/*
 * Codeliance Design System — canonical design tokens.
 * ============================================================================
 * Single source of truth for every color, type size, radius, spacing step,
 * shadow, and motion value in the app. Every screen reads its values from a
 * named token here — never a raw hex or pixel number.
 *
 * COD-230 (design token system). Values are lifted verbatim from Einat's
 * "Codeliance — Token Reference" handoff (the design source of truth); this
 * file IS the codebase implementation of that spec.
 *
 * NOT WIRED UP YET — nothing loads this file. Wiring is COD-231 (Build the
 * core component library), Step 0:
 *   1. point core/templates/base.html at this file;
 *   2. migrate the scan funnel off the legacy core/static/css/design-tokens.css
 *      onto these tokens — INCLUDING swapping the funnel's font <link> from
 *      IBM Plex Mono to Roboto Mono, else funnel mono text (10+ var(--mono)
 *      usages) falls back to a system font once --mono changes;
 *   3. delete the legacy design-tokens.css so both surfaces share one system.
 * Committed as a SEPARATE file (not an in-place overwrite of the funnel's
 * design-tokens.css) precisely so this commit can't regress the live funnel
 * before that reviewed migration.
 *
 * ── Fonts ──────────────────────────────────────────────────────────────────
 * This file only DECLARES the families (--sans / --mono). The faces are now
 * SELF-HOSTED (COD-233) in core/static/css/fonts.css: DM Sans + Roboto Mono as
 * @font-face served from core/static/fonts/ (latin + latin-ext woff2, variable
 * fonts with a font-weight range). Self-hosting was preferred over a Google
 * Fonts <link> because the app runs a nonce-based CSP — 'self' covers the woff2
 * with no font-src/style-src exception and no third-party dependency. Base
 * template loads fonts.css before this file. (The funnel still uses a Google
 * Fonts <link>; migrating it onto fonts.css is a separate follow-up.)
 *
 * ── Reconciliation notes (for the move into hub, COD-231) ───────────────────
 *  • Will supersede the legacy funnel design-tokens.css (created for the free
 *    scan, COD-235) once COD-231 migrates the funnel onto this file. Until then
 *    both coexist and the funnel is UNAFFECTED by this commit.
 *  • --text-muted / --text-sub are DARKER here than the legacy funnel values
 *    (#5f6377 vs #8a8fa8, #6a6e85 vs #b0b5c8) — intended contrast/accessibility
 *    improvement from the reference; the funnel picks this up when migrated
 *    (COD-231).
 *  • DROPPED from the old funnel file (all had zero var() usages in-repo):
 *    --blue-mid (a mislabeled teal — the reference resolves it into --teal),
 *    --navy, and --red/--red-bg/--red-border.
 *  • Negative / error color: the Token Reference defined no token; a muted rose
 *    was added here PROVISIONALLY pending Einat's sign-off on name, hue, and the
 *    variant shades. RESOLVED 2026-07-22 — Einat's COD-231 additions spec
 *    (design/new-design/codeliance-additions.css) sets the approved values: a
 *    true critical/destructive red (--red #b91c1c) plus --red-dark for the
 *    destructive-button hover, and --border-strong for empty container controls
 *    (select, textarea). The name --red stayed (the spec uses it); the earlier
 *    muted rose (#b8636e) is superseded.
 *  • --gray-soft is the ONLY funnel-only token still referenced (funnel
 *    report.css table backgrounds) — kept below as legacy; migrate in COD-231.
 *  • Type scale is 7 steps, not the 6 named in the COD-230 ticket text: the
 *    reference added --fs-read (15px) for prose/detail body after the ticket
 *    was written. The reference is authoritative.
 * ============================================================================
 */

:root {
  /* ── Brand blues ── */
  --blue:         #0b45ff;
  --blue-dark:    #0935cc;
  --blue-light:   #dde7fe;
  --blue-pale:    #eef2ff;

  /* ── Teal (semantic: completed) ── */
  --teal:         #0d7a70;
  --teal-bg:      #effaf8;

  /* ── Chrome surface (navbar / sidebar) ── */
  --chrome:       #0d1e3a;

  /* ── Ink & surfaces ── */
  --dark:         #1a1d2e;
  --text-muted:   #5f6377;
  --text-sub:     #6a6e85;
  --gray-bg:      #f5f6f8;
  --white:        #ffffff;
  --border:       rgba(11, 69, 255, 0.08);   /* translucent blue hairline */
  --border-solid: #e4e6ef;
  --border-strong: #c4c8d4;   /* stronger idle border for empty container controls (select, textarea) — COD-231 additions */

  /* ── Semantic status ── */
  --amber:        #d97706;   /* action needed */
  --amber-bg:     #fffbeb;
  --amber-border: #fde68a;
  --amber-text:   #92400e;
  --green:        #16a34a;   /* completed / pass */
  --green-bg:     #f0fdf4;
  --green-border: #bbf7d0;
  --purple:       #6b5bd6;   /* review */
  --purple-bg:    #f5f3ff;
  --purple-text:  #5a48c4;
  --red:          #b91c1c;   /* critical / destructive / error — Einat-approved (COD-231 additions spec) */
  --red-dark:     #991b1b;   /* destructive-button hover */
  --red-bg:       #fef2f2;
  --red-border:   #fecaca;
  --red-text:     #b91c1c;

  /* ── Type families ── */
  --sans:  'DM Sans', sans-serif;
  --mono:  'Roboto Mono', monospace;

  /* ── Font scale — 7 steps ── */
  --fs-display: 2.25rem;   /* 36px */
  --fs-stat:    1.57rem;   /* 25px */
  --fs-section: 1.18rem;   /* 19px */
  --fs-read:    0.94rem;   /* 15px — prose / detail body */
  --fs-body:    0.875rem;  /* 14px — UI headings, buttons, labels */
  --fs-meta:    0.76rem;   /* 12px — dense UI, table cells */
  --fs-label:   0.70rem;   /* 11px — codes, chips, micro-tags */

  /* ── Line height — 4 steps ── */
  --lh-tight: 1.1;   /* display / stat numerals */
  --lh-snug:  1.3;   /* card headings, table cells */
  --lh-base:  1.5;   /* all UI prose */
  --lh-read:  1.6;   /* detail body, guided step hints */

  /* ── Radius scale — 6 steps ── */
  --r-bar:  3px;
  --r-xs:   6px;
  --r-sm:   8px;
  --r-md:   11px;
  --r-lg:   14px;
  --r-pill: 50px;

  /* ── Spacing scale — 8 steps ── */
  --sp-1: 0.25rem;   /*  4px — focus offset, micro pad */
  --sp-2: 0.4rem;    /*  6px — icon ↔ label gap */
  --sp-3: 0.65rem;   /* 10px — list item gap */
  --sp-4: 0.85rem;   /* 14px — within-section element gap */
  --sp-5: 1rem;      /* 16px — grid / column gap */
  --sp-6: 1.25rem;   /* 20px — card padding */
  --sp-7: 1.5rem;    /* 24px — section margin */
  --sp-8: 2.5rem;    /* 40px — page / view padding */

  /* ── Motion ── */
  --dur-fast: 120ms;
  --dur-base: 150ms;
  --dur-slow: 250ms;
  --ease-ui:  cubic-bezier(0.16, 1, 0.3, 1);   /* snappy settle — most interactions */
  --ease-in:  cubic-bezier(0.4,  0, 1,   1);   /* exits */
  --ease-out: cubic-bezier(0,    0, 0.2, 1);   /* entrances */

  /* ── Shadows — near-zero, brand-tinted ── */
  --shadow-section:  0 1px 2px rgba(6, 26, 122, 0.18);    /* .section-header strip */
  --shadow-row:      0 1px 3px rgba(11, 69, 255, 0.06);   /* row hover */
  --shadow-hub-card: 0 1px 2px rgba(11, 69, 255, 0.05);   /* action-hub card */
  --shadow-modal:    0 16px 48px rgba(11, 69, 255, 0.15); /* centered modal */

  /* ── Z-index scale ── */
  --z-base:    0;
  --z-sticky:  10;    /* sticky section headers */
  --z-chrome:  50;    /* navbar + sidebar */
  --z-overlay: 200;   /* dark backdrop */
  --z-modal:   300;   /* centered modal / side panel */
  --z-toast:   400;   /* notification toasts */

  /* ── Breakpoints ── */
  --bp-compact: 860px;   /* sidebar + nav collapse */

  /* ── Legacy (funnel-only) — migrate/remove in COD-231 funnel audit ──
   * --gray-soft is the last funnel-only token still referenced (funnel
   * report.css table backgrounds). Not part of the canonical reference. */
  --gray-soft: #fafbfc;
}
