/* =====================================================================
   tokens.css — single source of truth for color + design tokens.
   Loaded FIRST on every page (before any component sheet).

   Light is the default (:root). Dark is applied via html[data-theme="dark"].
   Every component must consume these via var(--…) so both themes work
   everywhere — no per-component light/dark override lists.
   ===================================================================== */

:root,
html[data-theme="light"] {
  color-scheme: light;

  /* Surfaces — white-forward; fills are near-white so nothing looks disabled.
     Separation comes from borders, not grey fills. */
  --bg:        #f3f5f9;   /* page */
  --surface:        #ffffff;   /* cards / header / panels (white) */
  --surface2:       #f7f9fc;   /* subtle fills: inputs, dropdowns, hover (near-white) */
  --surface-sunken: #f4f7fb;   /* inset/nested panels + selected rows (near-white) */
  --border:         #dde3ee;

  /* Text — dark enough to read on white AND on the light fills above */
  --text:        #182234;
  --text-muted:  #586273;
  --muted:       #586273;
  --subtle:      #475569;

  /* Brand — UF orange (#FA4616) and shades of its hue. --indigo, --indigo-dark
     and --purple are legacy names kept so existing rules still resolve; they
     hold orange shades now. */
  --primary:       #fa4616;
  --primary-dark:  #dc3709;
  --accent:        #fa4616;   /* active-nav / emphasis (was undefined → invisible) */
  --indigo:        #fa4616;   /* legacy alias used by landing.css */
  --indigo-dark:   #dc3709;

  /* Semantic accents */
  --success:  #15803d;
  --warning:  #b45309;
  --danger:   #dc2626;
  --blue:     #2563eb;
  --purple:   #b32e09;   /* deep brand orange */

  /* Translucent surface for sticky/blurred bars */
  --surface-glass: rgba(255, 255, 255, 0.85);

  /* State chip tints — background / border / text, readable in this theme */
  --ok-bg: #dcfce7;      --ok-bd: #86efac;      --ok-fg: #15803d;
  --warn-bg: #fef3c7;    --warn-bd: #fcd34d;    --warn-fg: #b45309;
  --err-bg: #fee2e2;     --err-bd: #fecaca;     --err-fg: #b91c1c;
  --info-bg: #dbeafe;    --info-bd: #bfdbfe;    --info-fg: #1d4ed8;
  --neutral-bg: #eef2f7; --neutral-bd: #d7deea; --neutral-fg: #475569;
  --tintaccent-bg: #ffe3db; --tintaccent-bd: #fec4b4; --tintaccent-fg: #b32e09;
  /* Elevated-risk tint — the 4th step of the risk-assessment badges' 5-step
     green/yellow/orange/red scale (ok/warn/err cover the other three). */
  --mid-bg: #ffedd5;     --mid-bd: #fdba74;     --mid-fg: #9a3412;
  /* Risk-monitor severity meter fill — a single flat color per step, no
     bg/border/fg triad (it's a solid progress-bar fill, not a text chip).
     Same in both themes (no prior dark-mode variant existed). */
  --tier-low: #f4d03f;
  --tier-mid: #e67e22;

  /* Conversation bubbles — iMessage/SMS inspired: blue outgoing, grey incoming.
     Incoming text reuses --text / --text-muted so it tracks the theme. Blue is
     deepened from Apple's #0b84fe so white body text clears WCAG AA contrast. */
  --msg-out-bg: #0a6cf0;  --msg-out-fg: #ffffff;  --msg-out-label: rgba(255, 255, 255, 0.82);
  --msg-in-bg:  #e9e9eb;

  /* Shape + type */
  --radius:  8px;
  --font:    'Segoe UI', system-ui, -apple-system, sans-serif;
  --mono:    'Consolas', 'Courier New', monospace;
}

html[data-theme="dark"] {
  color-scheme: dark;

  /* Surfaces */
  --bg:        #0f1117;
  --surface:        #1a1d2e;
  --surface2:       #22263a;
  --surface-sunken: #151827;   /* inset/nested panels + selected rows */
  --border:         #2d3148;

  /* Text */
  --text:        #e2e8f0;
  --text-muted:  #94a3b8;
  --muted:       #64748b;
  --subtle:      #94a3b8;

  /* Brand (same UF orange in both themes) */
  --primary:       #fa4616;
  --primary-dark:  #dc3709;
  --accent:        #fa4616;
  --indigo:        #fa4616;
  --indigo-dark:   #dc3709;

  /* Semantic accents tuned brighter for dark surfaces */
  --success:  #22c55e;
  --warning:  #f59e0b;
  --danger:   #ef4444;
  --blue:     #3b82f6;
  --purple:   #fc997d;

  --surface-glass: rgba(15, 17, 23, 0.85);

  --ok-bg: #052e16;      --ok-bd: #166534;      --ok-fg: #4ade80;
  --warn-bg: #1c1408;    --warn-bd: #78350f;    --warn-fg: #fbbf24;
  --err-bg: #2d1b1b;     --err-bd: #7f1d1d;     --err-fg: #fca5a5;
  --info-bg: #0f172a;    --info-bd: #1e3a5f;    --info-fg: #93c5fd;
  --neutral-bg: #0f172a; --neutral-bd: #1e293b; --neutral-fg: #94a3b8;
  --tintaccent-bg: #3c1207; --tintaccent-bd: #87280d; --tintaccent-fg: #fc997d;
  --mid-bg: #431407;     --mid-bd: #9a3412;     --mid-fg: #fdba74;

  /* Conversation bubbles — iMessage/SMS inspired (tuned for dark surfaces) */
  --msg-out-bg: #0a6cf0;  --msg-out-fg: #ffffff;  --msg-out-label: rgba(255, 255, 255, 0.82);
  --msg-in-bg:  #3a3a3c;
}