/**
 * ============================================
 * COGNITIVE FOUNDATIONS - THÈMES DES CHAPITRES
 * ============================================
 *
 * Version CLAIRE - Fond blanc épuré
 * Couleurs solides pour les titres (pas de dégradés)
 *
 * PALETTE HARMONISÉE :
 * -----------------------------------------
 * Index    : Indigo     #4f46e5
 * Chap 1   : Rose       #db2777
 * Chap 2   : Bleu       #2563eb
 * Chap 3   : Orange     #d97706
 * Chap 4   : Violet     #7c3aed
 * Chap 5   : Vert       #059669
 * Chap 6   : Rouge-Ora  #ea580c
 * Chap 7   : Teal       #0d9488
 * Chap 8   : Cyan       #0891b2
 * Chap 9   : Indigo     #4338ca
 * Chap 10  : Fuchsia    #a21caf
 * -----------------------------------------
 */


/* ==========================================
   1. VARIABLES GLOBALES
   ========================================== */

:root {
    /* Couleurs de fond - VERSION CLAIRE */
    --bg-dark: #ffffff;
    --bg-medium: #f8fafc;
    --bg-light: #e2e8f0;

    /* Couleurs de texte - VERSION CLAIRE */
    --text-light: #1e293b;
    --text-muted: #64748b;

    /* Couleurs d'état */
    --success: #059669;
    --error: #dc2626;

    /* Couleurs principales - THÈME BLEU */
    --primary: #2563eb;
    --primary-light: #3b82f6;
    --accent: #2563eb;
    --accent-light: #60a5fa;
    --secondary: #2563eb;

    /* Ombres pour thème clair */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07);
    --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.1);

    /* Bordures */
    --border-color: #e2e8f0;
    --border-color-light: #f1f5f9;
}


/* ==========================================
   2. THÈME INDEX (Page d'accueil)
   ========================================== */

.theme-index {
    --primary: #2563eb;
    --primary-light: #3b82f6;
    --h1-color: #2563eb;
    --glow-color: rgba(37, 99, 235, 0.3);

    --hero-gradient:
        radial-gradient(ellipse at 20% 20%, rgba(37, 99, 235, 0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(59, 130, 246, 0.10) 0%, transparent 50%);
}


/* ==========================================
   3. CHAPITRE 1 - Histoire & Méthodes
   ========================================== */

.theme-chapitre-1 {
    --primary: #2563eb;
    --primary-light: #3b82f6;
    --h1-color: #2563eb;
    --glow-color: rgba(37, 99, 235, 0.3);

    --hero-gradient:
        radial-gradient(ellipse at 20% 20%, rgba(37, 99, 235, 0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(59, 130, 246, 0.10) 0%, transparent 50%);

    --quote-bg: rgba(37, 99, 235, 0.06);
    --quote-border: rgba(37, 99, 235, 0.3);
    --objectives-bg: rgba(37, 99, 235, 0.04);
    --objectives-border: rgba(37, 99, 235, 0.2);
    --btn-glow: rgba(37, 99, 235, 0.3);
    --qcm-hover-bg: rgba(37, 99, 235, 0.08);
    --qcm-selected-bg: rgba(37, 99, 235, 0.12);
}


/* ==========================================
   4. CHAPITRE 2 - Perception
   ========================================== */

.theme-chapitre-2 {
    --primary: #2563eb;
    --primary-light: #3b82f6;
    --h1-color: #2563eb;
    --glow-color: rgba(37, 99, 235, 0.3);

    --hero-gradient:
        radial-gradient(ellipse at 20% 20%, rgba(37, 99, 235, 0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(59, 130, 246, 0.10) 0%, transparent 50%);

    --quote-bg: rgba(37, 99, 235, 0.06);
    --quote-border: rgba(37, 99, 235, 0.3);
    --objectives-bg: rgba(37, 99, 235, 0.04);
    --objectives-border: rgba(37, 99, 235, 0.2);
    --btn-glow: rgba(37, 99, 235, 0.3);
    --qcm-hover-bg: rgba(37, 99, 235, 0.08);
    --qcm-selected-bg: rgba(37, 99, 235, 0.12);
}


/* ==========================================
   5. CHAPITRE 3 - Attention
   ========================================== */

.theme-chapitre-3 {
    --primary: #2563eb;
    --primary-light: #3b82f6;
    --h1-color: #2563eb;
    --glow-color: rgba(37, 99, 235, 0.3);

    --hero-gradient:
        radial-gradient(ellipse at 20% 20%, rgba(37, 99, 235, 0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(59, 130, 246, 0.10) 0%, transparent 50%);

    --quote-bg: rgba(37, 99, 235, 0.06);
    --quote-border: rgba(37, 99, 235, 0.3);
    --objectives-bg: rgba(37, 99, 235, 0.04);
    --objectives-border: rgba(37, 99, 235, 0.2);
    --btn-glow: rgba(37, 99, 235, 0.3);
    --qcm-hover-bg: rgba(37, 99, 235, 0.08);
    --qcm-selected-bg: rgba(37, 99, 235, 0.12);
}


/* ==========================================
   6. CHAPITRE 4 - Mémoire CT & Travail
   ========================================== */

.theme-chapitre-4 {
    --primary: #2563eb;
    --primary-light: #3b82f6;
    --h1-color: #2563eb;
    --glow-color: rgba(37, 99, 235, 0.3);

    --hero-gradient:
        radial-gradient(ellipse at 20% 20%, rgba(37, 99, 235, 0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(59, 130, 246, 0.10) 0%, transparent 50%);

    --quote-bg: rgba(37, 99, 235, 0.06);
    --quote-border: rgba(37, 99, 235, 0.3);
    --objectives-bg: rgba(37, 99, 235, 0.04);
    --objectives-border: rgba(37, 99, 235, 0.2);
    --btn-glow: rgba(37, 99, 235, 0.3);
    --qcm-hover-bg: rgba(37, 99, 235, 0.08);
    --qcm-selected-bg: rgba(37, 99, 235, 0.12);
}


/* ==========================================
   7. CHAPITRE 5 - Mémoire Long Terme
   ========================================== */

.theme-chapitre-5 {
    --primary: #2563eb;
    --primary-light: #3b82f6;
    --h1-color: #2563eb;
    --glow-color: rgba(37, 99, 235, 0.3);

    --hero-gradient:
        radial-gradient(ellipse at 20% 20%, rgba(37, 99, 235, 0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(59, 130, 246, 0.10) 0%, transparent 50%);

    --quote-bg: rgba(37, 99, 235, 0.06);
    --quote-border: rgba(37, 99, 235, 0.3);
    --objectives-bg: rgba(37, 99, 235, 0.04);
    --objectives-border: rgba(37, 99, 235, 0.2);
    --btn-glow: rgba(37, 99, 235, 0.3);
    --qcm-hover-bg: rgba(37, 99, 235, 0.08);
    --qcm-selected-bg: rgba(37, 99, 235, 0.12);
}


/* ==========================================
   8. CHAPITRE 6 - Mémoire en Contexte
   ========================================== */

.theme-chapitre-6 {
    --primary: #2563eb;
    --primary-light: #3b82f6;
    --h1-color: #2563eb;
    --glow-color: rgba(37, 99, 235, 0.3);

    --hero-gradient:
        radial-gradient(ellipse at 20% 20%, rgba(37, 99, 235, 0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(59, 130, 246, 0.10) 0%, transparent 50%);

    --quote-bg: rgba(37, 99, 235, 0.06);
    --quote-border: rgba(37, 99, 235, 0.3);
    --objectives-bg: rgba(37, 99, 235, 0.04);
    --objectives-border: rgba(37, 99, 235, 0.2);
    --btn-glow: rgba(37, 99, 235, 0.3);
    --qcm-hover-bg: rgba(37, 99, 235, 0.08);
    --qcm-selected-bg: rgba(37, 99, 235, 0.12);
}


/* ==========================================
   9. CHAPITRE 7 - Connaissances
   ========================================== */

.theme-chapitre-7 {
    --primary: #2563eb;
    --primary-light: #3b82f6;
    --h1-color: #2563eb;
    --glow-color: rgba(37, 99, 235, 0.3);

    --hero-gradient:
        radial-gradient(ellipse at 20% 20%, rgba(37, 99, 235, 0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(59, 130, 246, 0.10) 0%, transparent 50%);

    --quote-bg: rgba(37, 99, 235, 0.06);
    --quote-border: rgba(37, 99, 235, 0.3);
    --objectives-bg: rgba(37, 99, 235, 0.04);
    --objectives-border: rgba(37, 99, 235, 0.2);
    --btn-glow: rgba(37, 99, 235, 0.3);
    --qcm-hover-bg: rgba(37, 99, 235, 0.08);
    --qcm-selected-bg: rgba(37, 99, 235, 0.12);
}


/* ==========================================
   10. CHAPITRE 8 - Langage
   ========================================== */

.theme-chapitre-8 {
    --primary: #2563eb;
    --primary-light: #3b82f6;
    --h1-color: #2563eb;
    --glow-color: rgba(37, 99, 235, 0.3);

    --hero-gradient:
        radial-gradient(ellipse at 20% 20%, rgba(37, 99, 235, 0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(59, 130, 246, 0.10) 0%, transparent 50%);

    --quote-bg: rgba(37, 99, 235, 0.06);
    --quote-border: rgba(37, 99, 235, 0.3);
    --objectives-bg: rgba(37, 99, 235, 0.04);
    --objectives-border: rgba(37, 99, 235, 0.2);
    --btn-glow: rgba(37, 99, 235, 0.3);
    --qcm-hover-bg: rgba(37, 99, 235, 0.08);
    --qcm-selected-bg: rgba(37, 99, 235, 0.12);
}


/* ==========================================
   11. CHAPITRE 9 - Raisonnement & Décision
   ========================================== */

.theme-chapitre-9 {
    --primary: #2563eb;
    --primary-light: #3b82f6;
    --h1-color: #2563eb;
    --glow-color: rgba(37, 99, 235, 0.3);

    --hero-gradient:
        radial-gradient(ellipse at 20% 20%, rgba(37, 99, 235, 0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(59, 130, 246, 0.10) 0%, transparent 50%);

    --quote-bg: rgba(37, 99, 235, 0.06);
    --quote-border: rgba(37, 99, 235, 0.3);
    --objectives-bg: rgba(37, 99, 235, 0.04);
    --objectives-border: rgba(37, 99, 235, 0.2);
    --btn-glow: rgba(37, 99, 235, 0.3);
    --qcm-hover-bg: rgba(37, 99, 235, 0.08);
    --qcm-selected-bg: rgba(37, 99, 235, 0.12);
}


/* ==========================================
   12. CHAPITRE 10 - Résolution de Problèmes
   ========================================== */

.theme-chapitre-10 {
    --primary: #2563eb;
    --primary-light: #3b82f6;
    --h1-color: #2563eb;
    --glow-color: rgba(37, 99, 235, 0.3);

    --hero-gradient:
        radial-gradient(ellipse at 20% 20%, rgba(37, 99, 235, 0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(59, 130, 246, 0.10) 0%, transparent 50%);

    --quote-bg: rgba(37, 99, 235, 0.06);
    --quote-border: rgba(37, 99, 235, 0.3);
    --objectives-bg: rgba(37, 99, 235, 0.04);
    --objectives-border: rgba(37, 99, 235, 0.2);
    --btn-glow: rgba(37, 99, 235, 0.3);
    --qcm-hover-bg: rgba(37, 99, 235, 0.08);
    --qcm-selected-bg: rgba(37, 99, 235, 0.12);
}
