/* =========================================================
   Officine — feuille de style unique
   Thème clair et sombre pilotés par variables.
   ========================================================= */

:root {
  --ground: #F5F8F6;
  --surface: #FFFFFF;
  --sunk: #EDF1EF;
  --line: #D9E1DD;
  --line-soft: #E7ECE9;
  --ink: #12211E;
  --ink-mid: #46574F;
  --ink-soft: #6D7E77;
  --accent: #0F6B57;
  --accent-fort: #0B5745;
  --accent-doux: #E2EFEA;
  --alerte: #9E3B2E;
  --alerte-doux: #F7E7E4;
  --attention: #A9711A;
  --attention-doux: #F8EEDA;
  --ombre: 0 1px 2px rgba(18,33,30,.05), 0 8px 24px -18px rgba(18,33,30,.25);
  --rayon: 4px;
  --police: "Public Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ground: #0C1412;
    --surface: #121C19;
    --sunk: #17211E;
    --line: #27332F;
    --line-soft: #1E2926;
    --ink: #E7EFEB;
    --ink-mid: #A9BAB3;
    --ink-soft: #7F918A;
    --accent: #58C1A2;
    --accent-fort: #7BD4BA;
    --accent-doux: #16302A;
    --alerte: #E08878;
    --alerte-doux: #2E1B17;
    --attention: #DCA94C;
    --attention-doux: #2C2416;
    --ombre: 0 1px 2px rgba(0,0,0,.3), 0 12px 32px -22px rgba(0,0,0,.9);
  }
}

* { box-sizing: border-box; }

html, body { height: 100%; }

body {
  margin: 0;
  background: var(--ground);
  color: var(--ink);
  font-family: var(--police);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  display: flex;
  flex-direction: column;
}

h1, h2, h3 { margin: 0; letter-spacing: -.015em; text-wrap: balance; }
p { margin: 0; }
a { color: var(--accent); text-underline-offset: 2px; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 2px; }

.txt-doux { color: var(--ink-soft); }
.txt-mono { font-family: var(--mono); font-size: 12.5px; color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.txt-alerte { color: var(--alerte); }
.petit { font-size: 13px; }
.num { text-align: right; }
.vide { color: var(--ink-soft); font-size: 14.5px; padding: 14px 0; }

/* ---------- Bandeau ---------- */

.bandeau {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  background: var(--attention-doux);
  border-bottom: 1px solid var(--line);
  padding: 10px 20px;
  font-size: 14px;
  color: var(--ink-mid);
}
.bandeau strong { color: var(--ink); }
.bandeau button { margin-left: auto; }

/* ---------- En-tête ---------- */

.entete {
  display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
  padding: 12px 20px;
  background: var(--surface);
  border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 20;
}

.marque { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); }
.marque-signe {
  width: 30px; height: 30px; border-radius: 3px;
  background: var(--accent); color: #fff;
  display: grid; place-items: center;
  font-weight: 700; font-size: 16px;
}
.marque-texte { font-weight: 700; letter-spacing: -.02em; font-size: 17px; }

.nav { display: flex; gap: 4px; flex-wrap: wrap; }
.nav a {
  padding: 6px 12px; border-radius: 3px;
  color: var(--ink-mid); text-decoration: none;
  font-size: 14.5px; font-weight: 500;
}
.nav a:hover { background: var(--sunk); color: var(--ink); }
.nav a.actif { background: var(--accent-doux); color: var(--accent-fort); }

.entete-droite { margin-left: auto; display: flex; gap: 8px; align-items: center; }

body[data-espace="pro"] .marque-signe { background: var(--ink); }

/* ---------- Structure ---------- */

.vue { flex: 1; width: 100%; max-width: 1180px; margin: 0 auto; padding: 24px 20px 60px; }

.bloc { margin-bottom: 34px; }
.bloc.etroit { max-width: 620px; }
.bloc-tete {
  display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap;
  border-bottom: 1px solid var(--line);
  padding-bottom: 8px; margin-bottom: 16px;
}
.bloc-tete h2 { font-size: 20px; font-weight: 600; margin-right: auto; }
.bloc-tete > *:last-child { margin-left: auto; }

.pied {
  display: flex; gap: 16px; align-items: center; flex-wrap: wrap;
  padding: 14px 20px;
  border-top: 1px solid var(--line);
  background: var(--surface);
}

.etat-reseau { font-family: var(--mono); font-size: 12px; padding: 3px 9px; border-radius: 999px; }
.etat-reseau.en-ligne { background: var(--accent-doux); color: var(--accent-fort); }
.etat-reseau.hors-ligne { background: var(--attention-doux); color: var(--attention); }

/* ---------- Boutons ---------- */

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 9px 16px;
  border: 1px solid var(--line);
  border-radius: 3px;
  background: var(--surface);
  color: var(--ink);
  font: inherit; font-size: 14.5px; font-weight: 500;
  cursor: pointer; text-decoration: none;
  transition: background .12s ease, border-color .12s ease;
}
.btn:hover { background: var(--sunk); }
.btn.primaire { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn.primaire:hover { background: var(--accent-fort); border-color: var(--accent-fort); }
.btn.fantome { background: transparent; }
.btn.danger { color: var(--alerte); border-color: var(--alerte); background: transparent; }
.btn.danger:hover { background: var(--alerte-doux); }
.btn.petit { padding: 5px 11px; font-size: 13.5px; }
.btn.pleine { width: 100%; margin-top: 8px; }
.btn.carre { padding: 2px 10px; font-size: 16px; line-height: 1.4; }
.btn[disabled] { opacity: .45; cursor: not-allowed; }
.btn.fichier { position: relative; }

/* ---------- Accueil patient ---------- */

.hero { padding: 26px 0 38px; }
.sur-titre {
  font-family: var(--mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .14em; color: var(--ink-soft); margin-bottom: 10px;
}
.hero h1 { font-size: clamp(30px, 5.2vw, 46px); font-weight: 700; line-height: 1.08; margin-bottom: 22px; }

.barre-recherche { display: flex; gap: 8px; max-width: 560px; }
.barre-recherche.large { max-width: 100%; margin-bottom: 20px; }
.barre-recherche input {
  flex: 1; padding: 12px 14px;
  border: 1px solid var(--line); border-radius: 3px;
  background: var(--surface); color: var(--ink);
  font: inherit; font-size: 16px;
}
.hero .txt-doux { margin-top: 10px; }

/* ---------- Cartes officines ---------- */

.grille-ph { display: grid; grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); gap: 14px; }

.carte-ph {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--rayon); padding: 16px 18px;
  box-shadow: var(--ombre);
  display: flex; flex-direction: column; gap: 8px;
}
.carte-ph-tete { display: flex; align-items: start; gap: 10px; }
.carte-ph-tete h3 { font-size: 16.5px; font-weight: 600; flex: 1; }
.carte-ph-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }

.ligne-garde {
  font-size: 13.5px; color: var(--accent-fort);
  background: var(--accent-doux); border-radius: 2px; padding: 5px 9px;
}
.ligne-statut { font-size: 13.5px; border-radius: 2px; padding: 5px 9px; }
.ligne-statut.constate { background: var(--accent-doux); color: var(--accent-fort); font-weight: 500; }
.ligne-statut.declare { background: var(--sunk); color: var(--ink-soft); }

.puce {
  font-family: var(--mono); font-size: 11.5px; padding: 2px 8px;
  border-radius: 999px; white-space: nowrap;
  background: var(--sunk); color: var(--ink-mid);
}
.puce.ok { background: var(--accent-doux); color: var(--accent-fort); }
.puce.bas { background: var(--attention-doux); color: var(--attention); }
.puce.rupture { background: var(--alerte-doux); color: var(--alerte); }
.puce.neutre { background: var(--sunk); color: var(--ink-soft); }

.resultat { margin-bottom: 26px; }
.resultat-tete { display: flex; align-items: baseline; gap: 12px; margin-bottom: 10px; }
.resultat-tete h3 { font-size: 17px; font-weight: 600; }
.resultat-tete > *:last-child { margin-left: auto; }

.encart {
  background: var(--sunk); border: 1px solid var(--line-soft);
  border-radius: var(--rayon); padding: 16px 18px; margin-bottom: 16px;
}
.encart h3 { font-size: 16px; font-weight: 600; margin-bottom: 4px; }

.filtres { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.filtres input, .filtres select {
  padding: 9px 12px; border: 1px solid var(--line); border-radius: 3px;
  background: var(--surface); color: var(--ink); font: inherit; font-size: 14.5px;
}
.filtres input { flex: 1; min-width: 200px; }

/* ---------- Tableaux ---------- */

.table-defile { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; }
.table-donnees { min-width: 640px; font-size: 14.5px; }
th, td { text-align: left; padding: 10px 14px 10px 0; border-bottom: 1px solid var(--line-soft); vertical-align: top; }
th {
  font-family: var(--mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .1em; color: var(--ink-soft); font-weight: 500;
  border-bottom: 1px solid var(--line);
}
td { color: var(--ink-mid); }
td strong { color: var(--ink); font-weight: 600; }

/* ---------- Comptoir ---------- */

.comptoir { display: grid; grid-template-columns: 1fr 340px; gap: 24px; align-items: start; }
.comptoir-droite {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--rayon); padding: 16px 18px 18px;
  box-shadow: var(--ombre); position: sticky; top: 78px;
}

.champ-gros {
  width: 100%; padding: 13px 15px; font-size: 17px;
  border: 1px solid var(--line); border-radius: 3px;
  background: var(--surface); color: var(--ink); font-family: inherit;
  margin-bottom: 14px;
}

.liste-produits { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.produit {
  display: flex; flex-direction: column; gap: 3px; text-align: left;
  padding: 12px 14px; border: 1px solid var(--line); border-radius: 3px;
  background: var(--surface); color: var(--ink); font: inherit; cursor: pointer;
}
.produit:hover:not([disabled]) { border-color: var(--accent); background: var(--accent-doux); }
.produit[disabled] { opacity: .5; cursor: not-allowed; }
.produit-nom { font-weight: 600; font-size: 14.5px; }
.produit-meta { font-size: 12.5px; color: var(--ink-soft); }
.produit-stock { font-family: var(--mono); font-size: 11.5px; margin-top: 2px; }
.produit-stock.ok { color: var(--accent); }
.produit-stock.bas { color: var(--attention); }
.produit-stock.rupture { color: var(--alerte); }

.panier { display: flex; flex-direction: column; gap: 2px; margin-bottom: 10px; }
.panier-ligne {
  display: grid;
  grid-template-areas: "nom nom nom" "prix actions total";
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 4px 10px; align-items: center;
  padding: 9px 0; border-bottom: 1px solid var(--line-soft);
}
.panier-nom { grid-area: nom; font-size: 14.5px; font-weight: 500; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.panier-actions { grid-area: actions; display: flex; align-items: center; gap: 6px; }
.panier-total { grid-area: total; font-family: var(--mono); font-size: 13.5px; }

.prix-saisi { grid-area: prix; display: flex; flex-direction: row; align-items: center; gap: 5px; white-space: nowrap; }
.prix-saisi span { flex: none; }
.prix-saisi input {
  flex: none; width: 70px; padding: 3px 6px;
  border: 1px solid var(--line); border-radius: 3px;
  background: var(--surface); color: var(--ink);
  font-family: var(--mono); font-size: 13px; text-align: right;
  font-variant-numeric: tabular-nums;
}
.prix-saisi input:focus { border-color: var(--accent); }
.panier-ligne.sans-prix .prix-saisi input { border-color: var(--attention); background: var(--attention-doux); }

.total-ligne {
  display: flex; justify-content: space-between; align-items: baseline;
  padding-top: 12px; border-top: 2px solid var(--ink); margin-top: 6px;
}
.total-ligne strong { font-size: 22px; font-variant-numeric: tabular-nums; }

/* ---------- Formulaires ---------- */

.formulaire { display: flex; flex-direction: column; gap: 14px; }
.formulaire .paire { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
label { display: flex; flex-direction: column; gap: 5px; font-size: 14px; color: var(--ink-mid); }
label input, label select, label textarea {
  padding: 9px 12px; border: 1px solid var(--line); border-radius: 3px;
  background: var(--surface); color: var(--ink); font: inherit; font-size: 15px;
}
.formulaire button { align-self: flex-start; }
.actions-ligne { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }

.journal { margin-top: 22px; }
.journal h3 { font-size: 15px; font-weight: 600; margin-bottom: 6px; }
.journal ul { margin: 0; padding-left: 18px; }
.journal li { color: var(--ink-mid); }

/* ---------- Alertes ---------- */

.liste-alertes { list-style: none; margin: 0; padding: 0; }
.liste-alertes li {
  display: flex; justify-content: space-between; align-items: center; gap: 14px;
  padding: 11px 0; border-bottom: 1px solid var(--line-soft); font-size: 14.5px;
}

/* ---------- Caisse ---------- */

.chiffres { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; }
.chiffre {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--rayon); padding: 14px 16px;
  display: flex; flex-direction: column; gap: 2px;
}
.chiffre .label {
  font-family: var(--mono); font-size: 10.5px; text-transform: uppercase;
  letter-spacing: .12em; color: var(--ink-soft);
}
.chiffre strong { font-size: 22px; font-variant-numeric: tabular-nums; }

/* ---------- Modales ---------- */

.modale-fond {
  position: fixed; inset: 0; z-index: 60;
  background: rgba(10, 20, 18, .55);
  display: grid; place-items: center; padding: 20px;
}
.modale {
  background: var(--surface); border-radius: var(--rayon);
  border: 1px solid var(--line);
  width: min(460px, 100%); max-height: 90vh; overflow-y: auto;
  padding: 22px 24px;
  box-shadow: 0 24px 60px -20px rgba(0,0,0,.5);
}
.modale h3 { font-size: 18px; font-weight: 600; margin-bottom: 14px; }
.modale-corps { display: flex; flex-direction: column; gap: 13px; }
.modale-pied { display: flex; justify-content: flex-end; gap: 10px; margin-top: 20px; }
.total-modale { font-size: 30px; font-weight: 700; font-variant-numeric: tabular-nums; }

/* ---------- Notifications ---------- */

.toast {
  position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%) translateY(20px);
  background: var(--ink); color: var(--ground);
  padding: 11px 20px; border-radius: 3px;
  font-size: 14.5px; opacity: 0; pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
  z-index: 80; max-width: 90vw; text-align: center;
}
.toast.visible { opacity: 1; transform: translateX(-50%) translateY(0); }
.toast.alerte { background: var(--alerte); color: #fff; }

/* ---------- Ticket ---------- */

.zone-ticket { display: none; --ticket-largeur: 72mm; --ticket-police: 11px; }

@media print {
  @page { margin: 4mm; }
  body > *:not(.zone-ticket) { display: none !important; }
  .zone-ticket { display: block !important; }
  .ticket {
    width: var(--ticket-largeur);
    font-family: var(--mono);
    font-size: var(--ticket-police);
    color: #000;
    line-height: 1.35;
  }
  .ticket h3 { font-size: calc(var(--ticket-police) + 3px); text-align: center; margin-bottom: 2px; }
  .ticket p { text-align: center; font-size: calc(var(--ticket-police) - 1px); margin: 0; }
  .ticket hr { border: none; border-top: 1px dashed #000; margin: 6px 0; }
  .ticket table { width: 100%; border-collapse: collapse; }
  .ticket td { padding: 1px 0; border: none; font-size: var(--ticket-police); color: #000; text-align: left; }
  .ticket td.q { text-align: center; width: 28px; }
  .ticket td.p { text-align: right; white-space: nowrap; }
  .ticket .ticket-sous td {
    font-size: calc(var(--ticket-police) - 2px);
    padding-bottom: 3px;
  }
  .ticket-numero { font-weight: 700; font-size: var(--ticket-police) !important; letter-spacing: .04em; }
  .ticket-duplicata {
    font-weight: 700; letter-spacing: .2em;
    border: 1px solid #000; padding: 1px 0; margin: 4px 0 !important;
  }
  .ticket-mention { font-size: calc(var(--ticket-police) - 2px) !important; }
  .ticket-note { margin-top: 6px !important; font-size: calc(var(--ticket-police) - 1px) !important; }
  .ticket-pied { margin-top: 10px !important; font-size: calc(var(--ticket-police) - 1px) !important; }
}

/* ---------- Encaissement ---------- */

.modes {
  border: none; padding: 0; margin: 0 0 14px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px;
}
.modes legend { padding: 0; margin-bottom: 6px; }
.mode {
  display: block; text-align: center; cursor: pointer;
  border: 1px solid var(--line); border-radius: var(--rayon); padding: 8px 4px;
  font-size: 13px; transition: border-color .12s, background .12s;
}
.mode input { position: absolute; opacity: 0; pointer-events: none; }
.mode:has(input:checked) { border-color: var(--accent); background: var(--accent-doux); font-weight: 600; }
.mode:has(input:disabled) { opacity: .45; cursor: not-allowed; }
.coupures { display: flex; gap: 6px; flex-wrap: wrap; margin: 8px 0 4px; }
.rendu { font-size: 15px; font-weight: 600; margin: 6px 0 14px; }
.rendu.manque { color: var(--alerte); }
.liste-modes { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 4px; }
.liste-modes li {
  display: flex; justify-content: space-between; gap: 12px;
  padding: 6px 10px; background: var(--sunk); border-radius: var(--rayon); font-size: 13px;
}

/* ---------- Adaptation mobile ---------- */

@media (max-width: 900px) {
  .comptoir { grid-template-columns: 1fr; }
  .comptoir-droite { position: static; }
}

@media (max-width: 620px) {
  .entete { gap: 12px; padding: 10px 14px; }
  .entete-droite { width: 100%; margin-left: 0; }
  .nav { width: 100%; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 2px; }
  .nav a { white-space: nowrap; }
  .vue { padding: 18px 14px 50px; }
  .formulaire .paire { grid-template-columns: 1fr; }
  .barre-recherche { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}

/* =========================================================
   Ajouts version 2 — zone, ordonnance, rappels, fraîcheur
   ========================================================= */

.zone-choix { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 18px; }
.zone-champ { flex: 0 1 200px; }
.label-mini {
  font-family: var(--mono); font-size: 10.5px; text-transform: uppercase;
  letter-spacing: .12em; color: var(--ink-soft);
}
.zone-champ select {
  width: 100%; padding: 9px 12px; border: 1px solid var(--line); border-radius: 3px;
  background: var(--surface); color: var(--ink); font: inherit; font-size: 15px;
}

.raccourcis { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 12px; margin: 22px 0 14px; }
.raccourci {
  display: flex; flex-direction: column; gap: 3px;
  padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--rayon);
  background: var(--surface); text-decoration: none; color: var(--ink);
  box-shadow: var(--ombre);
}
.raccourci:hover { border-color: var(--accent); background: var(--accent-doux); }
.raccourci strong { font-size: 15.5px; font-weight: 600; }
.raccourci span { font-size: 13.5px; color: var(--ink-soft); }

.lede-p { font-size: 15px; color: var(--ink-mid); max-width: 68ch; margin-bottom: 16px; }

/* Fraîcheur de l'information — le cœur de la confiance. */
.ligne-statut.frais { background: var(--sunk); color: var(--ink-mid); }
.ligne-statut.ancien { background: var(--attention-doux); color: var(--attention); }
.ligne-statut.conteste { background: var(--alerte-doux); color: var(--alerte); }

.encart.equivalent { border-left: 3px solid var(--accent); }
.encart.couverture { border-left: 3px solid var(--attention); }

.etiquettes { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 18px; }
.etiquette {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--accent-doux); color: var(--accent-fort);
  border-radius: 999px; padding: 5px 8px 5px 13px; font-size: 14px;
}
.etiquette button {
  border: none; background: none; color: inherit; cursor: pointer;
  font-size: 17px; line-height: 1; padding: 0 3px;
}

.mini-liste { list-style: none; margin: 8px 0 0; padding: 0; font-size: 13.5px; }
.mini-liste li { padding: 2px 0; color: var(--ink-mid); }
.mini-liste li.manquant { color: var(--ink-soft); text-decoration: line-through; }

.liste-rappels { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }
.rappel {
  display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--rayon); padding: 14px 16px;
}
.rappel.inactif { opacity: .55; }
.rappel-actions { display: flex; gap: 8px; }

.bascule { flex-direction: row; align-items: center; gap: 10px; margin: 14px 0; font-size: 14.5px; }
.bascule input { width: 18px; height: 18px; }

/* Contraste renforcé — pour la lecture en plein soleil. */
body.contraste-fort {
  --ink: #000; --ink-mid: #1c2a26; --ink-soft: #33443e;
  --line: #7c8c86; --surface: #fff; --ground: #fff;
}
@media (prefers-color-scheme: dark) {
  body.contraste-fort:not([data-theme="light"]) {
    --ink: #fff; --ink-mid: #e2ece8; --ink-soft: #c2d2cc;
    --line: #6f807a; --surface: #000; --ground: #000;
  }
}

.adresse { font-size: 13.5px; color: var(--ink-mid); line-height: 1.45; }
.assurances { display: flex; flex-wrap: wrap; gap: 4px; }
.source-reelle { border-left: 3px solid var(--accent); }

.bandeau-source {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  background: var(--sunk); border: 1px solid var(--line-soft);
  border-left: 3px solid var(--accent);
  border-radius: var(--rayon); padding: 12px 16px; margin-bottom: 18px;
}
.bandeau-source strong { font-size: 14.5px; }
.bandeau-source > *:last-child { margin-left: auto; }

/* ---------- Client rattaché au comptoir ---------- */
.client-vente { margin-bottom: 12px; }
.client-actif {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  background: var(--accent-doux); border-radius: 3px; padding: 8px 12px;
}
.client-actif strong { display: block; font-size: 14.5px; }

/* ---------- Choix d'officine ---------- */
.liste-choix { display: flex; flex-direction: column; gap: 6px; max-height: 260px; overflow-y: auto; }
.choix {
  display: flex; flex-direction: column; gap: 2px; text-align: left;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 3px;
  background: var(--surface); color: var(--ink); font: inherit; cursor: pointer;
}
.choix:hover { border-color: var(--accent); }
.choix-actif { border-color: var(--accent); background: var(--accent-doux); }

/* ---------- Bibliothèque vocale ---------- */
.cellule-clip { min-width: 132px; }
.clip-actions { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 5px; }

/* ---------- Commande ---------- */
.champ-qte {
  width: 78px; padding: 5px 8px; text-align: right;
  border: 1px solid var(--line); border-radius: 3px;
  background: var(--surface); color: var(--ink); font: inherit;
  font-variant-numeric: tabular-nums;
}

/* ---------- Import de catalogue ---------- */

.depot {
  border: 1.5px dashed var(--line);
  border-radius: var(--rayon);
  background: var(--surface);
  padding: 28px 20px;
  text-align: center;
  display: grid; gap: 8px; justify-items: center;
  margin-bottom: 14px;
  transition: border-color .12s, background .12s;
}
.depot.survol { border-color: var(--accent); background: var(--accent-doux); }
.depot p { margin: 0; }

.zone-texte {
  width: 100%; padding: 10px 12px; margin-bottom: 12px;
  border: 1px solid var(--line); border-radius: var(--rayon);
  background: var(--surface); color: var(--ink);
  font-family: var(--mono); font-size: 13px; line-height: 1.6;
  resize: vertical;
}

.correspondance { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 16px; }
.corr {
  font-size: 12.5px; padding: 3px 9px; border-radius: 999px;
  background: var(--sunk); color: var(--ink-soft);
}
.corr.trouve { background: var(--accent-doux); color: var(--accent-fort); }
.corr.absent { text-decoration: line-through; opacity: .7; }

tr.ligne-attention td { background: var(--attention-doux); }

/* ---------- Compte de la cure ---------- */

.cure {
  background: var(--sunk); border-radius: var(--rayon);
  padding: 10px 12px; margin: 4px 0 14px;
  display: grid; gap: 5px;
}
.cure-ligne {
  display: flex; justify-content: space-between; gap: 12px;
  font-size: 14px; color: var(--ink-mid);
}
.cure-ligne strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.cure-ligne.manque strong { color: var(--attention); }
.cure-note { font-size: 13px; color: var(--ink-soft); margin-top: 3px; }
.cure-note.ok { color: var(--accent-fort); }
.cure-note strong { color: var(--ink); }

/* ---------- Vigilance à la délivrance ---------- */

.vigilance {
  background: var(--attention-doux);
  border-left: 3px solid var(--attention);
  border-radius: 0 var(--rayon) var(--rayon) 0;
  padding: 11px 13px; margin-bottom: 16px;
}
.vigilance h4 {
  margin: 0 0 6px; font-size: 14px; font-weight: 600; color: var(--ink);
  letter-spacing: 0;
}
.vigilance ul { margin: 0; padding-left: 16px; display: grid; gap: 4px; }
.vigilance li { font-size: 13.5px; color: var(--ink-mid); }
.vigilance li strong { color: var(--ink); }
.vigilance > p { margin-top: 7px; font-size: 12.5px; color: var(--ink-soft); }

/* ---------- Scan de la boîte ---------- */

.apercu-scan {
  margin-top: 10px; border-radius: var(--rayon); overflow: hidden;
  background: #000; max-width: 320px;
}
.apercu-scan video { width: 100%; height: auto; display: block; }

/* ---------- Avancement d'un traitement ---------- */

.avancement { margin-top: 8px; display: grid; gap: 4px; }
.jauge {
  height: 6px; border-radius: 999px; background: var(--sunk);
  overflow: hidden;
}
.jauge span { display: block; height: 100%; background: var(--accent); border-radius: 999px; }
.rappel.termine .jauge span { background: var(--ink-soft); }
.ligne-remboursement { margin: 4px 0 2px; }

/* ---------- Tour de garde expiré ---------- */

.encart.perime {
  background: var(--alerte-doux);
  border-left: 3px solid var(--alerte);
  display: grid; gap: 7px;
}
.encart.perime h3 { color: var(--alerte); }
.encart.perime p { font-size: 14.5px; color: var(--ink-mid); }
.encart.perime strong { color: var(--ink); }
.ligne-statut.perime {
  background: var(--alerte-doux); color: var(--alerte); font-weight: 500;
}
.bandeau-source.en-echec { border-color: var(--alerte); }