/* tokens.css — PlumbStrikez design tokens (v2 design system).
   Direction: sportsbook market cards on a terminal-dark base.
   Every component in app.css consumes these variables; changing the look
   site-wide is a one-file edit. */

/* ---- Self-hosted brand fonts (body text = system stack, no webfont) ---- */
@font-face {
    font-family: 'Orbitron';
    font-style: normal;
    font-weight: 700 900;            /* variable font file */
    font-display: swap;
    src: url('/static/fonts/orbitron-var.woff2') format('woff2');
}
@font-face {
    font-family: 'Rajdhani';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('/static/fonts/rajdhani-600.woff2') format('woff2');
}

:root {
    /* ---- Surfaces (terminal-dark, slight blue cast) ---- */
    --bg:            #0a0e14;        /* page background */
    --surface:       #111722;        /* cards, nav, panels */
    --surface-2:     #161e2c;        /* nested panels, table header rows */
    --surface-3:     #1c2536;        /* hover/elevated states, odds chips */
    --border:        #1f2a3a;        /* hairline card/table borders */
    --border-strong: #2c3a52;        /* hover borders, dividers */

    /* ---- Brand ---- */
    --brand-green:   #00ff88;
    --brand-cyan:    #00e5ff;
    --brand-gradient: linear-gradient(135deg, var(--brand-green), var(--brand-cyan));

    /* ---- Text ---- */
    --text:          #e8edf5;
    --text-dim:      #93a1b5;        /* secondary copy, labels */
    --text-faint:    #5b6878;        /* placeholders, disabled */

    /* ---- Semantics (betting) ---- */
    --edge-pos:      #00e676;        /* model edge in our favour */
    --edge-neg:      #ff5470;        /* negative edge / losses */
    --odds:          #7fd8ff;        /* odds numerals */
    --inplay:        #ff5470;
    --warn:          #ffb454;

    /* ---- Type ---- */
    --font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-brand: 'Orbitron', var(--font-body);
    --font-label: 'Rajdhani', var(--font-body);   /* uppercase eyebrows/section labels */

    /* ---- Scale ---- */
    --radius:        12px;           /* cards */
    --radius-sm:     8px;            /* chips, buttons, odds */
    --space-1: 4px;  --space-2: 8px;  --space-3: 12px;
    --space-4: 16px; --space-5: 24px; --space-6: 32px;

    /* ---- Effects ---- */
    --shadow-card:   0 1px 2px rgba(0,0,0,.4), 0 8px 24px -12px rgba(0,0,0,.5);
    --glow-green:    0 0 0 1px var(--brand-green), 0 0 14px -4px var(--brand-green);
    --glow-cyan:     0 0 0 1px var(--brand-cyan), 0 0 14px -4px var(--brand-cyan);
}