/* ==========================================================
   dimosTV Design Tokens
   Release Sprint R1
========================================================== */

:root {
    /* Brand Colors */
    --dtv-color-primary: #CC0000;
    --dtv-color-primary-hover: #E00000;
    --dtv-color-secondary: #0066CC;
    --dtv-color-secondary-hover: #0074E8;

    /* Surfaces */
    --dtv-color-background: #F5F7FB;
    --dtv-color-surface: #FFFFFF;
    --dtv-color-surface-dark: #0F172A;
    --dtv-color-surface-navy: #1A2E4A;
    --dtv-color-surface-soft: #F1F5F9;

    /* Text */
    --dtv-color-text: #1A2E4A;
    --dtv-color-text-muted: rgba(26, 46, 74, .68);
    --dtv-color-text-inverse: #FFFFFF;
    --dtv-color-text-inverse-muted: rgba(255, 255, 255, .72);

    /* Borders */
    --dtv-color-border: rgba(26, 46, 74, .12);
    --dtv-color-border-inverse: rgba(255, 255, 255, .16);

    /* Overlays */
    --dtv-overlay-dark: rgba(5, 10, 20, .72);
    --dtv-overlay-soft: rgba(15, 23, 42, .68);

    /* Spacing */
    --dtv-space-2xs: 4px;
    --dtv-space-xs: 8px;
    --dtv-space-sm: 12px;
    --dtv-space-md: 16px;
    --dtv-space-lg: 24px;
    --dtv-space-xl: 32px;
    --dtv-space-2xl: 48px;
    --dtv-space-3xl: 72px;

    /* Radius */
    --dtv-radius-xs: 6px;
    --dtv-radius-sm: 10px;
    --dtv-radius-md: 14px;
    --dtv-radius-lg: 18px;
    --dtv-radius-xl: 22px;
    --dtv-radius-2xl: 28px;
    --dtv-radius-pill: 999px;

    /* Shadows */
    --dtv-shadow-xs: 0 4px 14px rgba(15, 23, 42, .08);
    --dtv-shadow-sm: 0 10px 28px rgba(15, 23, 42, .10);
    --dtv-shadow-card: 0 18px 46px rgba(26, 46, 74, .12);
    --dtv-shadow-card-hover: 0 30px 90px rgba(15, 23, 42, .34);
    --dtv-shadow-modal: 0 24px 80px rgba(0, 0, 0, .40);
    --dtv-shadow-control: 0 12px 30px rgba(0, 0, 0, .24);

    /* Motion */
    --dtv-motion-fast: .16s ease;
    --dtv-motion-normal: .22s ease;
    --dtv-motion-slow: .32s ease;

    /* Z Index */
    --dtv-z-base: 1;
    --dtv-z-controls: 10;
    --dtv-z-dropdown: 100;
    --dtv-z-overlay: 1000;
    --dtv-z-modal: 999990;
    --dtv-z-player: 999998;
    --dtv-z-toast: 999999;

    /* Layout */
    --dtv-container-max: 1440px;
    --dtv-card-width-sm: 240px;
    --dtv-card-width-md: 280px;
    --dtv-card-width-lg: 320px;

    /* Typography */
    --dtv-font-heading: Oswald, sans-serif;
    --dtv-font-body: inherit;
    --dtv-font-weight-bold: 800;
    --dtv-font-weight-black: 900;
}

/* Dark UI utility scope */
.dtv-ui-dark {
    --dtv-color-text: var(--dtv-color-text-inverse);
    --dtv-color-text-muted: var(--dtv-color-text-inverse-muted);
    --dtv-color-surface: var(--dtv-color-surface-dark);
    --dtv-color-border: var(--dtv-color-border-inverse);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    :root {
        --dtv-motion-fast: 0s;
        --dtv-motion-normal: 0s;
        --dtv-motion-slow: 0s;
    }
}