/* =====================================
   MULTIPRESS DESIGN SYSTEM (v1.3.0 FINAL)
   - Global Tokens
   - Dark Newsroom UI
   - Broadcast Color System
===================================== */

:root {

    /* ================= BRAND ================= */

    /* Core Background */
    --primary: #050A14;              /* Deep black/blue */
    --primary-soft: #0A1A2F;         /* Soft navy */

    /* Accent Colors */
    --secondary: #007BFF;            /* Electric blue */
    --secondary-dark: #0056b3;
    --secondary-glow: #00D4FF;

    --accent: #D72638;               /* Breaking news red */
    --accent-dark: #A61B28;

    --accent-alt: #FF6A00;           /* Energy orange */

    --danger: #FF3B3B;

    /* ================= TEXT ================= */

    --text: #E5E7EB;
    --text-light: #A0AEC0;
    --text-muted: #6B7280;

    /* Always use on dark/red backgrounds */
    --text-inverse: #FFFFFF;

    /* ================= BACKGROUNDS ================= */

    --white: #0F172A;               /* Card background */
    --bg-light: #111827;
    --bg-soft: #1F2937;
    --bg-dark: #050A14;

    --bg-overlay: rgba(0,0,0,0.7);

    /* ================= BORDERS ================= */

    --border: #1F2937;
    --border-light: #374151;

    /* ================= TYPOGRAPHY ================= */

    --font-primary: 'Open Sans', sans-serif;
    --font-heading: 'Poppins', sans-serif;

    /* Font Sizes */
    --text-xs: 12px;
    --text-sm: 14px;
    --text-base: 16px;
    --text-lg: 18px;
    --text-xl: 22px;
    --text-2xl: 28px;
    --text-3xl: 36px;
    --text-4xl: 44px;

    /* Font Weights */
    --fw-normal: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;

    /* ================= SPACING ================= */

    --spacing-xs: 5px;
    --spacing-sm: 10px;
    --spacing-md: 20px;
    --spacing-lg: 40px;
    --spacing-xl: 60px;
    --spacing-xxl: 80px;

    /* ================= RADIUS ================= */

    --radius-sm: 6px;
    --radius: 10px;
    --radius-lg: 16px;
    --radius-xl: 24px;

    /* ================= SHADOW ================= */

    --shadow-sm: 0 2px 8px rgba(0,0,0,0.2);
    --shadow: 0 5px 15px rgba(0,0,0,0.3);
    --shadow-lg: 0 10px 30px rgba(0,0,0,0.5);

    /* Glow Effects */
    --glow-blue: 0 0 12px rgba(0,212,255,0.5);
    --glow-red: 0 0 12px rgba(215,38,56,0.5);

    /* ================= TRANSITIONS ================= */

    --transition-fast: 0.2s ease;
    --transition: 0.3s ease;
    --transition-slow: 0.5s ease;

    /* ================= Z-INDEX ================= */

    --z-header: 1000;
    --z-overlay: 9998;
    --z-menu: 10000;

    /* ================= CONTAINER ================= */

    --container-width: 1200px;

    /* ================= GRADIENTS ================= */

    --gradient-primary: linear-gradient(
        135deg,
        #007BFF,
        #00D4FF
    );

    --gradient-breaking: linear-gradient(
        135deg,
        #8B0000,
        #D72638
    );

    --gradient-energy: linear-gradient(
        135deg,
        #FF6A00,
        #FFA500
    );
}

/* =====================================
   DARK MODE (ENHANCED)
===================================== */

[data-theme="dark"] {

    --text: #E5E7EB;
    --text-light: #A0AEC0;
    --text-muted: #6B7280;

    --white: #0A1A2F;
    --bg-light: #050A14;
    --bg-soft: #0F172A;
    --bg-dark: #000;

    --border: #1F2937;
    --border-light: #374151;

    --shadow-sm: 0 2px 8px rgba(0,0,0,0.6);
    --shadow: 0 5px 15px rgba(0,0,0,0.7);
    --shadow-lg: 0 10px 30px rgba(0,0,0,0.9);
}