/**
 * Fiches de révision — mise en page bristol 2 colonnes + print A4.
 *
 * Structure attendue dans .revision-fiche-grid :
 *   .revision-bloc--retenir   → colonne gauche
 *   .revision-bloc--exemple   → colonne droite
 *   .revision-bloc--pieges    → bandeau bas, pleine largeur
 *
 * Tokens utilisés : primary (teal), emerald, amber.
 */

/* ─── Grille bristol (écran ≥ 768px) ─────────────────────────── */

.revision-fiche-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
        "retenir exemple"
        "pieges  pieges";
    gap: 1.25rem;
    align-items: start;
}

.revision-bloc--retenir { grid-area: retenir; }
.revision-bloc--exemple { grid-area: exemple; }
.revision-bloc--pieges  { grid-area: pieges; }

@media (max-width: 767px) {
    .revision-fiche-grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "retenir"
            "exemple"
            "pieges";
        gap: 1rem;
    }
}

/* ─── Style commun des blocs ─────────────────────────────────── */

.revision-bloc {
    background: #ffffff;
    border-radius: 1.25rem;
    border: 1px solid;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
    overflow: hidden;
}

.revision-bloc__header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid;
    font-weight: 700;
}

.revision-bloc__title {
    margin: 0;
    font-size: 1.05rem;
    font-family: var(--font-heading, inherit);
    font-weight: 700;
    line-height: 1.2;
}

.revision-bloc__body {
    padding: 1rem 1.25rem 1.25rem;
    font-size: 0.95rem;
    line-height: 1.55;
    color: rgb(30 41 59); /* slate-800 */
}

.revision-bloc__body > *:first-child { margin-top: 0; }
.revision-bloc__body > *:last-child  { margin-bottom: 0; }

.revision-bloc__body p { margin: 0 0 0.6rem; }
.revision-bloc__body ul,
.revision-bloc__body ol {
    margin: 0.4rem 0 0.6rem;
    padding-left: 1.25rem;
}
.revision-bloc__body li { margin: 0.2rem 0; }
.revision-bloc__body li::marker { color: currentColor; }

/* Variante "À retenir" — teal (primary) */
.revision-bloc--retenir {
    border-color: rgb(13 148 136 / 0.25); /* primary/25 */
}
.revision-bloc--retenir .revision-bloc__header {
    background: rgb(13 148 136 / 0.08);
    border-bottom-color: rgb(13 148 136 / 0.2);
    color: rgb(15 118 110); /* primary-dark */
}

/* Variante "Exemple type" — emerald */
.revision-bloc--exemple {
    border-color: rgb(16 185 129 / 0.25);
}
.revision-bloc--exemple .revision-bloc__header {
    background: rgb(16 185 129 / 0.08);
    border-bottom-color: rgb(16 185 129 / 0.2);
    color: rgb(5 122 85);
}

/* Variante "Pièges" — amber */
.revision-bloc--pieges {
    border-color: rgb(245 158 11 / 0.3);
}
.revision-bloc--pieges .revision-bloc__header {
    background: rgb(245 158 11 / 0.1);
    border-bottom-color: rgb(245 158 11 / 0.25);
    color: rgb(180 83 9);
}

/* Badges colorés (THÉORÈME, RÉCIPROQUE…) */
.rev-badge {
    display: inline-block;
    padding: 0.1rem 0.55rem;
    margin-right: 0.4rem;
    border-radius: 0.4rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    vertical-align: 0.1em;
    line-height: 1.4;
    white-space: nowrap;
}
.rev-badge--teal    { background: rgb(13 148 136 / 0.12); color: rgb(15 118 110); }
.rev-badge--orange  { background: rgb(249 115 22 / 0.12); color: rgb(194 65 12); }
.rev-badge--emerald { background: rgb(16 185 129 / 0.12); color: rgb(5 122 85); }
.rev-badge--amber   { background: rgb(245 158 11 / 0.15); color: rgb(180 83 9); }
.rev-badge--slate   { background: rgb(100 116 139 / 0.15); color: rgb(51 65 85); }
.rev-badge--rose    { background: rgb(244 63 94 / 0.12); color: rgb(190 18 60); }
.rev-badge--sky     { background: rgb(14 165 233 / 0.12); color: rgb(3 105 161); }

/* Figure illustrative en haut d'un bloc (TikZ centrée, compacte) */
.revision-bloc__figure {
    text-align: center;
    margin: 0 0 0.75rem;
}
.revision-bloc__figure img,
.revision-bloc__figure svg {
    max-width: 100%;
    height: auto;
    display: inline-block;
}

/* Formules KaTeX dans .revision-bloc — un peu plus compactes */
.revision-bloc .katex-display {
    margin: 0.5rem 0;
}

/* Tableau compact si présent */
.revision-bloc table {
    width: 100%;
    border-collapse: collapse;
    margin: 0.4rem 0;
    font-size: 0.9rem;
}
.revision-bloc th,
.revision-bloc td {
    padding: 0.3rem 0.5rem;
    border: 1px solid rgb(226 232 240); /* slate-200 */
    text-align: left;
}

/* ─── Impression A4 — tout sur une page ─────────────────────── */

@media print {
    /* Masquer tout ce qui n'est pas la fiche elle-même */
    header,
    footer,
    nav,
    .revision-hero,
    .revision-footer-actions,
    .breadcrumb,
    #wpadminbar,
    .site-header,
    .site-footer,
    .menu-mobile,
    .btn-menu-mobile {
        display: none !important;
    }

    /* Reset page */
    html, body {
        background: #ffffff !important;
        color: #000000 !important;
        font-size: 10pt;
        line-height: 1.35;
    }

    @page {
        size: A4 portrait;
        margin: 12mm 10mm;
    }

    main.revision-page {
        background: #ffffff !important;
    }

    .revision-page section {
        padding: 0 !important;
    }

    .container,
    .max-w-5xl,
    .max-w-4xl {
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Titre de la fiche en haut de page imprimée */
    .revision-page::before {
        content: attr(data-title);
    }

    /* Re-injecter le titre de la fiche en impression via h1 print-only */
    .print-only-title {
        display: block !important;
        font-family: var(--font-heading, sans-serif);
        font-size: 16pt;
        font-weight: 700;
        text-align: center;
        margin: 0 0 6mm 0;
        color: #0F766E; /* primary-dark */
        border-bottom: 1.5pt solid #0F766E;
        padding-bottom: 2mm;
    }

    /* Grille condensée — forcer 2 colonnes (le viewport print < 768px sinon déclenche le mobile) */
    .revision-fiche-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        grid-template-areas:
            "retenir exemple"
            "pieges  pieges" !important;
        gap: 4mm !important;
        align-items: start !important;
    }

    .revision-bloc {
        border-radius: 4pt;
        box-shadow: none !important;
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .revision-bloc__header {
        padding: 2mm 3mm;
    }

    .revision-bloc__title {
        font-size: 10.5pt;
    }

    .revision-bloc__body {
        padding: 2.5mm 3mm 3mm;
        font-size: 9.5pt;
        line-height: 1.4;
    }

    .revision-bloc__body p {
        margin: 0 0 1.5mm;
    }

    .revision-bloc__body ul,
    .revision-bloc__body ol {
        margin: 1mm 0 2mm;
        padding-left: 4mm;
    }

    .revision-bloc__body li {
        margin: 0.5mm 0;
    }

    /* Badges en impression — couleurs un peu plus sombres pour le contraste */
    .rev-badge {
        font-size: 7.5pt;
        padding: 0.5mm 1.5mm;
        margin-right: 1mm;
    }

    /* Figure compacte en impression */
    .revision-bloc__figure {
        margin: 0 0 2mm;
    }
    .revision-bloc__figure img,
    .revision-bloc__figure svg {
        max-height: 35mm;
    }

    /* Couleurs imprimables (un peu plus claires) */
    .revision-bloc--retenir { border-color: #0F766E; }
    .revision-bloc--retenir .revision-bloc__header { background: #F0FDFA; color: #0F766E; }

    .revision-bloc--exemple { border-color: #059669; }
    .revision-bloc--exemple .revision-bloc__header { background: #ECFDF5; color: #047857; }

    .revision-bloc--pieges  { border-color: #D97706; }
    .revision-bloc--pieges  .revision-bloc__header { background: #FFFBEB; color: #B45309; }
}

/* Le titre print-only est masqué à l'écran */
.print-only-title { display: none; }