/* ─────────────────────────────────────────────────────────────────────────────
 * COPY — do not edit this file to change a token.
 *
 * This is a BYTE-FOR-BYTE copy of the Adare Sales app's design tokens:
 *     C:\Adare\adare-quotes\public\tokens.css
 * taken on 22 Jul 2026 for the Service Ops unified-UI shell.
 *
 * The SOURCE OF TRUTH lives in adare-quotes, where public/tokens.js mirrors it
 * and tests/tokens-agreement.test.js pins the two together. Nothing in THIS repo
 * guards the copy, so a token changed there will silently drift from here.
 * To change a token: change it in adare-quotes, then re-copy this whole file.
 *
 * Deliberately NOT "improved" on the way across — in particular `--ink` is kept
 * as the alias `var(--text)` and NOT resolved to a hex, because that alias is a
 * recorded decision (William, 22 Jul 2026): keeping it an alias is what stops
 * --ink and --text drifting into two near-identical near-blacks.
 *
 * FOLLOW-UP (not done here): two copies of a token file will drift. Once both
 * apps are stable, add a parity check that diffs this against the Sales file.
 * ────────────────────────────────────────────────────────────────────────────*/

/* tokens.css — Adare design tokens (Phase 2, Session N1).
 *
 * The CSS face of the design tokens. Every value here mirrors public/tokens.js
 * (T.cssVars) EXACTLY — tests/tokens-agreement.test.js pins the two together so
 * the JS and CSS faces can never drift. tokens.js is the source; edit both, or
 * the agreement test fails. Values are the app's own census (Pass 3 §2), not new
 * ones. Consumed by :root here today for future/SSR CSS; the babel app reads the
 * same values via window.T. The legacy inline <style> block migrates onto these
 * gradually (Q5: "DM Sans screens migrate as touched").
 */
:root{
  --nav-width:200px;

  --brand:#323E48;
  --accent:#FF3600;
  --navy:#1B3A5C;
  --text:#1a1a1a;
  --sub:#5a5650;
  --muted:#9a958d;
  --line:#eaecea;
  --line-warm:#ede9e3;
  --bg:#F4F5F3;
  --panel:#f5f4f2;
  --ok-bg:#EAF3DE;
  --ok-fg:#27500A;
  --warn-bg:#FAEEDA;
  --warn-fg:#633806;
  --bad-bg:#FCEBEB;
  --bad-fg:#791F1F;
  --destructive:#c62828;
  --info-bg:#E6F1FB;
  --info-fg:#0C447C;
  --wa:#25D366;

  /* Semantic additions (UI-0). One accessible foreground amber (WCAG AA on
     white) that supersedes the ad-hoc #d97706 / #c98a17 scattered per page; a
     muted green accent; a second, lighter tertiary grey; and the white card
     surface that folds the per-page #fff every standalone page re-invented. */
  --amber:#b45309;
  --accent-green:#3a6b4f;
  --muted-2:#a3aaae;
  --card:#ffffff;

  /* The COOL family (Phase 13). Used all over web/** but never defined until
     now, so each silently fell back to an inline literal and the Next app
     rendered cool greys while the tokens above describe warm ones. Naming them
     stops the silent fallback. Values are what renders TODAY — nothing moves.

     ⚠️ OPEN DESIGN QUESTION, deliberately not answered here: --ink-soft
     duplicates --sub and --line-soft duplicates --line. Folding the cool family
     onto the warm one is a visible recolouring of the Next app, so it is a
     design decision for William, not a cleanup.

     ✅ --ink RESOLVED 22 Jul (William): an ALIAS of --text, not a colour of its
     own. Four answers had been in play — #1d2a33 (34 web/ decls), #323E48 (22
     decls, now on --brand), #16202A (the north-star mockup) and var(--text)
     (public/os.html). The shipped shell had it right; the mockup was moved onto
     the alias to match. Kept as `var(--text)` rather than a copied hex so the
     two can never drift back into two near-identical near-blacks. */
  --ink:var(--text);
  --ink-soft:#5b6b75;
  --line-soft:#eef1f4;
  --warn-line:#efd9ad;

  /* Breakpoints. ⚠️ NOT usable in a media-query condition — CSS forbids
     var() there and `@media (max-width: var(--bp-md))` never matches. These
     exist for JS (matchMedia) and as the agreed set that
     tests/token-guard.test.js enforces against every @media in the repo. */
  --bp-sm:640px;
  --bp-md:900px;
  --bp-lg:1200px;

  --font-display:'Outfit',sans-serif;
  --font-body:'Plus Jakarta Sans',sans-serif;
  --font-mono:monospace;

  --radius-chip:6px;
  --radius-control:8px;
  --radius-card:12px;
  --radius-card-lg:14px;
  --radius-modal:16px;

  --shadow-card:0 1px 2px rgba(50,62,72,.04);
  --shadow-modal:0 20px 60px rgba(0,0,0,.2);
  --shadow-toast:0 8px 30px rgba(0,0,0,.15);

  --space-xs:4px;
  --space-sm:6px;
  --space-md:8px;
  --space-lg:10px;
  --space-xl:12px;
  --space-xxl:16px;

  --z-nav:100;
  --z-mobile-tabs:8000;
  --z-drawer:8500;
  --z-modal:9000;
  --z-modal-top:9200;
  --z-sync-err:9998;
  --z-toast:9999;
}