/* Socle commun des trois sites « Je m'entraîne » (lots 4 et 5 de l'audit du 23/10/2026).
   Chargé après tabler.min.css et jm-tokens.css. Identique sur maths, français et hub.
   Règles : taille de base 18 px sur les pages élève, cibles tactiles de 44 px, gris lisibles,
   un seul bandeau et un seul pied, états tactiles explicites (jamais le survol seul). */

/* ---- Polices auto-hébergées (Atkinson Hyperlegible, licence OFL) ---- */
@font-face { font-family: 'Atkinson Hyperlegible'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/atkinson-hyperlegible-normal-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Atkinson Hyperlegible'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/atkinson-hyperlegible-normal-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Atkinson Hyperlegible'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/fonts/atkinson-hyperlegible-normal-700-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Atkinson Hyperlegible'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/fonts/atkinson-hyperlegible-normal-700-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Atkinson Hyperlegible'; font-style: italic; font-weight: 400; font-display: swap; src: url(/assets/fonts/atkinson-hyperlegible-italic-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* ---- Base ---- */
html { font-size: 16px; }
html.jm-eleve { font-size: 17px; }
@media (min-width: 768px) { html.jm-eleve { font-size: 18px; } }
body { font-family: var(--jm-font); background: var(--jm-bg); color: var(--jm-ink); -webkit-font-smoothing: antialiased; }
.text-muted, .text-secondary, .form-hint, .text-secondary.small, .small.text-muted { color: var(--jm-soft) !important; }
.jm-eleve .text-secondary, .jm-eleve .text-muted, .jm-eleve .form-hint { font-size: max(.95rem, 1em); font-style: normal; }
.jm-eleve .card-title { font-size: 1.25rem; }
.jm-eleve .form-control, .jm-eleve .form-select { font-size: 1.05rem; min-height: var(--jm-cible); }
.jm-eleve .btn { min-height: var(--jm-cible); padding-left: 1rem; padding-right: 1rem; font-size: 1.02rem; }
.jm-eleve .btn-sm { min-height: 40px; font-size: .95rem; }
.jm-eleve .badge { font-size: .85rem; }
a:focus-visible, button:focus-visible, .btn:focus-visible, .form-control:focus-visible, [role="button"]:focus-visible { outline: 3px solid rgba(var(--jm-accent-rgb), .55); outline-offset: 2px; box-shadow: none; }

/* ---- Bandeau commun des pages élève (.navbar-eleve) et des panels ---- */
.navbar-eleve, .jm-bandeau {
    background: var(--jm-accent) !important;
    background-image: linear-gradient(135deg, var(--jm-accent) 0%, var(--jm-accent-dark) 100%) !important;
    color: #fff;
    box-shadow: 0 2px 10px rgba(29, 39, 59, .15);
}
.navbar-eleve .navbar-brand, .navbar-eleve h1, .navbar-eleve a, .jm-bandeau .navbar-brand, .jm-bandeau a { color: #fff !important; }
.navbar-eleve .btn, .jm-bandeau .btn { background: rgba(255, 255, 255, .18); border: 1px solid rgba(255, 255, 255, .45); color: #fff !important; min-height: 40px; }
.navbar-eleve .btn:hover, .navbar-eleve .btn:active, .jm-bandeau .btn:hover, .jm-bandeau .btn:active { background: rgba(255, 255, 255, .3); }
.jm-bandeau-matiere { font-size: .85rem; opacity: .9; letter-spacing: .04em; text-transform: uppercase; }
.jm-pied { color: var(--jm-soft); font-size: .9rem; padding: 1.5rem 0; text-align: center; }
.jm-pied a { color: var(--jm-soft); }

/* ---- Boutons principaux des pages élève : la couleur d'accent de la matière ---- */
.jm-eleve .btn-primary { background: var(--jm-accent); border-color: var(--jm-accent); color: #fff; }
.jm-eleve .btn-primary:hover, .jm-eleve .btn-primary:active, .jm-eleve .btn-primary:focus { background: var(--jm-accent-dark); border-color: var(--jm-accent-dark); color: #fff; }
.jm-eleve .btn-outline-primary { color: var(--jm-accent); border-color: var(--jm-accent); }
.jm-eleve .btn-outline-primary:hover, .jm-eleve .btn-outline-primary:active { background: var(--jm-accent); color: #fff; }
.jm-eleve .btn-success { min-height: var(--jm-cible); }
.jm-eleve .card { border: 1px solid var(--jm-border); border-radius: var(--jm-radius); box-shadow: var(--jm-shadow); }
.jm-eleve .card-header { background: var(--jm-surface); border-bottom: 1px solid var(--jm-border); }
.jm-eleve .card-header-violet, .jm-eleve .card-header.bg-primary { background: var(--jm-accent-lt) !important; color: var(--jm-ink) !important; border-left: 5px solid var(--jm-accent); }
.jm-eleve .card-header-violet .card-title, .jm-eleve .card-header-violet h3 { color: var(--jm-ink) !important; }
.jm-eleve .alert { border-radius: var(--jm-radius); }
.jm-eleve .alert-danger { background: var(--jm-warn-lt); color: #7a3a16; border-color: #f5cdb3; }

/* ---- Cibles tactiles (lot 4) ---- */
.jm-eleve .exo-pastille, .jm-eleve .exo-pastilles a, .jm-eleve .exo-pastilles span { min-width: 40px; min-height: 40px; font-size: 1rem; }
.jm-eleve .seances-liste .btn, .jm-eleve .liste-seances .btn, .jm-eleve .sessions-liste .btn { min-width: var(--jm-cible); min-height: var(--jm-cible); }
.jm-eleve .form-check-input { width: 1.4em; height: 1.4em; }
.jm-eleve .form-check-label { padding-left: .35rem; line-height: 1.4em; }
.jm-eleve input[type="radio"], .jm-eleve input[type="checkbox"] { min-width: 1.4em; min-height: 1.4em; }
/* Les états tactiles : ce que le survol montre, le toucher doit le montrer aussi. */
.jm-eleve .mot:active, .jm-eleve .mot-texte:active, .jm-eleve .mot-banque:active, .jm-eleve .etiquette:active, .jm-eleve .choix:active { transform: scale(.97); }
@media (hover: none) { .jm-eleve [class*="mot"]:hover { background: inherit; } }

/* ---- Tablette : un point de rupture à 768 px ---- */
@media (max-width: 767.98px) {
    .jm-eleve .container-xl, .jm-eleve .container-fluid { padding-left: .75rem; padding-right: .75rem; }
    .jm-eleve .card-body { padding: 1rem; }
    .jm-eleve .navbar-eleve .navbar-brand { font-size: 1.05rem; }
    .jm-eleve h1, .jm-eleve .page-title { font-size: 1.35rem; }
}
@media (max-width: 575.98px) {
    .jm-eleve .btn-lg { width: 100%; }
}

/* ---- Impression : le fond et le bandeau ne s'impriment pas ---- */
@media print {
    body { background: #fff; }
    .navbar-eleve, .jm-bandeau, .jm-pave, .jm-lire { display: none !important; }
}