/* ============================================================
   IDENTITY — the look, in one place.

   Every visual DECISION the app makes lives here as a primitive: fonts and casing, the type
   scale, neutrals, the default brand colour, status tones, radii, shadows. Nothing else in
   the app states a value; tokens.css (--bit-* / --app-*) and courts-admin.css (--cx-*) map
   these primitives onto the names components use.

   Two kinds of change:
   - a TWEAK (a colour, a size, heading case): edit the value here.
   - a NEW DESIGN SYSTEM: replace this file. Components and pages keep their token names, so
     they follow without edits. Only a design that changes STRUCTURE (layouts, what a page
     contains) needs component work.

   Per-tenant: the brand colour is injected on <html> by ThemeService (--bit-clr-pri, and
   --tenant-accent-strong when a tenant pins it) from appsettings Tenants:*:Theme. The value
   below is only the fallback for when no tenant colour is set.

   Current identity: the owner's 2026-09 brand (Montserrat display, Open Sans text,
   #F85918 Nationwide orange, cool neutrals). See docs/design-system.md.
   Loaded FIRST — before tokens.css.
   ============================================================ */
:root {
    /* ── Status shades older screens still read as --bit-clr-* (Bit's light-theme values) ── */
    --id-legacy-danger: #DF3A2E;
    --id-legacy-danger-dark: #BF261B;
    --id-legacy-success: #49A94C;
    --id-legacy-success-dark: #318734;
    --id-legacy-warning: #F2B01F;
    --id-legacy-warning-dark: #D4950D;
    --id-legacy-caution: #D47E30;
    --id-legacy-info: #888F95;
    --id-legacy-info-dark: #5E656B;
    --id-legacy-border: #DEDDDC;
    --id-legacy-disabled-fg: #AAAAAA;
    --id-legacy-disabled-bg: #F3F2F1;
    --id-legacy-disabled-border: #E5E3DF;
    --id-legacy-pressed-bg: #EBEBEB;
    --id-legacy-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);
    --id-legacy-shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);

    /* ── Typefaces (self-hosted, static weights: @font-face in Components/App.razor) ── */
    --id-font-text: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    --id-font-display: 'Montserrat', 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    --id-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

    /* ── Voices: which face, weight, case and tracking each role speaks in ── */
    --id-heading-weight: 800;         /* page titles, panel titles, step titles */
    --id-heading-case: uppercase;
    --id-heading-track: .015em;
    --id-heading-lh: 1.2;
    --id-button-weight: 800;
    --id-button-case: uppercase;
    --id-button-track: .04em;
    --id-label-weight: 600;           /* nav items, field labels, table heads */
    --id-label-track: .05em;
    --id-data-weight: 800;            /* big figures: dashboard counts, fee totals */
    --id-data-track: -.02em;
    --id-kicker-weight: 700;          /* eyebrows / section kickers: rule + tracked caps */
    --id-kicker-track: .16em;
    --id-kicker-rule: 21px;

    /* ── Type scale (root font-size stays 16px; these are the component sizes) ── */
    --id-size-title: 22px;
    --id-size-head: 15px;
    --id-size-lead: 13.5px;           /* row titles, card labels, feed items */
    --id-size-body: 12.5px;
    --id-size-meta: 11.5px;
    --id-size-cap: 11px;
    --id-size-control: 13.5px;        /* inputs, selects */
    --id-size-figure: 34px;           /* big numbers: dashboard cards */
    --id-size-figure-md: 30px;        /* chart totals */
    --id-size-figure-sm: 28px;        /* stat strips, compact cards */
    --id-size-figure-xs: 24px;        /* "All clear" and similar words-as-figures */

    /* ── Neutrals ── */
    --id-ink: #0E1116;                /* titles, primary text */
    --id-ink-2: #2B313D;              /* secondary text */
    --id-ink-3: #5C6470;              /* labels, descriptions, placeholders */
    --id-ink-4: #7F7F7F;              /* decoration only: chevrons, dots, faint rules */
    --id-bg: #F7F8FA;                 /* app background, alternate panel */
    --id-bg-deep: #eef0f3;            /* pressed rows, skeletons */
    --id-panel: #FFFFFF;              /* cards, navigation */
    --id-border: #E6E8EC;
    --id-border-soft: #eff1f4;
    --id-row-hover: #f9fafb;

    /* ── Brand (fallback only — tenants inject their own on <html>) ── */
    --id-brand: #F85918;

    /* ── Status tones: ink (text), soft (fill), border, dot (the vivid signal) ──
       Meaning is fixed app-wide (Core/…/FsStatusUi): pending/submitted/correction = amber,
       under review/partially accepted = blue, accepted = green, rejected/failed = red,
       drafts/other = slate. Owner ruling 2026-09-29: these keep the app's long-standing
       mapping, not the proposal's swap. */
    --id-green: #14532d;  --id-green-soft: #d8f0e0;  --id-green-border: #a3d7b5;  --id-green-dot: #15803d;
    --id-red: #8c1c1c;    --id-red-soft: #fadedd;    --id-red-border: #eeb0ad;    --id-red-dot: #dc2626;
    --id-amber: #7c4708;  --id-amber-soft: #fbeed0;  --id-amber-border: #e9cf95;  --id-amber-dot: #d29905;
    --id-blue: #1d3fa3;   --id-blue-soft: #dce8fc;   --id-blue-border: #b2caf6;   --id-blue-dot: #2563eb;
    --id-slate: #414a56;  --id-slate-soft: #e6e9ee;  --id-slate-border: #ccd2da;  --id-slate-dot: #6b7480;

    /* ── Shape ── */
    --id-radius-control: 6px;         /* buttons, inputs, chips, nested rows */
    --id-radius-surface: 12px;        /* cards, panels, modals, popovers */

    /* ── Depth ── */
    --id-shadow-card: 0 1px 2px rgba(14,17,22,0.04);
    --id-shadow-raise: 0 4px 16px rgba(14,17,22,0.08), 0 1px 3px rgba(14,17,22,0.05);
    --id-shadow-pop: 0 12px 34px rgba(14,17,22,0.14), 0 3px 8px rgba(14,17,22,0.08);
}
