/* Conjugaison — habillage commun aux exercices.
   Extrait des pages le 17/08/2026, quand elles sont passées de deux à huit. */

/* Le fond, le bandeau et les variables de couleur viennent du socle (jm-tokens.css, jm-base.css). */

/* --- La grille récapitulative ------------------------------------------ */

.grille-recap { border-collapse: separate; border-spacing: 4px; width: 100%; }
.grille-recap th { font-weight: 600; font-size: .95rem; color: #495057; text-align: center; padding: .25rem; }
.grille-recap th.temps { text-align: left; white-space: nowrap; padding-right: .75rem; }
.grille-recap td { padding: 0; }
.case-recap {
    display: flex; flex-direction: column; justify-content: center; min-height: 48px;
    padding: .4rem .4rem; border-radius: .35rem; text-align: center;
    text-decoration: none; line-height: 1.25; border: 1px solid rgba(0,0,0,.06);
}
.case-recap:hover, .case-recap:active { border-color: var(--notion, var(--jm-accent)); }
.case-recap .taux { font-weight: 700; font-size: 1.05rem; display: block; }
.case-recap .etat { font-size: .9rem; display: block; }

.barre-exercices { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.barre-exercices .btn { min-height: var(--jm-cible, 44px); display: inline-flex; align-items: center; }

/* --- Le bandeau du temps tiré ------------------------------------------ */

/* Sur les exercices à clic, l'élève ne choisit pas son temps : il le découvre.
   Le bandeau l'annonce et rappelle les terminaisons sans rien à déplier. */
.bandeau-tirage {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem 1rem;
    background: var(--notion-lt, var(--jm-accent-lt)); border-left: 3px solid var(--notion, var(--jm-accent));
    padding: .5rem .75rem; border-radius: .3rem; margin-bottom: .75rem;
}
.bandeau-tirage .couple { font-weight: 700; color: var(--notion-dark, var(--jm-accent-dark)); }
.bandeau-tirage .terminaisons { font-size: .95rem; color: #6b4a3e; }
.bandeau-tirage code { background: transparent; color: var(--notion-dark, var(--jm-accent-dark)); font-size: .95rem; }

/* --- Le tableau de conjugaison ----------------------------------------- */

.tableau-conj td { vertical-align: middle; }
.tableau-conj .sujet { text-align: right; white-space: nowrap; font-weight: 600; width: 1%; padding-right: .75rem; }
.tableau-conj .sujet .precision { display: block; font-weight: 400; font-size: .95rem; color: var(--jm-soft); }
.tableau-conj input { max-width: 22rem; }
.attendu { font-size: .95rem; }

/* --- Les textes à trous ------------------------------------------------ */

.texte-trous { font-size: 1.08rem; line-height: 2.4; }
.texte-trous input { display: inline-block; width: 9.5rem; min-height: var(--jm-cible, 44px); padding: .3rem .5rem; font-size: 1.05rem; }
.texte-trous .infinitif { color: var(--jm-soft); font-size: .95rem; white-space: nowrap; }
.texte-trous .rendu { padding: .1rem .3rem; border-radius: .25rem; font-weight: 600; }
.texte-trous .juste { background: var(--jm-success-lt); color: var(--jm-success); }
.texte-trous .faux  { background: var(--jm-warn-lt); color: var(--jm-warn); text-decoration: line-through; }
.texte-trous .correction { color: var(--jm-success); font-weight: 600; }

/* --- Le motif d'une faute, montré à la correction ---------------------- */

/* Un distracteur sans explication n'apprend rien : l'élève voit que c'est faux
   sans voir pourquoi. Chaque piège porte son motif, et c'est ici qu'il s'affiche. */
.motif-faute {
    display: block; font-size: .95rem; color: #b06000; background: #fff8e1;
    border-left: 3px solid #f0a500; padding: .3rem .5rem; border-radius: .2rem;
    margin-top: .3rem;
}

/* --- Le QCM de conjugaison --------------------------------------------- */

/* La forme Q partagée dispose ses propositions en grille centrée, ce qui va
   pour des mots courts. Ici les propositions sont des formes conjuguées de
   longueur inégale : une colonne alignée à gauche se lit mieux. */
.propositions-conj { display: flex; flex-direction: column; gap: .35rem; align-items: stretch; }
.propositions-conj label { text-align: left; }

.phrase-qcm { font-size: 1.1rem; line-height: 1.9; }
.phrase-qcm .trou { display: inline-block; min-width: 6rem; border-bottom: 2px dotted #adb5bd; }
.phrase-qcm .infinitif { color: var(--jm-soft); font-size: .95rem; }

/* --- La terminaison seule ---------------------------------------------- */

/* Le début du verbe est donné, la fin se tape. Le radical est collé au champ,
   sans espace : « jou[___] », et non « jou [___] ». */
.phrase-terminaison { font-size: 1.08rem; line-height: 2.2; }
.phrase-terminaison .radical { font-weight: 700; color: #495057; }
.phrase-terminaison input.fin {
    display: inline-block; width: 6rem; min-height: var(--jm-cible, 44px); padding: .3rem .5rem; font-size: 1.05rem;
    border-left: 0; border-top-left-radius: 0; border-bottom-left-radius: 0;
    font-weight: 700;
}
.phrase-terminaison .infinitif { color: var(--jm-soft); font-size: .95rem; }

/* L'intertitre d'une compétence, sur la page d'un parcours qui en couvre
   plusieurs. Discret : il sépare, il ne concurrence pas le titre. */
.intertitre-competence {
    font-size: .95rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--jm-soft);
    margin: .75rem 0 -.25rem;
    padding-bottom: .35rem;
    border-bottom: 1px solid rgba(var(--notion-rgb, var(--jm-accent-rgb)), .18);
}