/* ============================================
   NANO TV PARIS — Thème Clair
   Surcharge les variables de variables.css
   ============================================ */

[data-theme="light"] {
    /* --- Couleurs principales (bleu) --- */
    --color-primary: #1a73c7;           /* Bleu vif */
    --color-primary-dim: #1565b3;       /* Bleu intense */
    --color-primary-container: #d4e6f9; /* Fond bleu doux */
    --color-on-primary: #ffffff;        /* Texte sur bleu */
    --color-on-primary-container: #0d4f8a;

    /* --- Couleurs secondaires --- */
    --color-secondary: #3d5a80;         /* Bleu marine */
    --color-secondary-container: #d7e3f2; /* Bleu clair */
    --color-on-secondary: #ffffff;
    --color-on-secondary-container: #2c4466;

    /* --- Couleurs tertiaires (jaune poussin clair) --- */
    --color-tertiary: #c5a800;
    --color-tertiary-container: #fdf6d0;
    --color-on-tertiary: #3a3400;

    /* --- Surfaces --- */
    --color-background: #f0f0ec;        /* Fond crème léger */
    --color-surface: #f7f7f4;
    --color-surface-dim: #e4e4e0;
    --color-surface-container-lowest: #ffffff;
    --color-surface-container-low: #f0f0ec;
    --color-surface-container: #e4e4e0;
    --color-surface-container-high: #d5d5d0;
    --color-surface-container-highest: #c0c0bb;
    --color-surface-variant: #e4e4e0;
    --color-surface-bright: #f7f7f4;

    /* --- Textes --- */
    --color-on-surface: #1a1a18;        /* Texte quasi noir */
    --color-on-surface-variant: #4a4a45; /* Texte gris chaud */
    --color-on-background: #1a1a18;

    /* --- Bordures et contours --- */
    --color-outline: #6e6e68;
    --color-outline-variant: #c8c8c2;

    /* --- Erreurs --- */
    --color-error: #c62828;
    --color-error-container: #ffdad6;
    --color-on-error: #ffffff;

    /* --- Inversés --- */
    --color-inverse-surface: #2f2f2d;
    --color-inverse-on-surface: #f0f0ec;
    --color-inverse-primary: #4da4e7;

    /* --- Nav --- */
    --nav-bg: rgba(240, 240, 236, 0.8);

    /* --- Ombres --- */
    --shadow-nav: 0 4px 20px rgba(0, 0, 0, 0.1);
}

/* Auto-détection navigateur si aucun choix manuel */
@media (prefers-color-scheme: light) {
    :root:not([data-theme]) {
        --color-primary: #1a73c7;
        --color-primary-dim: #1565b3;
        --color-primary-container: #d4e6f9;
        --color-on-primary: #ffffff;
        --color-on-primary-container: #0d4f8a;
        --color-secondary: #3d5a80;
        --color-secondary-container: #d7e3f2;
        --color-on-secondary: #ffffff;
        --color-on-secondary-container: #2c4466;
        --color-tertiary: #c5a800;
        --color-tertiary-container: #fdf6d0;
        --color-on-tertiary: #3a3400;
        --color-background: #f0f0ec;
        --color-surface: #f7f7f4;
        --color-surface-dim: #e4e4e0;
        --color-surface-container-lowest: #ffffff;
        --color-surface-container-low: #f0f0ec;
        --color-surface-container: #e4e4e0;
        --color-surface-container-high: #d5d5d0;
        --color-surface-container-highest: #c0c0bb;
        --color-surface-variant: #e4e4e0;
        --color-surface-bright: #f7f7f4;
        --color-on-surface: #1a1a18;
        --color-on-surface-variant: #4a4a45;
        --color-on-background: #1a1a18;
        --color-outline: #6e6e68;
        --color-outline-variant: #c8c8c2;
        --color-error: #c62828;
        --color-error-container: #ffdad6;
        --color-on-error: #ffffff;
        --color-inverse-surface: #2f2f2d;
        --color-inverse-on-surface: #f0f0ec;
        --color-inverse-primary: #4da4e7;
        --nav-bg: rgba(240, 240, 236, 0.8);
        --shadow-nav: 0 4px 20px rgba(0, 0, 0, 0.1);
    }
}