/* ==========================================================================
   Espace groupe / écoles : barre de contexte, pages d'accès, tableaux de bord, sélection,
   écoles, consolidation, commandes. Les composants (.bouton, .carte, .badge, .table, .stepper,
   .alerte, .vide…) viennent de base.css ; les lignes de sélection réutilisent panier.css.
   ========================================================================== */

/* ---------- Barre de contexte (sous l'en-tête) ---------- */
.espace-nav { background: var(--surface-2); border-bottom: 1px solid var(--ligne); }
.espace-nav-interieur { display: flex; align-items: center; gap: 1rem 2rem; min-height: 3.5rem; flex-wrap: wrap; padding-block: 0.5rem; }
.espace-nav-identite { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.espace-nav-sous { font-size: var(--texte-xs); font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--sable-fonce); }
.espace-nav-nom { font-family: var(--police-titre); font-size: 1.2rem; font-weight: 500; letter-spacing: -0.01em; color: var(--encre); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 22rem; }
.espace-nav-onglets { border-bottom: 0; margin-left: 0.5rem; }
.espace-nav-onglets .onglet { padding: 0.6rem 0.9rem; font-size: 0.95rem; margin-bottom: 0; border-radius: var(--rayon-s) var(--rayon-s) 0 0; }
.espace-nav-onglets .onglet.est-actif { border-bottom-color: var(--sable); }
.espace-nav-compte { margin-left: auto; display: flex; align-items: center; gap: 0.75rem; flex: none; }
.espace-nav-utilisateur { font-size: var(--texte-s); color: var(--encre-2); max-width: 16rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.barre-sup-espace { font-weight: 600; }
@media (max-width: 760px) {
  .espace-nav-interieur { gap: 0.25rem 0.75rem; }
  .espace-nav-identite { flex: 1 1 0; min-width: 0; }
  .espace-nav-sous { white-space: normal; }
  .espace-nav-nom { font-size: 1.1rem; max-width: none; white-space: normal; }
  .espace-nav-compte { margin-left: 0; order: 2; flex: none; }
  .espace-nav-utilisateur { display: none; }
  /* Les onglets passent sur deux lignes plutôt que de sortir de l'écran (« Commandes » restait hors champ à 390 px) */
  .espace-nav-onglets { order: 3; flex-basis: 100%; margin-left: 0; margin-inline: -0.25rem; flex-wrap: wrap; overflow-x: visible; }
  .espace-nav-onglets .onglet { padding: 0.65rem 0.7rem; font-size: 0.9rem; }
}
/* En-tête du site sous 400 px : le bouton « Ma sélection (N) » garde l'icône et le compteur (aria-label complet) pour ne pas tronquer la marque */
@media (max-width: 400px) {
  .entete-panier .entete-panier-texte { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
/* Lien d'invitation à transmettre (fiche d'une école, email non parti) */
.espace-lien-invitation { padding: 0.75rem 0.9rem; border: 1px solid var(--alerte-bord); background: var(--alerte-clair); border-radius: var(--rayon-s); display: flex; flex-direction: column; gap: 0.5rem; }
.espace-lien-invitation p { margin: 0; }
.espace-lien-invitation-champ { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.espace-lien-invitation-champ .entree { flex: 1 1 14rem; min-width: 0; font-size: var(--texte-s); }
/* Écoles actives sans sélection, avant l'envoi de la commande groupée */
.espace-sans-selection ul { margin: 0.4rem 0 0 1.1rem; padding: 0; }
.espace-sans-selection li { margin: 0.2rem 0; }
.espace-chiffre-sur { font-size: 1rem; color: var(--encre-3); font-weight: 400; }

/* ---------- Pages d'accès (connexion, invitation, mot de passe) ---------- */
.espace-acces { padding: clamp(1.5rem, 4vw, 2.5rem); max-width: 30rem; margin: clamp(1rem, 4vw, 2.5rem) auto; }
.espace-acces-titre { font-size: clamp(1.6rem, 3vw, 2.1rem); margin-bottom: 0.6rem; }
.espace-acces .texte-2 { margin-bottom: 1.25rem; }
.espace-acces .pile .champ + .champ { margin-top: 0.25rem; }

/* ---------- En-têtes et blocs ---------- */
/* 52rem cadrent un titre de page ; le texte qui le suit revient à la colonne de lecture. L'espace est l'endroit
   où l'on travaille, pas où l'on feuillette : ses en-têtes portaient 102 à 109 signes par ligne, et la note d'une
   carte, sans borne du tout, jusqu'à 183 — la plus longue ligne de texte du site. */
.espace-entete { max-width: 52rem; margin-bottom: clamp(1.25rem, 3vw, 2rem); }
.espace-entete h1 { margin-bottom: 0.5rem; }
.espace-entete p, .espace-carte p, .espace-code-texte p { max-width: var(--mesure); }
.espace-entete p:last-child { margin-bottom: 0; }
.espace-entete--actions { max-width: none; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 1rem 2rem; }
.espace-entete--actions > div:first-child { max-width: 46rem; }
.espace-entete-boutons { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; }
.espace-entete-boutons .bouton[aria-disabled="true"] { pointer-events: none; }
.espace-statut { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; margin: 0.75rem 0 0; }
.espace-bloc { margin-top: clamp(1.5rem, 4vw, 2.5rem); }
.espace-bloc > p { max-width: var(--mesure); } /* chapeau de bloc : colonne de lecture (139 signes par ligne) */
.espace-bloc-titre { font-size: 1.25rem; margin-bottom: 0.9rem; }
.espace-bloc-entete { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.espace-sous-titre { font-size: 0.95rem; margin: 1.25rem 0 0.5rem; }
.espace-grille-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: 1.25rem; align-items: start; }
.espace-carte { display: flex; flex-direction: column; gap: 0.5rem; }
.espace-carte > .carte-titre { margin-bottom: 0.25rem; }
.espace-carte-entete { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; flex-wrap: wrap; }
.espace-carte-entete .carte-titre { margin: 0; }
.espace-carte .defs { margin: 0.25rem 0; }
.espace-carte .formulaire-actions { margin-top: 0.5rem; }
.espace-vide { padding-block: clamp(1.5rem, 5vw, 3rem); background: var(--surface-2); border-radius: var(--rayon); }
.espace-vide .vide-texte { margin-bottom: 0; }
.espace-recap-aide { margin: 0; }
.espace-fil { padding-top: 0; margin-bottom: 1rem; }
.espace-aide-groupe { margin: 0; max-width: var(--mesure); } /* colonne de lecture : 139 signes par ligne auparavant */
.espace-bandeau { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem; }
.espace-bandeau p { margin: 0; flex: 1 1 18rem; }
.espace-bandeau form { margin: 0; }

/* Chiffres clés */
.espace-chiffres { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: clamp(1.25rem, 3vw, 2rem); }
.espace-chiffre { display: flex; flex-direction: column; gap: 0.15rem; padding: 1rem 1.15rem; }
.espace-chiffre-valeur { font-family: var(--police-titre); font-size: 1.7rem; font-weight: 500; letter-spacing: -0.02em; color: var(--encre); line-height: 1.1; font-variant-numeric: tabular-nums; }
.espace-chiffre-libelle { font-size: var(--texte-xs); color: var(--encre-3); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 600; }
@media (max-width: 900px) { .espace-chiffres { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Listes simples et journal */
.espace-liste-simple { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.4rem; font-size: 0.95rem; }
.espace-liste-simple li { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.45rem 0; border-bottom: 1px solid var(--ligne); }
.espace-liste-simple li:last-child { border-bottom: 0; }
.espace-journal { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.5rem; font-size: var(--texte-s); }
/* La date tient sa colonne de 7,5rem ; le libellé qui la suit revient à la colonne de lecture (88 signes par
   ligne auparavant), sans quoi une seule entrée de journal traversait toute la carte. */
.espace-journal li { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 0.5rem; align-items: baseline; max-width: calc(var(--mesure) + 8rem); }
.espace-journal-date { color: var(--encre-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
.espace-journal-texte { color: var(--encre-2); }

/* ---------- Tableaux : cartes sous 640 px ---------- */
.espace-table .espace-table-sous { display: block; font-weight: 400; margin-top: 0.15rem; }
/* Gravure : ce que la ligne fait graver et ce que cela ajoute à son total — sous la désignation, comme sur le devis */
.espace-table .espace-table-gravure { display: block; font-weight: 400; margin-top: 0.25rem; color: var(--encre-2); max-width: var(--mesure); }
.espace-table tfoot th, .espace-table tfoot td { background: var(--surface-2); font-weight: 600; border-top: 2px solid var(--ligne-2); }
.espace-table tfoot th { text-align: left; font-size: var(--texte-s); }
.espace-table tr.est-indisponible td { background: color-mix(in srgb, var(--alerte-clair) 35%, var(--surface)); }
.espace-col-ecole { min-width: 6.5rem; }
.espace-col-ecole a { color: var(--encre); }
.espace-col-note { display: block; font-size: 0.65rem; letter-spacing: 0.06em; color: var(--alerte-texte); font-weight: 600; }
@media (max-width: 640px) {
  .table-defilante:has(.espace-table) { border: 0; background: transparent; overflow: visible; }
  .espace-table, .espace-table tbody, .espace-table tr, .espace-table td { display: block; width: 100%; }
  /* Sémantique du tableau : display:block efface les rôles implicites (table, rangée, cellule) ; le balisage des
     vues porte donc les rôles ARIA explicites, et la rangée d'en-tête, au lieu de disparaître (display:none),
     sort seulement de l'écran. Les cellules gardent ainsi un intitulé de colonne relié — le libellé visible
     (data-libelle, ci-dessous) ne sert que la lecture à l'œil et n'associe rien. */
  .espace-table thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
  .espace-table tfoot { display: none; }
  .espace-table tr { background: var(--surface); border: 1px solid var(--ligne); border-radius: var(--rayon); margin-bottom: 0.75rem; padding: 0.5rem 0.25rem; box-shadow: var(--ombre-1); }
  /* Libellé / valeur sur une ligne, mais la valeur (badge « Transmise le … », montant) passe dessous si elle ne tient pas : rien ne déborde à 390 px */
  .espace-table td { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 0.35rem 1rem; border-bottom: 1px solid var(--ligne); padding: 0.55rem 0.8rem; text-align: right; min-width: 0; }
  .espace-table td > * { min-width: 0; max-width: 100%; }
  .espace-table td .badge { white-space: normal; text-align: left; }
  .espace-table td:last-child { border-bottom: 0; }
  .espace-table td[data-libelle]::before { content: attr(data-libelle); font-size: var(--texte-xs); text-transform: uppercase; letter-spacing: 0.06em; color: var(--encre-3); font-weight: 600; text-align: left; flex: none; }
  .espace-table td[data-libelle=""]::before { content: none; }
  .espace-table td[data-libelle=""] { justify-content: flex-end; }
  .espace-table td.num, .espace-table td.action { text-align: right; }
  .espace-table tbody tr:hover td { background: transparent; }
  .espace-table .espace-table-sous { display: block; text-align: right; }
  .espace-table .espace-table-gravure { display: block; text-align: right; }
  .espace-col-ecole { min-width: 0; }
  .espace-col-note { display: inline; margin-left: 0.35rem; }
  /* Consolidation : le total par école (information de contrôle avant l'envoi) reste visible, en carte sous le tableau */
  .espace-table-conso tfoot, .espace-table-conso tfoot tr, .espace-table-conso tfoot td { display: block; width: 100%; }
  .espace-table-conso tfoot th { display: block; width: 100%; text-align: left; background: transparent; border: 0; padding: 0.55rem 0.8rem 0.25rem; }
  .espace-table-conso tfoot td { display: flex; }
  .espace-table-conso tfoot td:empty { display: none; }
  .espace-table-conso tfoot td, .espace-table-conso tfoot th { border-top: 0; }
  .espace-table-conso tfoot tr { background: var(--surface-2); border: 1px solid var(--ligne-2); }
}

/* ---------- Écoles (liste du groupe) ---------- */
.espace-liste-ecoles { display: flex; flex-direction: column; gap: 1rem; margin-bottom: clamp(1.5rem, 4vw, 2.5rem); }
.espace-ecole { padding: 1.1rem 1.25rem; display: flex; flex-direction: column; gap: 0.9rem; scroll-margin-top: 6rem; }
.espace-ecole.est-inactive { background: var(--surface-2); }
.espace-ecole.est-inactive .espace-ecole-nom { color: var(--encre-3); }
.espace-ecole-entete { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 0.6rem 1.5rem; }
.espace-ecole-identite p { margin: 0.2rem 0 0; max-width: var(--mesure); }
.espace-ecole-nom { font-size: 1.15rem; margin: 0; letter-spacing: 0; }
.espace-ecole-nom a { color: var(--encre); }
.espace-ecole-badges { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.espace-ecole-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.espace-ecole-actions form { margin: 0; }
.espace-ecole-inviter { display: inline-flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.espace-ecole-inviter .entree--petite { width: 15rem; max-width: 100%; }
.espace-ecole-etat { margin-left: auto; }
.espace-bouton-attention:hover { color: var(--erreur); background: var(--erreur-clair); }
.espace-details { flex-basis: 100%; order: 10; }
.espace-details summary { list-style: none; cursor: pointer; width: max-content; }
.espace-details summary::-webkit-details-marker { display: none; }
.espace-details[open] summary { background: var(--surface-2); color: var(--encre); }
.espace-details-corps { margin-top: 0.9rem; padding: 1rem; border: 1px solid var(--ligne); border-radius: var(--rayon-s); background: var(--surface-2); }
.espace-ajout { scroll-margin-top: 6rem; }
.espace-ajout > p { max-width: var(--mesure); } /* colonne de lecture : 183 signes par ligne auparavant, à 1512 px */
.espace-ajout .case { margin-top: 0.25rem; }
@media (max-width: 640px) {
  .espace-ecole-actions .bouton, .espace-ecole-actions form, .espace-ecole-inviter button { width: 100%; }
  .espace-ecole-inviter .entree--petite { width: 100%; }
  .espace-ecole-etat { margin-left: 0; }
  .espace-details summary { width: 100%; }
}

/* ---------- Lignes de sélection (compléments à panier.css) ----------
   Les lignes sont désormais une seule liste encadrée (panier.css) : l'état d'une ligne se signale
   par un filet coloré à gauche, non par une bordure propre. */
.espace-ligne.est-ajustee { box-shadow: inset 3px 0 0 var(--sable); }
.espace-ligne.est-annulee { opacity: 0.72; }
.espace-ligne.est-annulee .panier-ligne-nom a { text-decoration: line-through; color: var(--encre-3); }
.espace-ligne.est-retiree-catalogue { box-shadow: inset 3px 0 0 var(--erreur); }
/* Profil d'établissement : le repli « effectif repris de votre fiche » et la note de saisie manuelle */
.profil-repli { margin: 0.5rem 0 0; color: var(--alerte-texte); font-weight: 500; }
.espace-selection .panier-recalcul, .espace-selection .panier-manques { margin-top: 0.25rem; }
.espace-ligne-trace { margin: 0.4rem 0 0; color: var(--sable-fonce); font-weight: 500; }
.espace-ecole-detail .espace-ligne-trace { color: var(--encre-2); font-weight: 400; }
.espace-ligne.est-ajustee .espace-ligne-trace { color: var(--sable-fonce); font-weight: 500; }
.espace-ligne-quantite-fixe { display: inline-flex; align-items: baseline; gap: 0.3rem; white-space: nowrap; }
.espace-ligne-quantite-fixe .prix-montant { font-size: 1.1rem; }
.espace-ligne-vide-action { display: block; width: 0; }
.espace-selection .panier-actions { margin-top: 0.25rem; }
.espace-infos .defs { margin: 0; }

/* ---------- Consolidation ---------- */
.espace-table-conso th:first-child, .espace-table-conso td:first-child { min-width: 14rem; }
.espace-conso-bas { margin-top: clamp(1.5rem, 4vw, 2.5rem); grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); }
.espace-recap-lignes { margin-bottom: 0.75rem; }
.espace-commander { padding: clamp(1.25rem, 3vw, 2rem); scroll-margin-top: 6rem; }
.espace-commander .panier-envoi-entete { margin-bottom: 1.25rem; }
.espace-case-verif { padding: 0.75rem 1rem; border: 1px solid var(--ligne-2); border-radius: var(--rayon-s); background: var(--surface-2); font-weight: 600; }
.espace-case-verif.a-erreur { border-color: var(--erreur); }
.espace-commander .panier-envoi-actions { margin-top: 0.75rem; }
/* minmax(0, 1fr) : une colonne « 1fr » seule vaut minmax(auto, 1fr) et s'élargit à la largeur du bouton bloc (débordement à 390 px) */
@media (max-width: 900px) { .espace-conso-bas { grid-template-columns: minmax(0, 1fr); } }
.espace-conso-bas .bouton--bloc { white-space: normal; height: auto; min-height: 2.75rem; padding-block: 0.6rem; }

/* ---------- Commande groupée (confirmation et détail) ---------- */
.espace-confirmation { margin-bottom: 0; }
.espace-repartition { margin-bottom: 0.75rem; overflow: hidden; }
.espace-repartition-entete { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1rem; padding: 0.9rem 1.1rem; cursor: pointer; list-style: none; }
.espace-repartition-entete::-webkit-details-marker { display: none; }
.espace-repartition-entete::before { content: "▸"; color: var(--encre-3); margin-right: 0.5rem; font-size: 0.8em; }
.espace-repartition[open] .espace-repartition-entete::before { content: "▾"; }
.espace-repartition-table { border: 0; border-top: 1px solid var(--ligne); border-radius: 0; }
.espace-repartition-corps { border-top: 1px solid var(--ligne); }
.espace-repartition-corps > p { padding: 0.9rem 1.1rem; margin: 0; }
.espace-repartition-corps .espace-repartition-table { border-top: 0; }
.espace-repartition-actions { padding: 0.75rem 1.1rem; margin: 0; border-top: 1px solid var(--ligne); display: flex; justify-content: flex-end; }
.espace-repartition tr.est-annulee td { color: var(--encre-3); }
.espace-repartition tr.est-annulee td[data-libelle="Produit"] { text-decoration: line-through; }

/* ---------- Page de connexion : créer l'espace d'un groupe, rejoindre son groupe ---------- */
.espace-acces-inscription { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--ligne); display: flex; flex-direction: column; gap: 0.6rem; }
.espace-acces-inscription p { margin: 0; }
/* Suite proposée à qui vient de lire « votre demande est en cours d'examen » : les étapes, pas un second compte. */
.espace-acces-etapes { margin: 0; padding-left: 1.2rem; display: flex; flex-direction: column; gap: 0.25rem; }
.espace-acces-lien { display: flex; flex-direction: column; gap: 0.15rem; padding: 0.75rem 0.9rem; border: 1px solid var(--ligne); border-radius: var(--rayon-s); background: var(--surface-2); color: inherit; text-decoration: none; transition: border-color var(--transition), box-shadow var(--transition); }
.espace-acces-lien:hover, .espace-acces-lien:focus-visible { border-color: var(--sable); box-shadow: var(--ombre-1); text-decoration: none; }
.espace-acces-lien-titre { font-weight: 600; color: var(--encre); }
.espace-acces-lien-texte { font-size: var(--texte-xs); color: var(--encre-3); }

/* ---------- Inscription (pages publiques) : un établissement, ou un réseau d'établissements ----------
   UNE seule porte d'entrée. Le choix fait en tête du formulaire décide du vocabulaire de toute la page :
   les deux variantes de chaque texte sont rendues par le serveur (.si-etablissement / .si-reseau), une
   seule est visible. La bascule est faite en CSS pur — `:has()` sur la case cochée — et doublée par la
   classe .est-reseau que pose espace.js : sans JavaScript comme sans `:has()`, la variante rendue par le
   serveur (celle du choix mémorisé) reste la bonne. Voir app/Views/site/espace/inscription-groupe.php.
   `display: revert` et non `inline` : la même classe sert sur un <span> et sur un <p>. */
.espace-inscription .si-reseau { display: none; }
.espace-inscription:has(#ins-type-reseau:checked) .si-reseau,
.espace-inscription.est-reseau .si-reseau { display: revert; }
.espace-inscription:has(#ins-type-reseau:checked) .si-etablissement,
.espace-inscription.est-reseau .si-etablissement { display: none; }

.espace-type-choix { border: 0; padding: 0; margin: 0 0 1.5rem; min-width: 0; display: flex; flex-direction: column; gap: 0.6rem; }
.espace-type-legende { font-family: var(--police-titre); font-size: 1.3rem; font-weight: 500; letter-spacing: -0.01em; color: var(--encre); padding: 0; margin-bottom: 0.9rem; }
.espace-type-option { display: flex; align-items: flex-start; gap: 0.7rem; padding: 0.85rem 1rem; border: 1px solid var(--ligne); border-radius: 12px; background: var(--surface); cursor: pointer; }
.espace-type-option:hover { border-color: var(--sable); }
.espace-type-option:has(input:checked) { border-color: var(--encre); background: var(--surface-2); }
.espace-type-option:has(input:focus-visible) { outline: 2px solid var(--encre); outline-offset: 2px; }
.espace-type-option input { margin-top: 0.2rem; flex: none; width: 1.1rem; height: 1.1rem; accent-color: var(--encre); }
.espace-type-corps { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }
.espace-type-titre { font-weight: 600; color: var(--encre); }
.espace-type-aide { font-size: var(--texte-s); color: var(--encre-3); max-width: var(--mesure); }

/* ---------- Inscription d'un établissement / d'un réseau (pages publiques) ---------- */
.espace-inscription-entete { max-width: 52rem; }
.espace-inscription-entete p:last-child { margin-bottom: 0; }
.espace-inscription-form { padding: clamp(1.25rem, 3vw, 2rem); scroll-margin-top: 5rem; }
.espace-inscription-form > .alerte { margin-bottom: 1.25rem; }
.espace-volet { border: 0; padding: 0; margin: 0 0 1.75rem; min-width: 0; }
.espace-volet:last-of-type { margin-bottom: 0; }
.espace-volet-titre { font-family: var(--police-titre); font-size: 1.3rem; font-weight: 500; letter-spacing: -0.01em; color: var(--encre); padding: 0; margin-bottom: 0.9rem; }
.espace-volet-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem; margin-top: 1rem; }
.espace-consentement { margin-top: 1rem; }
.espace-consentement.a-erreur { color: var(--erreur-texte); }
.espace-inscription-note { margin: 0.9rem 0 0; max-width: var(--mesure); } /* colonne de lecture */
.espace-champ-code { max-width: 20rem; margin-bottom: 1rem; }
.espace-entree-code { font-size: 1.2rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; font-variant-numeric: tabular-nums; }
/* Volets (mobile, espace.js) : un seul volet visible, indicateur d'étapes */
.espace-etapes { display: flex; list-style: none; margin: 0 0 1.25rem; padding: 0; gap: 0.5rem; }
.espace-etape { flex: 1 1 0; display: flex; align-items: center; gap: 0.45rem; font-size: var(--texte-s); color: var(--encre-3); padding-bottom: 0.5rem; border-bottom: 2px solid var(--ligne); }
.espace-etape.est-active { color: var(--encre); font-weight: 600; border-bottom-color: var(--sable); }
.espace-etape.est-faite { border-bottom-color: var(--succes); }
.espace-etape-numero { width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--surface-2); display: inline-flex; align-items: center; justify-content: center; font-size: var(--texte-xs); font-weight: 600; flex: none; }
.espace-etape.est-active .espace-etape-numero { background: var(--encre); color: #fff; }
.espace-etape.est-faite .espace-etape-numero { background: var(--succes); color: #fff; }
.espace-etape.est-erreur { border-bottom-color: var(--erreur); }
.espace-etape.est-erreur .espace-etape-numero { background: var(--erreur); color: #fff; }
.espace-inscription-legende { margin: 0 0 1rem; }
.espace-inscription-form > .alerte a { color: inherit; text-decoration: underline; text-underline-offset: 2px; font-weight: 600; }
.espace-inscription-form.est-volets .espace-volet:not(.est-actif) { display: none; }
.espace-inscription-form.est-volets .espace-volet { margin-bottom: 0; }
@media (max-width: 760px) {
  .espace-volet-actions .bouton { width: 100%; }
}

/* ---------- Encart « Rattacher vos écoles » (code de rattachement) ---------- */
.espace-code { padding: clamp(1.1rem, 3vw, 1.5rem) clamp(1.1rem, 3vw, 1.75rem); margin-bottom: clamp(1.5rem, 4vw, 2.5rem); border-left: 4px solid var(--sable); scroll-margin-top: 6rem; }
.espace-code--compact { margin-bottom: 1.25rem; }
.espace-code-principal { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; }
.espace-code-texte { flex: 1 1 22rem; min-width: 0; }
.espace-code-texte .carte-titre { margin-bottom: 0.35rem; }
.espace-code-texte p:last-child { margin: 0; }
.espace-code-valeur { display: flex; flex-direction: column; align-items: flex-start; gap: 0.6rem; }
.espace-code-chiffres { display: inline-block; font-family: var(--police-titre); font-size: clamp(1.8rem, 5vw, 2.5rem); font-weight: 500; letter-spacing: 0.12em; line-height: 1.1; color: var(--encre); background: var(--surface-2); border: 1px dashed var(--sable); border-radius: var(--rayon-s); padding: 0.4rem 0.9rem 0.4rem 1rem; font-variant-numeric: tabular-nums; user-select: all; }
.espace-code-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.espace-code-actions form { margin: 0; }
.espace-code-modele { margin-top: 1rem; }
.espace-code-modele summary { list-style: none; cursor: pointer; width: max-content; max-width: 100%; }
.espace-code-modele summary::-webkit-details-marker { display: none; }
.espace-code-modele[open] summary { background: var(--surface-2); color: var(--encre); }
.espace-code-modele-corps { margin-top: 0.75rem; display: flex; flex-direction: column; gap: 0.6rem; }
.espace-code-modele-corps .zone-texte { font-size: var(--texte-s); line-height: 1.5; }
.espace-code-modele-corps .ligne { align-items: center; gap: 0.5rem 1rem; }
/* Colonne de lecture : 181 signes par ligne à 1512 px. `overflow-wrap: anywhere` reste indispensable — l'adresse
   d'invitation qu'annonce cette phrase est un mot insécable et doit pouvoir se couper dans la colonne. */
.espace-code-lien { margin: 0.75rem 0 0; overflow-wrap: anywhere; max-width: var(--mesure); }
@media (max-width: 640px) {
  .espace-code-valeur { width: 100%; align-items: stretch; }
  .espace-code-chiffres { text-align: center; }
  .espace-code-actions .bouton, .espace-code-actions form { flex: 1 1 8rem; }
  .espace-code-actions form .bouton { width: 100%; }
  .espace-code-modele summary { width: 100%; }
}

/* ---------- Écoles : rattachement par code, détachement ---------- */
.espace-ecole-rattachee { margin: 0.2rem 0 0; color: var(--sable-fonce); font-weight: 500; }
.espace-ecole-etat { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.espace-ecole-etat form { margin: 0; }
.espace-ecole-detachee { margin: 0; flex-basis: 100%; }
@media (max-width: 640px) {
  .espace-ecole-etat { width: 100%; }
  .espace-ecole-etat form { flex: 1 1 8rem; }
}

/* ---------- Fiches « Mon réseau » / « Mon établissement » ---------- */
.espace-fiche .espace-carte + .espace-carte { margin-top: 1.25rem; }
.espace-fiche-identite { margin: 0; }
.espace-fiche-sous-titre { margin-top: 1.25rem; }
.espace-fiche-form .formulaire-actions { margin-top: 1rem; display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem; }

/* ---------- Suggestions dans l'espace ---------- */
.espace-selection .panier-suggestions { margin-top: 0.25rem; }
.espace-oublies { margin-top: clamp(1.5rem, 4vw, 2.5rem); }

/* ---------- Profil consolidé du réseau (consolidation) ---------- */
.espace-profil-cumul { display: flex; flex-direction: column; gap: 0.6rem; margin-bottom: clamp(1rem, 3vw, 1.75rem); }
.espace-profil-cumul p { margin: 0; }
.espace-profil-cumul-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.3rem; font-size: var(--texte-s); }

/* >>> Profil d'établissement, côté groupe (17/09/2026) ------------------------------------------------
   Le groupe est celui qui envoie la commande : il doit lire le profil de chaque école et la latéralité
   qu'elle a oubliée, même s'il ne peut pas la corriger à sa place. */
.espace-profil-ecole { margin: 0.6rem 0 0; }
.espace-manque-ecole { margin-top: 0.75rem; }
.espace-manques-groupe { display: flex; flex-direction: column; gap: 0.6rem; margin-bottom: clamp(1rem, 3vw, 1.75rem); }
.espace-manques-groupe .panier-manque-titre a { color: inherit; }
.espace-manques-groupe > p:last-child { margin: 0; }
/* <<< fin du bloc « profil d'établissement, côté groupe » */

/* >>> Gravure (17/09/2026) --------------------------------------------------------------------------------
   Fiche de l'établissement : le nom gravé et le logo. L'encart de la sélection et la case des lignes
   réutilisent panier.css (.panier-gravure, .panier-ligne-gravure) : c'est la même chose des deux côtés. */
.espace-gravure { margin-top: 1.25rem; }
.espace-gravure-intro { margin: 0 0 0.75rem; max-width: var(--mesure); }
.espace-gravure-repli { margin: 0 0 0.9rem; padding: 0.55rem 0.75rem; border-radius: var(--rayon-s); background: var(--surface-2); color: var(--encre-2); max-width: var(--mesure); }
.espace-gravure-form { gap: 1.1rem; }
.espace-gravure-form .champ-aide { max-width: var(--mesure); }
.espace-gravure-logo { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1rem; margin-bottom: 0.6rem; }
.espace-gravure-logo img { width: 5rem; height: 5rem; object-fit: contain; padding: 0.4rem; border: 1px solid var(--ligne); border-radius: var(--rayon-s); background: var(--surface); }
.espace-gravure-logo .champ-aide { margin: 0; flex: 1 1 12rem; }
.espace-gravure-retirer { margin-top: 0.5rem; }
.espace-gravure-note { margin: 0.75rem 0 0; max-width: var(--mesure); }
/* Ce que l'atelier gravera, établissement par établissement, sur la consolidation du réseau */
.espace-gravure-reseau { display: flex; flex-direction: column; gap: 0.6rem; margin-bottom: clamp(1rem, 3vw, 1.75rem); }
.espace-gravure-reseau p { margin: 0; max-width: var(--mesure); }
.espace-gravure-reseau-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.3rem; font-size: var(--texte-s); }
/* <<< fin du bloc « gravure » */

/* ---------- Mes kits (kits composés par l'établissement, 18/09/2026) ----------
   Une bibliotheque, pas un catalogue : des cartes larges qu'on parcourt du regard, chacune disant ce qu'elle
   contient et ce qu'on peut en faire. L'éditeur, lui, reprend la feuille admin-kits.css, partagée avec l'écran
   de l'équipe — les deux composent la même chose. */
.espace-actions-haut { margin: 0 0 1.5rem; }
.espace-kits { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1rem; }
.espace-kit { display: flex; flex-direction: column; gap: 0.6rem; }
.espace-kit-entete { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.35rem 1rem; }
.espace-kit-nom { margin: 0; font-size: 1.15rem; }
.espace-kit-nom a { color: var(--encre); }
.espace-kit-lignes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.2rem; }
.espace-kit-lignes li { padding-left: 0.9rem; position: relative; }
.espace-kit-lignes li::before {
  content: ""; position: absolute; left: 0; top: 0.62em;
  width: 0.3rem; height: 0.3rem; border-radius: 50%; background: var(--sable);
}
.espace-kit-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin-top: 0.3rem; }
.espace-kit-actions form { margin: 0; }
.espace-kits-catalogue { margin-top: 2.5rem; padding-top: 2rem; border-top: 1px solid var(--ligne); }
.espace-kits-modeles {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr));
}
.espace-kits-modeles li { display: flex; flex-direction: column; gap: 0.4rem; }
.espace-kits-modeles form { margin-top: auto; }
.espace-kits-note { margin-top: 1.5rem; }
.espace-retour { margin-top: 2rem; font-weight: 600; }

/* L'éditeur d'un kit d'établissement */
.espace-kit-profil {
  margin: 0 0 1.25rem; padding: 0.7rem 0.9rem; border-radius: var(--rayon-s);
  background: var(--sable-clair); color: var(--sable-fonce); max-width: var(--mesure);
}
.page-espace .kit-formulaire { display: flex; flex-direction: column; gap: 1.25rem; }
.page-espace .kit-formulaire .formulaire-section { border: 1px solid var(--ligne); margin: 0; }
.page-espace .kit-formulaire legend {
  padding: 0 0.5rem; margin-left: -0.5rem;
  font-family: var(--police-titre); font-size: 1.15rem; font-weight: 600; color: var(--accent);
}
.espace-kit-barre { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; }
.espace-kit-suppression { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--ligne); }

/* Le renvoi vers « Mes kits » depuis la sélection */
.panier-kits-lien { margin: 0 0 1rem; font-weight: 600; }
.panier-kits-lien a { text-decoration: underline; text-underline-offset: 3px; }