/*
 * Design tokens – primitive values
 *
 * These define the raw scale (palette, spacing, type, etc.).
 * Do not use these directly in component or feature styles.
 * Reference the semantic variables defined in theme.css instead.
 */

:root {
    /* ── Color palette ───────────────────────────────────── */

    --blue-50:  #e6f0fa;
    --blue-100: #f0f6ff;
    --blue-200: #d8e8f8;
    --blue-300: #8ec8f5;
    --blue-400: #3aa3e8;
    --blue-600: #0078d4;
    --blue-700: #005a9e;
    --blue-800: #004578;
    --blue-900: #002d52;
    --blue-950: #001929;

    --gray-50:  #fdfdfd;
    --gray-100: #f9f9f9;
    --gray-200: #f5f5f5;
    --gray-300: #e8e8e8;
    --gray-400: #ddd;
    --gray-600: #888;
    --gray-700: #666;
    --gray-800: #555;
    --gray-850: #444;
    --gray-900: #222;
    --gray-950: #111;

    --white: #ffffff;

    --red-50:  #fff8f8;
    --red-950: #1a0000;

    /* ── Spacing scale ────────────────────────────────────── */

    --space-xs:  0.25rem;
    --space-sm:  0.5rem;
    --space-md:  1rem;
    --space-lg:  1.5rem;
    --space-xl:  2rem;
    --space-2xl: 3rem;
    --space-3xl: 3.5rem;

    /* ── Border radius ────────────────────────────────────── */

    --radius-sm:   4px;
    --radius-md:   6px;
    --radius-full: 50%;

    /* ── Typography ───────────────────────────────────────── */

    --font-body: "Segoe UI", sans-serif;

    --font-size-sm:   0.9rem;
    --font-size-base: 1rem;
    --font-size-md:   1.15rem;
    --font-size-lg:   1.25rem;
    --font-size-xl:   1.5rem;
    --font-size-2xl:  1.6rem;

    --font-weight-normal:   400;
    --font-weight-semibold: 600;
    --font-weight-bold:     700;

    --line-height-tight:   1.2;
    --line-height-snug:    1.4;
    --line-height-normal:  1.6;
    --line-height-relaxed: 1.65;
    --line-height-loose:   1.75;

    /* ── Shadows ──────────────────────────────────────────── */

    --shadow-card: 0 2px 8px rgba(0, 120, 212, 0.07);
}