/* ============================================================
   Ask Hava — Lake Ink & Brass: interactive component layer.
   ADDITIVE to lake.css (which stays the verbatim visual system).
   Holds the interaction/a11y CSS the static mockups don't carry:
   the Ask bar, accordion event rows, day strip, routed result,
   empty state, pagination. Loaded site-wide after lake.css.
   ============================================================ */

/* Ask bar — the intent router input (role=search form). */
.askbar{display:flex;align-items:center;gap:10px;background:var(--raised);border:1px solid var(--hair-2);
  border-radius:999px;padding:7px 7px 7px 18px;box-shadow:var(--sh-card);max-width:640px}
.askbar .ai{flex:1;min-width:0;border:0;outline:none;background:transparent;font-family:var(--ui);
  font-size:16px;color:var(--ink);min-height:38px}
.askbar .ai::placeholder{color:var(--muted)}
.askbar .go{flex:none}
.askbar:focus-within{border-color:var(--ink);box-shadow:0 0 0 2px #fff,0 0 0 4px var(--havasu)}

/* Routed result — the aria-live region the router writes into. */
.routed{margin-top:12px;padding:13px 16px;border-radius:14px;border:1px solid var(--hair);
  background:var(--raised);box-shadow:var(--sh-1);font-size:14px;color:var(--ink-2)}
.routed[hidden]{display:none}
.routed .rk{font-weight:600;color:var(--ink)}

/* Day strip — a labelled button group (aria-pressed); items reuse .chip. */
.daystrip{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* Event row as an accordion: the whole row is a button; reset its chrome so it
   keeps the .erow visual but gains keyboard/expand semantics. */
.erow{width:100%;text-align:left;font:inherit;color:inherit;background:none;border:0;cursor:pointer}
button.erow{appearance:none}
.eitem .edetail{padding:0 16px 15px 104px;font-size:13.5px;color:var(--ink-2);line-height:1.6}
.eitem .edetail[hidden]{display:none}
.erow[aria-expanded="true"] .chev{transform:rotate(180deg)}
.erow .chev{transition:transform .22s var(--ease)}

/* Empty state. */
.empty{text-align:center;padding:40px 20px;border:1px dashed var(--hair-2);border-radius:18px;background:var(--raised)}
.empty h3{font-family:var(--disp);font-weight:600;font-size:20px;color:var(--ink)}
.empty p{font-size:14px;color:var(--muted);margin-top:6px;max-width:46ch;margin-inline:auto}
.empty .act{margin-top:16px}

/* Pagination. */
.pager{display:flex;gap:10px;align-items:center;justify-content:center;margin:24px 0;font-size:14px;color:var(--muted)}
.pager .cur{font-variant-numeric:tabular-nums}

/* WCAG 2.1 AA contrast hardening (caught by axe/pa11y on the styleguide).
   The verbatim visual system pairs white text with mid-tone --brass on the CTA
   (3.7:1) and reuses the `.tag` class in the footer, where the chip's light
   background collides with the dark footer (light-on-light). Fixed with the
   system's own deeper tokens — no new palette, no layout change. Guarded by
   tests/test_lake_contrast.py so it can't regress. */
.btn-brass{background:var(--brass-deep);color:#fff}
.btn-brass:hover{background:var(--brass-deep);filter:brightness(1.1)}
.ft .tag{background:none;border:0;padding:0}
/* The "Live" label was --havasu (~3:1) on the light conditions band. Read it in
   --ink-2; the havasu pulse dot still carries the brand accent. */
.cb-live{color:var(--ink-2)}

/* Styleguide-only scaffolding (the Phase-0 component gallery). */
.sg-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;align-items:start}
.sg-swatches{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.sg-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.sg-sw{width:64px;height:64px;border-radius:12px;border:1px solid var(--hair-2)}
.sg-sw + span{font-size:11px;color:var(--muted)}