/* ==========================================================================
   Color Tokens — Dark (default) & Light themes
   Premium sports broadcast aesthetic
   ========================================================================== */

:root,
[data-theme="dark"] {
    --bg-base:      #060D1A;
    --bg-elevated:  #0C1829;
    --bg-card:      #111F36;
    --bg-card-alt:  #152640;
    --border:       rgba(255, 255, 255, 0.06);
    --border-hover: rgba(245, 166, 35, 0.4);
    --text-primary: #E8ECF1;
    --text-secondary: #B0B8C8;
    --text-muted:   #5A6A82;
    --accent-1:     #F5A623;  /* Gold / Amber */
    --accent-2:     #E8891D;  /* Deeper gold */
    --accent-grad:  linear-gradient(135deg, #F5A623, #E8891D);
    --accent-glow:  rgba(245, 166, 35, 0.15);
    --success:      #34D399;
    --warning:      #FBBF24;
    --danger:       #EF4444;
    --live-color:   #EF4444;
    --nav-bg:       rgba(6, 13, 26, 0.95);
    --nav-border:   rgba(245, 166, 35, 0.2);
    --shadow-card:
        0 1px 0 rgba(255, 255, 255, 0.03) inset,
        0 2px 8px rgba(0, 0, 0, 0.4),
        0 8px 32px rgba(0, 0, 0, 0.2);
    --shadow-glow:  0 0 20px rgba(245, 166, 35, 0.08);
}

[data-theme="light"] {
    --bg-base:      #F0F2F5;
    --bg-elevated:  #FFFFFF;
    --bg-card:      #FFFFFF;
    --bg-card-alt:  #F7F8FA;
    --border:       rgba(0, 0, 0, 0.08);
    --border-hover: rgba(200, 130, 20, 0.4);
    --text-primary: #1A1D26;
    --text-secondary: #4A5568;
    --text-muted:   #8896A6;
    --accent-1:     #D4890A;
    --accent-2:     #B87308;
    --accent-grad:  linear-gradient(135deg, #D4890A, #B87308);
    --accent-glow:  rgba(212, 137, 10, 0.1);
    --success:      #059669;
    --warning:      #D97706;
    --danger:       #DC2626;
    --live-color:   #DC2626;
    --nav-bg:       rgba(255, 255, 255, 0.95);
    --nav-border:   rgba(0, 0, 0, 0.1);
    --shadow-card:
        0 1px 3px rgba(0, 0, 0, 0.06),
        0 4px 16px rgba(0, 0, 0, 0.04);
    --shadow-glow:  0 0 20px rgba(212, 137, 10, 0.06);
}