/* ============================================================
   Falconstead / Sentinel — Design Tokens
   Source of truth: docs/design-system.md
   Light values are defaults; html[data-theme="dark"] swaps to
   the "Quiet Gold" theme. Reference tokens, never raw hex.
   Fonts are NOT @imported here on purpose: an @import cannot start
   downloading until this file has itself downloaded and parsed, which
   serialises the webfont request behind the CSS. Each page loads them
   via <link rel="preconnect"> + <link rel="stylesheet"> in <head>.
   ============================================================ */

:root {
    color-scheme: light;

    /* Core surfaces & text */
    --bg: #f5f5f7;
    --surface: #fff;
    --surface-glass: rgba(255, 255, 255, 0.8);
    --surface-glass-strong: rgba(255, 255, 255, 0.9);
    --surface-glass-soft: rgba(255, 255, 255, 0.72);
    --text: #1d1d1f;
    /* 4.66:1 on --bg. The previous #86868b was 3.33:1, under the WCAG AA 4.5:1
       floor, and base.css applies this to every <p> on the site. */
    --text-secondary: #6e6e73;
    --text-muted: #555;
    --border-hard: #d2d2d7;

    /* Neutral foreground-alpha scale ("ink") */
    --ink-02: rgba(0, 0, 0, 0.02);
    --ink-03: rgba(0, 0, 0, 0.03);
    --ink-04: rgba(0, 0, 0, 0.04);
    --ink-05: rgba(0, 0, 0, 0.05);
    --ink-06: rgba(0, 0, 0, 0.06);
    --ink-08: rgba(0, 0, 0, 0.08);
    --ink-10: rgba(0, 0, 0, 0.1);
    --ink-12: rgba(0, 0, 0, 0.12);
    --ink-15: rgba(0, 0, 0, 0.15);
    --ink-20: rgba(0, 0, 0, 0.2);

    /* Interactive accent: blue in light, gold in dark */
    --accent: #007AFF;
    --accent-strong: #0040DD;
    --accent-contrast: #ffffff;
    --accent-tint-05: rgba(0, 122, 255, 0.05);
    --accent-tint-06: rgba(0, 122, 255, 0.06);
    --accent-tint-08: rgba(0, 122, 255, 0.08);
    --accent-tint-10: rgba(0, 122, 255, 0.1);
    --focus-ring: rgba(0, 122, 255, 0.12);

    /* Status (financial semantics keep green/red in both themes) */
    --positive: #248A3D;
    --negative: #D70015;
    --danger: #FF3B30;
    --warn-text: #C93400;
    --tag-purple-text: #8944AB;

    /* Skeleton shimmer */
    --skeleton-a: #e8e8ed;
    --skeleton-b: #f0f0f5;

    /* Announcement banners & severity badges */
    --banner-info-bg: #f0f6ff;
    --banner-warn-bg: #fff7ec;
    --banner-danger-bg: #fff0ef;
    --sev-info-bg: #e3f0ff;
    --sev-warn-bg: #fff0d6;
    --sev-warn-text: #b25e00;
    --sev-danger-bg: #ffe0de;

    /* Admin upload drop-zone text */
    --drop-text: #1d3557;
    --drop-text-strong: #0b1e3a;

    /* Elevation (literal black-alpha — never route through --ink-*) */
    --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.04);
    --shadow-md: 0 2px 12px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.08);

    /* Radius scale */
    --r-sm: 6px;
    --r-md: 8px;
    --r-lg: 10px;
    --r-xl: 16px;
    --r-pill: 999px;
}

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

    --bg: #0a0a0b;
    --surface: #161618;
    --surface-glass: rgba(22, 22, 24, 0.8);
    --surface-glass-strong: rgba(22, 22, 24, 0.9);
    --surface-glass-soft: rgba(22, 22, 24, 0.72);
    --text: #ffffff;
    --text-secondary: #9b9b9e;
    --text-muted: #a8a8ad;
    --border-hard: #3a3a3d;

    --ink-02: rgba(255, 255, 255, 0.03);
    --ink-03: rgba(255, 255, 255, 0.04);
    --ink-04: rgba(255, 255, 255, 0.06);
    --ink-05: rgba(255, 255, 255, 0.07);
    --ink-06: rgba(255, 255, 255, 0.08);
    --ink-08: rgba(255, 255, 255, 0.1);
    --ink-10: rgba(255, 255, 255, 0.12);
    --ink-12: rgba(255, 255, 255, 0.14);
    --ink-15: rgba(255, 255, 255, 0.18);
    --ink-20: rgba(255, 255, 255, 0.24);

    --accent: #C9A227;                    /* antique gold */
    --accent-strong: #D9B845;
    --accent-contrast: #0a0a0b;           /* near-black text on gold */
    --accent-tint-05: rgba(201, 162, 39, 0.07);
    --accent-tint-06: rgba(201, 162, 39, 0.09);
    --accent-tint-08: rgba(201, 162, 39, 0.12);
    --accent-tint-10: rgba(201, 162, 39, 0.15);
    --focus-ring: rgba(201, 162, 39, 0.25);

    --positive: #34C759;
    --negative: #FF453A;
    --danger: #FF453A;
    --warn-text: #FFB340;
    --tag-purple-text: #C79AFF;

    --skeleton-a: #232326;
    --skeleton-b: #2c2c30;

    --banner-info-bg: #15202b;
    --banner-warn-bg: #2a2113;
    --banner-danger-bg: #2a1513;
    --sev-info-bg: #16242f;
    --sev-warn-bg: #2a2113;
    --sev-warn-text: #FFB340;
    --sev-danger-bg: #2a1513;

    --drop-text: #cfe2ff;
    --drop-text-strong: #e3efff;

    /* Shadows stay literal black even in dark mode */
    --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 2px 12px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.5);
}