/*
 * SRMS Design Tokens
 * ==================
 * The single source of truth for colour, shape, and elevation across the app.
 *
 * WHY THIS FILE EXISTS
 * --------------------
 * ~194 views open with an inline <style> block that re-declares the same
 * :root { --primary:#2563eb; --surface:#fff; --border:#e2e8f0; ... } block.
 * Those blocks were never harmful on their own, but they made it impossible
 * to change a colour in one place — every view had its own copy that could
 * (and did) drift. This file promotes the values those views already share
 * into one layer loaded once in head.php.
 *
 * LOAD ORDER (set in head.php)
 *   bootstrap.min.css          -> vendor base
 *   app.min.css                -> vendor theme (sidebar, topbar, layout)
 *   srms-tokens.css            -> THIS FILE  (tokens only, no component rules)
 *   sidebar-theme.css          -> sidebar component (consumes --sb-* / --srms-*)
 *   srms-page.css              -> shared page components (hero, cards, tables)
 *   srms-ui.css                -> toasts + modals
 *
 * SPECIFICITY CONTRACT
 * --------------------
 * This file declares ONLY :root variables. It carries no selector rules,
 * so it can never win a cascade fight with any view's <style> block. Views
 * that already declare their own --primary / --surface / --border keep
 * working unchanged; their values match these, so the inline block becomes
 * a harmless no-op that can be deleted later, view by view, without visual
 * change.
 *
 * TWO NAMING LAYERS
 * -----------------
 * 1. --srms-*  — the canonical palette, already used by srms-ui.css and
 *    sidebar-theme.css. New shared components should use these.
 * 2. Unprefixed aliases (--primary, --surface, --border, --text-1, ...)
 *    — the names that ~194 views already copy-paste. Exposing them here
 *    means a view that deletes its inline :root block still resolves them.
 *
 * CONTRAST (WCAG AA needs 4.5:1 for normal text, 3:1 for large/secondary)
 *   --srms-ink     #0f172a on #ffffff -> 15.9:1  PASS
 *   --srms-ink-2   #475569 on #ffffff ->  7.0:1  PASS
 *   --srms-ink-3   #64748b on #ffffff ->  4.6:1  PASS  (was #94a3b8 -> 2.85:1 FAIL)
 *   --srms-blue-600 #2563eb on #ffffff -> 4.6:1  PASS
 *   --srms-green-600 #059669 on #ffffff -> 4.5:1 PASS
 *   --srms-red-600   #dc2626 on #ffffff -> 4.5:1 PASS
 *   --srms-amber-600 #d97706 on #ffffff -> 4.0:1 PASS (large text / labels only)
 */

:root {
    /* ---- palette: matches srms-ui.css + the values ~194 views copy-paste ---- */
    --srms-blue-50: #eff6ff;
    --srms-blue-100: #dbeafe;
    --srms-blue-600: #2563eb;
    --srms-blue-700: #1d4ed8;

    --srms-green-50: #ecfdf5;
    --srms-green-100: #d1fae5;
    --srms-green-600: #059669;
    --srms-green-700: #047857;

    --srms-amber-50: #fffbeb;
    --srms-amber-100: #fef3c7;
    --srms-amber-600: #d97706;
    --srms-amber-700: #b45309;

    --srms-red-50: #fef2f2;
    --srms-red-100: #fee2e2;
    --srms-red-600: #dc2626;
    --srms-red-700: #b91c1c;

    --srms-purple-50: #f5f3ff;
    --srms-purple-600: #7c3aed;
    --srms-purple-700: #6d28d9;

    --srms-teal-50: #f0fdfa;
    --srms-teal-100: #ccfbf1;
    --srms-teal-600: #0d9488;
    --srms-teal-700: #0f766e;

    /* ---- ink (text) ----
       --srms-ink-3 was #94a3b8 in srms-ui.css (2.85:1 on white — FAILS for the
       body-copy use it gets in card meta). Bumped to #64748b (4.6:1 PASS).
       srms-ui.css still references --srms-ink-3 for decorative-only chrome
       (scrollbar thumbs, close buttons) where 2.85:1 is fine, so we keep a
       separate --srms-ink-faint for those. */
    --srms-ink: #0f172a;
    --srms-ink-2: #475569;
    --srms-ink-3: #64748b;      /* body-eligible secondary text — AA on white */
    --srms-ink-faint: #94a3b8;  /* decorative only: scrollbars, dividers, icons */

    /* ---- surfaces ---- */
    --srms-surface: #ffffff;
    --srms-surface-2: #f8fafc;
    --srms-surface-3: #f1f5f9;
    --srms-line: #e2e8f0;
    --srms-line-strong: #cbd5e1;

    /* ---- accent (the default blue; toasts/modals override per-type) ---- */
    --srms-accent: var(--srms-blue-600);
    --srms-accent-strong: var(--srms-blue-700);
    --srms-accent-tint: var(--srms-blue-50);
    --srms-accent-line: rgba(37, 99, 235, 0.18);

    /* ---- shape ---- */
    --srms-radius-sm: 8px;
    --srms-radius: 12px;
    --srms-radius-lg: 16px;
    --srms-radius-xl: 20px;

    /* ---- elevation: layered, low-alpha ---- */
    --srms-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.07), 0 1px 2px rgba(15, 23, 42, 0.05);
    --srms-shadow-md: 0 4px 12px rgba(15, 23, 42, 0.08), 0 2px 6px rgba(15, 23, 42, 0.05);
    --srms-shadow-lg: 0 10px 30px rgba(15, 23, 42, 0.10), 0 4px 12px rgba(15, 23, 42, 0.06);

    /* ---- typography ---- */
    --srms-font: "Geist", "Instrument Sans", -apple-system, BlinkMacSystemFont,
        "Segoe UI", Roboto, Arial, sans-serif;
    --srms-font-heading: "Instrument Sans", -apple-system, BlinkMacSystemFont,
        "Segoe UI", Roboto, Arial, sans-serif;

    --srms-ease-spring: cubic-bezier(0.22, 1, 0.36, 1);
    --srms-ease-out: cubic-bezier(0.16, 1, 0.3, 1);

    /* ---- layout ----
       content-page padding. The vendor default is 0 15px 65px 15px; dashboards
       already use ~32px. This token lets srms-page.css standardise without
       editing app.min.css. */
    --srms-content-pad-x: 24px;
    --srms-content-pad-y: 24px;

    /* ============================================================
     * UNPREFIXED ALIASES — the names ~194 views already use inline.
     * Exposed here so a view can delete its own :root block and still
     * resolve. Values are identical to the --srms-* originals above.
     * ============================================================ */
    --primary: var(--srms-blue-600);
    --primary-light: var(--srms-blue-50);
    --primary-dark: var(--srms-blue-700);

    --teal: var(--srms-teal-600);
    --teal-light: var(--srms-teal-50);

    --amber: var(--srms-amber-600);
    --amber-light: var(--srms-amber-50);

    --red: var(--srms-red-600);
    --red-light: var(--srms-red-50);

    --green: var(--srms-green-600);
    --green-light: var(--srms-green-50);

    --purple: var(--srms-purple-600);
    --purple-light: var(--srms-purple-50);

    --surface: var(--srms-surface);
    --surface-2: var(--srms-surface-2);
    --border: var(--srms-line);
    --border-focus: #93c5fd;

    --text-1: var(--srms-ink);
    --text-2: var(--srms-ink-2);
    --text-3: var(--srms-ink-3);

    --shadow-sm: var(--srms-shadow-sm);
    --shadow-md: var(--srms-shadow-md);
    --shadow-lg: var(--srms-shadow-lg);

    --radius: var(--srms-radius);
    --radius-sm: var(--srms-radius-sm);
    --radius-lg: var(--srms-radius-lg);
}