/* ══════════════════════════════════════════════════════════════════════════
   Administration — n'ajoute que ce que le portail n'a pas.
   Tout le reste (page, entête, groupe, doc, doc-bloc, doc-btn, vide) vient de
   portail.css : une page d'admin qui ne ressemble pas au portail donne
   l'impression d'être un autre outil.
   ══════════════════════════════════════════════════════════════════════════ */

.attente{
  padding:3rem 0; text-align:center;
  font-size:.9375rem; color:var(--muted);
}
.attente a{ color:var(--teal-deep) }

.aide{
  margin:-.5rem 0 1rem; max-width:var(--mesure);
  font-size:.8125rem; line-height:1.5; color:var(--muted);
}

/* ── Fil d'Ariane ──────────────────────────────────────────────────────── */
.fil{ margin:0 0 .75rem; font-size:.8125rem; color:var(--muted) }
/* ⚠️ `width:auto` et `text-align:left` sont indispensables, pas décoratifs :
   portail.css met les boutons en pleine largeur, et un bouton centre son texte.
   Sans ces deux lignes, le fil d'Ariane s'étalait sur 1016 px et son libellé
   apparaissait au MILIEU de l'écran — mesuré le 2026-09-09. Le DOM semblait
   pourtant aligné : c'est le bouton qui l'était, pas le texte. */
.fil-etape{
  width:auto; text-align:left;
  border:0; background:none; padding:0; cursor:pointer;
  font:inherit; color:var(--teal-deep); text-decoration:underline;
  text-underline-offset:2px;
}
.fil-etape:disabled{ color:var(--ink); text-decoration:none; cursor:default; font-weight:600 }

/* ── Un dossier se distingue d'un fichier au premier coup d'œil ─────────
   Par un chevron dessiné en CSS, pas par un emoji : la charte de la flotte
   proscrit les emojis dans l'interface, et leur rendu varie d'un système à
   l'autre — ici le glyphe mangeait l'espace qui le suivait. */
.doc--dossier{ background:var(--surface); box-shadow:var(--creux) }
.doc--dossier:hover{ box-shadow:var(--creux) }
.dossier-nom{
  display:flex; align-items:center; gap:.5rem; width:auto;
  border:0; background:none; padding:0; cursor:pointer;
  font:inherit; font-size:.9375rem; color:var(--ink); text-align:left;
}
.dossier-nom::before{
  content:''; flex:none; width:.5rem; height:.5rem;
  border-right:1.5px solid var(--teal); border-bottom:1.5px solid var(--teal);
  transform:rotate(-45deg); margin-left:.1rem;
}
.dossier-nom:hover{ color:var(--teal-deep) }

/* Un partenaire révoqué reste lisible mais visiblement éteint : le masquer
   ferait croire qu'il a disparu, alors que son historique est conservé. */
.doc--eteint{ opacity:.55 }

/* ── Rubriques de la liste publiée ─────────────────────────────────────────
   Un cran SOUS le `h2` de section, et sans relief : ce sont des intercalaires
   dans une liste, pas des cartes. Le premier ne prend pas la marge haute, il
   suivrait immédiatement le texte d'aide. */
.rubrique{
  margin:1.75rem 0 .625rem; font-size:.8125rem; font-weight:600;
  letter-spacing:.06em; text-transform:uppercase; color:var(--muted);
}
.rubrique:first-child{ margin-top:.25rem }

.doc-mention-ok{
  font-size:.8125rem; color:var(--ok-encre); white-space:nowrap;
}

/* ── Publier : trois commandes sur une ligne, qui se replient en étroit ── */
.publier{ display:flex; flex-wrap:wrap; gap:.5rem; align-items:center }
.mini-select, .mini-champ{
  font:inherit; font-size:.8125rem; padding:.5rem .6875rem;
  color:var(--ink); background:var(--surface);
  border:0; border-radius:12px; box-shadow:var(--creux); max-width:11rem;
}
/* Le libellé est le champ qu'on relit avant de publier : il mérite plus de
   place que les deux listes déroulantes qui le suivent. */
.mini-champ{ flex:1 1 14rem; max-width:22rem }
.mini-champ:focus-visible, .mini-select:focus-visible{ outline:2px solid var(--teal); outline-offset:2px }

/* ── Le formulaire d'invitation ────────────────────────────────────────── */
.formulaire{ max-width:var(--mesure) }
.champs{
  display:grid; gap:.875rem 1rem;
  grid-template-columns:repeat(auto-fit, minmax(15rem, 1fr));
  margin-bottom:1rem;
}
.formulaire label{
  display:block; font-size:.8125rem; font-weight:600; color:var(--ink);
}
.facultatif{ font-weight:400; color:var(--muted) }
/* ⚠️ `:not([type=checkbox])` N'EST PAS DÉCORATIF — mesuré le 2026-09-10.
   Sans lui, cette règle s'appliquait AUSSI aux cases à cocher : une case étirée
   sur 100 % de la largeur, avec le creux du neumorphisme, donnait une longue
   barre grise avec un carré perdu au milieu, et poussait son libellé à la ligne
   suivante. « Accès aux projets » était illisible.
   TROISIÈME occurrence du même défaut en deux jours — `button{width:100%}` avait
   étiré le fil d'Ariane sur 1016 px, puis un `box-shadow` teal avait posé un halo
   sur cinq boutons nus. Le motif est toujours le même : une règle écrite pour un
   type de champ, appliquée au sélecteur d'élément. Toucher à un sélecteur nu
   (`input`, `button`, `a`) demande de vérifier CE QUE ÇA ATTRAPE D'AUTRE. */
.formulaire input:not([type=checkbox]), .formulaire textarea{
  width:100%; margin-top:.35rem; font:inherit; font-size:.9375rem;
  padding:.75rem .9375rem; color:var(--ink); background:var(--surface);
  border:0; border-radius:14px; box-shadow:var(--creux);
}
.formulaire input[type=checkbox]{
  width:1.15rem; height:1.15rem; margin:0; flex:0 0 auto;
  accent-color:var(--teal-deep); cursor:pointer;
}
.formulaire textarea{ resize:vertical; margin-bottom:1rem }
.formulaire input:focus-visible, .formulaire textarea:focus-visible{
  outline:2px solid var(--teal); outline-offset:2px;
}
.formulaire button[type=submit]{
  width:auto; padding:.75rem 1.375rem; font:inherit; font-size:.9375rem;
  font-weight:600; color:#fff; background:var(--teal-deep);
  border:0; border-radius:14px; cursor:pointer;
  box-shadow:5px 5px 12px rgb(30 88 95 / .28);
}
.formulaire button[type=submit]:hover:not(:disabled){ background:var(--teal); box-shadow:6px 6px 16px rgb(30 88 95 / .34) }
.formulaire button[type=submit]:active:not(:disabled){ box-shadow:2px 2px 6px rgb(30 88 95 / .3) }
.formulaire button[type=submit]:disabled{ opacity:.6; cursor:default }

.projets{
  margin:0 0 1rem; padding:1rem 1.125rem;
  border:0; border-radius:18px; background:var(--surface); box-shadow:var(--creux);
}
.projets legend{
  padding:0 .35rem; font-size:.8125rem; font-weight:600; color:var(--ink);
}
/* Une case par ligne, toute la ligne cliquable : à deux projets on pouvait les
   mettre côte à côte, à six ce serait un mur. */
.case{
  display:flex; align-items:center; gap:.625rem;
  padding:.5rem .25rem; font-weight:400; font-size:.9375rem; cursor:pointer;
}
.case:hover{ color:var(--teal-deep) }

/* ── Les deux gestes du formulaire ─────────────────────────────────────── */
.boutons{ display:flex; flex-wrap:wrap; gap:.625rem; align-items:center }
.formulaire button.second{
  width:auto; padding:.75rem 1.375rem; font:inherit; font-size:.9375rem;
  font-weight:600; color:var(--teal-deep); background:var(--surface);
  border:0; border-radius:14px; cursor:pointer; box-shadow:var(--bosse-douce);
}
.formulaire button.second:hover:not(:disabled){ box-shadow:var(--bosse) }
.formulaire button.second:active:not(:disabled){ box-shadow:var(--creux) }
.formulaire button.second:disabled{ opacity:.6; cursor:default }

/* ── L'envoi différé, déplié sur la ligne d'un partenaire ──────────────── */
.envoi{
  display:flex; flex-wrap:wrap; gap:.5rem; align-items:center;
  width:100%; margin-top:.75rem;
}
.envoi input{
  flex:1 1 18rem; min-width:0; font:inherit; font-size:.875rem;
  padding:.625rem .875rem; color:var(--ink); background:var(--surface);
  border:0; border-radius:12px; box-shadow:var(--creux);
}
.envoi input:focus-visible{ outline:2px solid var(--teal); outline-offset:2px }

/* ── Retours ───────────────────────────────────────────────────────────── */
.reponse--ok, .reponse--erreur{
  margin-top:1.5rem; padding:.875rem 1.125rem; border-radius:14px;
  font-size:.9375rem; line-height:1.45;
}
.reponse--ok{ background:var(--ok-surface); color:var(--ok-encre) }
.reponse--erreur{ background:var(--err-surface); color:var(--err-encre) }

/* Les deux gestes d'une ligne de partenaire. Le conteneur existe pour qu'ils
   restent groupés quand la ligne passe à la ligne suivante. */
.actions{ display:flex; flex-wrap:wrap; gap:.5rem; align-items:center }

/* Un accès créé que personne n'a encore reçu : c'est la seule anomalie que cet
   écran doit faire remonter à l'œil, puisqu'elle se répare d'un clic juste à
   côté. Couleur et graisse, pas d'emoji — cf. le chevron des dossiers. */
.a-prevenir{ color:var(--err-encre); font-weight:600 }

/* ── Le journal ────────────────────────────────────────────────────────────
   Une ligne par consultation, l'heure en colonne fixe à gauche. Pas de relief
   sur ces lignes : c'est une lecture, pas une carte à actionner. */
.doc--journal{ box-shadow:none; padding:.625rem 1rem; margin-bottom:.25rem; justify-content:flex-start; gap:.875rem }
.doc--journal:hover{ box-shadow:none }
.journal-heure{ flex:0 0 3.25rem; font-variant-numeric:tabular-nums; font-size:.875rem; color:var(--muted) }
.doc--journal .doc-nom{ font-size:.9375rem }
.doc--journal .doc-nom strong{ font-weight:600 }
.doc--journal .doc-nom em{ font-style:normal; color:var(--teal-deep) }