/* The Event dashboard tab, drawn by app/event-dashboard-view.js: two fixed
   columns (Next up then Rooms on the left, Ops then Website on the right; 7
   and 5 twelfths, her saved sizes) and Creative the full width, whose groups
   carry what each area is up to (event-creative-box.css; the event's status
   sits in the event header).
   Loaded after extensions.css and events-index.css; it reuses the task tick
   (.task-check) and .button from those sheets and adds no colour tokens. */
.event-dashboard-stack{display:grid;gap:16px;margin-bottom:18px}
.event-dashboard-stack>*{min-width:0;margin:0}

.event-dashboard-link:focus-visible,.event-dashboard-more>summary:focus-visible{border-radius:4px;outline:2px solid var(--accent);outline-offset:2px}

/* Blocks */
.event-dashboard-block{padding:14px 16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper)}
.event-dashboard-block h3{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0 0 10px;color:var(--ink);font:600 14px "Poppins",sans-serif}
.event-dashboard-block-note{margin-left:auto;color:var(--muted);font:500 12.5px "Bricolage Grotesque",sans-serif;font-variant-numeric:tabular-nums}
.event-dashboard-actions{display:flex;flex-wrap:wrap;gap:6px}
.event-dashboard-actions .button{text-decoration:none;white-space:nowrap}
.event-dashboard-more>summary{width:max-content;max-width:100%;padding:8px 0 2px;color:var(--accent-text);font-size:13px;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.event-dashboard-more[open]>summary{margin-bottom:6px}
.event-dashboard-link{display:block;margin:6px 0 0;padding:6px 0 2px;border:0;background:none;color:var(--accent-text);font:600 13px "Bricolage Grotesque",sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.event-dashboard-loading{display:inline-grid;vertical-align:middle;color:var(--muted)}

/* Next up: the decisions, then the late and due tasks, as short soft rows
   (her playground's Next up). A row is a mark, a few words with a small line
   under them, and a decision's buttons under the words; the full sentence is
   the tooltip. The tick is the shared .task-check, drawn round here. */
.event-dashboard-next-list{display:grid;gap:8px}
.event-dashboard-next-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 12px;align-items:center;padding:12px 14px;border-radius:16px;background:#f6f6f3}
.event-dashboard-more>.event-dashboard-next-row+.event-dashboard-next-row{margin-top:8px}
.event-dashboard-next-row.is-decision{background:#fde7ee}
.event-dashboard-next-row>.event-dashboard-actions{grid-column:2;justify-self:start}
.event-dashboard-next-mark{display:grid;place-items:center;width:19px;height:19px;color:var(--red);font-weight:700}
.event-dashboard-next-row .task-check{margin:0;border-radius:50%;cursor:pointer}
.event-dashboard-next-row .task-check:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.event-dashboard-next-text{display:grid;min-width:0}
.event-dashboard-next-title{color:var(--ink);font:600 13px/1.3 "Poppins",sans-serif;overflow-wrap:anywhere}
.event-dashboard-next-when{color:var(--muted);font-size:11px}
.event-dashboard-next-row.is-late .event-dashboard-next-when{color:var(--danger-ink);font-weight:700}
.event-dashboard-next-row.is-soon .event-dashboard-next-when{color:#9a6817;font-weight:700}

/* Two fixed columns. A column with nothing in it is not drawn, so the one
   left takes the whole width. */
.event-dashboard-columns{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:16px;align-items:start}
.event-dashboard-columns>:only-child{grid-column:1/-1}
.event-dashboard-column,.event-dashboard-next{display:grid;gap:16px;min-width:0}
.event-dashboard-column>*,.event-dashboard-next>*{min-width:0;margin:0}

/* One column on a phone, in her saved order: Next up, Ops, Website, Rooms.
   Every card fills the width (stretch undoes the desktop grid's start). */
@media(max-width:760px){
  .event-dashboard-block-note{margin-left:0;flex-basis:100%}
  .event-dashboard-columns{display:flex;flex-direction:column;align-items:stretch}
  .event-dashboard-column,.event-dashboard-next,.event-dashboard-rooms{display:contents}
  .event-dashboard-next>*{order:-1}
  .event-dashboard-rooms>*{order:1}
}