/*
 * School Console — design tokens
 * Source of truth for color, type, spacing, radius, shadow.
 * Aligned to the existing purple logo (WEBSITE_REDESIGN_PLAN §3.1, §3.5).
 * Any UI in Razor pages / components should consume these via var(--sc-*).
 * Hardcoded color values outside this file are a bug.
 */
:root {
    /* Surface */
    --sc-bg:           #FFFFFF;
    --sc-surface:      #FFFFFF;
    --sc-surface-2:    #F7F8FC;
    --sc-surface-3:    #EEF0F8;
    --sc-border:       #E6E8F0;
    --sc-border-2:     #D9DCEA;
    --sc-shadow-sm:    0 1px 2px rgba(20, 24, 40, .06);
    --sc-shadow:       0 1px 2px rgba(20, 24, 40, .06), 0 8px 24px rgba(20, 24, 40, .06);
    --sc-shadow-lg:    0 4px 12px rgba(20, 24, 40, .08), 0 16px 48px rgba(20, 24, 40, .08);

    /* Ink */
    --sc-ink:          #111634;
    --sc-ink-2:        #2A3055;
    --sc-ink-3:        #5C6388;
    --sc-ink-mute:     #8A90AE;
    --sc-ink-inverse:  #FFFFFF;

    /* Primary — cyan (Tailwind cyan-500 → 700). Matched to the real ERP's "S" brand mark
       per 2026-05-13 screenshot. Pure cyan for the bright brand pop the product uses
       throughout (sidebar badge, active-item highlight, mini-pill backgrounds). */
    --sc-primary:      #06B6D4;
    --sc-primary-600:  #0891B2;
    --sc-primary-700:  #0E7490;
    --sc-primary-50:   #ECFEFF;
    --sc-primary-100:  #CFFAFE;

    /* Accent — teal-500 (slightly more green than primary). Used on AI section + success states. */
    --sc-accent-2:     #14B8A6;
    --sc-accent-2-50:  #CCFBF1;

    /* Semantic */
    --sc-success:      #16A34A;
    --sc-warn:         #F59E0B;
    --sc-danger:       #DC2626;
    --sc-info:         #0EA5E9;

    /* Radius */
    --sc-radius-sm:    8px;
    --sc-radius:       12px;
    --sc-radius-lg:    20px;
    --sc-radius-pill:  9999px;

    /* Spacing scale (multiples of 4) */
    --sc-s-1:  4px;
    --sc-s-2:  8px;
    --sc-s-3:  12px;
    --sc-s-4:  16px;
    --sc-s-5:  24px;
    --sc-s-6:  32px;
    --sc-s-7:  48px;
    --sc-s-8:  64px;
    --sc-s-9:  96px;

    /* Type — Inter for everything, JetBrains Mono in code blocks */
    --sc-font-sans:    "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --sc-font-mono:    "JetBrains Mono", "Cascadia Code", Consolas, "Liberation Mono", monospace;

    /* Container widths */
    --sc-container:    1200px;
    --sc-container-narrow: 880px;

    /* Hero gradient — cyan tints */
    --sc-hero-grad:    linear-gradient(135deg, #ECFEFF 0%, #CFFAFE 40%, #ECFEFF 100%);
    /* AI section gradient — dark cyan/navy. Strong identity vs the light hero. */
    --sc-ai-grad:      linear-gradient(135deg, #083344 0%, #155E75 50%, #0E7490 100%);
}

/* Dark-section reads */
[data-theme="dark"] {
    --sc-bg:           #0F0B1F;
    --sc-surface:      #1A1233;
    --sc-surface-2:    #221947;
    --sc-border:       rgba(255, 255, 255, .12);
    --sc-ink:          #FFFFFF;
    --sc-ink-2:        #E5E1FA;
    --sc-ink-3:        #B8B0E0;
    --sc-ink-mute:     #8A8CB0;
}
