/* §8.4's shared token file — the ONE place a colour is defined.
 *
 * The two front ends are built with different tooling (this one is plain CSS,
 * the admin UI is Tailwind v4), so what keeps them looking like one product is
 * not shared components — it is this file. `admin-ui` imports it and binds
 * Tailwind's `@custom-variant dark` to the same `[data-theme="dark"]` attribute
 * rather than to Tailwind's own class convention, so neither app owns a colour.
 *
 * The `:root` prefix on the dark block is load-bearing. The chat UI's theme
 * buttons carry `data-theme="light"` / `data-theme="dark"` as their OWN
 * attributes, so a bare `[data-theme="dark"]` selector matches the BUTTON and
 * redefines the entire palette on it — every token inside that one element
 * resolves to the opposite theme's value, forever, whichever theme is active.
 * It stayed invisible while the two `--rail-text` values were a cream and an
 * off-white two steps apart; it is a white label on a white rail the moment
 * the palettes actually differ.
 *
 * Two blocks, same names, nothing else. Anything that hardcodes a hex outside
 * this file is a theme bug waiting for the other mode to be opened.
 *
 * The three citation colours are the ones §8.4 warns fail contrast first, and
 * they are the retrieval paths of §4.1: hybrid today, the other two from step 7.
 */

:root {
  --bg: #f4f3ec;
  --surface: #ffffff;
  --surface-raised: #eceadf;
  --text: #1a1a1a;
  --muted: #5f6b73;
  --border: #d8d5c7;
  --accent: #2e5f7f;
  --accent-text: #f8f7ee;
  --danger: #a30000;
  --danger-bg: #ffe9e9;

  /* The rail columns keep the brand blue in both themes; their own text token
     is declared here so nothing inside them has to guess. */
  --rail-bg: #2e5f7f;
  --rail-text: #f8f7ee;
  --rail-muted: rgba(248, 247, 238, 0.65);
  --rail-hover: rgba(255, 255, 255, 0.12);
  --rail-active: rgba(255, 255, 255, 0.22);

  /* Code blocks are the first of §8.4's ten always-missed sites. */
  --code-bg: rgba(0, 0, 0, 0.06);
  --pre-bg: #1e1e1e;
  --pre-text: #f5f5f5;
  --table-header-bg: #e8e8e8;
  --link: #2952a3;
  --focus: #2e5f7f;

  /* The three citation / path-badge colours (§8.4). Checked at AA against
     --surface in light and against --surface in dark. */
  --path-hybrid: #1d5c8c;
  --path-hybrid-bg: #dcebf6;
  --path-graph: #6a4a17;
  --path-graph-bg: #f6ecd8;
  --path-traversal: #145041;
  --path-traversal-bg: #dcefe8;
}

:root[data-theme="dark"] {
  --bg: #14171a;
  --surface: #1c2024;
  --surface-raised: #262b31;
  --text: #e8e6df;
  --muted: #9aa4ac;
  --border: #333a41;
  --accent: #7db4d8;
  --accent-text: #10141a;
  --danger: #ff9c9c;
  --danger-bg: #3a1d1d;

  --rail-bg: #1b2b36;
  --rail-text: #e8e6df;
  --rail-muted: rgba(232, 230, 223, 0.6);
  --rail-hover: rgba(255, 255, 255, 0.08);
  --rail-active: rgba(255, 255, 255, 0.16);

  --code-bg: rgba(255, 255, 255, 0.1);
  --pre-bg: #0f1216;
  --pre-text: #e8e6df;
  --table-header-bg: #262b31;
  --link: #7db4d8;
  --focus: #7db4d8;

  --path-hybrid: #9cccea;
  --path-hybrid-bg: #1a2e3c;
  --path-graph: #e0bd7c;
  --path-graph-bg: #33291661;
  --path-traversal: #8fd6bf;
  --path-traversal-bg: #16302a;
}
