/* ============================================
   TV NEWS DESIGN SYSTEM — CSS Custom Properties
   Premium broadcast-quality design tokens
   ============================================ */

/* ---- Dark Theme (Default) ---- */
:root {
  /* Background Colors */
  --color-bg-primary: #0D1117;
  --color-bg-secondary: #161B22;
  --color-bg-surface: #1C2128;
  --color-bg-card: #21262D;
  --color-bg-card-hover: #282E36;

  /* Accent Colors */
  --color-accent-red: #E63946;
  --color-accent-red-hover: #FF4757;
  --color-accent-red-dark: #C62828;
  --color-accent-blue: #2196F3;
  --color-accent-green: #00C853;
  --color-accent-orange: #FF9800;
  --color-accent-purple: #9C27B0;

  /* Text Colors */
  --color-text-primary: #F0F6FC;
  --color-text-secondary: #8B949E;
  --color-text-muted: #6E7681;

  /* Border Colors */
  --color-border: #30363D;
  --color-border-hover: #484F58;

  /* Overlay Colors */
  --color-overlay: rgba(0, 0, 0, 0.7);
  --color-overlay-light: rgba(0, 0, 0, 0.4);

  /* Spacing Scale */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.5);
  --shadow-xl: 0 20px 50px rgba(0, 0, 0, 0.6);

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;
  --transition-slow: 350ms ease;

  /* Border Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-full: 9999px;

  /* Z-Index Scale */
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-modal: 300;
  --z-tooltip: 400;

  /* Category Colors */
  --cat-politics: #E63946;
  --cat-world: #2196F3;
  --cat-economy: #FF9800;
  --cat-sports: #4CAF50;
  --cat-technology: #9C27B0;
  --cat-culture: #E91E63;
  --cat-health: #00BCD4;
  --cat-opinion: #FFC107;

  /* Typography */
  --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-display: 'Playfair Display', 'Georgia', serif;
  --font-accent: 'Oswald', 'Impact', sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;
}

/* ---- Light Theme ---- */
[data-theme='light'] {
  --color-bg-primary: #FFFFFF;
  --color-bg-secondary: #F6F8FA;
  --color-bg-surface: #FFFFFF;
  --color-bg-card: #FFFFFF;
  --color-bg-card-hover: #F3F4F6;

  --color-text-primary: #1F2937;
  --color-text-secondary: #4B5563;
  --color-text-muted: #9CA3AF;

  --color-border: #E5E7EB;
  --color-border-hover: #D1D5DB;

  --color-overlay: rgba(0, 0, 0, 0.5);
  --color-overlay-light: rgba(0, 0, 0, 0.2);

  /* Shadows — lighter for light theme */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.12);
  --shadow-xl: 0 20px 50px rgba(0, 0, 0, 0.16);
}