/* ==========================================================================
   anesthia-shell.css — socle de style partagé (lot 10a)
   Généré par extraction des règles communes à >= 3 écrans.
   NE PAS dupliquer ces règles dans les fichiers HTML : toute divergence de
   style doit se déclarer localement, APRÈS le chargement de ce fichier.
   ========================================================================== */

:root{
  --amber: #b3752b;
  --amber-soft: #fbf1e2;
  --blue: #2f5f96;
  --blue-soft: #e6eef7;
  --card: #ffffff;
  --green: #2f7a3d;
  --green-soft: #e4f1e6;
  --grey: #8a9a95;
  --grey-soft: #eef2f0;
  --ink: #132422;
  --ink-soft: #4d635f;
  --line: #dbe4e1;
  --paper: #f6f4ee;
  --radius: 14px;
  --red: #a5342b;
  --red-soft: #f7e6e3;
  --shadow: 0 1px 2px rgba(19,36,34,0.05);
  --teal: #0f6e56;
  --teal-deep: #085041;
  --teal-soft: #e1f0ec;
  --u0: #e00000;
  --u1: #db5c43;
  --u12: #8fbf3f;
  --u24: #00a04a;
  --u3: #e59400;
  --u48: #0f95c9;
  --u6: #e4d000;
  --up: #8a9a95;
  --violet: #7a5ea6;
  --violet-soft: #efe9f6;
}

/* --- socle commun ------------------------------------------------------- */

*{box-sizing:border-box;}
body{margin:0; font-family:-apple-system,"Segoe UI",Inter,Helvetica,Arial,sans-serif; background:var(--paper); color:var(--ink); min-height:100vh;}
button{font-family:inherit;}
.appbar{background:var(--card); border-bottom:1px solid var(--line); display:flex; align-items:center; gap:16px; padding:0 26px; height:60px; position:sticky; top:0; z-index:30;}
.brand{display:flex; align-items:baseline; gap:9px;}
.brand .logo{font-size:18px; font-weight:700; letter-spacing:-0.02em; color:var(--teal-deep);}
.brand .logo b{color:var(--amber);}
.brand .tag{font-size:12px; color:var(--ink-soft);}
.appbar .spacer{flex:1;}
.role{display:flex; align-items:center; gap:10px; font-size:13px; color:var(--ink-soft); border:1px solid var(--line); border-radius:999px; padding:5px 6px 5px 14px; background:#fff;}
.role .who b{color:var(--ink);}
.crumb{font-size:12px; color:var(--ink-soft); margin-bottom:14px;}
.crumb a{color:var(--teal); cursor:pointer; text-decoration:none;}
.head-row{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:20px;}
h1{font-size:24px; font-weight:600; margin:0 0 4px; letter-spacing:-0.015em;}
.sub{font-size:14px; color:var(--ink-soft); margin:0; line-height:1.5;}
.btn{height:42px; border-radius:10px; border:1px solid var(--line); background:#fff; color:var(--ink); font-size:14px; font-weight:600; padding:0 18px; cursor:pointer; white-space:nowrap; display:inline-flex; align-items:center; gap:8px; transition:.15s;}
.btn:hover{border-color:var(--teal); color:var(--teal-deep);}
.btn.primary{background:var(--teal); border-color:var(--teal); color:#fff;}
.btn.primary:hover{background:var(--teal-deep);}
.btn.primary:disabled{background:#c7d3cf; border-color:#c7d3cf; cursor:not-allowed;}
.btn.ghost{background:transparent; border-color:transparent; color:var(--ink-soft);}
.btn.ghost:hover{color:var(--teal-deep); background:var(--grey-soft);}
.toolbar{display:flex; align-items:center; gap:14px; margin:2px 0 14px; flex-wrap:wrap;}
.toolbar .sp{flex:1;}
.tf{display:flex; align-items:center; gap:8px;}
.tf label{font-size:12px; color:var(--ink-soft); font-weight:600;}
.filters{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px;}
.chip{border:1px solid var(--line); background:#fff; border-radius:999px; height:32px; padding:0 14px; font-size:13px; color:var(--ink-soft); cursor:pointer; display:inline-flex; align-items:center; gap:7px;}
.chip.active{background:var(--teal-deep); border-color:var(--teal-deep); color:#fff;}
.chip .n{font-size:11px; opacity:.75;}
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden;}
table{width:100%; border-collapse:collapse; font-size:14px;}
thead th{text-align:left; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft); padding:13px 16px; border-bottom:1px solid var(--line); background:#fbfbf8;}
tbody td{padding:14px 16px; border-bottom:1px solid var(--line); vertical-align:middle;}
tbody tr:last-child td{border-bottom:none;}
tbody tr{cursor:pointer;}
tbody tr:hover{background:#fafaf6;}
.pt-name{font-weight:600;}
.pt-meta{font-size:12px; color:var(--ink-soft);}
.interv .lib{line-height:1.35;}
.interv .cat{font-size:12px; color:var(--ink-soft);}
.side-pill{font-size:11px; border:1px solid var(--line); border-radius:6px; padding:1px 6px; color:var(--ink-soft); margin-left:6px; white-space:nowrap;}
.empty{padding:48px 20px; text-align:center; color:var(--ink-soft); font-size:14px;}
.urg{font-size:12px; font-weight:600; display:inline-flex; align-items:center; gap:6px; white-space:nowrap;}
.urg::before{content:""; width:8px; height:8px; border-radius:50%;}
.urg.programme::before{background:var(--green);}
.urg.semi::before{background:var(--amber);}
.urg.urgent::before{background:var(--red);}
.urg.programme{color:var(--green);}
.urg.semi{color:var(--amber);}
.urg.urgent{color:var(--red);}
.st-wrap{display:flex; flex-direction:column; gap:3px;}
.status{font-size:12px; font-weight:600; border-radius:999px; padding:4px 11px; display:inline-block; white-space:nowrap; width:fit-content;}
.st-attente{background:var(--amber-soft); color:var(--amber);}
.st-reserve{background:#fff; color:var(--amber); border:1px solid var(--amber);}
.st-validee{background:var(--green-soft); color:var(--green);}
.st-recuse{background:var(--red-soft); color:var(--red);}
.st-sub{font-size:11.5px; color:var(--ink-soft); line-height:1.3; max-width:230px;}
/* Alerts */
  .al-wrap{display:flex; flex-direction:column; gap:4px; align-items:flex-start;}
.al{display:inline-flex; align-items:center; gap:4px; font-size:10.5px; font-weight:700; border-radius:6px; padding:2px 7px; white-space:nowrap; line-height:1.35; cursor:default;}
.al-critique{background:var(--red-soft); color:var(--red);}
.al-attention{background:var(--amber-soft); color:var(--amber);}
.al-info{background:var(--teal-soft); color:var(--teal-deep);}
/* Questionnaire cell */
  .qbadge{font-size:11.5px; font-weight:600; border-radius:999px; padding:3px 10px; display:inline-flex; align-items:center; gap:6px; white-space:nowrap; width:fit-content;}
.qbadge::before{content:""; width:7px; height:7px; border-radius:50%;}
.q-non{background:var(--grey-soft); color:var(--ink-soft);}
.q-non::before{background:var(--grey);}
.q-complete{background:var(--green-soft); color:var(--green);}
.q-complete::before{background:var(--green);}
/* ============ Drawer ============ */
  .overlay{position:fixed; inset:0; background:rgba(19,36,34,.32); opacity:0; pointer-events:none; transition:.2s; z-index:40;}
.overlay.show{opacity:1; pointer-events:auto;}
/* Lot 9a — le plafond de 1100px ramenait le tiroir à 57% d'une dalle 1920,
   en contradiction avec la règle « au moins 80% de l'écran ». Retiré : la
   largeur est désormais 82vw sur tous les écrans, avec un plancher pour les
   petites définitions (plancher de cadrage E1 : 1366x768). */
.drawer{position:fixed; top:0; right:0; height:100vh; width:82vw; min-width:min(620px,96vw); background:var(--card); border-left:1px solid var(--line); box-shadow:-8px 0 30px rgba(19,36,34,.12); transform:translateX(100%); transition:transform .24s cubic-bezier(.4,0,.2,1); z-index:50; display:flex; flex-direction:column;}
.drawer.show{transform:translateX(0);}
.drawer-head{padding:20px 22px; border-bottom:1px solid var(--line); display:flex; align-items:flex-start; gap:12px;}
.drawer-head .x{margin-left:auto; border:none; background:var(--grey-soft); width:32px; height:32px; border-radius:8px; cursor:pointer; font-size:16px; color:var(--ink-soft); flex-shrink:0;}
.drawer-head h2{font-size:19px; margin:0 0 2px; font-weight:600;}
.drawer-head .dh-meta{font-size:12.5px; color:var(--ink-soft);}
.dblock{padding:16px 0; border-bottom:1px solid var(--line);}
.dblock:last-child{border-bottom:none;}
.drow{display:flex; justify-content:space-between; gap:14px; padding:4px 0; font-size:13.5px;}
.drow .k{color:var(--ink-soft);}
.drow .v.muted{font-weight:400; color:var(--grey);}
.status-hint{font-size:11.5px; color:var(--ink-soft); margin-top:7px; line-height:1.45;}
/* Alerts in drawer */
  .alert-row{display:flex; gap:11px; align-items:flex-start; padding:10px 12px; border-radius:9px; margin-bottom:8px; border:1px solid var(--line); border-left-width:3px;}
.alert-row.sev-critique{border-left-color:var(--red); background:var(--red-soft);}
.alert-row.sev-attention{border-left-color:var(--amber); background:var(--amber-soft);}
.alert-row.sev-info{border-left-color:var(--teal); background:var(--teal-soft);}
.alert-ic{font-size:16px; line-height:1.2;}
.alert-main{flex:1;}
.alert-main .t{font-weight:700; font-size:13.5px;}
.alert-main .d{font-size:12px; color:var(--ink); opacity:.85; margin-top:2px; line-height:1.4;}
.alert-src{font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-soft); background:#fff; border-radius:5px; padding:2px 7px; margin-top:6px; display:inline-block;}
.atc{display:inline-flex; align-items:center; gap:5px; font-size:12px; background:var(--grey-soft); border-radius:7px; padding:3px 9px; margin:0 5px 5px 0;}
.atc.crit{background:var(--red-soft); color:var(--red); font-weight:600;}
.atc.warn{background:var(--amber-soft); color:var(--amber); font-weight:600;}
.atc-none{font-size:12.5px; color:var(--green); font-weight:600;}
.dbtn{height:38px; border-radius:9px; border:1px solid var(--line); background:#fff; color:var(--ink); font-size:13px; font-weight:600; padding:0 14px; cursor:pointer; display:inline-flex; align-items:center; gap:7px; transition:.14s; font-family:inherit;}
.dbtn:hover{border-color:var(--teal); color:var(--teal-deep);}
.dbtn.primary{background:var(--teal); border-color:var(--teal); color:#fff;}
.dbtn.primary:hover{background:var(--teal-deep);}
.dbtn.sm{height:30px; padding:0 11px; font-size:12px;}
.dact{display:flex; gap:8px; flex-wrap:wrap; margin-top:12px;}
.decision-box.validee{background:var(--green-soft);}
.decision-box.recuse{background:var(--red-soft);}
.decision-box.validee .dtitle{color:var(--green);}
.decision-box.recuse .dtitle{color:var(--red);}
.hidden{display:none !important;}
/* ---- Fenêtre modale : LA BASE, ajoutée au lot 37 --------------------------
   Le socle ne portait que `.modal.show` et `.modal-head` / `.modal-body` : la
   règle de base `.modal` — position, largeur, ombre — était redéclarée dans
   chacun des quatre écrans qui l'utilisent. Conséquence constatée en écrivant
   le premier écran neuf branché d'emblée sur le socle : sa fenêtre de saisie
   s'affichait DANS LE FLUX de la page, au bas du document, au lieu d'être
   centrée. Rien ne signalait le manque — `.show` existait, `.modal-head`
   existait, tout donnait l'impression d'un socle complet.
   C'est précisément le mécanisme décrit par la demande 63 : un socle
   incomplet est plus dangereux qu'un socle absent, parce qu'on croit pouvoir
   s'y appuyer. Les quatre écrans existants gardent leur déclaration locale,
   qui l'emporte par ordre de source ; elle disparaîtra à leur passage au
   socle. */
.modal-ov{position:fixed; inset:0; background:rgba(19,36,34,.34); opacity:0;
  pointer-events:none; transition:.18s; z-index:60;}
.modal{position:fixed; top:50%; left:50%; transform:translate(-50%,-46%);
  width:420px; max-width:92vw; background:var(--card); border-radius:16px;
  box-shadow:0 20px 60px rgba(19,36,34,.28); z-index:61; opacity:0;
  pointer-events:none; transition:.18s;}
.modal-ov.show{opacity:1; pointer-events:auto;}
.modal.show{opacity:1; pointer-events:auto; transform:translate(-50%,-50%);}
.modal-head{display:flex; align-items:flex-start; gap:12px; padding:18px 20px 14px; border-bottom:1px solid var(--line);}
.modal-head .mh-t{font-size:16px; font-weight:600;}
.modal-head .mh-s{font-size:12.5px; color:var(--ink-soft); margin-top:2px;}
.modal-head .x{margin-left:auto; border:none; background:var(--grey-soft); width:30px; height:30px; border-radius:8px; cursor:pointer; font-size:15px; color:var(--ink-soft); flex-shrink:0;}
.modal-body{padding:18px 20px 20px;}

/* ---- Fenêtre de SAISIE (demande 106) --------------------------------------
   .modal seul n'a ni marge intérieure, ni hauteur maximale, ni défilement : il
   a été taillé pour la petite fenêtre de créneau, dont le contenu tient
   toujours et qui porte ses marges dans .modal-head / .modal-body. Un
   formulaire de douze champs déversé directement dans .modal se collait aux
   bords et débordait de l'écran par le haut ET par le bas — emportant le titre
   et le bouton Enregistrer, sans possibilité de défiler.
   La variante .form lui donne une largeur de formulaire, un corps qui défile
   seul, et un pied de fenêtre qui reste visible quoi qu'il arrive : le bouton
   d'enregistrement ne peut plus sortir de l'écran. */
.modal.form{width:min(720px,94vw); max-height:86vh; display:flex; flex-direction:column;}
.modal.form .modal-head{flex:0 0 auto;}
.modal.form .modal-body{flex:1 1 auto; overflow:auto; min-height:0;}
.modal.form .modal-foot{flex:0 0 auto; display:flex; gap:9px; justify-content:flex-end;
  padding:13px 20px; border-top:1px solid var(--line); background:var(--card);
  border-radius:0 0 16px 16px;}
/* Trois champs sur une ligne : Spécialité · Nom · Coordonnées, ou Nom · Lien ·
   Téléphone. .row2 n'a que deux colonnes — trois champs y repassaient à la
   ligne en désordre. */
.modal.form .row3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px;}
.modal.form .field:last-child{margin-bottom:0;}
.modal.form .fgroup{font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:.04em; color:var(--ink-soft); margin:16px 0 8px;}
.modal.form .fgroup:first-child{margin-top:0;}
@media (max-width:700px){ .modal.form .row3{grid-template-columns:1fr;} }

.dbtn.danger{color:var(--red); border-color:var(--red-soft);}
.dbtn.danger:hover{background:var(--red-soft); border-color:var(--red);}
/* Login */
  .login-card{max-width:460px; margin:8vh auto 0; background:var(--card); border:1px solid var(--line); border-radius:16px; box-shadow:0 10px 40px rgba(19,36,34,.08); padding:34px 32px;}
.login-logo{font-size:22px; font-weight:700; color:var(--teal-deep); margin-bottom:18px;}
.login-logo b{color:var(--amber);}
.login-card h1{font-size:21px; margin:0 0 4px;}
.login-btn{display:flex; align-items:center; gap:14px; width:100%; text-align:left; border:1px solid var(--line); background:#fff; border-radius:12px; padding:13px 16px; cursor:pointer; font-family:inherit; font-size:15px; font-weight:600; color:var(--ink); transition:.14s;}
.login-btn:hover{border-color:var(--teal); background:var(--teal-soft); color:var(--teal-deep);}
.login-btn .av{width:38px; height:38px; border-radius:50%; background:var(--teal-soft); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; flex-shrink:0;}
.login-btn .nm{flex:1;}
.login-btn .arr{color:var(--grey);}
.login-note{font-size:12px; color:var(--ink-soft); margin:14px 0 0;}
.login-user{display:flex; align-items:center; gap:12px; background:var(--teal-soft); border-radius:10px; padding:12px 14px; margin-bottom:16px; font-size:15px;}
.login-user .av{width:34px; height:34px; border-radius:50%; background:#fff; color:var(--teal-deep); display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700;}
.login-field{margin-bottom:14px;}
.login-field label{display:block; font-size:12.5px; color:var(--ink-soft); margin-bottom:6px;}
.login-field input{width:100%; border:1px solid var(--line); border-radius:9px; height:42px; padding:0 12px; font-family:inherit; font-size:14px;}
.login-field input:focus{outline:none; border-color:var(--teal); box-shadow:0 0 0 3px var(--teal-soft);}
.login-2fa{font-size:12px; color:var(--ink-soft); background:var(--grey-soft); border-radius:9px; padding:10px 12px; margin-bottom:16px; line-height:1.5;}
#toast{position:fixed; left:50%; bottom:26px; transform:translateX(-50%) translateY(20px); background:#132422; color:#fff; padding:12px 20px; border-radius:10px; font-size:13.5px; box-shadow:0 8px 24px rgba(19,36,34,.25); opacity:0; pointer-events:none; transition:.25s; z-index:90;}
#toast.show{opacity:1; transform:translateX(-50%) translateY(0);}
/* ---- Champs de saisie : LA BASE, ajoutée au lot 37 ------------------------
   Même manque que pour `.modal`, et découvert de la même façon. Le socle ne
   portait que les états `:focus` des champs — leurs règles de base étaient
   redéclarées dans les onze écrans qui s'en servent. Le premier écran neuf
   branché d'emblée sur le socle affichait donc des champs nus : largeur
   naturelle, sans hauteur, sans bordure.
   Vérifié avant l'ajout : les DIX écrans qui utilisent `.field` le déclarent
   tous localement, et leur déclaration l'emporte par ordre de source (le
   <style> local vient après le <link>). Aucun d'eux ne change d'apparence.
   Règles reprises telles quelles de AnesthIA_Secretariat.html, écran de
   référence du modèle E1. Un pas de la demande 63, fait là où il ne coûte
   rien : sur un écran neuf, pas en refondant les dix autres. */
.field{margin-bottom:15px;}
.field label{display:block; font-size:12.5px; color:var(--ink-soft);
  margin-bottom:6px; font-weight:500;}
.field label .opt{color:var(--grey); font-weight:400;}
.field input, .field select, .field textarea{width:100%; border-radius:9px;
  border:1px solid var(--line); padding:0 12px; height:42px; font-size:14px;
  font-family:inherit; background:#fff; color:var(--ink);}
.field textarea{height:auto; padding:10px 12px; resize:vertical;
  min-height:60px; line-height:1.5;}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.row3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:14px;}
@media (max-width:700px){
  .row2, .row3{grid-template-columns:1fr;}
}
.field input:focus, .field select:focus, .field textarea:focus{outline:none; border-color:var(--teal); box-shadow:0 0 0 3px var(--teal-soft);}
.spacer{flex:1;}
.ac-item:last-child{border-bottom:none;}
.ac-item:hover, .ac-item.hl{background:var(--teal-soft);}
.logo b{color:var(--amber);}
.field input:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-soft);}
.btn:hover{background:var(--teal-deep);}
.hidden{display:none!important;}

/* ==========================================================================
   TIROIR À ONGLETS — modèle E1 (mutualisé au lot 9a, demande 63)
   Ces règles vivaient dans AnesthIA_Urgentiste.html. Elles sont remontées ici
   sans changement de valeur, pour que tout écran passant en shell E1 les
   hérite au lieu de les recopier. Structure attendue du tiroir :
     .drawer > .drawer-head ( h2#dName + .dh-meta#dMeta + #dAlerts )
             > .dtabs#dTabs
             > .drawer-body#drawerBody
   ========================================================================== */

.drawer-body{padding:8px 22px 26px; overflow-y:auto; flex:1;}
.dblock h4{font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft); margin:0 0 10px;}

/* Barre d'onglets du tiroir */
/* ⚠️ ONGLETS DU TIROIR — ALIGNÉS SUR LE PRODUIT DÉPLOYÉ, 22/09.
   Le socle portait un soulignement ; l'espace ANESTHÉSISTE, qui est la référence
   de forme de la fenêtre patient (règle 173, mesurée le 16/09), porte des
   PASTILLES PLEINES — et le bloc et l'urgentiste aussi, chacun avec sa propre
   copie de la règle. Le socle était donc le seul à dire autre chose que ses trois
   plus gros consommateurs : sur huit onglets, un simple trait sous le libellé ne
   distingue presque pas l'onglet ouvert.
   ⚠️ PORTÉE MESURÉE AVANT D'Y TOUCHER : cinq écrans portent `.dtabs`, TROIS
   redéfinissent la règle chez eux (anesthésiste, bloc, urgentiste) et ne sont donc
   pas concernés. Restent DEUX écrans servis par le socle : le SECRÉTARIAT et les
   interfaces inter-services. Le secrétariat change donc d'aspect — et il devient
   identique à l'anesthésiste, ce que la règle 172 demande. *La référence de forme
   est le produit déployé, pas une valeur décidée en séance.* */
.dtabs{display:flex; gap:5px; padding:10px 22px; border-bottom:1px solid var(--line); background:#fbfbf8; flex-wrap:wrap;}
/* ⚠️ RESPIRATION SYMÉTRIQUE. La règle précédente posait 0 en haut et 9 px en bas :
   les pastilles touchaient le bandeau d'identité et flottaient au-dessus du trait.
   Un onglet collé à ce qui le précède se lit comme la suite du bloc du dessus.
   Les MÉTRIQUES DE LA PASTILLE sont celles du produit déployé, au pixel — 5/13 px
   et 12 px de texte, relevées dans l'espace anesthésiste. On ne dessine pas une
   troisième taille pour le même composant. */
.dtab{border:1px solid var(--line); background:#fff; color:var(--ink-soft); border-radius:999px; padding:5px 13px; font:600 12px inherit; cursor:pointer; white-space:nowrap; display:inline-flex; align-items:center; gap:6px; font-family:inherit;}
.dtab:hover{background:var(--grey-soft); color:var(--teal-deep);}
.dtab.on{background:var(--teal); border-color:var(--teal); color:#fff;}
.dtab .b{font-size:10.5px; background:var(--red); color:#fff; border-radius:999px; padding:0 6px; min-width:16px; text-align:center; line-height:16px;}

/* Bandeau d'alerte permanent — allergies NOMMÉES, jamais un décompte.
   Reste visible quel que soit l'onglet : rien de critique ne dépend d'un clic. */
.synth-alertbar{display:flex; flex-wrap:wrap; gap:10px; align-items:center; padding:7px 10px; background:#fff; border:1px solid var(--line); border-left:3px solid var(--red); border-radius:9px; margin-bottom:8px;}
.synth-alertbar.ok{border-left-color:var(--green); background:var(--green-soft);}
.synth-alertbar.ok .sab-none{color:var(--green); font-weight:600;}
.synth-alertbar .sab-none{font-size:11.5px; color:var(--ink-soft);}
.synth-alertbar .sab-grp{display:flex; flex-wrap:wrap; gap:4px; align-items:center;}
.synth-alertbar .sab-lbl{font-size:9.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft); margin-right:2px;}
.synth-alertbar .sab-chip{border-radius:999px; padding:2px 9px; font-size:11px; font-weight:600; background:var(--grey-soft); color:var(--ink);}
.synth-alertbar .sab-chip.crit{background:var(--red-soft); color:var(--red);}
.synth-alertbar .sab-chip.warn{background:var(--amber-soft); color:var(--amber);}
#dAlerts .synth-alertbar{margin-bottom:0; padding:6px 8px; margin-top:8px;}

/* Sous-onglets d'un onglet chargé */
.synth-subtabs{display:flex; flex-wrap:wrap; gap:4px; margin-bottom:9px; border-bottom:1px solid var(--line); padding-bottom:6px;}
.synth-subtabs .sst{border:1px solid var(--line); background:#fff; color:var(--ink-soft); border-radius:999px; padding:4px 11px; font:600 11.5px inherit; cursor:pointer; white-space:nowrap;}
.synth-subtabs .sst:hover{background:var(--grey-soft);}
.synth-subtabs .sst.active{background:var(--teal); border-color:var(--teal); color:#fff;}
.synth-zone{overflow-y:auto;}

/* Onglet chargé : deux colonnes plutôt qu'un défilement (lot 9a, demande 35a).
   Chaque bloc reste insécable ; la bordure basse devient une bordure de
   séparation verticale pour ne pas dessiner de traits qui s'arrêtent au milieu. */
.drawer-body.two-col{display:grid; grid-template-columns:1fr 1fr; gap:4px 34px; align-content:start;}
/* Pas de bordure basse en grille : un trait qui s'arrête au milieu de la
   largeur se lit comme un défaut d'affichage. Les blocs sont séparés par un
   encadré léger, qui tient quelle que soit la colonne. */
.drawer-body.two-col .dblock{border-bottom:none; break-inside:avoid; background:#fdfdfb; border:1px solid var(--line); border-radius:10px; padding:14px 16px; margin-bottom:10px;}
@media (max-width:1100px){
  .drawer-body.two-col{grid-template-columns:1fr;}
}

/* La largeur de contenu (.wrap) et l'en-tête de liste collant vivent dans
   anesthia-layout.css : ces deux règles doivent valoir sur les onze écrans,
   or le socle n'est branché que sur quatre d'entre eux. Ne pas les remettre
   ici, sous peine d'avoir deux sources qui divergent. */