/* ============================================================
   BURGI COCKPIT — Design Tokens
   "Neon Arena" — dark navy stage, dual lightning palette
   (warm orange/red left ⚡ cool cyan/blue right) + cool spotlights.
   Derived from the reference arena image.
   ============================================================ */

:root {
    /* ── Background Palette (deep navy stage) ── */
    --bg-deepest:  #060A12;
    --bg-deep:     #0A1422;
    --bg-card:     #0E1A2E;
    --bg-elevated: #122340;
    --bg-hover:    #173052;
    --bg-input:    #0B1626;
    --bg-alt-row:  #0D1B30;

    /* ── Gradients ── */
    --gradient-body:    linear-gradient(135deg, #060A12 0%, #0A1A2E 50%, #0D2238 100%);
    --gradient-sidebar: linear-gradient(180deg, #0A1626 0%, #070E1A 100%);
    --gradient-title:   linear-gradient(100deg, #00D4FF 0%, #2DA8FF 38%, #FF7A18 100%);
    --gradient-arena:   linear-gradient(90deg, rgba(255,122,24,0.16) 0%, rgba(6,10,18,0) 40%, rgba(6,10,18,0) 60%, rgba(0,212,255,0.16) 100%);

    /* ── Dual neon accents (from the image) ── */
    --accent-cyan:    #00D4FF;   /* primary cool */
    --accent-blue:    #2DA8FF;   /* secondary cool */
    --accent-orange:  #FF7A18;   /* primary warm */
    --accent-amber:   #FF9F1C;   /* secondary warm */
    --accent-red:     #FF3B5C;   /* warm peak / danger */
    --accent-magenta: #FF2D95;   /* warm-pink lightning tip */
    --accent-violet:  #8B5CF6;   /* tertiary */
    --accent-spot:    #BFE3FF;   /* cool-white spotlight */

    /* ── Accent hover states ── */
    --accent-cyan-hover:   #33DDFF;
    --accent-orange-hover: #FF9240;

    /* ── Glow shadows ── */
    --glow-cyan:   0 0 22px rgba(0, 212, 255, 0.35);
    --glow-blue:   0 0 22px rgba(45, 168, 255, 0.30);
    --glow-orange: 0 0 22px rgba(255, 122, 24, 0.35);
    --glow-red:    0 0 22px rgba(255, 59, 92, 0.30);
    --glow-soft:   0 8px 30px rgba(0, 0, 0, 0.45);

    /* ── Text colors ── */
    --text-primary:   #EAF2FF;
    --text-secondary: #9DB2D0;
    --text-muted:     #5E7799;
    --text-accent:    #00D4FF;
    --text-danger:    #FF3B5C;
    --text-success:   #2EE6A8;
    --text-warning:   #FF9F1C;

    /* ── Semantic ── */
    --color-positive: #2EE6A8;
    --color-negative: #FF3B5C;
    --color-warning:  #FF9F1C;
    --color-up:       #2EE6A8;
    --color-down:     #FF3B5C;

    /* ── Glass / overlay ── */
    --glass-bg:        rgba(14, 26, 46, 0.66);
    --glass-border:    rgba(0, 212, 255, 0.14);
    --glass-blur:      blur(12px);
    --overlay-bg:      rgba(6, 10, 18, 0.82);
    --card-border:     rgba(255, 255, 255, 0.06);

    /* ── Typography ── */
    --font-sans: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace;
    --font-size-xs:  0.75rem;
    --font-size-sm:  0.85rem;
    --font-size-md:  1rem;
    --font-size-lg:  1.2rem;
    --font-size-xl:  1.5rem;
    --font-size-2xl: 2rem;

    /* ── Spacing ── */
    --space-xs: 0.25rem;
    --space-sm: 0.5rem;
    --space-md: 1rem;
    --space-lg: 1.5rem;
    --space-xl: 2rem;
    --space-2xl: 3rem;

    /* ── Radius ── */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-pill: 9999px;

    /* ── Transitions ── */
    --transition-fast:   0.15s ease;
    --transition-normal: 0.2s ease;
    --transition-slow:   0.3s ease;

    /* ── Layout ── */
    --sidebar-width: 248px;

    /* ── Z-index ── */
    --z-bg:      -1;
    --z-dropdown: 100;
    --z-modal:    200;
    --z-toast:    300;
}
