/* ============================================================
   admin.css — coquille du back-office Mystic Luna
   S'appuie sur tokens.css. Pensé pour une utilisatrice unique et
   non technique : libellés en français clair, actions évidentes,
   aucun jargon. Utilisable sur tablette et téléphone.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }

body.adm {
  margin: 0;
  font-family: var(--ml-font-texte);
  font-size: var(--ml-t-sm);
  line-height: 1.6;
  color: var(--ml-encre);
  background: var(--ml-creme);
  -webkit-font-smoothing: antialiased;
}
.adm h1, .adm h2, .adm h3 { font-family: var(--ml-font-titre); font-weight: 500; line-height: 1.2; margin: 0 0 var(--ml-e-3); }
.adm h1 { font-size: var(--ml-t-2xl); }
.adm h2 { font-size: var(--ml-t-xl); }
.adm h3 { font-size: var(--ml-t-lg); }
.adm p { margin: 0 0 var(--ml-e-3); }
/* `:where()` met la spécificité de cette règle à ZÉRO : c'est une simple couleur
   par défaut que n'importe quel composant (bouton, menu latéral, pied de page)
   écrase sans effort. Écrite en `.adm a`, sa spécificité (0,1,1) rendait au
   contraire le texte des boutons-liens rose sur rose, donc illisible. */
:where(.adm a) { color: var(--ml-rose-800); }
.adm img { max-width: 100%; display: block; }

/* ===================== Structure ===================== */
.adm-cadre { display: grid; grid-template-columns: 1fr; min-height: 100vh; }
@media (min-width: 1000px) { .adm-cadre { grid-template-columns: 264px 1fr; } }
/* Un élément de grille a min-width:auto par défaut : son contenu large (onglets
   défilants, tableaux) élargirait la piste au-delà de l'écran. min-width:0 le
   contraint et laisse jouer les overflow internes. */
.adm-cadre > * { min-width: 0; }

/* --- Barre latérale --- */
.adm-lat {
  background: var(--ml-rose-900);
  color: var(--ml-rose-100);
  padding: var(--ml-e-4) 0;
  display: flex; flex-direction: column; gap: var(--ml-e-4);
}
@media (max-width: 999px) { .adm-lat { display: none; } .adm-lat.est-ouvert { display: flex; } }
@media (min-width: 1000px) { .adm-lat { position: sticky; top: 0; height: 100vh; overflow-y: auto; } }

.adm-lat__marque { display: flex; align-items: center; gap: var(--ml-e-3); padding: 0 var(--ml-e-4) var(--ml-e-4);
  border-bottom: 1px solid rgba(255,255,255,.14); }
.adm-lat__marque img { width: 40px; height: 40px; border-radius: var(--ml-r-sm); flex: none; }
.adm-lat__marque b { font-family: var(--ml-font-titre); font-size: var(--ml-t-base); display: block; line-height: 1.15; }
.adm-lat__marque span { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--ml-rose-300); }

.adm-menu { display: flex; flex-direction: column; gap: 2px; padding: 0 var(--ml-e-2); }
.adm-menu__titre { font-size: 10px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--ml-rose-300); padding: var(--ml-e-4) var(--ml-e-3) var(--ml-e-1); }
.adm-menu a {
  display: flex; align-items: center; gap: var(--ml-e-3);
  padding: var(--ml-e-3); border-radius: var(--ml-r-sm);
  color: var(--ml-rose-100); text-decoration: none; font-weight: 600; font-size: var(--ml-t-sm);
  transition: background var(--ml-transition);
}
.adm-menu a:hover { background: rgba(255,255,255,.10); }
.adm-menu a[aria-current="page"] { background: var(--ml-blanc); color: var(--ml-rose-900); }
.adm-menu svg { flex: none; opacity: .9; }
.adm-menu .pastille { margin-left: auto; background: var(--ml-bientot-bg); color: var(--ml-bientot-fg);
  border-radius: var(--ml-r-pill); font-size: 11px; font-weight: 800; padding: 1px 7px; }
.adm-menu a[aria-current="page"] .pastille { background: var(--ml-rose-700); color: #fff; }

.adm-lat__pied { margin-top: auto; padding: var(--ml-e-4); border-top: 1px solid rgba(255,255,255,.14);
  font-size: var(--ml-t-xs); color: var(--ml-rose-300); }
.adm-lat__pied a { color: var(--ml-rose-100); }

/* --- Barre du haut --- */
.adm-haut {
  position: sticky; top: 0; z-index: 30;
  background: rgba(251,247,244,.94); backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--ml-bord);
  display: flex; align-items: center; gap: var(--ml-e-3);
  padding: var(--ml-e-3) var(--ml-e-4); min-height: 66px;
}
.adm-haut > * { min-width: 0; }
.adm-haut__fil { font-size: var(--ml-t-xs); color: var(--ml-taupe); }
.adm-haut__fil a { color: var(--ml-taupe); }
.adm-haut__actions { margin-left: auto; display: flex; align-items: center; gap: var(--ml-e-3);
  flex-wrap: wrap; justify-content: flex-end; }
.adm-burger { width: 44px; height: 44px; display: grid; place-items: center; flex: none;
  border: 1px solid var(--ml-bord); border-radius: var(--ml-r-sm); background: var(--ml-blanc); cursor: pointer; }
@media (min-width: 1000px) { .adm-burger { display: none; } }
.adm-compte { display: flex; align-items: center; gap: var(--ml-e-2); font-size: var(--ml-t-xs); }
.adm-compte i { width: 34px; height: 34px; border-radius: 50%; background: var(--ml-lilas-200);
  color: var(--ml-lilas-700); display: grid; place-items: center; font-style: normal; font-weight: 800; }

.adm-corps { padding: var(--ml-e-5) var(--ml-e-4) var(--ml-e-8); }
@media (min-width: 700px) { .adm-corps { padding: var(--ml-e-6); } }

/* --- En-tête de page --- */
.adm-titre { display: flex; flex-wrap: wrap; gap: var(--ml-e-4); align-items: flex-start;
  margin-bottom: var(--ml-e-5); }
.adm-titre h1 { margin: 0; }
.adm-titre p { margin: var(--ml-e-1) 0 0; color: var(--ml-taupe); }
.adm-titre__actions { margin-left: auto; display: flex; flex-wrap: wrap; gap: var(--ml-e-3); }

/* ===================== Composants ===================== */

/* Boutons (mêmes primitives que le front, densité admin) */
.adm-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--ml-e-2);
  min-height: 44px; padding: var(--ml-e-2) var(--ml-e-4);
  border: 1px solid transparent; border-radius: var(--ml-r-sm);
  font: 600 var(--ml-t-sm)/1.2 var(--ml-font-texte);
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background var(--ml-transition), border-color var(--ml-transition);
}
.adm-btn:focus-visible { outline: 3px solid var(--ml-lilas-400); outline-offset: 2px; }
.adm-btn--principal { background: var(--ml-rose-700); color: #fff; }
.adm-btn--principal:hover { background: var(--ml-rose-800); }
.adm-btn--neutre { background: var(--ml-blanc); color: var(--ml-encre); border-color: var(--ml-bord); }
.adm-btn--neutre:hover { background: var(--ml-ivoire); }
.adm-btn--danger { background: var(--ml-blanc); color: #9B2C2C; border-color: #E7C9C9; }
.adm-btn--danger:hover { background: #FBEDED; }
.adm-btn--petit { min-height: 36px; padding: var(--ml-e-1) var(--ml-e-3); font-size: var(--ml-t-xs); }
.adm-btn--bloc { width: 100%; }

/* Cartes / panneaux */
.adm-carte { background: var(--ml-blanc); border: 1px solid var(--ml-bord); border-radius: var(--ml-r-md);
  box-shadow: var(--ml-ombre-douce); }
.adm-carte__entete { padding: var(--ml-e-4); border-bottom: 1px solid var(--ml-bord);
  display: flex; align-items: center; gap: var(--ml-e-3); flex-wrap: wrap; }
.adm-carte__entete h2, .adm-carte__entete h3 { margin: 0; }
.adm-carte__corps { padding: var(--ml-e-4); }
.adm-carte__pied { padding: var(--ml-e-4); border-top: 1px solid var(--ml-bord); background: var(--ml-creme);
  display: flex; gap: var(--ml-e-3); flex-wrap: wrap; align-items: center;
  border-radius: 0 0 var(--ml-r-md) var(--ml-r-md); }

/* Grilles */
.adm-grille { display: grid; gap: var(--ml-e-4); }
.adm-grille--2 { grid-template-columns: 1fr; }
.adm-grille--3 { grid-template-columns: 1fr; }
.adm-grille--4 { grid-template-columns: 1fr 1fr; }
@media (min-width: 800px) { .adm-grille--2 { grid-template-columns: 1fr 1fr; }
  .adm-grille--3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1100px) { .adm-grille--4 { grid-template-columns: repeat(4, 1fr); } }
.adm-colonnes { display: grid; gap: var(--ml-e-4); }
.adm-grille > *, .adm-colonnes > * { min-width: 0; }
@media (min-width: 1000px) { .adm-colonnes { grid-template-columns: 1fr 340px; align-items: start; } }

/* Vignettes chiffrées du tableau de bord */
.adm-chiffre { background: var(--ml-blanc); border: 1px solid var(--ml-bord); border-radius: var(--ml-r-md);
  padding: var(--ml-e-4); box-shadow: var(--ml-ombre-douce); }
.adm-chiffre__label { font-size: var(--ml-t-xs); color: var(--ml-taupe); letter-spacing: .04em; }
.adm-chiffre__valeur { font-family: var(--ml-font-titre); font-size: var(--ml-t-3xl); line-height: 1.05;
  margin: var(--ml-e-1) 0 2px; }
.adm-chiffre__detail { font-size: var(--ml-t-xs); color: var(--ml-taupe); }
.adm-chiffre--alerte { border-color: var(--ml-bientot-fg); background: var(--ml-bientot-bg); }
.adm-chiffre--alerte .adm-chiffre__label, .adm-chiffre--alerte .adm-chiffre__detail { color: var(--ml-bientot-fg); }

/* Tableaux — deviennent des cartes empilées sur mobile */
.adm-tableau-cadre { overflow-x: auto; }
.adm-tableau { width: 100%; border-collapse: collapse; font-size: var(--ml-t-sm); }
.adm-tableau th, .adm-tableau td { padding: var(--ml-e-3) var(--ml-e-4); text-align: left; vertical-align: middle;
  border-bottom: 1px solid var(--ml-bord); }
.adm-tableau thead th { background: var(--ml-ivoire); font-size: 11px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--ml-taupe); white-space: nowrap; }
.adm-tableau tbody tr:hover { background: var(--ml-rose-050); }
.adm-tableau tbody tr:last-child td { border-bottom: 0; }
.adm-tableau__actions { display: flex; gap: var(--ml-e-2); justify-content: flex-end; }
.adm-tableau .principal { font-weight: 700; }
.adm-tableau .secondaire { color: var(--ml-taupe); font-size: var(--ml-t-xs); }
.adm-vignette { width: 56px; height: 42px; border-radius: 4px; flex: none; overflow: hidden; }

@media (max-width: 780px) {
  .adm-tableau thead { display: none; }
  .adm-tableau, .adm-tableau tbody, .adm-tableau tr, .adm-tableau td { display: block; width: 100%; }
  .adm-tableau tr { border: 1px solid var(--ml-bord); border-radius: var(--ml-r-sm);
    margin-bottom: var(--ml-e-3); padding: var(--ml-e-2); background: var(--ml-blanc); }
  .adm-tableau td { border: 0; padding: var(--ml-e-2); display: flex; gap: var(--ml-e-3); align-items: center; }
  .adm-tableau td::before { content: attr(data-col); flex: none; width: 96px;
    font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--ml-taupe); font-weight: 700; }
  .adm-tableau__actions { justify-content: flex-start; }
}

/* Badges de statut */
.adm-badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px var(--ml-e-3);
  border-radius: var(--ml-r-pill); font-size: 11px; font-weight: 800; letter-spacing: .02em; white-space: nowrap; }
.adm-badge--publie    { background: var(--ml-dispo-bg);   color: var(--ml-dispo-fg); }
.adm-badge--brouillon { background: var(--ml-complet-bg); color: var(--ml-complet-fg); }
.adm-badge--bientot   { background: var(--ml-bientot-bg); color: var(--ml-bientot-fg); }
.adm-badge--complet   { background: var(--ml-attente-bg); color: var(--ml-attente-fg); }
.adm-badge--annule    { background: #FBEDED; color: #9B2C2C; }
.adm-badge--externe   { background: var(--ml-lilas-100);  color: var(--ml-lilas-700); }
.adm-badge--paye      { background: var(--ml-dispo-bg);   color: var(--ml-dispo-fg); }
.adm-badge--acompte   { background: var(--ml-bientot-bg); color: var(--ml-bientot-fg); }
.adm-badge--attente   { background: var(--ml-attente-bg); color: var(--ml-attente-fg); }

/* Barre d'outils de liste : recherche + filtres */
.adm-outils { display: flex; flex-wrap: wrap; gap: var(--ml-e-3); align-items: center; margin-bottom: var(--ml-e-4); }
.adm-recherche { position: relative; flex: 1; min-width: 220px; }
.adm-recherche input { width: 100%; min-height: 44px; padding: var(--ml-e-2) var(--ml-e-3) var(--ml-e-2) 40px;
  border: 1px solid var(--ml-bord); border-radius: var(--ml-r-sm); background: var(--ml-blanc);
  font: inherit; color: var(--ml-encre); }
.adm-recherche svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--ml-taupe); }
.adm-onglets-filtre { display: flex; gap: var(--ml-e-1); background: var(--ml-ivoire);
  border: 1px solid var(--ml-bord); border-radius: var(--ml-r-pill); padding: 3px; }
.adm-onglets-filtre button { min-height: 36px; padding: 0 var(--ml-e-3); border: 0; background: transparent;
  border-radius: var(--ml-r-pill); font: 700 var(--ml-t-xs)/1 var(--ml-font-texte); color: var(--ml-taupe); cursor: pointer; }
.adm-onglets-filtre button[aria-pressed="true"] { background: var(--ml-blanc); color: var(--ml-encre);
  box-shadow: var(--ml-ombre-douce); }

/* Onglets de formulaire */
.adm-onglets { display: flex; gap: var(--ml-e-1); border-bottom: 1px solid var(--ml-bord);
  overflow-x: auto; margin-bottom: var(--ml-e-5); }
.adm-onglets button { min-height: 46px; padding: 0 var(--ml-e-4); border: 0; background: transparent;
  border-bottom: 3px solid transparent; font: 700 var(--ml-t-sm)/1 var(--ml-font-texte);
  color: var(--ml-taupe); cursor: pointer; white-space: nowrap; }
.adm-onglets button[aria-selected="true"] { color: var(--ml-rose-800); border-bottom-color: var(--ml-rose-700); }
.adm-panneau[hidden] { display: none; }

/* Mini-onglets internes à un panneau : découpent un écran chargé sans
   multiplier les onglets principaux. */
.adm-sous-onglets { display: inline-flex; gap: var(--ml-e-1); flex-wrap: wrap;
  width: fit-content; max-width: 100%;
  padding: var(--ml-e-1); margin-bottom: var(--ml-e-4);
  background: var(--ml-ivoire); border: 1px solid var(--ml-bord); border-radius: var(--ml-r-pill); }
.adm-sous-onglets button { min-height: 38px; padding: 0 var(--ml-e-4); border: 0; cursor: pointer;
  background: transparent; color: var(--ml-taupe); border-radius: var(--ml-r-pill);
  font: 700 var(--ml-t-xs)/1 var(--ml-font-texte); }
.adm-sous-onglets button[aria-selected="true"] { background: var(--ml-blanc); color: var(--ml-encre);
  box-shadow: var(--ml-ombre-douce); }
.adm-sous-panneau[hidden] { display: none; }

/* Champs de formulaire */
.adm-champ { margin-bottom: var(--ml-e-4); }
.adm-champ > label { display: block; font-weight: 700; font-size: var(--ml-t-sm); margin-bottom: var(--ml-e-2); }
.adm-champ .adm-aide { display: block; font-weight: 400; color: var(--ml-taupe); font-size: var(--ml-t-xs);
  margin-top: 2px; }
.adm-champ input[type=text], .adm-champ input[type=email], .adm-champ input[type=tel],
.adm-champ input[type=number], .adm-champ input[type=date], .adm-champ input[type=time],
.adm-champ input[type=url], .adm-champ select, .adm-champ textarea {
  width: 100%; min-height: 46px; padding: var(--ml-e-2) var(--ml-e-3);
  border: 1px solid var(--ml-bord); border-radius: var(--ml-r-sm); background: var(--ml-blanc);
  font: inherit; color: var(--ml-encre);
}
.adm-champ textarea { min-height: 110px; resize: vertical; }
.adm-champ input:focus, .adm-champ select:focus, .adm-champ textarea:focus {
  outline: 3px solid var(--ml-lilas-400); outline-offset: 1px; border-color: var(--ml-lilas-400); }
.adm-paire { display: grid; gap: var(--ml-e-4); }
@media (min-width: 620px) { .adm-paire { grid-template-columns: 1fr 1fr; } }
.adm-paire--3 { display: grid; gap: var(--ml-e-4); }
@media (min-width: 620px) { .adm-paire--3 { grid-template-columns: repeat(3, 1fr); } }

.adm-case { display: flex; gap: var(--ml-e-3); align-items: flex-start; font-size: var(--ml-t-sm);
  margin-bottom: var(--ml-e-3); }
.adm-case input { width: 20px; height: 20px; flex: none; margin-top: 2px; }
.adm-case label { font-weight: 600; }

/* Choix en cartes radio (ex. mode de paiement) */
.adm-choix { display: grid; gap: var(--ml-e-3); }
@media (min-width: 620px) { .adm-choix--2 { grid-template-columns: 1fr 1fr; } }
.adm-choix label { display: flex; gap: var(--ml-e-3); align-items: flex-start; padding: var(--ml-e-4);
  border: 1px solid var(--ml-bord); border-radius: var(--ml-r-sm); background: var(--ml-blanc); cursor: pointer; }
.adm-choix label[aria-checked="true"] { border-color: var(--ml-rose-700);
  box-shadow: 0 0 0 1px var(--ml-rose-700); background: var(--ml-rose-050); }
.adm-choix input { width: 20px; height: 20px; flex: none; margin-top: 2px; }
.adm-choix b { display: block; }
.adm-choix span { font-size: var(--ml-t-xs); color: var(--ml-taupe); }

/* Éditeur de texte riche (simulation de Quill) */
.adm-riche { border: 1px solid var(--ml-bord); border-radius: var(--ml-r-sm); background: var(--ml-blanc); }
.adm-riche__barre { display: flex; flex-wrap: wrap; gap: 2px; padding: var(--ml-e-2);
  border-bottom: 1px solid var(--ml-bord); background: var(--ml-ivoire);
  border-radius: var(--ml-r-sm) var(--ml-r-sm) 0 0; }
.adm-riche__barre button { min-width: 34px; height: 34px; border: 1px solid transparent; background: transparent;
  border-radius: 4px; cursor: pointer; font-size: var(--ml-t-sm); color: var(--ml-encre); }
.adm-riche__barre button:hover { background: var(--ml-blanc); border-color: var(--ml-bord); }
.adm-riche__zone { padding: var(--ml-e-3); min-height: 150px; }
.adm-riche__zone p:last-child { margin-bottom: 0; }

/* Zone de dépôt d'image + médiathèque */
.adm-depot { border: 2px dashed var(--ml-rose-300); border-radius: var(--ml-r-md); background: var(--ml-rose-050);
  padding: var(--ml-e-5); text-align: center; }
.adm-depot p { margin: 0 0 var(--ml-e-3); color: var(--ml-taupe); font-size: var(--ml-t-sm); }
.adm-medias { display: grid; gap: var(--ml-e-3); grid-template-columns: repeat(2, 1fr); }
@media (min-width: 700px) { .adm-medias { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1200px) { .adm-medias { grid-template-columns: repeat(6, 1fr); } }
.adm-media { border: 1px solid var(--ml-bord); border-radius: var(--ml-r-sm); overflow: hidden;
  background: var(--ml-blanc); cursor: pointer; }
.adm-media__img { aspect-ratio: 4 / 3; }
.adm-media__nom { padding: var(--ml-e-2); font-size: 11px; color: var(--ml-taupe);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-media[aria-selected="true"] { border-color: var(--ml-rose-700); box-shadow: 0 0 0 2px var(--ml-rose-700); }

/* Bandeaux d'information */
.adm-info { padding: var(--ml-e-4); border-left: 3px solid var(--ml-lilas-400); background: var(--ml-lilas-100);
  border-radius: var(--ml-r-sm); font-size: var(--ml-t-sm); margin-bottom: var(--ml-e-4); }
.adm-info--succes { border-color: var(--ml-sauge-400); background: var(--ml-sauge-100); }
.adm-info--attention { border-color: var(--ml-bientot-fg); background: var(--ml-bientot-bg); }
.adm-info--danger { border-color: #9B2C2C; background: #FBEDED; }
.adm-info p:last-child { margin-bottom: 0; }

/* Barre de sauvegarde collante */
.adm-barre-enreg { position: sticky; bottom: 0; z-index: 20;
  display: flex; flex-wrap: wrap; gap: var(--ml-e-3); align-items: center;
  padding: var(--ml-e-3) var(--ml-e-4); margin-top: var(--ml-e-5);
  background: var(--ml-blanc); border: 1px solid var(--ml-bord); border-radius: var(--ml-r-md);
  box-shadow: 0 -4px 16px rgba(94,63,75,.08); }
.adm-barre-enreg__etat { font-size: var(--ml-t-xs); color: var(--ml-taupe); }
.adm-barre-enreg__actions { margin-left: auto; display: flex; gap: var(--ml-e-3); flex-wrap: wrap; }

/* Jauge de remplissage */
.adm-jauge { height: 6px; border-radius: var(--ml-r-pill); background: var(--ml-bord); overflow: hidden; min-width: 70px; }
.adm-jauge span { display: block; height: 100%; background: var(--ml-sauge-400); }
.adm-jauge--bientot span { background: #D8A24A; }
.adm-jauge--complet span { background: var(--ml-lilas-400); }

/* Pagination */
.adm-pagination { display: flex; gap: var(--ml-e-2); align-items: center; justify-content: center;
  margin-top: var(--ml-e-5); font-size: var(--ml-t-sm); }
.adm-pagination a, .adm-pagination span { min-width: 40px; min-height: 40px; display: grid; place-items: center;
  border: 1px solid var(--ml-bord); border-radius: var(--ml-r-sm); background: var(--ml-blanc);
  text-decoration: none; color: var(--ml-encre); }
.adm-pagination [aria-current="page"] { background: var(--ml-rose-700); color: #fff; border-color: var(--ml-rose-700); }

/* Bandeau de maquette */
.adm-bandeau { background: var(--ml-lilas-700); color: #fff; font-size: var(--ml-t-xs);
  text-align: center; padding: var(--ml-e-2) var(--ml-e-4); }
.adm-bandeau a { color: #fff; }

/* Interrupteur publié / brouillon (repris de l'admin école : bascule en un clic) */
.adm-bascule { display: inline-flex; align-items: center; gap: var(--ml-e-3); cursor: pointer; }
.adm-bascule__piste { width: 46px; height: 26px; border-radius: var(--ml-r-pill); background: var(--ml-bord);
  position: relative; transition: background var(--ml-transition); flex: none; }
.adm-bascule__piste::after { content: ''; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px;
  border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2);
  transition: transform var(--ml-transition); }
.adm-bascule[aria-pressed="true"] .adm-bascule__piste { background: var(--ml-sauge-400); }
.adm-bascule[aria-pressed="true"] .adm-bascule__piste::after { transform: translateX(20px); }
.adm-bascule__libelle { font-size: var(--ml-t-xs); font-weight: 700; }

/* Barre de progression de remplissage du formulaire */
.adm-progres { display: flex; align-items: center; gap: var(--ml-e-3); font-size: var(--ml-t-xs);
  color: var(--ml-taupe); margin-bottom: var(--ml-e-4); }
.adm-progres__piste { flex: 1; height: 8px; border-radius: var(--ml-r-pill); background: var(--ml-bord); overflow: hidden; }
.adm-progres__piste span { display: block; height: 100%; background: var(--ml-rose-500); }

/* Modale de confirmation (jamais de confirm() natif : message explicite) */
.adm-modale { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center;
  background: rgba(58,50,56,.55); padding: var(--ml-e-4); }
.adm-modale[hidden] { display: none; }
.adm-modale__boite { background: var(--ml-blanc); border-radius: var(--ml-r-md); max-width: 460px; width: 100%;
  box-shadow: 0 20px 60px rgba(58,50,56,.3); overflow: hidden; }
.adm-modale__corps { padding: var(--ml-e-5); }
.adm-modale__corps h3 { margin-bottom: var(--ml-e-2); }
.adm-modale__pied { padding: var(--ml-e-4) var(--ml-e-5); background: var(--ml-creme);
  border-top: 1px solid var(--ml-bord); display: flex; gap: var(--ml-e-3); justify-content: flex-end; flex-wrap: wrap; }

/* Point coloré devant un statut (signature visuelle de l'admin école) */
.adm-point { width: 7px; height: 7px; border-radius: 50%; background: currentColor; display: inline-block; }

/* Image d'attente (les vraies photos viendront de la cliente) */
.adm-ph {
  background: linear-gradient(135deg, var(--ml-rose-100) 0%, var(--ml-lilas-100) 50%, var(--ml-sauge-100) 100%);
  display: grid; place-items: center; overflow: hidden;
  color: var(--ml-taupe); font-size: 10px; letter-spacing: .06em; text-transform: uppercase;
  text-align: center; padding: 2px;
}

.adm-vide { text-align: center; padding: var(--ml-e-8) var(--ml-e-4); color: var(--ml-taupe); }
.adm-cache { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }