/* ==========================================================================
   Upstream — design tokens
   Ported from "Shelfcheck Brand and Components" · option 1a (brand board).

   Two themes, one contract. Every component reads colour through these
   variables and never hard-codes a hex, with one deliberate exception:
   the camera surface in scan.* is always dark, so it pins itself to the
   dark set via data-theme="dark".

   The verdict channel (--v / --vbg / --vline) is the load-bearing idea.
   Set data-v="avoid|caution|clear|unknown" on any ancestor and everything
   below it repaints. Verdict colour is the only saturation on screen, so
   it always means something.
   ========================================================================== */

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

  /* Surfaces */
  --bg: #0D1014;
  --s1: #14181E;
  --s2: #1B2027;
  --s3: #232932;

  /* Rules */
  --line: #242B34;
  --line2: #39414D;

  /* Text — primary, secondary, annotation */
  --tx: #EAEEF3;
  --tx2: #98A2AF;
  --tx3: #6A7481;

  /* Signal blue — the only accent */
  --ink: #5C9CFF;
  --ink-bg: #12203A;

  /* Verdicts */
  --avoid: #FF6259;
  --avoid-bg: #241214;
  --avoid-line: #5C2622;

  --caution: #F0B03E;
  --caution-bg: #211809;
  --caution-line: #59421B;

  --clear: #45C58E;
  --clear-bg: #0E1F18;
  --clear-line: #204738;

  --unknown: #8E99A6;
  --unknown-bg: #171B21;
  --unknown-line: #333B46;
}

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

  --bg: #F4F6F8;
  --s1: #FFFFFF;
  --s2: #FFFFFF;
  --s3: #EDF0F4;

  --line: #DFE4EA;
  --line2: #C2CAD4;

  --tx: #101519;
  --tx2: #59636F;
  --tx3: #7C8794;

  --ink: #1F5FD0;
  --ink-bg: #E8EFFC;

  --avoid: #C42B21;
  --avoid-bg: #FCEEEC;
  --avoid-line: #F1CCC7;

  --caution: #8A5A05;
  --caution-bg: #FDF4E3;
  --caution-line: #EDDAB0;

  --clear: #10684A;
  --clear-bg: #E9F5F0;
  --clear-line: #C1E2D3;

  --unknown: #5A646F;
  --unknown-bg: #EFF2F5;
  --unknown-line: #D7DDE4;
}

/* --------------------------------------------------------------------------
   Verdict channel
   Declared on both theme roots so a nested [data-theme] island resolves
   against its own palette, then overridden by [data-v] at any depth.
   -------------------------------------------------------------------------- */

:root,
[data-theme] {
  --v: var(--ink);
  --vbg: var(--ink-bg);
  --vline: var(--line2);
}

[data-v="avoid"] {
  --v: var(--avoid);
  --vbg: var(--avoid-bg);
  --vline: var(--avoid-line);
}

[data-v="caution"] {
  --v: var(--caution);
  --vbg: var(--caution-bg);
  --vline: var(--caution-line);
}

[data-v="clear"] {
  --v: var(--clear);
  --vbg: var(--clear-bg);
  --vline: var(--clear-line);
}

[data-v="unknown"] {
  --v: var(--unknown);
  --vbg: var(--unknown-bg);
  --vline: var(--unknown-line);
}

/* --------------------------------------------------------------------------
   Type
   Archivo everywhere, sentence case. The monospace earns its place twice:
   barcodes and dataset versions. Nothing else.
   -------------------------------------------------------------------------- */

:root {
  --font-sans: Archivo, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Radii */
  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 10px;
  --r-pill: 999px;
}