/* MGE v3 — socle commun de toutes les pages v2 (body.v2-app).
   Direction « table de correction lumineuse » : fond papier légèrement lilas, encre indigo,
   un accent (= couleur du thème choisi), trois couleurs d'état :
   corail = à corriger · soleil = en cours · menthe = terminé.
   Chargé après les styles d'origine ; ne modifie aucun id/classe utilisé par le JS. */

:root {
    --v2-accent: var(--primary, #5b4fd6);
    --v2-accent-dark: var(--primary-dark, #463cb0);
    --v2-accent-rgb: var(--primary-rgb, 91, 79, 214);
    --v2-accent-soft: rgba(var(--v2-accent-rgb), .11);
    --v2-accent-ring: rgba(var(--v2-accent-rgb), .22);
    --v2-page: #f4f3f9;
    --v2-surface: #ffffff;
    --v2-surface-2: #f8f7fc;
    --v2-ink: #1c1a3a;
    --v2-ink-bg: #1c1a3a;          /* panneaux sombres (bandeau reprise, note finale) */
    --v2-soft: #6b6889;
    --v2-faint: #a3a1bd;
    --v2-line: #e7e5f1;
    --v2-line-soft: #f0eff7;
    --v2-coral: #ff7a59;  --v2-coral-ink: #d4532f; --v2-coral-soft: #fff0eb;
    --v2-sun: #f2a930;    --v2-sun-ink: #a96d0b;   --v2-sun-soft: #fff5e1;
    --v2-mint: #17a982;   --v2-mint-ink: #128a6a;  --v2-mint-soft: #e3f7f0;
    /* anciens noms (pages déjà habillées) */
    --v2-green: var(--v2-mint); --v2-green-soft: var(--v2-mint-soft);
    --v2-amber: var(--v2-sun-ink); --v2-amber-soft: var(--v2-sun-soft);
    --v2-red: var(--v2-coral-ink); --v2-red-soft: var(--v2-coral-soft);
    --v2-radius: 20px;
    --v2-side-w: 84px;
    --v2-font: 'Plus Jakarta Sans', 'Nunito', system-ui, -apple-system, sans-serif;
    --v2-display: 'Bricolage Grotesque', 'Plus Jakarta Sans', system-ui, sans-serif;
    --v2-shadow: 0 14px 34px -20px rgba(40, 30, 120, .35);
}
body[data-mge-dark="1"] {
    --v2-page: #121120;
    --v2-surface: #1b1a2d;
    --v2-surface-2: #222138;
    --v2-ink: #efeefa;
    --v2-ink-bg: #0c0b18;
    --v2-soft: #a9a6c6;
    --v2-faint: #6f6c8e;
    --v2-line: #2b2944;
    --v2-line-soft: #232238;
    --v2-accent-soft: rgba(var(--v2-accent-rgb), .2);
    --v2-coral-soft: #3a2420; --v2-coral-ink: #ff9c80;
    --v2-sun-soft: #382d16;   --v2-sun-ink: #f5c060;
    --v2-mint-soft: #14322b;  --v2-mint-ink: #4fd3ac;
}

/* Textes plus fins : base 15px au lieu de 16px, corps à ~14px */
html:has(body.v2-app), html:has(body[data-page]) { font-size: 15px; }
html body.v2-app {
    font-size: .94rem;
    background: var(--v2-page) !important;
    font-family: var(--v2-font);
    color: var(--v2-ink);
    -webkit-font-smoothing: antialiased;
}
html body.v2-app h1, html body.v2-app h2, html body.v2-app h3,
html body.v2-app h4, html body.v2-app h5 {
    font-family: var(--v2-display) !important;
    letter-spacing: -.02em;
    text-wrap: balance;
}

/* ═════════ Menu : rail fin à gauche (≥ 992px), barre du haut sinon ═════════ */
html body.v2-app .mge-navbar {
    background: var(--v2-surface) !important;
    box-shadow: none !important;
    border-bottom: 1px solid var(--v2-line) !important;
    backdrop-filter: none !important;
}
html body.v2-app .mge-navbar .navbar-brand {
    color: var(--v2-ink) !important;
    display: flex; align-items: center; gap: 10px;
    font-family: var(--v2-display); font-weight: 800; font-size: 1.1rem;
}
html body.v2-app .mge-navbar .navbar-brand i {
    width: 42px; height: 42px; border-radius: 14px;
    background: linear-gradient(140deg, var(--v2-accent), rgba(var(--v2-accent-rgb), .62));
    box-shadow: 0 8px 20px -8px var(--v2-accent);
    color: #fff; font-size: 1rem; margin: 0 !important;
    display: inline-flex; align-items: center; justify-content: center;
}
html body.v2-app .mge-navbar .navbar-brand-text { font-size: 1.1rem; }
html body.v2-app .mge-navbar .nav-link,
html body.v2-app .mge-navbar #themeBrushBtn {
    color: var(--v2-soft) !important;
    font-weight: 700; font-size: .84rem; font-family: var(--v2-font);
    border: none !important; background: none !important;
}
html body.v2-app .mge-navbar .nav-link:hover { color: var(--v2-ink) !important; }
html body.v2-app .mge-navbar .nav-link.active { color: var(--v2-accent) !important; }
html body.v2-app .mge-navbar .navbar-toggler { border-color: var(--v2-line); }
html body.v2-app .mge-navbar .navbar-toggler-icon { filter: none; }
html body.v2-app .v2-side-user { display: none; }

@media (min-width: 992px) {
    html body.v2-app { padding-left: var(--v2-side-w) !important; }
    html body.v2-app.v2-no-nav { padding-left: 0 !important; }
    html body.v2-app .mge-navbar {
        position: fixed !important;
        top: 0; left: 0; bottom: 0;
        width: var(--v2-side-w);
        padding: 16px 0 14px !important;
        align-items: stretch;
        border-bottom: none !important;
        border-right: 1px solid var(--v2-line) !important;
        overflow-y: auto; overflow-x: hidden;
        z-index: 1030;
    }
    html body.v2-app .mge-navbar > .container-fluid {
        flex-direction: column; align-items: center; flex-wrap: nowrap;
        height: 100%; padding: 0;
    }
    html body.v2-app .mge-navbar .navbar-brand { flex-direction: column; gap: 4px; padding: 0; margin: 0 0 16px; }
    html body.v2-app .mge-navbar .navbar-brand-text {
        font-size: .64rem; font-weight: 800; letter-spacing: .06em;
        color: var(--v2-soft);
    }
    html body.v2-app .mge-navbar .navbar-collapse {
        display: flex !important; flex-direction: column; align-items: center; flex: 1; width: 100%;
    }
    html body.v2-app .mge-navbar .navbar-nav {
        flex-direction: column !important; align-items: center; gap: 4px; width: 100%;
    }
    html body.v2-app .mge-navbar .navbar-nav.me-auto { margin-right: 0 !important; }
    html body.v2-app .mge-navbar .navbar-nav:not(.me-auto) { margin-top: auto; padding-top: 10px; }
    html body.v2-app .mge-navbar .nav-link,
    html body.v2-app .mge-navbar #themeBrushBtn {
        position: relative;
        display: flex !important; flex-direction: column; align-items: center; justify-content: center; gap: 5px;
        width: 66px; min-height: 56px;
        padding: 8px 4px !important;
        border-radius: 14px;
        font-size: .64rem !important; line-height: 1.15; font-weight: 700;
        text-align: center; white-space: normal; word-break: normal; hyphens: auto;
        transition: background .15s, color .15s;
    }
    html body.v2-app .mge-navbar .nav-link i,
    html body.v2-app .mge-navbar #themeBrushBtn i { font-size: 1.05rem; margin: 0 !important; width: auto; }
    html body.v2-app .mge-navbar .nav-link:hover,
    html body.v2-app .mge-navbar #themeBrushBtn:hover { background: var(--v2-page) !important; }
    html body.v2-app .mge-navbar .nav-link.active { background: var(--v2-accent-soft) !important; color: var(--v2-accent) !important; }
    html body.v2-app .mge-navbar .nav-link .badge {
        position: absolute; top: 4px; right: 6px; margin: 0 !important;
        font-size: .58rem; padding: 2px 5px; border-radius: 99px;
    }
    html body.v2-app .mge-navbar #themeBrushBtn::after { content: 'Thème'; font-family: var(--v2-font); }

    html body.v2-app .v2-side-user { display: flex; justify-content: center; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--v2-line); width: 56px; }
    html body.v2-app .v2-side-user > div:last-child { display: none; }
    html body.v2-app .v2-side-user .v2-avatar {
        width: 38px; height: 38px; border-radius: 50%;
        background: var(--v2-sun); color: #fff;
        font-weight: 800; font-size: .78rem; text-transform: uppercase;
        display: flex; align-items: center; justify-content: center;
    }
}

.v2-switch-banner {
    display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px;
    margin: 14px 24px; padding: 10px 12px 10px 16px;
    background: var(--v2-sun-soft); border: 1px solid var(--v2-sun); border-radius: 14px;
    color: var(--v2-ink); font-size: .86rem; line-height: 1.35;
}
.v2-switch-banner > span i { color: var(--v2-sun-ink); margin-right: 8px; }
.v2-switch-banner > span strong { margin-right: 4px; }
.v2-switch-banner-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.v2-switch-banner-actions > a {
    display: inline-flex; align-items: center; gap: 7px; flex-shrink: 0;
    padding: 8px 14px; border-radius: 10px;
    background: var(--v2-ink-bg); color: #fff !important;
    font-weight: 800; font-size: .84rem; text-decoration: none;
}
.v2-switch-banner-actions > a:hover { filter: brightness(1.25); }
.v2-switch-banner-close {
    border: 0; background: transparent; color: var(--v2-soft); width: 32px; height: 32px;
    border-radius: 8px; display: inline-flex; align-items: center; justify-content: center;
    cursor: pointer; flex-shrink: 0; font-size: .82rem;
}
.v2-switch-banner-close:hover { background: rgba(0, 0, 0, .06); color: var(--v2-ink); }
@media print { .v2-switch-banner { display: none; } }

/* ═════════ Composants communs ═════════ */
html body.v2-app > .container > h2:first-child,
html body.v2-app > .container > h1:first-child,
html body.v2-app > .container-fluid > h2:first-child {
    color: var(--v2-ink) !important;
    font-weight: 800; font-size: 1.45rem;
    -webkit-text-fill-color: currentColor;
    background: none !important; text-shadow: none !important;
    margin: 6px 0 18px;
}
html body.v2-app .card {
    background: var(--v2-surface);
    border: 1px solid var(--v2-line) !important;
    border-radius: var(--v2-radius) !important;
    box-shadow: none !important;
}
html body.v2-app .card > .card-header {
    background: var(--v2-surface) !important;
    border-bottom: 1px solid var(--v2-line-soft) !important;
    color: var(--v2-ink) !important;
    font-weight: 700;
    border-radius: var(--v2-radius) var(--v2-radius) 0 0 !important;
}
html body.v2-app .card > .card-header * { color: inherit; }
html body.v2-app .form-control,
html body.v2-app .form-select {
    border-color: var(--v2-line);
    border-radius: 12px;
    font-family: var(--v2-font);
    background-color: var(--v2-surface);
    color: var(--v2-ink);
}
html body.v2-app .form-control:focus,
html body.v2-app .form-select:focus { border-color: var(--v2-accent); box-shadow: 0 0 0 3px var(--v2-accent-ring); }
html body.v2-app .form-label { font-weight: 700; color: var(--v2-soft); font-size: .84rem; }
html body.v2-app .btn { border-radius: 12px; font-weight: 700; font-family: var(--v2-font); }
html body.v2-app .btn-primary {
    background: var(--v2-ink-bg) !important; border-color: var(--v2-ink-bg) !important;
    color: #fff !important; box-shadow: none !important;
}
html body.v2-app .btn-primary:hover { background: var(--v2-accent) !important; border-color: var(--v2-accent) !important; }
html body.v2-app .btn-outline-primary { color: var(--v2-accent) !important; border-color: rgba(var(--v2-accent-rgb), .45) !important; }
html body.v2-app .btn-outline-primary:hover { background: var(--v2-accent-soft) !important; }
html body.v2-app .btn-success { background: var(--v2-mint) !important; border-color: var(--v2-mint) !important; }
html body.v2-app .table { --bs-table-bg: transparent; }
html body.v2-app .table > thead th {
    background: var(--v2-surface-2) !important;
    color: var(--v2-soft) !important;
    font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em;
    border-bottom: 1px solid var(--v2-line) !important;
}
html body.v2-app .table td { border-color: var(--v2-line-soft); }
html body.v2-app .modal-content { border: 1px solid var(--v2-line); border-radius: 22px; overflow: hidden; }
html body.v2-app .dropdown-menu { border: 1px solid var(--v2-line); border-radius: 14px; box-shadow: var(--v2-shadow); padding: 6px; }
html body.v2-app .dropdown-item { border-radius: 9px; }
html body.v2-app .alert { border-radius: 16px; }
html body.v2-app .badge { font-family: var(--v2-font); }

/* Pastilles d'état réutilisables */
.v3-pill { display: inline-flex; align-items: center; gap: 5px; font-size: .72rem; font-weight: 800; padding: 3px 9px; border-radius: 99px; }
.v3-pill.is-done { background: var(--v2-mint-soft); color: var(--v2-mint-ink); }
.v3-pill.is-progress { background: var(--v2-sun-soft); color: var(--v2-sun-ink); }
.v3-pill.is-todo { background: var(--v2-coral-soft); color: var(--v2-coral-ink); }

/* Menus flottants d'origine (ronds en dégradé) → boutons plats à l'encre */
html body.v2-app .floating-menu .fab-item {
    background: var(--v2-ink-bg) !important; box-shadow: 0 10px 24px -10px rgba(20, 15, 60, .5) !important;
    border-radius: 16px !important;
}
html body.v2-app .floating-menu .fab-item:hover { background: var(--v2-accent) !important; }

/* ═════════ Synthèse ═════════ */
html body.v2-p-synthese_copiesfilles .synth-page-wrap { max-width: 1320px; }
html body.v2-p-synthese_copiesfilles #titre {
    font-family: var(--v2-display) !important; font-size: clamp(1.3rem, 2vw, 1.6rem) !important; font-weight: 800; color: var(--v2-ink) !important;
}
html body.v2-p-synthese_copiesfilles .synth-chip {
    background: var(--v2-surface); border: 1px solid var(--v2-line); box-shadow: none; color: var(--v2-ink);
    font-family: var(--v2-font); font-size: .82rem;
}
html body.v2-p-synthese_copiesfilles .synth-chip .chip-icon { color: var(--v2-accent); }
html body.v2-p-synthese_copiesfilles .synth-chip.chip-memo { background: var(--v2-sun-soft); border-color: transparent; }
html body.v2-p-synthese_copiesfilles .synth-chip.chip-memo .chip-memo-label { color: var(--v2-sun-ink); }
html body.v2-p-synthese_copiesfilles .synth-btn { border-radius: 12px; font-family: var(--v2-font); padding: 8px 15px; }
html body.v2-p-synthese_copiesfilles .synth-btn-primary { background: var(--v2-ink-bg); border-color: var(--v2-ink-bg); color: #fff; }
html body.v2-p-synthese_copiesfilles .synth-btn-primary:hover { background: var(--v2-accent); border-color: var(--v2-accent); }
html body.v2-p-synthese_copiesfilles .synth-btn-outline { background: var(--v2-surface); color: var(--v2-ink); border: 1px solid var(--v2-line); }
html body.v2-p-synthese_copiesfilles .synth-btn-outline:hover { border-color: var(--v2-accent); background: var(--v2-surface); }
html body.v2-p-synthese_copiesfilles .synth-ent, html body.v2-p-synthese_copiesfilles .synth-search { background: var(--v2-surface); border: 1px solid var(--v2-line); border-radius: 12px; }
html body.v2-p-synthese_copiesfilles .synth-legend { color: var(--v2-soft); }
html body.v2-p-synthese_copiesfilles .synth-table-card { border: 1px solid var(--v2-line); border-radius: 22px; box-shadow: none; }
html body.v2-p-synthese_copiesfilles .synth-table-card thead tr:first-child th {
    background: var(--v2-ink-bg) !important; color: #fff; text-shadow: none; font-family: var(--v2-display); font-weight: 700;
}
html body.v2-p-synthese_copiesfilles .synth-table-card thead tr:nth-child(2) th { background: var(--v2-surface-2); color: var(--v2-ink); font-family: var(--v2-font); }
html body.v2-p-synthese_copiesfilles .synth-table-card thead tr:nth-child(3) th { background: var(--v2-accent-soft); color: var(--v2-accent); font-family: var(--v2-font); }
html body.v2-p-synthese_copiesfilles .synth-table-card tfoot td { background: var(--v2-surface-2); color: var(--v2-ink); }
html body.v2-p-synthese_copiesfilles .nf-badge { border-radius: 10px; font-family: var(--v2-display); font-weight: 800; }
html body.v2-p-synthese_copiesfilles .chart-card, html body.v2-p-synthese_copiesfilles .analyse-card { border: 1px solid var(--v2-line); border-radius: 22px; box-shadow: none; }
/* Bloc « La classe en un coup d'œil » */
.v3-syn { display: grid; grid-template-columns: 1.2fr 1fr; gap: 16px; margin: 16px 0 4px; }
.v3-syn-card { background: var(--v2-surface); border: 1px solid var(--v2-line); border-radius: 22px; padding: 18px 20px; }
.v3-syn-card h2 { font-size: 1.05rem !important; font-weight: 700; margin: 0 0 12px; color: var(--v2-ink); }
.v3-syn-kv { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.v3-syn-kv small { display: block; color: var(--v2-soft); font-weight: 600; font-size: .76rem; }
.v3-syn-kv b { font-family: var(--v2-display); font-size: 1.3rem; font-weight: 800; color: var(--v2-ink); font-variant-numeric: tabular-nums; }
.v3-syn-card p { margin: 12px 0 0; color: var(--v2-soft); font-size: .86rem; }
.v3-syn-card p b { color: var(--v2-ink); }
.v3-hist { display: flex; align-items: flex-end; gap: 6px; height: 110px; padding-top: 18px; border-bottom: 1px solid var(--v2-line); }
.v3-hist div { flex: 1; border-radius: 8px 8px 0 0; background: var(--v2-accent-soft); position: relative; }
.v3-hist div.hi { background: var(--v2-accent); }
.v3-hist span { position: absolute; top: -17px; left: 0; right: 0; text-align: center; font-size: .7rem; font-weight: 800; color: var(--v2-soft); }
.v3-hist-x { display: flex; gap: 6px; margin-top: 5px; }
.v3-hist-x span { flex: 1; text-align: center; font-size: .66rem; font-weight: 700; color: var(--v2-faint); }
@media (max-width: 900px) { .v3-syn { grid-template-columns: 1fr; } }

/* ═════════ Création / modification de grille, IA, progression ═════════ */
html body.v2-app .page-title, html body.v2-app .form-section-title { font-family: var(--v2-display) !important; }
html body.v2-p-create-evaluation .container, html body.v2-p-edit-evaluation .container,
html body.v2-p-creer-ia .container, html body.v2-p-progression-eleves .container { max-width: 1180px; }

/* Pas de rail à l'impression */
@media print {
    html body.v2-app { padding-left: 0 !important; }
    html body.v2-app .mge-navbar { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
    html body.v2-app * { transition: none !important; animation: none !important; }
}

/* ═════════ Thèmes sombres : éléments d'origine restés clairs ═════════ */
body[data-mge-dark="1"] { color-scheme: dark; }
body[data-mge-dark="1"] .modal-content,
body[data-mge-dark="1"] .dropdown-menu,
body[data-mge-dark="1"] .popover,
body[data-mge-dark="1"] .offcanvas,
body[data-mge-dark="1"] .card,
body[data-mge-dark="1"] .list-group-item,
body[data-mge-dark="1"] [class*="ai-panel"],
body[data-mge-dark="1"] .modal-header,
body[data-mge-dark="1"] .modal-footer { background-color: var(--v2-surface) !important; color: var(--v2-ink) !important; border-color: var(--v2-line) !important; }
body[data-mge-dark="1"] .form-control,
body[data-mge-dark="1"] .form-select,
body[data-mge-dark="1"] textarea,
body[data-mge-dark="1"] input[type="text"],
body[data-mge-dark="1"] input[type="search"],
body[data-mge-dark="1"] input[type="number"],
body[data-mge-dark="1"] input[type="date"] { background-color: var(--v2-surface-2) !important; color: var(--v2-ink) !important; border-color: var(--v2-line) !important; }
body[data-mge-dark="1"] .form-control::placeholder, body[data-mge-dark="1"] textarea::placeholder { color: var(--v2-faint) !important; }
body[data-mge-dark="1"] .dropdown-item { color: var(--v2-ink) !important; }
body[data-mge-dark="1"] .dropdown-item:hover { background: var(--v2-surface-2) !important; }
body[data-mge-dark="1"] .table { --bs-table-color: var(--v2-ink); --bs-table-bg: transparent; color: var(--v2-ink); }
body[data-mge-dark="1"] .table > thead th { background: var(--v2-surface-2) !important; color: var(--v2-soft) !important; }
body[data-mge-dark="1"] .text-muted, body[data-mge-dark="1"] .text-secondary { color: var(--v2-soft) !important; }
body[data-mge-dark="1"] .text-dark { color: var(--v2-ink) !important; }
body[data-mge-dark="1"] .bg-white, body[data-mge-dark="1"] .bg-light { background-color: var(--v2-surface) !important; }
body[data-mge-dark="1"] .btn-close { filter: invert(1) grayscale(1); }
body[data-mge-dark="1"] .score-display.not-evaluated { background: var(--v2-surface-2) !important; color: var(--v2-faint) !important; }
body[data-mge-dark="1"] .btn-light, body[data-mge-dark="1"] .btn-outline-secondary { background: var(--v2-surface-2) !important; color: var(--v2-ink) !important; border-color: var(--v2-line) !important; }
body[data-mge-dark="1"] .score-display:not(.not-evaluated) { color: #1c1a3a !important; }
