/* Bioteris Réseau (05/10) : pensé pour le téléphone d'abord. Aucune ressource extérieure (polices du système). */
:root { --encre:#071b17; --vert:#2b5746; --vert-clair:#e3ece6; --signal:#dbb55e; --fond:#f9f7f3; --carte:#fff; --texte:#10241e;
  --gris:#5d6963; --bord:#dbdcd3; --rouge:#ab4238; --rouge-fond:#fbe3e1; --orange:#9a5b00; --orange-fond:#fff4e0; --ok:#1d5a3a; --ok-fond:#dcf1e4; }
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; font:16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; background:var(--fond); color:var(--texte); }
a { color:var(--vert); }
.haut { background:var(--encre); color:#fff; padding:.7rem 1rem; display:flex; flex-wrap:wrap; gap:.6rem 1.2rem; align-items:center; }
.marque { color:#fff; text-decoration:none; font-weight:700; letter-spacing:.02em; }
.marque span { color:var(--signal); font-weight:600; }
.menu { display:flex; flex-wrap:wrap; gap:.2rem .9rem; align-items:center; font-size:.95rem; }
.menu a { color:#dfe6e1; text-decoration:none; padding:.2rem 0; }
.menu a.actif { color:#fff; box-shadow:inset 0 -2px 0 var(--signal); }
.deconnexion { margin:0; }
button.lien { background:none; border:0; color:#dfe6e1; padding:0; font:inherit; text-decoration:underline; cursor:pointer; }
main { max-width:46rem; margin:0 auto; padding:1rem; }
h1 { font-size:1.4rem; margin:.6rem 0 1rem; }
h2 { font-size:1.08rem; margin:0 0 .5rem; }
.carte { background:var(--carte); border:1px solid var(--bord); border-radius:10px; padding:1rem; margin:0 0 1rem; }
.etroite { max-width:28rem; margin:1.5rem auto; }
label { display:flex; flex-direction:column; gap:.25rem; margin:0 0 .8rem; font-size:.92rem; font-weight:500; }
label.case { flex-direction:row; align-items:flex-start; gap:.5rem; font-weight:400; }
input, textarea, select { font:inherit; padding:.6rem .7rem; border:1px solid var(--bord); border-radius:8px; background:#fff; width:100%; }
input[type=checkbox] { width:auto; margin-top:.25rem; }
input[type=file] { padding:.4rem; }
input.code { font-size:1.4rem; letter-spacing:.2em; text-align:center; }
button, .bouton { font:inherit; font-weight:600; padding:.7rem 1rem; border:0; border-radius:8px; background:var(--vert); color:#fff; cursor:pointer;
  text-decoration:none; display:inline-block; min-height:2.75rem; }
button.secondaire, .bouton.secondaire { background:#fff; color:var(--vert); border:1px solid var(--vert); }
.discret { color:var(--gris); font-size:.88rem; font-weight:400; }
.erreur { background:var(--rouge-fond); color:var(--rouge); padding:.6rem .8rem; border-radius:8px; }
.ok { background:var(--ok-fond); color:var(--ok); padding:.6rem .8rem; border-radius:8px; }
.info { background:var(--orange-fond); color:var(--orange); padding:.6rem .8rem; border-radius:8px; }
.deux { display:grid; grid-template-columns:1fr; gap:0 .8rem; }
@media (min-width:36rem) { .deux { grid-template-columns:1fr 1fr; } }
fieldset { border:1px solid var(--bord); border-radius:8px; margin:0 0 .8rem; padding:.6rem .8rem; }
legend { font-size:.92rem; font-weight:500; padding:0 .3rem; }
.choix { display:grid; grid-template-columns:1fr; gap:.1rem .8rem; }
@media (min-width:36rem) { .choix { grid-template-columns:1fr 1fr; } }
.choix label.case { margin:0 0 .35rem; }
.etapes { padding-left:1.2rem; }
.etapes li { margin:0 0 .7rem; }
.qr { background:#fff; padding:.5rem; display:inline-block; margin:.5rem 0; }
.qr svg { width:200px; height:200px; display:block; }
code.cle { font-size:1rem; word-break:break-all; }
ol.codes { columns:2; font-size:1.05rem; }
.actions { display:flex; flex-wrap:wrap; gap:.6rem; }
.etat { display:inline-block; padding:.05rem .5rem; border-radius:999px; font-size:.85rem; font-weight:600; }
.etat-valide { background:var(--ok-fond); color:var(--ok); }
.etat-bientot, .etat-a_verifier { background:var(--orange-fond); color:var(--orange); }
.etat-manquante, .etat-refusee, .etat-expiree { background:var(--rouge-fond); color:var(--rouge); }
ul.a-faire { padding-left:1.1rem; }
ul.a-faire li { margin:.3rem 0; }
ul.a-faire li.fait { color:var(--gris); text-decoration:line-through; }
form.ligne { display:flex; flex-wrap:wrap; gap:.6rem; align-items:flex-end; }
form.ligne label { flex:1; min-width:12rem; margin:0; }
.depot { border-top:1px solid var(--bord); padding-top:.8rem; margin-top:.6rem; }
blockquote.message { border-left:3px solid var(--signal); margin:0 0 1rem; padding:.3rem .8rem; color:var(--gris); white-space:pre-line; }
.texte-long h2 { margin-top:1rem; }
.charte { white-space:pre-line; }
.bas { text-align:center; color:var(--gris); font-size:.8rem; padding:1.5rem 1rem 2rem; }
[hidden] { display:none !important; }
details.nouvelle-version > summary { cursor:pointer; color:var(--vert); font-weight:600; padding:.4rem 0; }
