/**
 * MMAS — Design Tokens
 * Source UNIQUE pour toutes les pages.
 * Charger EN PREMIER, AVANT tout autre CSS.
 */
:root {
    /* --- Grille d'espacement, base 4 px -----------------------------------
       Documentée dans CLAUDE.md depuis l'origine mais jamais définie : les
       66 déclarations qui écrivaient var(--space-2) à travers l'application
       étaient invalides au calcul, donc ramenées à zéro. Les pages Assistant,
       Demandes parents, Photos et Réinscriptions avaient leurs gouttières
       écrasées sans que ça saute aux yeux. */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-7: 28px;
    --space-8: 32px;

    /* Couleurs principales */
    --primary: #4338ca;
    --primary-dark: #3730a3;
    --primary-light: #6366f1;
    --primary-50: #eef2ff;
    --primary-100: #e0e7ff;

    --secondary: #0ea5e9;
    --secondary-dark: #0284c7;
    --secondary-light: #38bdf8;
    --accent: #8b5cf6;

    /* Surfaces */
    --surface: #ffffff;
    --background: #f8fafc;

    /* Sémantiques */
    --success: #10b981;
    --success-light: #d1fae5;
    --success-dark: #059669;
    --warning: #f59e0b;
    --warning-light: #fef3c7;
    --warning-dark: #d97706;
    --danger: #ef4444;
    --danger-light: #fee2e2;
    --danger-dark: #dc2626;
    --info: #3b82f6;
    --info-light: #dbeafe;

    /* Variantes TEXTE : foncées, lisibles (≥4.5:1) sur fond clair/blanc ou
       sur les fonds *-light. À utiliser pour le TEXTE des badges/pills, pas
       les versions vives (--success/--danger) qui échouent au contraste AA. */
    --success-text: #047857;
    --warning-text: #92400e;
    --danger-text: #b91c1c;
    --info-text: #1d4ed8;
    --accent-text: #6d28d9;
    --secondary-text: #0369a1; /* ~5.3:1 — pour le TEXTE (le vif --secondary #0ea5e9 = 2.77:1, audit A11Y-1) */

    /* Neutres (Tailwind Slate) */
    --white: #ffffff;
    --gray-50: #f8fafc;
    --gray-100: #f1f5f9;
    --gray-200: #e2e8f0;
    --gray-300: #cbd5e1;
    --gray-400: #6b7488; /* WCAG AA : 4.57:1 sur blanc (audit A11Y-1 : #78839a ne faisait que 3.81:1) */
    --gray-500: #64748b;
    --gray-600: #475569;
    --gray-700: #334155;
    --gray-800: #1e293b;
    --gray-900: #0f172a;

    --whatsapp: #25D366;
    --whatsapp-dark: #128C7E;

    /* Typo */
    --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

    /* Rayons */
    --radius-xs: 4px;
    --radius-sm: 8px;
    --radius: 12px;
    --radius-md: 16px;
    --radius-lg: 20px;
    --radius-xl: 24px;
    --radius-full: 9999px;

    /* Ombres */
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
    --shadow-md: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.025);
    --shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    --shadow-xl: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
    --glass-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);

    /* Glassmorphism */
    --glass-bg: rgba(255, 255, 255, 0.7);
    --glass-border: 1px solid rgba(255, 255, 255, 0.3);
    --blur: blur(12px);

    /* Gradients */
    --gradient-primary: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
    --gradient-brand: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
    --gradient-sidebar: linear-gradient(180deg, var(--primary) 0%, var(--primary-dark) 40%, var(--secondary) 100%);
    --gradient-bg: linear-gradient(135deg, #1e1b4b 0%, #312e81 50%, #4338ca 100%);

    /* Transitions */
    --transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-bounce: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

    /* Layout */
    --sidebar-width: 280px;
    --header-height: 70px;
}