/*
 * Système de design « École Quiz » — jetons (couleurs, typographie, rayons, ombres).
 *
 * Univers : la chouette Plume, fond lavande doux, violet principal et cinq couleurs d'accent
 * joyeuses (une par matière). Tous les couples texte/fond utilisés pour du texte respectent un
 * contraste d'au moins 4,5:1 (les couleurs « vives » servent aux décors, aux bordures et aux
 * fonds associés à un texte foncé).
 *
 * Les variables Bootstrap (--bs-*) sont redéfinies ici pour que tous les composants Bootstrap
 * (espace Admin / Professeur compris) héritent de la même identité.
 */
:root {
    /* Typographie : Baloo Bhaijaan 2 (titres, latin + arabe), Nunito (texte). */
    --font-body: 'Nunito', 'Baloo Bhaijaan 2', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --font-display: 'Baloo Bhaijaan 2', 'Nunito', system-ui, -apple-system, 'Segoe UI', sans-serif;

    /* Couleur principale (violet) */
    --c-primary: #5b3fd9;
    --c-primary-700: #4a2fc4;
    --c-primary-800: #3a2399;
    --c-primary-200: #d4cbff;
    --c-primary-100: #ece8ff;
    --c-primary-50: #f5f3ff;

    /* Neutres */
    --c-ink: #1f1b3a;
    --c-ink-soft: #3d3860;
    --c-muted: #615d7a;
    --c-line: #e6e3f3;
    --c-line-strong: #d3cfe6;
    --c-bg: #f6f4ff;
    --c-surface: #ffffff;

    /* Accents vifs (décors, bordures, fonds avec texte foncé) */
    --c-sun: #ffc23c;
    --c-sun-700: #e0a200;
    --c-coral: #ff6b6b;
    --c-sky: #2196f3;
    --c-mint: #14b88a;
    --c-pink: #e255c0;

    /* Sémantiques (texte lisible sur fond clair) */
    --c-success: #12805f;
    --c-success-700: #0c6a4e;
    --c-success-soft: #ddf7ee;
    --c-warning: #8a5a00;
    --c-warning-soft: #fff4d6;
    --c-danger: #c62a2f;
    --c-danger-soft: #ffe6e6;
    --c-info: #0b5ca8;
    --c-info-soft: #e3f3ff;

    /* Rayons */
    --r-sm: 10px;
    --r-md: 16px;
    --r-lg: 24px;
    --r-xl: 32px;
    --r-pill: 999px;

    /* Ombres */
    --sh-sm: 0 1px 2px rgba(31, 27, 58, .06), 0 1px 3px rgba(31, 27, 58, .06);
    --sh-md: 0 6px 18px rgba(31, 27, 58, .08);
    --sh-lg: 0 18px 40px rgba(58, 35, 153, .14);
    --sh-focus: 0 0 0 4px rgba(91, 63, 217, .35);

    /* Divers */
    --tap: 48px;
    --ease-bounce: cubic-bezier(.34, 1.56, .64, 1);
    --tabbar-h: 68px;

    /* --- Bootstrap --- */
    --bs-body-font-family: var(--font-body);
    --bs-body-color: var(--c-ink);
    --bs-body-color-rgb: 31, 27, 58;
    --bs-body-bg: var(--c-bg);
    --bs-emphasis-color: var(--c-ink);
    --bs-secondary-color: var(--c-muted);
    --bs-primary: var(--c-primary);
    --bs-primary-rgb: 91, 63, 217;
    --bs-success: var(--c-success);
    --bs-success-rgb: 18, 128, 95;
    --bs-danger: var(--c-danger);
    --bs-danger-rgb: 198, 42, 47;
    --bs-warning-rgb: 255, 194, 60;
    --bs-info-rgb: 33, 150, 243;
    --bs-link-color: var(--c-primary);
    --bs-link-color-rgb: 91, 63, 217;
    --bs-link-hover-color: var(--c-primary-800);
    --bs-link-hover-color-rgb: 58, 35, 153;
    --bs-border-color: var(--c-line);
    --bs-border-radius: var(--r-sm);
    --bs-border-radius-lg: var(--r-md);
    --bs-border-radius-sm: 8px;
    --bs-focus-ring-color: rgba(91, 63, 217, .35);
    --bs-primary-text-emphasis: var(--c-primary-800);
    --bs-primary-bg-subtle: var(--c-primary-100);
    --bs-primary-border-subtle: var(--c-primary-200);
}

/* Couleurs par matière : chaque matière reçoit un ton (filtre Twig subject_tone). */
.tone-0 { --tone: #6c4cf5; --tone-soft: #eee9ff; --tone-ink: #3e25b8; }
.tone-1 { --tone: #2196f3; --tone-soft: #e3f3ff; --tone-ink: #0b5ca8; }
.tone-2 { --tone: #ffb800; --tone-soft: #fff4d6; --tone-ink: #8a5a00; }
.tone-3 { --tone: #ff5a5f; --tone-soft: #ffe6e6; --tone-ink: #b3262b; }
.tone-4 { --tone: #14b88a; --tone-soft: #ddf7ee; --tone-ink: #0b6e52; }
.tone-5 { --tone: #e255c0; --tone-soft: #fbe6f6; --tone-ink: #9c1f7f; }
