/**
 * MyAssurBox — Variables CSS
 * Charte graphique "Final v3"
 * Dégradé violet/bleu, cards colorées, KPI glass
 */

:root {
    /* === Couleurs principales === */
    --color-primary: #0EA5E9;
    --color-secondary: #8B5CF6;
    --color-accent-pink: #EC4899;
    --color-accent-yellow: #FBBF24;
    --color-primary-dark: #1E293B;
    --color-primary-mid: #334155;
    --color-primary-light: #475569;
    --color-accent: #F97316;
    --color-accent-hover: #EA6C0E;
    --color-accent-glow: rgba(14, 165, 233, 0.3);
    --color-secondary-glow: rgba(139, 92, 246, 0.3);

    /* === Dégradés === */
    --gradient-hero: linear-gradient(135deg, #667eea, #764ba2);
    --gradient-primary: linear-gradient(135deg, #0EA5E9, #8B5CF6);
    --gradient-dark: linear-gradient(135deg, #667eea, #764ba2);
    --gradient-accent: linear-gradient(135deg, #0EA5E9, #8B5CF6);
    --gradient-text: linear-gradient(135deg, #FBBF24, #F97316);

    /* === Glassmorphism === */
    --glass-bg: rgba(255, 255, 255, 0.15);
    --glass-border: rgba(255, 255, 255, 0.20);
    --glass-hover: rgba(255, 255, 255, 0.25);
    --glass-blur: blur(20px);

    /* === Neutres (sections claires) === */
    --color-bg: #F8FAFC;
    --color-surface: #FFFFFF;
    --color-text: #111827;
    --color-text-secondary: #6B7280;
    --color-border: #E5E7EB;

    /* === Texte sur fond sombre === */
    --color-text-light: #FFFFFF;
    --color-text-light-body: rgba(255, 255, 255, 0.5);
    --color-text-light-muted: rgba(255, 255, 255, 0.3);

    /* === Badges types de fichier === */
    --color-badge-pdf: #EF4444;
    --color-badge-ppt: #F97316;
    --color-badge-pack: #F97316;
    --color-badge-exam: #F97316;

    /* === Feedback === */
    --color-success: #16A34A;
    --color-error: #DC2626;
    --color-warning: #F59E0B;

    /* === Footer === */
    --color-footer-bg: #1E293B;

    /* === Typographie === */
    --font-heading: 'Inter', sans-serif;
    --font-body: 'Inter', sans-serif;

    --fs-h1: 2.5rem;
    --fs-h2: 2rem;
    --fs-h3: 1.5rem;
    --fs-body: 1rem;
    --fs-small: 0.875rem;
    --fs-xs: 0.75rem;

    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;
    --fw-extrabold: 800;
    --fw-black: 900;

    /* === Ombres === */
    --shadow-card: 0 2px 12px rgba(0, 0, 0, 0.05);
    --shadow-card-hover: 0 25px 60px rgba(0, 0, 0, 0.15);
    --shadow-glass: 0 10px 40px rgba(0, 0, 0, 0.25);
    --shadow-cta-glow: 0 8px 24px rgba(14, 165, 233, 0.35);

    /* === Border-radius === */
    --radius-sm: 5px;
    --radius-md: 11px;
    --radius-lg: 14px;
    --radius-xl: 18px;
    --radius-round: 25px;
    --radius-pill: 50px;

    /* === Transitions === */
    --transition-base: 0.3s ease;
    --transition-smooth: 0.5s cubic-bezier(0.16, 1, 0.3, 1);

    /* === Largeurs === */
    --container-max: 1280px;
    --container-narrow: 960px;

    /* === Header === */
    --header-height: 72px;
    --header-height-scrolled: 60px;
    --header-bg: rgba(5, 10, 20, 0.95);
}