/* Velocity Peak token source-of-truth for RunZone (light + dark) */

:root {
    color-scheme: light;

    /* Brand accents */
    --velocity-lime: #a3cf34;
    --pulse-orange: #ff6b00;
    --deep-track: #1a1a1a;
    --stadium-white: #ffffff;
    --asphalt-gray: #666666;
    --sidewalk-silver: #f4f4f4;

    /* Core surfaces */
    --background-color: #f9f9f9;
    --surface: #f9f9f9;
    --surface-dim: #dadada;
    --surface-bright: #f9f9f9;
    --surface-container-lowest: #ffffff;
    --surface-container-low: #f3f3f4;
    --surface-container: #eeeeee;
    --surface-container-high: #e8e8e8;
    --surface-container-highest: #e2e2e2;
    --surface-variant: #e2e2e2;

    /* Foreground */
    --on-background: #1a1c1c;
    --on-surface: #1a1c1c;
    --on-surface-variant: #444936;
    --inverse-surface: #2f3131;
    --inverse-on-surface: #f0f1f1;

    /* Semantic brand roles */
    --primary-color: #4d6700;
    --on-primary: #ffffff;
    --secondary-color: #a04100;
    --on-secondary: #ffffff;
    --accent-color: var(--pulse-orange);
    --success-color: var(--velocity-lime);
    --warning-color: #f0b429;
    --danger-color: #ba1a1a;

    /* Text aliases (legacy compatibility) */
    --text-color: var(--on-background);
    --text-primary: var(--on-surface);
    --text-secondary: #4f6f5c;
    --text-muted: #667665;
    --text-muted-color: #5f6955;
    --text-subtle-color: #727c68;
    --dark-color: var(--deep-track);
    --light-color: var(--surface-container-lowest);

    /* Borders/outlines */
    --outline: #747964;
    --outline-variant: #c4c9b1;
    --panel-border: rgba(116, 121, 100, 0.3);
    --border-color: #d0d5bf;

    /* Pastel aliases used by existing templates */
    --pastel-lavender: #e8f4ee;
    --pastel-blue: #e9f6f0;
    --pastel-mint: #ebf9ef;
    --pastel-peach: #f3fbe9;
    --pastel-pink: #eef9f1;

    /* Typography */
    --heading-font: 'Manrope', sans-serif;
    --body-font: 'Plus Jakarta Sans', sans-serif;

    /* Radius + spacing */
    --radius-sm: 0.25rem;
    --radius-md: 0.75rem;
    --radius-lg: 1rem;
    --radius-xl: 1.5rem;
    --radius-pill: 9999px;
    --border-radius: 0.75rem;
    --border-width: 1px;

    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-12: 48px;
    --touch-target: 44px;

    /* Effects */
    --glass-bg: rgba(255, 255, 255, 0.9);
    --glass-border: rgba(116, 121, 100, 0.22);
    --box-shadow: 0 12px 28px rgba(26, 28, 28, 0.12);
    --shadow-soft: 0 10px 22px rgba(38, 49, 84, 0.09);

    /* Gradients */
    --page-bg-gradient: linear-gradient(160deg, #f9f9f9 0%, #f3f3f4 58%, #e8e8e8 100%);
    --hero-glow-primary: rgba(163, 207, 52, 0.18);
    --hero-glow-secondary: rgba(255, 107, 0, 0.14);

    /* Bootstrap bridge */
    --bs-primary: var(--primary-color);
    --bs-success: var(--success-color);
    --bs-warning: var(--warning-color);
    --bs-danger: var(--danger-color);
    --bs-body-font-family: var(--body-font);
}

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

    --background-color: #12140b;
    --surface: #12140b;
    --surface-dim: #12140b;
    --surface-bright: #383a2f;
    --surface-container-lowest: #0c0f06;
    --surface-container-low: #1a1d13;
    --surface-container: #1e2116;
    --surface-container-high: #282b20;
    --surface-container-highest: #33362b;
    --surface-variant: #33362b;

    --on-background: #e2e4d3;
    --on-surface: #e2e4d3;
    --on-surface-variant: #c4c9b1;
    --inverse-surface: #e2e4d3;
    --inverse-on-surface: #2f3226;

    --primary-color: #beec4f;
    --on-primary: #263500;
    --secondary-color: #ffb693;
    --on-secondary: #561f00;
    --accent-color: #fe6b00;
    --success-color: #a9d63b;
    --warning-color: #facc72;
    --danger-color: #ffb4ab;

    --text-color: var(--on-background);
    --text-primary: var(--on-surface);
    --text-secondary: #cdeed7;
    --text-muted: #b8e6c9;
    --text-muted-color: #c4c9b1;
    --text-subtle-color: #8e937d;
    --dark-color: var(--on-surface);
    --light-color: var(--surface-container-low);

    --outline: #8e937d;
    --outline-variant: #444936;
    --panel-border: rgba(142, 147, 125, 0.35);
    --border-color: rgba(142, 147, 125, 0.5);

    --pastel-lavender: rgba(51, 54, 43, 0.78);
    --pastel-blue: rgba(46, 52, 40, 0.78);
    --pastel-mint: rgba(42, 50, 36, 0.78);
    --pastel-peach: rgba(58, 46, 34, 0.78);
    --pastel-pink: rgba(52, 46, 42, 0.78);

    --glass-bg: rgba(30, 33, 22, 0.9);
    --glass-border: rgba(142, 147, 125, 0.28);
    --box-shadow: 0 14px 28px rgba(0, 0, 0, 0.45);
    --shadow-soft: 0 12px 26px rgba(0, 0, 0, 0.4);

    --page-bg-gradient: linear-gradient(160deg, #12140b 0%, #1a1d13 58%, #282b20 100%);
    --hero-glow-primary: rgba(190, 236, 79, 0.2);
    --hero-glow-secondary: rgba(254, 107, 0, 0.16);

    --bs-primary: var(--primary-color);
    --bs-success: var(--success-color);
    --bs-warning: var(--warning-color);
    --bs-danger: var(--danger-color);
}

/* Semantic utilities used by race/auth templates */
.race-type-badge {
    color: #ffffff;
}

.race-type-badge--trail {
    background: color-mix(in srgb, var(--velocity-lime) 82%, #0f5132);
}

.race-type-badge--ocr {
    background: color-mix(in srgb, var(--danger-color) 82%, #3b0a0a);
}

.race-type-badge--multisport {
    background: color-mix(in srgb, var(--pulse-orange) 78%, #6b2c00);
}

.race-type-badge--street {
    background: color-mix(in srgb, var(--secondary-color) 70%, #1f3c88);
}

.race-badge-promo {
    background: color-mix(in srgb, var(--velocity-lime) 62%, #ffd76a);
    color: var(--deep-track);
}

.auth-error-alert {
    background: linear-gradient(135deg, var(--pastel-peach) 0%, var(--surface-container-high) 100%);
    border-color: var(--danger-color);
    color: var(--danger-color);
}