/**
 * VARIABLES CSS
 * Définition des variables globales du projet ANSSI
 * Couleurs, polices, espacements, etc.
 */

:root {
    /* === COULEURS PRINCIPALES === */
    --couleur-primaire: #ff7700;           /* Orange ANSSI */
    --couleur-primaire-hover: #ff8c1a;     /* Orange hover */
    --couleur-primaire-clair: rgba(255, 119, 0, 0.12);  /* Fond bouton secondaire */
    --couleur-secondaire: #1e293b;         /* Ardoise (chaleureux) */
    --couleur-accent: #5a7a76;             /* Teal adouci */
    --couleur-accent-hover: #4a6a66;       /* Teal foncé */
    --couleur-accent-clair: rgba(90, 122, 118, 0.12);   /* Teinte légère, voir à travers */
    --couleur-accent-voile: rgba(90, 122, 118, 0.06);   /* Voile très subtil */
    --couleur-fond: #ffffff;               /* Blanc */
    --couleur-blanc: #ffffff;              /* Blanc */
    --couleur-noir: #000000;               /* Noir pur */
    
    /* === COULEURS DE TEXTE === */
    --texte-principal: #334155;            /* Texte principal (ardoise) */
    --texte-secondaire: #64748b;           /* Texte secondaire */
    --texte-clair: #94a3b8;                /* Texte clair */
    --texte-inverse: #ffffff;              /* Texte sur fond foncé */
    
    /* === COULEURS DE BADGES (teintes translucides, voir à travers) === */
    --badge-actualites: #4a9b7a;                       /* Joli vert */
    --badge-publications: rgba(90, 122, 118, 0.7);      /* Teal voilé */
    --badge-alertes: rgba(184, 84, 80, 0.75);           /* Rouge voilé */
    --badge-politique: rgba(74, 122, 106, 0.75);        /* Vert sauge voilé */
    
    /* === POLICES === */
    --police-principale: 'Roboto', sans-serif;
    
    /* === POIDS DE POLICE === */
    --poids-light: 300;
    --poids-regular: 400;
    --poids-medium: 500;
    --poids-bold: 700;
    --poids-black: 900;
    
    /* === TAILLES DE POLICE === */
    --taille-petit: 12px;
    --taille-normal: 14px;
    --taille-moyen: 16px;
    --taille-grand: 18px;
    --taille-titre-3: 24px;
    --taille-titre-2: 32px;
    --taille-titre-1: 36px;
    --taille-hero: 48px;
    
    /* === ESPACEMENTS === */
    --espacement-xs: 5px;
    --espacement-sm: 10px;
    --espacement-md: 15px;
    --espacement-lg: 20px;
    --espacement-xl: 30px;
    --espacement-xxl: 40px;
    --espacement-section: 80px;
    
    /* === BORDURES === */
    --rayon-petit: 3px;
    --rayon-normal: 5px;
    --rayon-moyen: 8px;
    --rayon-grand: 10px;
    --rayon-arrondi: 15px;
    --rayon-rond: 50%;
    
    /* === OMBRES === */
    --ombre-legere: 0 2px 10px rgba(0, 0, 0, 0.1);
    --ombre-moyenne: 0 5px 20px rgba(0, 0, 0, 0.1);
    --ombre-forte: 0 10px 30px rgba(0, 0, 0, 0.15);
    --ombre-tres-forte: 0 20px 60px rgba(0, 0, 0, 0.3);
    --ombre-orange: 0 5px 15px rgba(255, 119, 0, 0.3);
    
    /* === TRANSITIONS === */
    --transition-rapide: 0.3s;
    --transition-normale: 0.5s;
    --transition-lente: 1s;
    
    /* === HAUTEURS FIXES === */
    --header-height: 60px;

    /* === Z-INDEX === */
    --z-modal: 9999;
    --z-overlay: 999;
    --z-header: 1010;  /* Au-dessus de la bande nav-bar (1004) pour que le menu déroulant passe par-dessus */
    --z-navbar: 1002;
    --z-menu-mobile: 1001;
    --z-signal-button: 999;
    /* Hauteur approximative de la barre fixe « Signaler un incident » (mobile ≤1024px) + marge */
    --reserve-signal-bar-h: 56px;
    
    /* === LARGEURS MAXIMALES === */
    --largeur-container: 1400px;
    --largeur-medium: 1200px;
    --largeur-small: 800px;
    --largeur-modal: 960px;
}