/* ── Hush AI sitewide theme + accessibility layer ──────────────────────────
   Loaded by base_meta.html on every page, BEFORE each page's own <style>.
   - Supplies the canonical light palette for the shared CSS var names used
     by all templates. Pages that define their own [data-theme="light"] block
     override these (their <style> comes later in the cascade) — harmless.
   - Fixes the hardcoded dark backgrounds (nav / chat topbar / input area /
     home try-bubbles / mobile menu) that the var system doesn't cover.
   - Dyslexia-friendly mode per BDA style-guide (sans-serif, wider spacing).
   - Respects prefers-reduced-motion.
   Theme state lives on <html>: data-theme="light", data-dyslexia="1".
   localStorage keys: hush_theme ('light'|'dark'), hush_dyslexia ('1'|'0').
─────────────────────────────────────────────────────────────────────────── */

/* ── Canonical light palette (matches chat.html webapp light theme) ──
   :root[data-theme="light"] (specificity 0,2,0) — MUST outrank each page's own
   later `:root{dark vars}` (0,1,0). A bare [data-theme="light"] ties at 0,1,0
   and loses to the page's later rule, silently killing the light default
   (the 2026-06-10 "nothing works" bug). */
:root[data-theme="light"]{
  --bg:#f5f3ef;
  --sidebar:#ebe8e2;
  --surface:#ffffff;
  --surface2:#f0ede7;
  --border:rgba(140,120,80,.22);
  --text:#1a1a1a;
  --dim:#6b6b6b;
  --accent:#9a7d3f;
  --accent-dark:#7d6432;
  --accent-glow:rgba(154,125,63,.07);
  --warn:#c04030;
  --warn-soft:rgba(192,64,48,.08);
  --warn-border:rgba(192,64,48,.3);
  --green:#1f8a4d;
  --user-bg:#f0ede7;
  --ai-bg:#faf8f4;
}

/* ── Light-mode fixes for hardcoded dark backgrounds ── */
[data-theme="light"] .nav{background:rgba(245,243,239,.95)}
[data-theme="light"] .topbar{background:rgba(245,243,239,.97)}
[data-theme="light"] .input-area{background:rgba(245,243,239,.97)}
[data-theme="light"] .try-msg.assistant .try-body{background:var(--ai-bg)}
[data-theme="light"] .try-body pre{background:var(--surface2)}
@media(max-width:768px){
  [data-theme="light"] .nav .nav-links{background:rgba(245,243,239,.98);border-bottom:1px solid rgba(140,120,80,.22)}
}

/* ── Shared toggle buttons (injected by /static/a11y.js) ── */
.theme-toggle,.dys-toggle{background:var(--surface,#12121a);border:1px solid var(--border,rgba(200,170,110,.15));border-radius:4px;padding:.35rem .65rem;color:var(--dim,#9a9a9a);cursor:pointer;font-size:11px;font-family:'Courier New',monospace;letter-spacing:.5px}
.theme-toggle:hover,.dys-toggle:hover{color:var(--accent,#c8aa6e);border-color:var(--accent,#c8aa6e)}
.dys-toggle.on{color:var(--accent,#c8aa6e);border-color:var(--accent,#c8aa6e);background:var(--accent-glow,rgba(200,170,110,.06))}
/* Floating fallback for pages without a .nav (e.g. chat already has its own bar) */
.a11y-float{position:fixed;bottom:.9rem;left:.9rem;z-index:150;display:flex;gap:.35rem}
.a11y-float .theme-toggle,.a11y-float .dys-toggle{opacity:.55}
.a11y-float .theme-toggle:hover,.a11y-float .dys-toggle:hover{opacity:1}

/* ── Dyslexia-friendly mode (BDA style guide) ──
   Sans-serif everywhere except code, kbd and the monospace brand marks;
   wider letter/word spacing and line height; no italics. */
[data-dyslexia="1"] *:not(code):not(pre):not(pre *):not(kbd):not(.nav-brand):not(.sb-logo):not(.hero-brand){
  font-family:Verdana,'Segoe UI','Trebuchet MS',Arial,sans-serif !important;
  font-style:normal !important;
}
[data-dyslexia="1"] body{letter-spacing:.03em;word-spacing:.12em;line-height:1.8}
[data-dyslexia="1"] p,[data-dyslexia="1"] li,[data-dyslexia="1"] .msg-body,[data-dyslexia="1"] .try-body{line-height:1.9 !important}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}
