/* ---------- Écran ---------- */
/* polices Alegreya (titres) et Open Sans (texte), licence libre OFL ; fichiers dans static/polices : marche sans internet */
@font-face { font-family: "Alegreya"; font-style: normal; font-weight: 500; font-display: swap; src: url("/static/polices/alegreya-500.woff2") format("woff2"); }
@font-face { font-family: "Alegreya"; font-style: normal; font-weight: 700; font-display: swap; src: url("/static/polices/alegreya-700.woff2") format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("/static/polices/open-sans-400.woff2") format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url("/static/polices/open-sans-600.woff2") format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("/static/polices/open-sans-700.woff2") format("woff2"); }
/* palette de jour ; le papier (fiche A4, planches) la garde aussi en mode nuit */
:root, .feuille, .annexe-photos, .planche, .bordereau.saisie, .vanne-tor.saisie { --carte: #fff; --police-titre: "Alegreya", Georgia, serif; --police-texte: "Open Sans", "Helvetica Neue", Arial, sans-serif;
  /* palette CVS bleu et pêche : #00428E #057ED9 #04CAEF #B6EDFF #FEBE74 #FFDBBB #FEE7C5 */
  --bleu: #04caef; --bleu-fonce: #00428e; --encre: #00428e; --etiquette: #37474f; --a-remplir: #fbfdff; --bouton: #057ed9; --peche: #febe74; --peche-clair: #fee7c5; --peche-texte: #8a4b00; --fond: #f6fbfe; --texte: #14284b; --gris: #4a586c; --bord: #d5e3ee; --teinte: #e6f7ff; --entete-tableau: #eef6fb; --entete-feuille: #b6edff; --ok: #1b7f4b; --ok-fond: #e2f4ea; --ko: #c62828; --ko-fond: #fde7e7; --doute: #9a5b00;
  /* habillage écran (style Chantiers CVS) */
  --fond-ecran: #f3f6fa; --bord-carte: #d9e3ee; --bord-clair: #e9eff5; --bleu-pale: #eaf3fb; --nav: #00326d; --nav-txt: #d7e4f5; --nav-actif: #0a4a94;
  --ombre: 0 1px 2px rgba(16, 40, 75, .06), 0 2px 8px rgba(16, 40, 75, .05); --rayon: 6px; }
/* Mode nuit (bouton lune/soleil du menu, sinon réglage du système) : écran seulement, jamais à l'impression ni dans les PDF */
@media screen { html[data-theme=nuit] { color-scheme: dark; --carte: #172231; --fond: #0f1823; --fond-ecran: #0d151f; --texte: #e2e9f2; --gris: #9fb0c3;
  --bord: #2b3b4f; --bord-carte: #263546; --bord-clair: #1f2c3b; --bleu-pale: #1b2d44; --teinte: #182a3d; --entete-tableau: #1a2737;
  --bleu-fonce: #8ec5ff; --encre: #1b56a0; --etiquette: #b9c7d7; --a-remplir: #1a2a3c; --bouton: #2f8fe6; --peche-clair: #3b2b14; --peche-texte: var(--peche); --entete-feuille: #1d4a73; --ok: #5cc994; --ok-fond: #15301f; --ko: #ff7a7a; --ko-fond: #3a1a1c; --doute: #f0b25a;
  --nav: #0a1726; --nav-actif: #17406f; --ombre: 0 1px 2px rgba(0, 0, 0, .4); }
  html[data-theme=nuit] img[src*="logo-cvs"]:not(.feuille img) { background: #fff; border-radius: 4px; } }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 1rem; }
body { margin: 0; font: 15px/1.5 var(--police-texte); color: var(--texte); background: var(--fond); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
h1, h2, h3, .titre-groupe { font-family: var(--police-titre); font-weight: 700; }
a { color: var(--bleu-fonce); text-decoration-thickness: 1px; text-underline-offset: .2em; transition: color .15s; }
a:hover { color: var(--bouton); }
:focus-visible { outline: 3px solid var(--bouton); outline-offset: 2px; }
h1 { font-size: 1.6rem; line-height: 1.2; letter-spacing: -.01em; margin: .3rem 0 .6rem; }
h1 small { font-size: .9rem; color: var(--gris); font-weight: normal; }
h2 { font-size: 1.1rem; margin: 0 0 .8rem; color: var(--bleu-fonce); }
h3 { font-size: 1rem; margin: .4rem 0 .5rem; }
main { max-width: 1360px; margin: 0 auto; padding: 1rem 1.2rem 3rem; }
.pied-app { max-width: 1360px; margin: 0 auto; padding: .8rem 1.2rem 5rem; border-top: 1px solid var(--bord); color: var(--gris); font-size: .8rem; }
.pied-app a { color: inherit; }
.texte-long { line-height: 1.55; } .texte-long h2, .page-donnees h2 { font-size: 1.05rem; margin: 1.4rem 0 .4rem; color: var(--bleu-fonce); }
.texte-long li, .page-donnees li { margin: .25rem 0; }
.page-donnees form { margin: .6rem 0; display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; }
.muted { color: var(--gris); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-height: 2.4rem; padding: .4rem 1rem; background: var(--bouton); color: #fff; border: 1px solid var(--bouton); border-radius: 2px; font: inherit; font-weight: 600; cursor: pointer; text-decoration: none; transition: background-color .15s, border-color .15s, color .15s; }
.btn:hover { background: #046bba; border-color: #046bba; color: #fff; }
.btn:active { transform: translateY(1px); }
.btn.secondaire { background: var(--carte); color: var(--bouton); }
.btn.secondaire:hover { background: var(--teinte); color: var(--bleu-fonce); }
.btn.danger { background: var(--carte); color: var(--ko); border-color: #e3a5a5; }
.btn.danger:hover { background: var(--ko); border-color: var(--ko); color: #fff; }
.lien, .lien-danger { background: none; border: 0; color: var(--bleu-fonce); cursor: pointer; font: inherit; font-size: .85rem; padding: 0; text-decoration: underline; }
.lien-danger { color: var(--ko); }
.lien.copier { display: inline-flex; align-items: center; gap: .3rem; } .lien.copier svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 2; }
.flash { padding: .6rem .9rem; border-radius: 2px; margin-bottom: .8rem; }
.flash.ok { background: var(--ok-fond); color: var(--ok); }
.flash.erreur { background: var(--ko-fond); color: var(--ko); }
@media screen {
  .flash[data-toast] { position: fixed; right: 1.2rem; bottom: 1.2rem; z-index: 60; max-width: min(420px, calc(100vw - 2.4rem)); margin: 0;
                       padding: .7rem 1rem .7rem 2.4rem; background: var(--encre); color: #fff; box-shadow: 0 6px 20px rgba(0, 40, 90, .25);
                       cursor: pointer; overflow: hidden; animation: toast-arrive .25s ease-out; transition: opacity .3s, transform .3s; }
  .flash[data-toast]::before { content: "✓"; position: absolute; left: .9rem; color: var(--peche); font-weight: 700; }
  .flash[data-toast].parti { opacity: 0; transform: translateY(8px); }
  .flash[data-toast]::after { content: ""; position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--peche); transform-origin: left; animation: toast-temps var(--duree, 2s) linear forwards; }
  body:has(.actions-bas) .flash[data-toast] { bottom: 5rem; }
  @keyframes toast-temps { to { transform: scaleX(0); } }
  @keyframes toast-arrive { from { opacity: 0; transform: translateY(8px); } }
}
.ok { color: var(--ok); } .ko { color: var(--ko); }

/* Recherche */
.recherche { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; padding: 0 0 1rem; border-bottom: 1px solid var(--bord); margin-bottom: 1rem; }
.recherche input[type=search] { flex: 1 1 340px; }
input, select, textarea { font: inherit; padding: .45rem .6rem; border: 1px solid #aebfd0; border-radius: 2px; background: var(--carte); color: inherit; width: 100%; transition: border-color .15s, box-shadow .15s; }
input:not([type=checkbox], [type=radio], [type=file]), select { min-height: 2.5rem; }
input:hover, select:hover, textarea:hover { border-color: #9fb4c7; }
.recherche select, .recherche input[type=checkbox] { width: auto; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--bouton); box-shadow: 0 0 0 3px rgba(5, 126, 217, .4); background: var(--carte); }
input[type=checkbox], input[type=radio] { accent-color: var(--bouton); }
input[readonly] { background: #eceff1; }
.case { display: flex; gap: .3rem; align-items: center; white-space: nowrap; }
.case input { width: auto; }
table.liste { width: 100%; border-collapse: separate; border-spacing: 0; }
table.liste th, table.liste td { padding: .6rem .65rem; border-bottom: 1px solid var(--bord); text-align: left; vertical-align: middle; }
table.liste th { position: sticky; top: 0; z-index: 2; background: var(--fond); color: var(--gris); font-size: .74rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; border-bottom: 2px solid var(--bleu-fonce); white-space: nowrap; }
table.liste td { background: var(--carte); transition: background-color .12s; }
table.liste tbody tr:hover > td { background: #f0f8fd; }
table.liste td > a, table.liste td > b { white-space: nowrap; }
table.liste td a { text-decoration: none; } table.liste td a:hover { text-decoration: underline; }
.tag { font-size: .75rem; padding: .1rem .45rem; border-radius: 2px; background: var(--bord-clair); text-transform: capitalize; }
.tag.vanne { background: var(--teinte); color: var(--bleu-fonce); } .tag.essai { background: var(--bord-clair); color: var(--gris); } .tag.capteur { background: #e0f7fa; color: #00838f; }
.statut { font-size: .8rem; padding: .1rem .5rem; border-radius: 2px; }
.statut.brouillon { background: var(--peche-clair); color: var(--peche-texte); } .statut.a-relire { background: var(--teinte); color: var(--bleu-fonce); } .statut.validee { background: var(--ok-fond); color: var(--ok); }
.vide { background: var(--carte); border: 1px dashed var(--bord); border-radius: 2px; padding: 2rem; text-align: center; }
.vide > b { display: block; font-family: "Alegreya", Georgia, serif; font-size: 1.15rem; color: var(--bleu-fonce); }
.vide > p { margin: .4rem auto 0; max-width: 34rem; color: var(--gris); } .actions-vide { margin-top: 1rem; display: flex; gap: .6rem; justify-content: center; flex-wrap: wrap; }
.inactif { opacity: .5; text-decoration: line-through; }

/* Formulaire */
.entete-form { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; align-items: end; margin-bottom: .8rem; }
.info-revision { background: var(--teinte); border: 1px solid var(--bleu); padding: .6rem .8rem; border-radius: 2px; max-width: 640px; }
.mise-en-page { display: grid; grid-template-columns: 200px 1fr; gap: 1.2rem; }
.mise-en-page > *, .deux-colonnes > * { min-width: 0; }   /* une grille de champs ou un tableau large ne pousse pas la page */
.sommaire { position: sticky; top: 1rem; align-self: start; display: flex; flex-direction: column; gap: .2rem; }
.sommaire a { text-decoration: none; padding: .4rem .6rem; border-radius: 2px; color: var(--texte); }
.sommaire a:hover { background: var(--teinte); }
.sommaire a.actif { background: var(--carte); color: var(--bleu-fonce); font-weight: 600; box-shadow: inset 3px 0 0 var(--bouton); }
.sections section { background: var(--carte); border: 1px solid var(--bord); border-radius: 2px; padding: 1rem 1.1rem; margin-bottom: 1rem; scroll-margin-top: 1rem; }
.grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .7rem 1rem; margin-bottom: .6rem; }
.champ { display: flex; flex-direction: column; gap: .2rem; }
.champ > span { font-size: .82rem; font-weight: 600; color: var(--etiquette); }
.champ small { font-weight: normal; color: var(--gris); }
.champ.large { grid-column: span 2; }
.avec-unite { display: flex; align-items: center; gap: .3rem; }
.avec-unite i { font-style: normal; color: var(--gris); }
.astuce { font-size: .82rem; color: var(--gris); margin: .3rem 0 0; }
.interrupteurs { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; }
.interrupteur { display: flex; align-items: center; gap: .5rem; cursor: pointer; }
.interrupteur input { position: absolute; opacity: 0; width: 1px; }
.interrupteur .oui, .interrupteur .non { font-size: .78rem; font-weight: 700; padding: .25rem .55rem; border: 1px solid var(--bord); }
.interrupteur .oui { border-radius: 2px 0 0 6px; } .interrupteur .non { border-radius: 0 6px 6px 0; margin-left: -.5rem; margin-right: .2rem; background: var(--bord-clair); }
.interrupteur input:checked ~ .oui { background: var(--ok); color: var(--carte); border-color: var(--ok); }
.interrupteur input:checked ~ .non { background: var(--carte); color: var(--gris); }
.interrupteur input:focus-visible ~ .oui { outline: 2px solid var(--bleu); }
.deux-colonnes { display: grid; grid-template-columns: 1fr 1.2fr; gap: 1.5rem; }
.cases { display: grid; grid-template-columns: 1fr 1fr; gap: .15rem .8rem; margin-bottom: .6rem; }
.cases label { display: flex; gap: .4rem; align-items: center; padding: .2rem .3rem; border-radius: 2px; cursor: pointer; }
.cases label:has(input:checked) { background: var(--teinte); font-weight: 600; }
.cases input, table.pieces input[type=checkbox], table.pieces input[type=radio] { width: auto; }
table.pieces { width: 100%; border-collapse: collapse; margin-bottom: .6rem; font-size: .92rem; }
table.pieces th { font-size: .78rem; color: var(--gris); text-align: left; }
table.pieces td { padding: .1rem .3rem; border-bottom: 1px solid #eceff1; }
table.pieces tr:not(.coche) td:not(:first-child) { opacity: .35; }
table.pieces tr.coche td:first-child { font-weight: 600; }
table.pieces label { display: flex; gap: .3rem; align-items: center; cursor: pointer; }
table.pieces .nowrap { white-space: nowrap; } table.pieces .nowrap label { display: inline-flex; }
input.qte { width: 4.5rem; padding: .2rem .3rem; }
table.mesures { border-collapse: collapse; width: 100%; max-width: 900px; margin: .4rem 0; }
table.mesures th, table.mesures td { border: 1px solid var(--bord); padding: .3rem; text-align: center; }
table.mesures thead th { background: var(--entete-tableau); font-size: .82rem; }
table.mesures input { text-align: right; }
input.incoherent, input.incoherent:focus { border-color: var(--ko); background: var(--ko-fond); outline-color: var(--ko); }
.champ .erreur-champ { display: block; color: var(--ko); font-size: .78rem; margin-top: .15rem; } .champ .erreur-champ:empty { display: none; }
#mesures.sans-autre .col-autre { display: none; } #mesures .autre:read-only { background: var(--fond); } #mesures:not(.sans-autre) :is(.col-relevee, .col-relevee_retour, .col-autre) input { min-width: 4.5rem; }
.champ-course { display: flex; flex-direction: column; gap: .3rem; } .champ-course .case { font-size: .82rem; color: var(--etiquette); }
table.mesures tbody tr:focus-within > * { background: var(--fond); } table.mesures tbody td:focus-within { background: var(--teinte); }
table.mesures tbody tr:focus-within > th { color: var(--bleu-fonce); box-shadow: inset 3px 0 var(--bouton); }
table.mesures input[data-auto="1"] { color: var(--gris); font-style: italic; }
table.mesures input[readonly] { background: transparent; border-color: transparent; color: inherit; font-style: normal; cursor: default; }
.champ[hidden], .bloc-coupure.cache, table.mesures:not(.dp) .col-rac, table.mesures:not(.dp) .si-debit, table.mesures:not(.debit) .col-op { display: none; }
table.mesures.dp:not(.racine) th[data-loi="lin"] small::after, table.mesures.racine th[data-loi="rac"] small::after { content: " ✓"; }
table.mesures .op { white-space: nowrap; }
table.mesures .converti { display: block; text-align: right; color: var(--gris); padding-right: .4rem; }
td.ecart { font-weight: 600; white-space: nowrap; }
td.ecart.ok { background: var(--ok-fond); color: var(--ok); } td.ecart.ko { background: var(--ko-fond); color: var(--ko); }
.verdict-live { font-weight: 700; padding: .4rem 0; }
fieldset { border: 1px solid var(--bord); border-radius: 2px; padding: .5rem .7rem; display: grid; gap: .5rem; }
legend { font-weight: 600; font-size: .85rem; padding: 0 .3rem; }
.actions-bas { position: fixed; left: 0; right: 0; bottom: 0; background: var(--carte); border-top: 1px solid var(--bord); padding: .7rem 1.2rem; display: flex; gap: .7rem; align-items: center; z-index: 5; box-shadow: 0 -2px 8px rgba(0,0,0,.05); }
.espace { flex: 1; }
.supprimer { margin-top: 1rem; text-align: right; }

/* Historique */
.verdict { font-size: .8rem; font-weight: 700; padding: .1rem .5rem; border-radius: 2px; }
.verdict.ok { background: var(--ok-fond); } .verdict.ko { background: var(--ko-fond); }

/* Paramètres */
.onglets { display: flex; gap: .3rem; border-bottom: 1px solid var(--bord); margin-bottom: .8rem; }
.onglets a { padding: .5rem .9rem; text-decoration: none; border-radius: 2px 6px 0 0; }
.onglets a.actif { background: var(--carte); border: 1px solid var(--bord); border-bottom-color: #fff; margin-bottom: -1px; font-weight: 600; }
.cartes { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
.carte { background: var(--carte); border: 1px solid var(--bord); border-radius: 2px; padding: .8rem; }
ul.valeurs { list-style: none; padding: 0; margin: 0 0 .6rem; max-height: 260px; overflow: auto; }
ul.valeurs li { display: flex; justify-content: space-between; gap: .5rem; padding: .2rem 0; border-bottom: 1px solid #eceff1; }
ul.valeurs li.inactif { text-decoration: none; } ul.valeurs li small { color: var(--gris); margin-left: .4rem; }
ul.valeurs li.a-verifier small, .note-verifier a { color: var(--doute); } .note-verifier { border-left: 3px solid var(--peche); padding: .4rem .7rem; background: var(--peche-clair); } ul.valeurs form { display: inline; }
ul.valeurs:has(.sortes-catalogue) { max-height: none; } ul.valeurs li:has(.sortes-catalogue) { flex-wrap: wrap; } ul.valeurs form.sortes-catalogue { order: 3; flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 0 .7rem; font-size: .8rem; color: var(--gris); }
.sortes-catalogue label { display: inline-flex; align-items: center; gap: .2rem; }
.ajout { display: flex; gap: .4rem; } .ajout.ligne { margin-top: .8rem; flex-wrap: wrap; align-items: center; }
.ajout.ligne input, .ajout.ligne select { width: auto; } .ajout.ligne label { display: flex; gap: .3rem; align-items: center; }

/* Sécurité / comptes */
.carte-centre { max-width: 440px; margin: 2rem auto; background: var(--carte); border: 1px solid var(--bord); border-radius: 2px; padding: 1.4rem 1.6rem; }
.carte-centre.large { max-width: 720px; margin-top: .5rem; }
.pile { display: grid; gap: .8rem; }
.majuscules { text-transform: uppercase; }
.court { width: 5rem !important; }
tr.alerte td { background: color-mix(in srgb, var(--ko-fond) 55%, var(--carte)); }
.nowrap { white-space: nowrap; }

/* Incertitude */
.aide-calcul { margin: .2rem 0; font-weight: 600; min-height: 1.2em; }
.aide-calcul.ok { color: var(--ok); } .aide-calcul.ko { color: var(--ko); }
input.a-remplir { outline: 3px solid var(--ko); background: var(--ko-fond); }
table.incert { border-collapse: collapse; width: 100%; max-width: 980px; margin-bottom: .6rem; }
table.incert th, table.incert td { border-bottom: 1px solid #eceff1; padding: .3rem .4rem; text-align: left; font-size: .9rem; }
table.incert thead th { font-size: .78rem; color: var(--gris); }
td.incertitude { white-space: nowrap; color: var(--etiquette); }
td.decision { font-weight: 700; font-size: .8rem; white-space: nowrap; }
.decision.ok, td.ok { color: var(--ok); } .decision.ko { color: var(--ko); }
.verdict-live.ok { color: var(--ok); } .verdict-live.ko { color: var(--ko); }
.bilan { text-align: left !important; color: #34465f; line-height: 1.5; }
/* sous un relevé : verdict expliqué, barre des zones de décision (_zones.html, fiche.js) et notes */
.verdict-ligne { display: flex; align-items: center; gap: 3mm; } .verdict-ligne .verdict-imp { flex: none; white-space: nowrap; margin: 0; }
.verdict-ligne b { font-weight: 600; } .verdict-ligne .ok { color: var(--ok); } .verdict-ligne .ko { color: var(--ko); }
.zones { display: block; width: 100%; height: auto; margin-top: .8mm; } .zones[hidden] { display: none; }
.zones text { font-size: 9px; fill: var(--gris); } .zones path.repere { fill: var(--texte); } .zones line.repere { stroke: var(--texte); stroke-width: 1.4; }
.zones .barre-u { fill: none; stroke: var(--texte); stroke-width: 1; }
.zones rect { stroke: #8a99ad; stroke-width: .6; } .zones line { stroke: var(--gris); stroke-width: .8; } .zones line.tol { stroke: var(--texte); stroke-dasharray: 2 2; }
rect.z-ok { fill: var(--ok-fond); } rect.z-ko { fill: var(--ko-fond); }
.zones text.z-ok, .zones text.z-ko { font-size: 8px; font-weight: 600; letter-spacing: .04em; }
text.z-ok { fill: var(--ok); } text.z-ko { fill: var(--ko); }
.notes-imp { display: flex; gap: 4mm; margin-top: 1mm; padding-top: .6mm; border-top: .6pt solid #b4c3d3; font-size: 8px; color: #5d6b80; line-height: 1.35; }
.notes-imp > b { color: var(--bleu-fonce); text-transform: uppercase; letter-spacing: .06em; }
.notes-imp ul { display: grid; grid-template-columns: 1fr 1fr; gap: 0 5mm; margin: 0; padding: 0; list-style: none; } .notes-imp li b { color: #34465f; }
.aide-doc { text-align: center; font: 13px var(--police-texte); color: #444; }

/* ---------- Fiche imprimable (style des fiches papier CVS) ---------- */
.outils { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; margin-bottom: 1rem; }
.outils .btn { padding-inline: .75rem; }
.outils form { display: inline; }
/* police du rapport : la même partout, chiffres alignés ; tailles 8 (notes, pied), 9 (étiquettes), 10 (bandeaux), 10,5 (valeurs) */
.feuille, .resume-mobile { font-family: var(--police-texte); font-variant-numeric: tabular-nums; color: #111; }
.feuille { background: var(--carte); width: 210mm; min-height: 297mm; margin: 0 auto; padding: 10mm; box-shadow: 0 2px 12px rgba(0,0,0,.12); position: relative; color: #14284b; font-size: 10.5px; }
.feuille.brouillon::after { content: "BROUILLON"; position: absolute; top: 40%; left: 10%; font-size: 90px; font-weight: 700; color: rgba(180,35,24,.10); transform: rotate(-30deg); pointer-events: none; }
table.imp { width: 100%; border-collapse: collapse; margin-bottom: 3mm; }
table.imp th, table.imp td { padding: 1.2mm 1.5mm; vertical-align: middle; border: .6pt solid #b4c3d3; }
table.imp th { text-align: left; font-weight: 600; color: #34465f; background: #f2f6fa; }
.bleu, tr.bleu th { background: var(--entete-feuille); text-align: center !important; font-weight: 700; }
table.imp th.bleu { white-space: nowrap; background: #f2f6fa; color: #00428e; text-align: left !important; font-weight: 600; font-size: 9px; text-transform: uppercase; letter-spacing: .04em; width: 14%; }
table.imp.centre td, table.imp.centre th { text-align: center; }
.entete td { height: 12mm; }
/* logo et n° de suivi de même largeur (27 %) : le titre tombe au milieu de la page */
.logo-imp { width: 27%; vertical-align: bottom !important; }
.logo-imp .marque { font-weight: 700; font-style: italic; background: none; color: #00428e; padding: 0; font-size: 21px; letter-spacing: .02em; line-height: 1; }
.logo-imp .sous { color: #5d6b80; font-size: 8px; margin-top: 1mm; letter-spacing: .03em; }
.titre-imp { text-align: center; font-weight: 700; font-size: 13px; letter-spacing: .03em; color: #00428e; vertical-align: bottom !important; line-height: 1.25; }
.adresse { font-weight: normal; margin-top: 1.5mm; color: #5d6b80; font-size: 8px; white-space: nowrap; }
.numero-imp { font-weight: 700; text-align: right; font-size: 20px; color: #00428e; padding-bottom: 2.5mm !important; line-height: 1.1; }
.numero-imp div { font-weight: normal; font-size: 8px; color: #5d6b80; }
.sceau-imp { width: 15mm; text-align: center; vertical-align: bottom !important; padding: 0 0 1.5mm 2mm !important; }
.sceau-imp svg { display: block; width: 13mm; height: 13mm; margin: 0 auto; } .sceau-imp small { font-size: 6.5px; color: #5d6b80; letter-spacing: .04em; text-transform: uppercase; }
/* Page du QR « Vérifier » (verifier.html) : bandeau d'état, carte de la fiche, empreinte à comparer */
body.page-verif { background: var(--fond-ecran); } body.page-verif .barre-mobile, body.page-verif .pied-app { display: none; }
.verif-page { width: 100%; max-width: 520px; display: grid; gap: 1rem; padding: 1.2rem 1rem 1.5rem; }
.verif-tete { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: .9rem; border-bottom: 1px solid var(--bord-carte); }
.verif-tete img { width: 190px; max-width: 55%; } .verif-tete span { font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--gris); text-align: right; }
.verif-etat { --c: var(--ok); --f: var(--ok-fond); display: flex; gap: 1rem; align-items: center; padding: 1.1rem 1.2rem; background: var(--f); border: 1px solid var(--c); border-radius: var(--rayon); }
.verif-etat.remplacee { --c: var(--doute); --f: var(--peche-clair); } .verif-etat.inconnue { --c: var(--ko); --f: var(--ko-fond); }
.verif-etat svg { flex: none; width: 52px; height: 52px; } .verif-etat circle { fill: var(--c); }
.verif-etat path { fill: none; stroke: #fff; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.verif-etat h1 { margin: 0 0 .2rem; font-size: 1.45rem; color: var(--c); } .verif-etat p { margin: 0; font-size: .9rem; line-height: 1.45; }
.verif-fiche { background: var(--carte); border: 1px solid var(--bord-carte); border-radius: var(--rayon); box-shadow: var(--ombre); }
.verif-num { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 0 .8rem; padding: 1rem 1.2rem .9rem; border-bottom: 1px solid var(--bord-clair); }
.verif-num small { grid-column: 1 / -1; font-size: .78rem; color: var(--gris); text-transform: uppercase; letter-spacing: .04em; }
.verif-num b { font: 700 1.7rem/1.2 var(--police-titre); color: var(--bleu-fonce); } .verif-num span { grid-column: 1; font-size: .85rem; color: var(--gris); }
.pastille-verdict { grid-column: 2; grid-row: 2 / 4; align-self: center; font-style: normal; font-weight: 700; font-size: .8rem; padding: .3rem .75rem; border-radius: 999px; color: var(--ok); background: var(--ok-fond); }
.pastille-verdict.ko { color: var(--ko); background: var(--ko-fond); } .pastille-verdict.doute { color: var(--doute); background: var(--peche-clair); }
.verif-fiche dl { display: grid; grid-template-columns: auto 1fr; margin: 0; padding: .3rem 1.2rem .5rem; }
.verif-fiche dt, .verif-fiche dd { padding: .55rem 0; border-bottom: 1px solid var(--bord-clair); } .verif-fiche dl > :nth-last-child(-n+2) { border-bottom: 0; }
.verif-fiche dt { color: var(--gris); font-size: .85rem; padding-right: 1rem; } .verif-fiche dd { margin: 0; font-weight: 600; text-align: right; }
.verif-fiche dd small { display: block; font-weight: 400; font-size: .8rem; color: var(--gris); }
.verif-code { padding: .9rem 1.2rem 1rem; background: var(--carte); border: 1px dashed var(--bord-carte); border-radius: var(--rayon); }
.verif-code p { margin: 0 0 .45rem; font-size: .82rem; color: var(--gris); } .verif-code .code + p { margin-top: .9rem; }
.verif-code .code { display: flex; flex-wrap: wrap; gap: .4rem; } .verif-code .code span { font: 600 1.05rem/1 ui-monospace, Menlo, Consolas, monospace; letter-spacing: .06em; padding: .45rem .55rem; background: var(--bleu-pale); color: var(--bleu-fonce); border-radius: 4px; }
.verif-code .perime span { background: var(--fond-ecran); color: var(--gris); text-decoration: line-through; }
.verif-pied { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .3rem 1rem; font-size: .78rem; color: var(--gris); }
.imp-deux { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5mm; align-items: start; }
.liste-imp td { padding: .6mm 1.5mm; border-left: 0; border-right: 0; } .liste-imp td.c { text-align: center; width: 9mm; border-left: .6pt solid #e1e8ef; }
.liste-imp tr.fait td:first-child { font-weight: 600; color: #00428e; }
/* case à cocher dessinée (identique sur Mac, iPhone, Windows et à l'impression) */
.coche-imp { display: inline-block; width: 2.8mm; height: 2.8mm; vertical-align: -0.4mm; position: relative; background: var(--carte); border: 1px solid #34465f; border-radius: 0; }
.champ-imp { display: inline-block; width: 14mm; height: 1.2em; vertical-align: middle; }   /* fiche vierge : place d'un nombre, champ du PDF à remplir */
.feuille .case-ecran { display: block; width: 100%; min-width: 0; height: 1.2em; min-height: 0; padding: 0 .2em; margin: 0; line-height: 1.2em; border: 0; border-radius: 0; outline: 0; font: inherit; text-align: inherit; color: #0b3a73;   /* fiche vierge remplie à l'écran */
  background: none; box-shadow: none; resize: none; } .feuille td > i ~ .case-ecran { display: inline-block; width: 60%; } .feuille .nt-ligne > .case-ecran { flex: 1; }
@media screen { .feuille .case-ecran { background: rgba(5, 126, 217, .07); } .feuille .case-ecran:focus { background: rgba(5, 126, 217, .18); } .coche-imp[data-saisie] { cursor: pointer; } }
.coche-imp.oui::before, .coche-imp.oui::after { content: ""; position: absolute; left: 50%; top: -12%; width: 1.3px; height: 124%; background: #00428e; }
.coche-imp.oui::before { transform: translateX(-50%) rotate(45deg); } .coche-imp.oui::after { transform: translateX(-50%) rotate(-45deg); }
td.obs { height: 18mm; vertical-align: top; white-space: pre-wrap; line-height: 1.45; }
.mesures-imp td.ko { color: var(--ko); font-weight: 700; }
.verdict-imp { font-weight: 700; margin-top: 1mm; display: table; font-size: 12px; letter-spacing: .08em; border: 1.2pt solid currentColor; padding: .6mm 2.5mm; margin: 1.2mm 0 .6mm; } .verdict-imp.ok { color: var(--ok); } .verdict-imp.ko { color: var(--ko); }
.visas tr.visa td { height: 14mm; }
.pied-imp { text-align: right; border-top: .6pt solid #b4c3d3; padding-top: 1.5mm; margin-top: 1mm; color: #5d6b80; font-size: 8px; display: flex; justify-content: space-between; }

@media (max-width: 640px) { .cases { grid-template-columns: 1fr; } .champ.large { grid-column: auto; } }   /* tablette : cases sur deux colonnes */
@media (max-width: 900px) {
  .mise-en-page, .deux-colonnes { grid-template-columns: 1fr; }
  .sommaire { display: none; }
  .feuille { width: 100%; min-height: 0; }
}
/* Fiche version téléphone (_resume_mobile.html) : cachée sur ordinateur et à l'impression */
.resume-mobile { display: none; }
.rm-entete { background: var(--carte); border: 1px solid var(--bord); border-top: 4px solid var(--bleu-fonce); border-radius: 2px; padding: .9rem 1rem; margin-bottom: .8rem; position: relative; }
.rm-entete .statut { position: absolute; top: .9rem; right: 1rem; }
.rm-numero { font-size: 1.5rem; font-weight: 700; color: var(--bleu-fonce); letter-spacing: .3px; }
.rm-numero small { font-size: .85rem; font-weight: 400; color: var(--gris); }
.rm-titre { margin: .2rem 0 .1rem; font-size: 1.05rem; }
.rm-verdict { display: inline-block; margin-top: .6rem; padding: .3rem .8rem; border-radius: 2px; font-weight: 700; letter-spacing: .4px; }
.rm-verdict.ok { background: var(--ok-fond); color: var(--ok); } .rm-verdict.ko { background: var(--ko-fond); color: var(--ko); }
.rm-bloc { background: var(--carte); border: 1px solid var(--bord); border-radius: 2px; padding: .8rem 1rem; margin-bottom: .8rem; }
.rm-bloc h3 { margin: 0 0 .5rem; font-size: .8rem; text-transform: uppercase; letter-spacing: .6px; color: var(--bleu-fonce); }
.rm-bloc h3 small { text-transform: none; letter-spacing: 0; font-weight: 400; }
.rm-ligne { display: flex; justify-content: space-between; gap: 1rem; padding: .35rem 0; border-bottom: 1px solid #eceff1; }
.rm-ligne:last-child { border-bottom: 0; }
.rm-ligne span { color: var(--gris); flex: none; max-width: 45%; }
.rm-ligne b { font-weight: 600; text-align: right; overflow-wrap: anywhere; }
.rm-liste { margin: 0; padding-left: 1.1rem; } .rm-liste li { padding: .15rem 0; } .rm-liste small { display: block; }
.rm-obs { margin: 0; white-space: pre-wrap; }
.rm-mesure { display: grid; grid-template-columns: 3.2rem 1fr auto; gap: .1rem .6rem; align-items: center; padding: .45rem 0; border-bottom: 1px solid #eceff1; font-size: .92rem; }
.rm-mesure .rm-point { grid-row: span 2; font-size: 1rem; color: var(--bleu-fonce); }
.rm-mesure span { grid-column: 2; color: var(--etiquette); }
.rm-mesure .rm-decision { grid-column: 3; grid-row: 1 / span 2; font-size: .75rem; }
.rm-decision.ok { color: var(--ok); } .rm-decision.ko { color: var(--ko); }
.rm-bilan { margin: .5rem 0 0; font-size: .85rem; }
.rm-signatures { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin-top: .6rem; }
.rm-signatures figure { margin: 0; border: 1px solid var(--bord); border-radius: 2px; padding: .3rem; text-align: center; }
.rm-signatures img { width: 100%; height: auto; } .rm-signatures figcaption { font-size: .78rem; color: var(--gris); }
.rm-voir-a4 { width: 100%; }

/* Téléphone : rien ne dépasse de l'écran */
@media screen and (max-width: 640px) {
  main { padding: .7rem .7rem 6rem; }
  .mise-en-page > *, .sections, .sections section, .grille > *, .deux-colonnes > *, .cases, .cases label { min-width: 0; }
  .cases label { overflow-wrap: anywhere; }
  .sections section { padding: .8rem .7rem; }
  .grille { grid-template-columns: 1fr; }
  .case { white-space: normal; align-items: flex-start; }
  /* tableaux larges : ils défilent de côté dans leur cadre, la page reste fixe */
  table.liste, .sections table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
  table.liste { white-space: nowrap; }
  .sections table input, .sections table select { min-width: 4.5rem; }
  .sections table input[type=checkbox], .sections table input[type=radio] { min-width: 0; }
  .entete-form .btn, .actions .btn { flex: 1 1 auto; text-align: center; }
  .recherche { display: grid; grid-template-columns: 1fr 1fr; gap: .45rem; }
  .recherche input[type=search], .recherche .case, .recherche > span { grid-column: 1 / -1; }
  .recherche select { width: 100%; min-width: 0; }
  .filtre-client label { min-width: 0; } .filtre-client select { flex: 1; min-width: 0; }
  form.recherche[data-auto] > .btn { display: none; }
  .recherche > a { font-size: .85rem; }
  input, select, textarea { font-size: 16px; }  /* 16 px : l'iPhone ne zoome plus tout seul sur le champ */
  /* fiche terminée : la version téléphone ; la feuille A4 seulement sur demande (bouton « Voir la fiche A4 ») */
  .resume-mobile { display: block; }
  .page-fiche:not(.voir-a4) .cadre-impression, .page-fiche:not(.voir-a4) .annexe-photos { display: none; }
  .page-fiche.voir-a4 .resume-mobile > :not(.rm-voir-a4) { display: none; }
  .outils { gap: .5rem .8rem; }
  .outils .espace { display: none; }
  .outils .btn, .outils form { flex: 1 1 45%; text-align: center; }
  .outils form .btn { width: 100%; }
  .cadre-impression .feuille { margin: 0; flex: none; }
}

@media print {
  @page { size: A4; margin: 0; }  /* marge 0 : le navigateur n'a plus de place pour ses en-têtes (date, adresse) */
  body { background: var(--carte); }
  .no-print, .barre { display: none !important; }
  main { max-width: none; margin: 0; padding: 0 !important; }

  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  /* réduction calculée par commun.js pour tenir sur une page (transform : même rendu sur Safari et Chrome) */
  html, body { height: auto !important; }

  .cadre-impression { height: var(--hauteur-impression, auto); overflow: hidden; padding: 10mm 10mm 0; box-sizing: content-box; }
  .annexe-photos { display: none; }
  body.avec-photos .annexe-photos { display: block; break-before: page; padding: 10mm; max-width: none; margin: 0; box-shadow: none; }
  body.avec-photos .annexe-photos .photo { break-inside: avoid; }

  .feuille.brouillon::after { top: 30%; }
}
/* Photos */
.photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: .7rem; margin: .6rem 0; }
.photo { margin: 0; background: var(--carte); border: 1px solid var(--bord); border-radius: 2px; padding: .4rem; display: flex; flex-direction: column; gap: .3rem; }
.photo img { width: 100%; height: 150px; object-fit: cover; border-radius: 2px; background: #eceff1; }
.photo input[name=photo_legende] { width: 100%; box-sizing: border-box; }
.photo figcaption { font-size: .8rem; color: var(--gris); }
.ajout-photo { cursor: pointer; }
.annexe-photos { background: var(--carte); width: 210mm; max-width: 100%; margin: 1rem auto; padding: 10mm; box-sizing: border-box; box-shadow: 0 2px 12px rgba(0,0,0,.12); }
.annexe-photos h2 { font-size: 13px; margin: 0 0 4mm; }
.annexe-photos .photos { grid-template-columns: 1fr 1fr; gap: 4mm; }
.annexe-photos .photo { border: 0; padding: 0; }
.annexe-photos .photo img { height: auto; max-height: 85mm; object-fit: contain; }
/* Signatures au doigt */
.signature { display: flex; flex-direction: column; gap: .3rem; }
.signature canvas { width: 100%; aspect-ratio: 3 / 1; background: var(--carte); border: 1px dashed var(--bord); border-radius: 2px; touch-action: none; cursor: crosshair; }
.signature .effacer-signature { align-self: flex-start; }
.ecart-champ { width: 7em; }
.sig-imp img { height: 12mm; max-width: 100%; display: block; margin: auto; }
.rappel-etalons { background: color-mix(in srgb, var(--ko-fond) 55%, var(--carte)); border: 1px solid #f3c2b8; border-radius: 2px; padding: .6rem .9rem; margin: .6rem 0; }
/* Saisie sans réseau */
.bandeau-attente { background: color-mix(in srgb, var(--peche-clair) 60%, var(--carte)); border: 1px solid #f0d58a; border-radius: 2px; padding: .6rem .9rem; margin-bottom: .8rem; }
input.code-pin { font-size: 1.6rem; letter-spacing: .5rem; text-align: center; }
/* Mise en page compacte de l'impression (aussi appliquée un instant à l'écran pour mesurer la hauteur) */
@media print { table.imp th, table.imp td { padding: .8mm 1.4mm; } .liste-imp td { padding: .2mm 1.4mm; }
  td.obs { height: 12mm; } .visas tr.visa td { height: 10mm; } .feuille { box-shadow: none; min-height: 0; padding: 0; width: var(--largeur-impression, 190mm) !important; margin: 0 !important; transform: scale(var(--zoom-impression, .7)); transform-origin: 0 0; } }
body.mesure-a4 table.imp th, body.mesure-a4 table.imp td { padding: .8mm 1.4mm; }
body.mesure-a4 .liste-imp td { padding: .2mm 1.4mm; }
body.mesure-a4 td.obs { height: 12mm; } body.mesure-a4 .visas tr.visa td { height: 10mm; }
body.mesure-a4 .feuille { padding: 0; width: 194mm; min-height: 0 !important; }
table.incert td:nth-child(3), table.incert td:nth-child(4) { min-width: 175px; }
body.mesure-a4 .cadre-impression { display: block !important; }

/* ---------- Feuille A4 / PDF : rendu propre (traits fins, titres de section bleu foncé, étiquettes discrètes) ---------- */

table.imp td { background: var(--carte); }
/* titre de section : bandeau bleu foncé, texte blanc, à gauche */
tr.cols th { background: #f2f6fa !important; color: #34465f; text-align: center !important; }
tr.bleu th, tr.bleu td { background: #00428e !important; color: #fff; border-color: #00428e; text-align: center !important; font-size: 10px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
tr.bleu + tr th { font-size: 9px; } .visas tr.bleu + tr th { font-size: inherit; }
/* étiquettes des champs (Client, Date…) */

table.imp.centre th.bleu { text-align: left !important; }
/* colonnes CVS / CLIENT / Qté de l'en-tête de liste : centrées */
.liste-imp tr.bleu th + th { letter-spacing: .04em; }

 .liste-imp td:first-child { border-left: .6pt solid #b4c3d3; }
.liste-imp td:last-child { border-right: .6pt solid #b4c3d3; } 

/* en-tête : logo à gauche, titre au centre, numéro encadré à droite, filet bleu dessous */
table.imp.entete { margin-bottom: 4mm; border-bottom: 2pt solid #00428e; }
table.imp.entete th, table.imp.entete td { border: 0; background: var(--carte); }
table.imp.entete td, table.imp.entete th { height: auto; padding: 0 0 2.5mm !important; }

table.imp.entete th.bleu { width: 27%; background: var(--carte); color: #5d6b80; text-align: right !important; font-size: 8px; padding: 0 0 .5mm !important; vertical-align: bottom; }

.mesures-imp td.ok, .mesures-imp td.ko { font-weight: 600; font-size: 9px; letter-spacing: .04em; }
/* fiche : identification en 4 lignes de 3 rubriques, une valeur par ligne ; travaux capteur en un tableau : cases simples | autre, puis cases à choix deux par ligne */
table.imp.identite th.bleu { width: 1%; } table.imp.identite td { width: 30%; white-space: nowrap; } table.imp.identite td:nth-of-type(2) { width: 38%; } .releve td.g-ecart { white-space: nowrap; } .feuille.vierge table.imp.identite td { white-space: normal; }   /* fiche vierge : les cases à remplir passent à la ligne au besoin */
table.imp.travaux-imp td { width: 50%; }
/* relevé : chaque groupe de colonnes a sa teinte d'en-tête et un filet épais à gauche */
.releve .debut { border-left: 1.5pt solid #00428e !important; }
.fl { font-size: 1.45em; line-height: 0; vertical-align: -.08em; }
body table.imp.releve th, body table.imp.releve td { padding-left: .7mm; padding-right: .7mm; }
.releve th.g-lin { background: #dcf1fc; } .releve th.g-rac, .releve th.g-autre { background: #fee7c5; } .releve th.g-op { background: #e8edf3; }
.releve th.g-ecart, .releve th.g-u, .releve th.g-dec { background: #f2f6fa; color: #00428e; }
.releve td.g-lin { background: #f3fafe; } .releve td.g-rac, .releve td.g-autre { background: #fff8ee; } .releve td.g-op { background: #f6f8fa; font-weight: 600; }
/* point non conforme : toute la ligne en rouge pâle */
.releve tr.ligne-ko > * { background: var(--ko-fond) !important; } .releve td.g-dec { white-space: nowrap; }
.visas th { width: 9%; }

.pied-imp::before { content: "CVS Industrie · Miramas"; }

/* ---------- Téléphone : tailles reprises (barre compacte, liste des fiches lisible, boutons du bas plus bas) ---------- */
@media screen and (max-width: 640px) {
  body { font-size: 15px; }

  main h1 { font-size: 1.35rem; margin: .4rem 0 .6rem; }


  /* pièces : libellé sur toute la largeur, « fourni par » et quantité dessous */
  .sections table.pieces { display: block; overflow: visible; }
  table.pieces thead { display: none; }
  table.pieces tbody { display: block; }
  table.pieces tr { display: grid; grid-template-columns: 1fr auto; gap: .2rem .8rem; align-items: center; padding: .45rem 0; border-bottom: 1px solid #eceff1; }
  table.pieces td { display: block; border: 0; padding: 0; }
  table.pieces td:first-child { grid-column: 1 / -1; }
  table.pieces td.nowrap { display: flex; gap: 1.4rem; padding-left: 1.65rem; }
  table.pieces td:nth-child(3) { display: flex; align-items: center; gap: .4rem; }
  table.pieces td:nth-child(3)::before { content: "Qté"; color: var(--gris); font-size: .85rem; }
  table.pieces input[type=checkbox], table.pieces input[type=radio] { width: 1.15rem !important; min-width: 0 !important; height: 1.15rem; flex: none; margin: 0; padding: 0; }
  table.pieces label { gap: .5rem; }
  table.pieces input.qte { width: 4rem; }
  table.pieces td:nth-child(4) { grid-column: 1 / -1; padding-left: 1.7rem; }
  table.pieces tr:not(.coche) td:not(:first-child) { display: none; }

  /* boutons du bas : une seule ligne, moins hauts */
  .actions-bas { padding: .5rem .7rem calc(.5rem + env(safe-area-inset-bottom)); gap: .5rem; }
  .actions-bas .espace { display: none; }
  .actions-bas .btn { padding: .5rem .4rem; font-size: .85rem; line-height: 1.2; flex: 1 1 0; min-width: 0; text-align: center; }
  .actions-bas > a:not(.btn) { font-size: .85rem; flex: none; }
}
@media screen and (max-width: 640px) {
  /* tableau d'étalonnage : défile de côté, en-têtes plus compacts */
  table.mesures thead th { font-size: .72rem; line-height: 1.2; }
  table.mesures td:first-child, table.mesures th:first-child { position: sticky; left: 0; background: var(--fond); z-index: 1; }
}
/* Ordinateur : la fiche A4 affichée un peu plus grande à l'écran pour être lisible (l'impression n'est pas touchée) */
@media screen and (min-width: 1280px) {
  .cadre-impression .feuille { zoom: 1.2; }
  body.mesure-a4 .cadre-impression .feuille { zoom: 1; }
}
/* Téléphone et tablette en hauteur : la fiche A4 garde sa mise en page ; « Voir la fiche A4 » : réduction par transform (et non zoom)
   pour que les traits fins restent visibles sur iPhone ; commun.js donne au cadre la hauteur réduite */
@media screen and (max-width: 1279px) {
  .feuille { width: 210mm; padding: 6mm; zoom: 1; transform: scale(var(--zoom-ecran, 1)); transform-origin: 0 0; }
  .cadre-impression { overflow: hidden; display: block; justify-content: center; height: var(--hauteur-ecran, auto); }
}

/* Fiche courte : lignes aérées (--etirer calculé par commun.js) pour remplir la page A4, à la mesure comme à l'impression */
@media print {
  table.imp:not(.entete) th, table.imp:not(.entete) td { padding-top: calc(.8mm + var(--etirer, 0px)) !important; padding-bottom: calc(.8mm + var(--etirer, 0px)) !important; }
  table.imp.liste-imp:not(.entete) td { padding-top: calc(.2mm + var(--etirer, 0px)) !important; padding-bottom: calc(.2mm + var(--etirer, 0px)) !important; }
}
body.mesure-a4 table.imp:not(.entete) th, body.mesure-a4 table.imp:not(.entete) td { padding-top: calc(.8mm + var(--etirer, 0px)) !important; padding-bottom: calc(.8mm + var(--etirer, 0px)) !important; }
body.mesure-a4 table.imp.liste-imp:not(.entete) td { padding-top: calc(.2mm + var(--etirer, 0px)) !important; padding-bottom: calc(.2mm + var(--etirer, 0px)) !important; }
  /* sinon la hauteur mesurée vaut toujours 297 mm et la fiche est réduite pour rien */
/* Safari : la largeur calculée en px débordait à droite de la page ; la fiche prend simplement toute la largeur
   disponible (page moins 10 mm de chaque côté), le zoom réduit le contenu à l'intérieur */
@media print {
  html.safari body, html.safari main { width: auto !important; min-width: 0 !important; margin: 0 !important; }
  html.safari .cadre-impression { height: auto; overflow: visible; width: auto; box-sizing: border-box; padding: 10mm 10mm 0; }
  html.safari .feuille { transform: none; zoom: var(--zoom-impression, .7); width: auto !important; max-width: none; }
}

/* Mesure de la fiche (commun.js) : on neutralise les réglages d'impression déjà appliqués.
   Safari passe en mode impression AVANT l'évènement beforeprint : sans cela il mesurait une fiche déjà réduite,
   en déduisait qu'elle tenait à 100 %, et une fiche bien remplie débordait sur une 2e page. */
html body.mesure-a4 .feuille { zoom: 1 !important; transform: none !important; width: var(--largeur-mesure, 190mm) !important; max-width: none !important; }
html body.mesure-a4 .annexe-photos { display: block !important; }
/* PDF (commun.js) : chaque feuille a exactement les proportions de la zone utile A4 (190 × 277 mm), pied de page calé en bas */
html body.pdf-a4 .feuille { min-height: calc(var(--largeur-mesure, 190mm) * 277 / 190) !important; padding-bottom: 26px; }
body.pdf-a4 .feuille > .pied-imp { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; }

/* Logo officiel CVS-Industrie (static/logo-cvs.png) : barre du haut et en-tête de la fiche */
.logo-imp img.logo-fiche { display: block; width: 100%; max-width: 62mm; height: auto; }

/* ---------- Clients, échéances, facturation ---------- */
.titre-section { margin: 1.6rem 0 .6rem; font-size: 1.2rem; }
.droite { text-align: right !important; }
.peche { color: var(--peche-texte); font-weight: 600; }
a.discret { color: inherit; text-decoration: none; } a.discret:hover { text-decoration: underline; }
.tag.recurrente { background: var(--peche-clair); color: var(--peche-texte); text-transform: none; }
form.en-ligne { display: inline; } form.planifier { display: inline-flex; gap: .3rem; align-items: center; margin-right: .4rem; }
.filtre-client label { display: flex; gap: .4rem; align-items: center; white-space: nowrap; }
.filtre-client select { width: auto; }
table.chiffres { width: 100%; border-collapse: collapse; background: var(--carte); margin-bottom: .6rem; table-layout: fixed; }
table.chiffres td { border: 1px solid var(--bord); padding: .7rem .9rem; vertical-align: top; color: var(--gris); font-size: .85rem; }
table.chiffres td b { display: block; font-size: 1.5rem; line-height: 1.2; color: var(--bleu-fonce); }
table.chiffres td small { display: block; font-size: .78rem; }
table.chiffres td.alerte { background: var(--peche-clair); }
.deroulants { border-top: 1px solid var(--bord); }
details.deroulant { background: var(--carte); border: 1px solid var(--bord); border-top: 0; }
details.deroulant > summary { display: flex; gap: .7rem; align-items: center; flex-wrap: wrap; padding: .6rem .8rem; cursor: pointer; list-style: none; }
details.deroulant > summary::-webkit-details-marker { display: none; }
details.deroulant > summary::before { content: "▸"; color: var(--bouton); width: .8rem; }
details.deroulant[open] > summary::before { content: "▾"; }
details.deroulant[open] > summary { background: var(--entete-tableau); border-bottom: 1px solid var(--bord); }
.deroulant-corps { padding: .5rem .8rem .8rem 2rem; }
details.deroulant.sous { border-top: 1px solid var(--bord); margin-top: -1px; }
details.deroulant.sous > summary { padding: .45rem .7rem; }
dl.detail-revision { display: grid; grid-template-columns: 11rem 1fr; gap: .25rem 1rem; margin: .6rem .9rem; }
dl.detail-revision dt { color: var(--gris); font-size: .85rem; }
dl.detail-revision dd { margin: 0; }
.liens-revision { margin: .2rem .9rem .7rem; font-size: .9rem; }
.methode { font-size: .82rem; max-width: 900px; }
.bilan-cartes { margin: 1rem 0; }
table.liste.compacte th, table.liste.compacte td { padding: .3rem .45rem; font-size: .88rem; }
.valeur-fixe { padding: .45rem 0; font-weight: 600; }
table.fournitures { width: 100%; border-collapse: collapse; margin-bottom: .6rem; font-size: .92rem; }
table.fournitures th { font-size: .78rem; color: var(--gris); text-align: left; padding: .2rem .3rem; }
table.fournitures td { padding: .2rem .3rem; border-bottom: 1px solid #eceff1; }
table.fournitures td:first-child { width: 40%; }
table.fournitures tfoot td { border: 0; font-weight: 600; }
input.prix { width: 6.5rem; text-align: right; }
.type-pression.obligatoire > span { color: var(--bleu-fonce); }
.type-pression.obligatoire select:invalid { border-color: var(--ko); background: var(--ko-fond); }
.factu-interne { max-width: 210mm; margin: 1rem auto; }
.bloc-echeance { display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; background: var(--carte); border: 1px solid var(--bord); padding: .7rem .9rem; margin-bottom: 1rem; }
.bloc-echeance > div { display: flex; gap: .6rem; align-items: baseline; flex-wrap: wrap; }
.bloc-echeance form { margin: 0; }
details.modifier { display: inline-block; }
details.modifier > summary { cursor: pointer; color: var(--bleu-fonce); font-size: .85rem; text-decoration: underline; }
details.modifier[open] { display: block; margin-top: .4rem; }
.reglages { max-width: 520px; }
@media screen and (max-width: 640px) {
  table.chiffres, table.chiffres tbody, table.chiffres tr { display: block; }
  table.chiffres tr { display: grid; grid-template-columns: 1fr 1fr; }
  table.chiffres td { margin: -1px 0 0 -1px; }
  dl.detail-revision { grid-template-columns: 1fr; gap: 0; }
  dl.detail-revision dd { margin-bottom: .4rem; }
  .deroulant-corps { padding-left: .4rem; }
  table.fournitures thead { display: none; }
  table.fournitures tbody tr { display: grid; grid-template-columns: 1fr 1fr; gap: .3rem; padding: .4rem 0; border-bottom: 1px solid var(--bord); }
  table.fournitures tbody td { border: 0; width: auto !important; }
  table.fournitures tbody td:first-child { grid-column: 1 / -1; }
}


/* ---------- Menu à gauche (style Chantiers CVS) : bleu nuit, logo, « + Nouvelle fiche », rubriques par section, compte en bas ;
   sur téléphone et tablette en hauteur, il sort sur le côté avec le bouton ☰ ---------- */
.entete-app { background: var(--carte); border-bottom: 3px solid var(--entete-feuille); }
.barre { display: flex; align-items: center; max-width: 1360px; min-height: 60px; margin: 0 auto; padding: 0 1.2rem; }
.logo img { display: block; height: 34px; width: auto; }
body.avec-menu .cadre { display: grid; grid-template-columns: 236px minmax(0, 1fr); min-height: calc(100vh / var(--z, 1)); zoom: var(--z, 1); }
/* Grands écrans : toute l'interface (menu, logo, textes) est agrandie au lieu d'étirer les pages ; jamais en mesure A4 ni en PDF */
@media screen and (min-width: 1800px) { body.avec-menu { --z: 1.2; } }
@media screen and (min-width: 2300px) { body.avec-menu { --z: 1.45; } }
body.mesure-a4, body.pdf-a4 { --z: 1 !important; }
.zone { min-width: 0; display: flex; flex-direction: column; } .zone > main { flex: 1; width: 100%; }
.lateral { background: var(--nav); color: var(--nav-txt); position: sticky; top: 0; height: calc(100vh / var(--z, 1)); display: flex; flex-direction: column; padding-bottom: 12px; z-index: 30; font-size: .93rem; }
.lateral a { color: inherit; text-decoration: none; }
.lateral .marque { display: block; background: var(--carte); padding: 16px 18px; }
.lateral .marque img { display: block; width: 100%; max-width: 190px; height: auto; }
.icone { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
/* menus déroulants (« + Nouvelle fiche », révisions) : panneau blanc sous ou à côté du bouton */
.menu-deroulant > summary { list-style: none; cursor: pointer; } .menu-deroulant > summary::-webkit-details-marker { display: none; }
.sous-menu { position: absolute; top: 100%; background: var(--carte); border: 1px solid var(--bord); box-shadow: 0 8px 16px rgba(0, 66, 142, .08); display: flex; flex-direction: column; z-index: 30; }
.sous-menu a, .sous-menu .lien { padding: .45rem 1rem; color: var(--texte); text-decoration: none; text-align: left; }
.sous-menu a:hover, .sous-menu .lien:hover { background: var(--teinte); color: var(--bleu-fonce); }
.titre-groupe { display: block; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: var(--gris); padding: .7rem 1rem .3rem; }
.nouveau-menu { position: relative; margin: 16px 16px 6px; }
.lateral .nouveau { display: flex; align-items: center; justify-content: center; gap: 8px; background: var(--peche); color: var(--encre); border-radius: 4px; padding: 10px 12px; font-weight: 700; cursor: pointer; list-style: none; }
.lateral .nouveau::-webkit-details-marker { display: none; }
.lateral .nouveau:hover, .nouveau-menu[open] .nouveau { filter: brightness(1.05); }
.nouveau-menu .sous-menu { top: 0; left: calc(100% + 16px); width: 21rem; border-radius: 6px; padding: .3rem 0; box-shadow: 0 10px 30px rgba(5, 20, 40, .25); }
.nouveau-menu .sous-menu a { font-weight: 600; } .nouveau-menu .sous-menu small { display: block; font-weight: 400; color: var(--gris); font-size: .78rem; }
.lateral .recherche-rapide { margin: 8px 16px 4px; }
.lateral .recherche-rapide input { min-height: 0; padding: .45rem .7rem; font-size: .88rem; border: 1px solid rgba(255, 255, 255, .14); border-radius: 4px; background: rgba(255, 255, 255, .08); color: #fff; }
.lateral .recherche-rapide input::placeholder { color: var(--nav-txt); opacity: .7; }
.lateral .recherche-rapide input:focus { background: var(--carte); color: var(--texte); border-color: #fff; box-shadow: none; }
.lateral nav { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.2) transparent; display: flex; flex-direction: column; gap: 2px; padding: 6px 10px; }
.lateral .sec { font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; opacity: .55; padding: 12px 10px 3px; }
.lateral details.groupe > a { margin-top: 2px; }
.lateral summary.sec { display: flex; align-items: center; cursor: pointer; list-style: none; border-radius: 5px; }
.lateral summary.sec::-webkit-details-marker { display: none; }
.lateral summary.sec::after { content: "▸"; margin-left: auto; font-size: .8rem; }
.lateral details[open] > summary.sec::after { content: "▾"; }
.lateral summary.sec:hover { opacity: .9; }
.lateral nav a, .lateral .moi a, .lateral .moi button { display: flex; align-items: center; gap: 11px; padding: 7px 10px; border-radius: 5px; transition: background-color .12s; }
.lateral nav a:hover, .lateral .moi a:hover, .lateral .moi button:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.lateral nav a[aria-current=page] { background: var(--nav-actif); color: #fff; font-weight: 600; box-shadow: inset 3px 0 var(--peche); }
.lateral .nb { margin-left: auto; background: var(--peche); color: var(--encre); font-size: .72rem; padding: 0 7px; border-radius: 999px; }
.lateral .moi { border-top: 1px solid rgba(255, 255, 255, .12); margin: 0 10px; padding-top: 10px; display: flex; align-items: center; gap: 2px; font-size: .86rem; }
.lateral .moi .qui { flex: 1; min-width: 0; gap: 10px; padding: 4px 6px; }
.lateral .moi .qui > span:last-child { min-width: 0; }
.lateral .rond { width: 32px; height: 32px; border-radius: 50%; background: rgba(255, 255, 255, .14); display: grid; place-items: center; font-weight: 700; color: #fff; font-size: .85rem; flex: none; }
.lateral .moi strong { display: block; color: #fff; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .lateral .moi small { display: block; font-size: .75rem; opacity: .75; }
.lateral .moi a[aria-current=page] { background: var(--nav-actif); color: #fff; }
.lateral .moi form { display: contents; }
.lateral .moi button { background: none; border: 0; color: inherit; font: inherit; cursor: pointer; }
.lateral nav .theme { display: flex; align-items: center; gap: 11px; margin-top: auto; padding: 7px 10px; border: 0; border-radius: 5px; background: none; color: inherit; font: inherit; cursor: pointer; text-align: left; }
.lateral nav .theme:hover { background: rgba(255, 255, 255, .07); color: #fff; } .theme .n, html[data-theme=nuit] .theme .j { display: none; } html[data-theme=nuit] .theme .n { display: inline; }
.barre-mobile { display: none; }
@media screen { body.avec-menu main, body.avec-menu .pied-app { max-width: none; margin: 0; padding-left: 28px; padding-right: 28px; } body.avec-menu main { padding-top: 22px; } }
@media screen and (max-width: 899px) {
  body.avec-menu .cadre { display: block; }
  .barre-mobile { display: flex; align-items: center; gap: 12px; background: var(--nav); padding: 9px 14px; position: sticky; top: 0; z-index: 25; }
  .barre-mobile img { display: block; height: 30px; background: var(--carte); padding: 3px 6px; border-radius: 3px; }
  .barre-mobile button { margin-left: auto; display: flex; background: none; border: 0; color: #fff; padding: 6px; cursor: pointer; }
  .barre-mobile svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
  .lateral { position: fixed; inset: 0 auto 0 0; width: 270px; height: auto; transform: translateX(-100%); transition: transform .2s; }
  body.menu-ouvert .lateral { transform: none; box-shadow: 0 0 0 100vmax rgba(5, 20, 40, .45); }
  .lateral nav a, .lateral .moi a, .lateral .moi button { padding: 10px; }
  .lateral .recherche-rapide input { font-size: 16px; }
  .nouveau-menu .sous-menu { position: static; width: auto; margin-top: 6px; }
  body.avec-menu main, body.avec-menu .pied-app { padding-left: .8rem; padding-right: .8rem; }
  body.avec-menu main { padding-top: .8rem; }
}

/* ---------- Haut de page commun (_tete.html) : fil, titre à gauche, boutons à droite ---------- */
.tete-page { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: .4rem 1.5rem; margin: .4rem 0 1.2rem; padding-bottom: .8rem; border-bottom: 1px solid var(--bord); }
.tete-page h1 { margin: 0; } .tete-page p { margin: .2rem 0 0; max-width: 60rem; }
.fil { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: .2rem 1rem; font-size: .85rem; }
.actions-page { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.actions-page form { display: contents; }
@media screen and (max-width: 640px) { .actions-page { flex-basis: 100%; } .actions-page > .btn, .actions-page > .choix-capteur { flex: 1 1 40%; text-align: center; } }

/* ---------- Campagnes et lots : plusieurs fiches, une page A4 chacune ---------- */
.page-lot .cadre-impression { margin: 0 auto 1.2rem; }
@media print { .page-lot .cadre-impression { margin: 0; } }
.envoi-pdf { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: end; background: var(--carte); border: 1px solid var(--bord); border-top: 3px solid var(--bouton); padding: .8rem; margin: 0 auto 1.2rem; max-width: 210mm; }
.envoi-pdf .champ { flex: 1 1 260px; }
.titre-envoi { flex-basis: 100%; margin: 0; font-weight: 700; color: var(--bleu-fonce); }
.actions-envoi { display: flex; gap: .6rem; }
.etat-envoi { flex-basis: 100%; }
.etat-envoi:empty { display: none; }
.bandeau-campagne { background: var(--peche-clair); border-left: 4px solid var(--peche); padding: .55rem .8rem; margin-bottom: .8rem; }
.barre-lot { margin: .6rem 0; }
tr.a-remplir-ligne td { background: var(--a-remplir); }
input.coche-lot { width: auto; vertical-align: middle; margin-right: .3rem; }
.campagne-form textarea { font-family: inherit; }
/* campagne : choix capteur ou vanne pour chaque appareil */
.choix-appareil { max-width: 34rem; margin: 1.5rem auto; text-align: center; }
.choix-appareil .boutons-choix { display: flex; gap: .8rem; justify-content: center; margin: 1.2rem 0 1.6rem; }
.choix-appareil .btn-choix { flex: 1; max-width: 14rem; padding: 1.1rem .5rem; font-size: 1.2rem; font-weight: 700; text-align: center; background: var(--peche); color: var(--encre); text-decoration: none; border: 1px solid var(--peche); }
.choix-appareil .btn-choix:hover { background: var(--peche-clair); }
.choix-appareil .retours-choix { display: flex; flex-direction: column; align-items: center; gap: .6rem; }
.bandeau-campagne .changer-type { float: right; font-size: .9rem; }
@media screen and (max-width: 640px) { .bandeau-campagne .changer-type { float: none; display: block; margin-top: .3rem; } }
.defile-x { overflow-x: auto; }
/* numéro de révision cliquable : liste des révisions avec date et heure */
details.revisions { display: inline-block; }
details.revisions > summary { cursor: pointer; list-style: none; color: var(--bleu-fonce); text-decoration: underline dotted; white-space: nowrap; }
details.revisions > summary::-webkit-details-marker { display: none; }
details.revisions > summary::after { content: " ▾"; font-size: .75rem; color: var(--bouton); }
details.revisions .sous-menu { left: 0; right: auto; min-width: 19rem; top: calc(100% + .3rem); border-top: 1px solid var(--bord); text-align: left; font-size: .9rem; }
details.revisions .titre-groupe { padding: .45rem 1rem .25rem; }
details.revisions .sous-menu a { display: block; padding: .45rem 1rem; white-space: normal; }
details.revisions .sous-menu a small { display: block; color: var(--gris); font-size: .8rem; }
details.revisions .sous-menu a.courante { background: var(--teinte); }
details.revisions .sous-menu a.courante b::after { content: " (celle-ci)"; font-weight: normal; color: var(--gris); }
table.liste:has(details.revisions[open]) { overflow: visible !important; }  /* le menu ne doit pas être coupé par le tableau */
details.revisions[open] .sous-menu { z-index: 40; }
/* barre des rubriques sur toute la largeur : trois parts égales, quel que soit l'écran */

/* liste des fiches : une ligne par campagne, ses fiches apparaissent au survol (ou au toucher) */
tbody.groupe-campagne tr.ligne-campagne td { background: var(--peche-clair); cursor: pointer; }
tbody.groupe-campagne tr.ligne-campagne td:first-child { box-shadow: inset 4px 0 0 var(--peche); }
tbody.groupe-campagne .nb-fiches { color: var(--bleu-fonce); font-weight: 600; }
tbody.groupe-campagne .nb-fiches::after { content: " ▾"; font-size: .75rem; color: var(--bouton); }
tbody.groupe-campagne .tag + .tag { margin-left: .2rem; }
td.reperes-campagne { max-width: 14rem; font-size: .9rem; }
tr.dans-campagne { display: none; }
tr.dans-campagne td { background: color-mix(in srgb, var(--peche-clair) 35%, var(--carte)); }
tr.dans-campagne td:first-child { box-shadow: inset 4px 0 0 var(--peche); padding-left: 1.4rem; }
tbody.groupe-campagne:hover tr.dans-campagne, tbody.groupe-campagne.ouvert tr.dans-campagne { display: table-row; }
@media screen and (max-width: 899px) {  /* liste des fiches : chaque fiche sur 3 lignes, sans défilement de côté (téléphone, tablette en hauteur) */
  table.liste.fiches { display: block; overflow: visible; }
  table.liste.fiches thead { display: none; }
  table.liste.fiches tbody { display: block; }
  table.liste.fiches tr { display: grid; grid-template-columns: auto auto 1fr auto; column-gap: .55rem; row-gap: .15rem; align-items: baseline; padding: .7rem 0; border-bottom: 1px solid var(--bord); }
  table.liste.fiches td { display: block; padding: 0; border: 0; background: transparent; min-width: 0; }
  table.liste.fiches td:nth-child(1) { grid-area: 1 / 1; font-size: 1.02rem; }
  table.liste.fiches td:nth-child(2) { grid-area: 1 / 2; color: var(--gris); font-size: .82rem; }
  table.liste.fiches td:nth-child(2)::before { content: "rév. "; }
  table.liste.fiches td:nth-child(4) { grid-area: 1 / 3; }
  table.liste.fiches td:nth-child(11) { grid-area: 1 / 4; text-align: right; }
  table.liste.fiches td:nth-child(6) { grid-area: 2 / 1; font-weight: 600; }
  table.liste.fiches td:nth-child(5) { grid-area: 2 / 2 / 3 / 4; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  table.liste.fiches td:nth-child(3) { grid-area: 2 / 4; text-align: right; color: var(--gris); font-size: .88rem; }
  table.liste.fiches td:nth-child(8) { grid-area: 3 / 1 / 4 / 4; color: var(--gris); font-size: .85rem; }
  table.liste.fiches td:nth-child(12) { grid-area: 3 / 4; text-align: right; font-size: .88rem; }
  table.liste.fiches td:nth-child(7), table.liste.fiches td:nth-child(9), table.liste.fiches td:nth-child(10) { display: none; }
  table.liste.fiches tr.dans-campagne { display: none; background: color-mix(in srgb, var(--peche-clair) 35%, var(--carte)); box-shadow: inset 4px 0 0 var(--peche); padding-left: 1.1rem; }
  table.liste.fiches tbody.groupe-campagne:hover tr.dans-campagne, table.liste.fiches tbody.groupe-campagne.ouvert tr.dans-campagne { display: grid; }
  table.liste.fiches tr.ligne-campagne { background: var(--peche-clair); box-shadow: inset 4px 0 0 var(--peche); }
  table.liste.fiches tr.ligne-campagne td:nth-child(2)::before { content: none; }
  table.liste.fiches tr.ligne-campagne td { background: transparent; box-shadow: none; }
  table.liste.fiches tr.ligne-campagne td:nth-child(1) { grid-area: 1 / 1 / 2 / 4; }
  table.liste.fiches tr.ligne-campagne td:nth-child(11) { grid-area: 1 / 4; }
  table.liste.fiches tr.ligne-campagne td:nth-child(6) { grid-area: 2 / 1 / 3 / 4; font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  table.liste.fiches tr.ligne-campagne td:nth-child(4) { grid-area: 3 / 1 / 4 / 4; }
  table.liste.fiches tr.ligne-campagne td:nth-child(4) br { display: none; }
  table.liste.fiches tr.ligne-campagne td:nth-child(2), table.liste.fiches tr.ligne-campagne td:nth-child(5), table.liste.fiches tr.ligne-campagne td:nth-child(8) { display: none; }

  table.liste.fiches tr.dans-campagne td { background: transparent; box-shadow: none; padding-left: 0; }
}
tbody.groupe-campagne .tag { white-space: nowrap; }
tbody.groupe-campagne tr.ligne-campagne .statut { white-space: nowrap; }
/* historique d'un repère */
.recherche-repere { display: flex; gap: .6rem; margin: .8rem 0 1.2rem; max-width: 34rem; }
.recherche-repere input { flex: 1; font-size: 1.05rem; }
.resume-repere { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); border: 1px solid var(--bord); background: var(--carte); margin-bottom: 1rem; }
.resume-repere > div { padding: .7rem 1rem; border-left: 1px solid var(--bord); }
.resume-repere > div:first-child { border-left: 0; }
.resume-repere b { display: block; font-size: 1.35rem; color: var(--bleu-fonce); }
.resume-repere span { color: var(--gris); font-size: .85rem; }
.bandeau-repere { background: var(--teinte); border-left: 4px solid var(--bouton); padding: .55rem .8rem; }
@media screen and (max-width: 640px) { .resume-repere > div { border-left: 0; border-top: 1px solid var(--bord); } .resume-repere > div:first-child { border-top: 0; } }
/* saisie par étapes (téléphone) */
@media screen and (max-width: 640px) {
  body.mode-etapes .sections > section { display: none; }
  body.mode-etapes .sections > section.etape-active { display: block; }
  body.mode-etapes .sections > section > h2 { display: none; }  /* le titre est dans l'en-tête d'étape */
  body.mode-etapes .actions-bas { display: none; }
  body.mode-etapes.derniere-etape .actions-bas { display: flex; bottom: 3.9rem; }
  .etapes-entete { position: sticky; top: 0; z-index: 6; background: var(--fond); padding: .45rem 0 .5rem; margin: 0 0 .4rem; border-bottom: 1px solid var(--bord); }
  .etapes-barre { display: flex; gap: 3px; }
  .etapes-barre button { flex: 1; height: 7px; padding: 0; border: 0; background: #dbe5ec; min-width: 0; }
  .etapes-barre button.faite { background: var(--bouton); }
  .etapes-barre button.en-cours { background: var(--peche); }
  .etapes-titre { display: flex; align-items: end; justify-content: space-between; margin-top: .4rem; }
  .etapes-num small { display: block; color: var(--gris); font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; }
  .etapes-num b { font-size: 1.2rem; color: var(--bleu-fonce); }
  .etapes-titre .lien { font-size: .85rem; }
  .etapes-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 7; display: grid; grid-template-columns: 3.4rem auto 1fr; gap: .5rem; padding: .55rem .7rem calc(.55rem + env(safe-area-inset-bottom)); background: var(--carte); border-top: 1px solid var(--bord); }
  .etapes-nav .btn { padding: .8rem .4rem; font-size: 1.02rem; font-weight: 700; text-align: center; }
  .etapes-nav .btn:disabled { opacity: .35; }
  .etapes-nav [data-etape="1"][hidden] { display: none; }
  body.mode-etapes.derniere-etape .etapes-nav { grid-template-columns: 1fr; }
  body.mode-etapes.derniere-etape .etapes-nav [data-etape="-1"]::after { content: " Précédent"; }
  body.mode-etapes.derniere-etape .etapes-nav [value=brouillon] { display: none; }
  body.mode-etapes main { padding-bottom: 9rem; }

  /* relevé de mesure en cartes : un point par carte, écart en couleur à droite */
  table.mesures, table.mesures tbody { display: block; width: 100%; }
  table.mesures thead { display: none; }
  table.mesures tr { display: grid; grid-template-columns: 1fr 1fr; gap: .35rem .6rem; background: var(--carte); border: 1px solid var(--bord); padding: .55rem .65rem; margin-bottom: .5rem; }
  table.mesures th, table.mesures td { border: 0; padding: 0; text-align: left; position: static !important; background: transparent !important; }
  table.mesures tr > th { font-size: 1.15rem; color: var(--bleu-fonce); align-self: center; }
  table.mesures td.ecart { grid-column: 2; grid-row: 1; text-align: right; font-weight: 700; font-size: 1.05rem; align-self: center; }
  table.mesures td.ecart.ok { color: var(--ok); } table.mesures td.ecart.ko { color: var(--ko); }
  table.mesures td[data-libelle]::before { content: attr(data-libelle); display: block; font-size: .72rem; color: var(--gris); }
  table.mesures td input { width: 100%; font-size: 1.15rem; font-weight: 600; padding: .45rem .55rem; }
  table.mesures td.incertitude, table.mesures td.decision { font-size: .85rem; color: var(--gris); align-self: end; }
  table.mesures td.decision { text-align: right; font-weight: 700; }
}
/* planche d'étiquettes QR (A4, 3 × 7, 63,5 × 38,1 mm) */
.planche { width: 210mm; height: 297mm; background: var(--carte); margin: 1rem auto; box-shadow: 0 2px 12px rgba(0,0,0,.12); padding: 15.15mm 7.25mm 0; display: grid; grid-template-columns: repeat(3, 63.5mm); grid-auto-rows: 38.1mm; column-gap: 2.5mm; box-sizing: border-box; }
.etiquette { display: grid; grid-template-columns: 27mm 1fr; gap: 2mm; align-items: center; padding: 2mm 3mm 2mm 2mm; overflow: hidden; outline: 1px dashed #c9d6e2; outline-offset: -1px; color: #14284b; font-size: 2.6mm; line-height: 1.25; }
.etiquette .qr svg { width: 27mm; height: 27mm; display: block; }
.etiquette .qr path { fill: #000; }
.etiquette .infos { display: flex; flex-direction: column; gap: .5mm; min-width: 0; }
.etiquette .infos img { height: 3.6mm; width: auto; align-self: flex-start; }
.etiquette .repere { font-size: 4.6mm; line-height: 1.1; word-break: break-all; }
.etiquette small { font-size: 2.2mm; color: #5d6b80; }
.etiquette .type { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.etiquette .date-revision { color: #14284b; font-weight: 600; white-space: nowrap; }
.outils-etiquettes { max-width: 210mm; margin: 0 auto; }
@media print {
  .page-etiquettes .planche { margin: 0; box-shadow: none; break-after: page; }
  .page-etiquettes .etiquette { outline: 0; }
}
@media screen and (max-width: 640px) { .planche { transform: scale(.45); transform-origin: 0 0; margin: 0 0 -160mm; } }
@media screen and (min-width: 641px) and (max-width: 1279px) { .planche { zoom: .88; } }
/* courbe de dérive (page appareil) */
.derive-et-resume { display: grid; grid-template-columns: 2fr 1fr; gap: 1rem; margin: 1rem 0; align-items: start; }
.derive h2 small { font-weight: 400; font-size: .85rem; }
.graphique-derive { width: 100%; height: auto; display: block; font-family: inherit; font-size: 13px; }
.graphique-derive .t-ok { fill: var(--ok); } .graphique-derive .t-gris { fill: var(--gris); } .graphique-derive .t-ko { fill: var(--ko); font-weight: 700; }
.graphique-derive .t-bleu { fill: var(--bouton); } .graphique-derive .t-texte { fill: var(--texte); font-weight: 600; }
.lecture-derive { margin: .4rem 0 0; }
table.chiffres-appareil { width: 100%; border-collapse: collapse; }
table.chiffres-appareil td { padding: .45rem .3rem; border-bottom: 1px solid #eceff1; }
@media screen and (max-width: 900px) { .derive-et-resume { grid-template-columns: 1fr; } }
@media (max-width: 640px) {
  .graphique-derive { font-size: 25px; }
  .graphique-derive .t-date { display: none; }
}

/* ---------- Page d'accueil : tableau de bord ---------- */
.btn.ajout { background: var(--peche); color: var(--encre); font-weight: 600; }
.barre-ajout { display: inline-flex; background: var(--encre); border-radius: 6px; box-shadow: 0 1px 2px rgba(0, 30, 70, .2); }
.barre-ajout > a, .barre-ajout .choix-capteur > span { display: flex; align-items: center; gap: .5rem; padding: .6rem 1rem; color: #fff; font-weight: 600; text-decoration: none; white-space: nowrap; }
.barre-ajout > * + * { border-left: 1px solid rgba(255, 255, 255, .22); }
.barre-ajout > :first-child { border-radius: 6px 0 0 6px; } .barre-ajout > :last-child { border-radius: 0 6px 6px 0; }
.barre-ajout > a:hover, .barre-ajout .choix-capteur:hover > span, .barre-ajout .choix-capteur:focus-within > span { background: #003272; }
.barre-ajout .choix-capteur .volet { border-radius: 0 0 6px 6px; min-width: 15rem; }
.barre-ajout .choix-capteur:nth-child(3) .volet { left: auto; right: 0; }   /* volet « Fiche vierge » calé à droite : ne sort pas de l'écran */
.picto { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
@media screen and (max-width: 640px) { .barre-ajout { display: flex; flex-wrap: wrap; width: 100%; } .barre-ajout > * { flex: 1 1 50%; border-radius: 0 !important; }
  .barre-ajout > :nth-child(3) { border-left: 0; } .barre-ajout > :nth-child(n+3) { border-top: 1px solid rgba(255, 255, 255, .22); }
  .barre-ajout .choix-capteur:nth-child(3) .volet { left: 0; right: auto; } .barre-ajout > a, .barre-ajout .choix-capteur > span { justify-content: center; padding: .6rem .5rem; } }
.btn.petit { padding: .3rem .7rem; font-size: .9rem; }
.tableau-accueil { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 1.1rem; align-items: stretch; margin-bottom: .6rem; }
.bloc { display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.bloc > header { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: .8rem 1.1rem; border-bottom: 1px solid var(--bord-clair); }
.bloc > header h3 { margin: 0; font-size: 1.05rem; } .bloc > header a { font-size: .85rem; white-space: nowrap; text-decoration: none; }
.bloc > header a:hover { text-decoration: underline; }
.bloc > footer { margin-top: auto; padding: .6rem 1.1rem; border-top: 1px solid var(--bord-clair); font-size: .82rem; }
.bloc > footer a { text-decoration: none; } .bloc .vide { margin: .9rem 1.1rem; }
.lignes .ligne { display: grid; grid-template-columns: 5.2rem minmax(0, 1fr) auto; align-items: center; gap: .8rem; padding: .6rem 1.1rem; color: inherit; text-decoration: none; border-top: 1px solid var(--bord-clair); }
.lignes .ligne:first-child { border-top: 0; } a.ligne:hover { background: var(--teinte); }
.ligne > .tag, .ligne > .jours { justify-self: start; margin: 0; }
.ligne .quoi { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--gris); }
.ligne .quoi b { color: var(--texte); margin-right: .3rem; } .ligne .quoi small { display: block; font-size: .8rem; overflow: hidden; text-overflow: ellipsis; }
.ligne .action { font-size: .85rem; font-weight: 600; color: var(--bouton); white-space: nowrap; } .ligne .action::after { content: " →"; }
.ligne .date { font-size: .82rem; color: var(--gris); white-space: nowrap; }
.tag.campagne { background: var(--peche-clair); color: var(--peche-texte); }
.jours { display: inline-block; min-width: 2.6rem; text-align: center; margin-right: .3rem; padding: 0 .3rem; font-size: .8rem; font-weight: 700; background: var(--peche-clair); color: var(--peche-texte); }
.jours.depasse { background: var(--ko-fond); color: var(--ko); }
.verdict-court { font-size: .72rem; font-weight: 700; letter-spacing: .04em; white-space: nowrap; }
.verdict-court.ok { color: var(--ok); } .verdict-court.ko { color: var(--ko); }
.chiffres-mois { display: grid; grid-template-columns: 1fr 1fr; background: var(--bord-clair); gap: 1px; flex: 1; }
.chiffres-mois > div { background: var(--carte); padding: .9rem 1.1rem; color: var(--gris); font-size: .9rem; }
.chiffres-mois b { display: block; font-size: 1.6rem; line-height: 1.15; color: var(--bleu-fonce); }
.chiffres-mois small { display: block; font-size: .78rem; }
.evolution { font-weight: 700; font-size: .78rem; color: var(--gris); }
.evolution.hausse { color: var(--ok); } .evolution.baisse { color: var(--ko); }

.graphiques-accueil { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem; }
.graphiques-accueil .carte { padding: .9rem 1rem; } .graphiques-client { margin-bottom: 1.6rem; }
.graphiques-accueil h3 { margin: 0 0 .5rem; font-size: 1rem; color: var(--bleu-fonce); }
.graphiques-accueil h3 small { font-weight: 400; font-size: .82rem; }
/* courbe d'étalonnage (fiche A4 et formulaire) */
.courbe-etal { margin: 2mm 0; border: 1px solid #c9d6e3; padding: 1.5mm 2mm 0; break-inside: avoid; }
.formule { text-transform: none; letter-spacing: 0; }
.courbe-etal figcaption { font-size: 9.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--bleu-fonce); }
.courbe-etal svg { width: 100%; height: auto; display: block; font-size: 10.5px; }
.courbe-etal text { fill: #34465f; stroke: none; } .courbe-etal text.axe { font-weight: 600; fill: #00428e; }
.courbe-etal .grille { stroke: #e3ebf2; } .courbe-etal polyline, .courbe-etal g line { fill: none; stroke-width: 2; }
.courbe-etal .theo { stroke: #8a97a8; stroke-dasharray: 5 4; } .courbe-etal .montee { stroke: #057ed9; } .courbe-etal .descente { stroke: #e08a1e; }
.courbe-etal line.axe2 { stroke: #e08a1e; } .courbe-etal text.axe2 { fill: #b56a0e; }
.courbe-etal .moyenne { stroke: #111; stroke-width: 1.5 !important; } .courbe-etal circle.moyenne { fill: #111; }
.courbe-etal svg[data-ech] { cursor: crosshair; touch-action: pan-y; }
.courbe-etal .curseur line { stroke: #00428e; stroke-dasharray: 3 3; } .courbe-etal .curseur rect { fill: #fff; stroke: #00428e; stroke-width: .8; }
.courbe-etal .curseur text { fill: #14284b; font-size: 12px; }
.courbe-etal .repere line { stroke: #febe74; stroke-width: 1.5; stroke-dasharray: 6 4; } .courbe-etal .repere circle { fill: #febe74; stroke: #00428e; stroke-width: 1.5; }
.courbe-etal .repere text { fill: #00428e; font-weight: 600; paint-order: stroke; stroke: #fff; stroke-width: 4px; stroke-linejoin: round; }
#points-courbe { max-width: 680px; } #points-courbe td.pc-valeurs { color: var(--gris); white-space: nowrap; } #points-courbe td:first-child { width: 9rem; } #points-courbe input[name=pc_lib] { text-align: left; }
.courbe-etal g.legende { cursor: pointer; } .courbe-etal g.eteinte { opacity: .3; } .courbe-etal .masque { display: none; }
.aide-courbe { margin: .5mm 0 1mm; font-size: 8px; color: #5d6b80; }
@media print { .courbe-etal .curseur, .courbe-etal g.eteinte, .aide-courbe { display: none; } }
body.mesure-a4 .courbe-etal .curseur, body.mesure-a4 .courbe-etal g.eteinte, body.mesure-a4 .aide-courbe { display: none; }
.courbe-etal polygon.hysteresis { fill: #febe74; fill-opacity: .45; stroke: none; } .courbe-etal .legende.hysteresis rect { fill: #febe74; fill-opacity: .6; }
.courbe-etal circle.montee { fill: #057ed9; } .courbe-etal circle.descente { fill: #e08a1e; }
.courbe-etal path.barre-u { fill: none; stroke-width: 1.2; }
.courbe-etal.grande { margin-top: 4mm; } .courbe-etal.grande figcaption { font-size: 11px; } .courbe-etal.grande svg { font-size: 12.5px; }
@media screen and (max-width: 640px) { #courbe svg, #courbe-debit svg { font-size: 20px; } }
.graphique-svg { width: 100%; height: auto; display: block; font-family: inherit; font-size: 13px; }
.graphique-svg .t-gris { fill: var(--gris); } .graphique-svg .t-texte { fill: var(--texte); font-weight: 600; }
.legende { margin: .3rem 0 0; font-size: .85rem; color: var(--gris); }
.legende b { color: var(--texte); margin-right: 1rem; }
.trait, .carre { display: inline-block; vertical-align: middle; margin: 0 .35rem 0 0; }
.trait { width: 1.4rem; height: 3px; } .trait.bleu { background: #057ed9; } .trait.gris { background: #b4c3d3; }
.carre { width: .75rem; height: .75rem; } .carre.bleu { background: #057ed9; } .carre.peche { background: var(--peche); margin-left: .8rem; }
.carre.turquoise { background: #04caef; margin-left: .5rem; }
.titre-periode { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; }
.choix-periode { display: flex; border: 1px solid var(--bouton); margin: 1.6rem 0 .6rem; }
.choix-periode a { padding: .35rem .8rem; text-decoration: none; color: var(--bouton); border-left: 1px solid var(--bouton); font-size: .9rem; background: var(--carte); }
.choix-periode a:first-child { border-left: 0; }
.choix-periode a.actif { background: var(--bouton); color: #fff; font-weight: 600; }
.choix-periode.constats { display: inline-flex; flex-wrap: wrap; margin: .2rem 0 1rem; }
#classements { margin-top: 0; }
table.classement { width: 100%; border-collapse: collapse; }
table.classement td { padding: .4rem .3rem; border-top: 1px solid var(--bord); vertical-align: middle; }
table.classement tr:first-child td { border-top: 0; }
table.classement small { display: block; }
table.classement .col-barre { width: 38%; }
table.classement .nombre { text-align: right; white-space: nowrap; font-weight: 600; width: 1%; }
table.classement .nombre small { display: inline; font-weight: 400; }
.barre-h { display: block; width: 100%; height: .8rem; background: var(--entete-tableau); }
.barre-h rect { fill: #057ed9; } .barre-h rect.capteurs { fill: #04caef; }
@media (max-width: 1000px) { .tableau-accueil { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) {
  .graphiques-accueil { grid-template-columns: minmax(0, 1fr); }
  .lignes .ligne { grid-template-columns: auto minmax(0, 1fr); padding: .55rem .8rem; } .ligne .action, .ligne .date { display: none; }
  .graphique-svg { font-size: 22px; }
  .choix-periode { width: 100%; margin-top: 0; } .choix-periode a { flex: 1; text-align: center; padding: .4rem .2rem; font-size: .8rem; }
  table.classement .col-barre { width: 30%; }
}

/* ---------- Planning des échéances ---------- */
.planning-cadre { overflow-x: auto; background: var(--carte); border: 1px solid var(--bord); }
table.planning { border-collapse: collapse; width: 100%; min-width: 980px; font-size: .9rem; }
table.planning th, table.planning td { border: 1px solid var(--bord); padding: 0; text-align: center; }
table.planning thead th { background: var(--entete-tableau); padding: .45rem .3rem; font-weight: 600; color: var(--bleu-fonce); }
table.planning thead th small { display: block; font-weight: 400; color: var(--gris); font-size: .72rem; }
table.planning .col-client { text-align: left; padding: .45rem .7rem; white-space: nowrap; background: var(--carte); position: sticky; left: 0; z-index: 1; }
table.planning thead .col-client { background: var(--entete-tableau); }
table.planning td.cellule { width: 6.2%; height: 3.4rem; }
table.planning td.cellule a, table.planning td.cellule span { display: block; height: 100%; padding: .35rem .2rem; text-decoration: none; color: inherit; }
table.planning td.cellule a:hover { outline: 2px solid var(--bouton); outline-offset: -2px; }
table.planning td.cellule b { display: block; font-size: 1.1rem; line-height: 1.1; }
table.planning td.cellule small { display: block; font-size: .64rem; line-height: 1.2; color: inherit; opacity: .85; }
table.planning td.cellule small i { font-style: normal; white-space: nowrap; }
.niveau-1 { background: var(--teinte); color: var(--bleu-fonce); } .niveau-2 { background: var(--entete-feuille); color: var(--bleu-fonce); }
.niveau-3 { background: #5cb8f0; color: #00264f; } .niveau-4 { background: #057ed9; color: #fff; }
table.planning td.cellule.retard, .carre.retard { background: var(--ko-fond); color: var(--ko); }
table.planning thead th.retard { color: var(--ko); }
table.planning td.total, table.planning tfoot td { font-weight: 700; padding: .45rem .3rem; }
table.planning tfoot th, table.planning tfoot td { background: var(--entete-tableau); }
.carre.niveau-1, .carre.niveau-2, .carre.niveau-3, .carre.niveau-4, .carre.retard { border: 1px solid var(--bord); margin-left: .6rem; }

/* ---------- Fluidité : transitions douces entre les pages et à l'ouverture des menus ---------- */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .16s; }

details[open] > .sous-menu { animation: apparition .14s ease-out; }
@keyframes apparition { from { opacity: 0; transform: translateY(-4px); } }
@media (prefers-reduced-motion: reduce) { *, ::view-transition-group(*) { animation: none !important; transition: none !important; } html { scroll-behavior: auto; } }

/* ---------- Liste des fiches : lignes compactes, matériel et n° de série en petit ---------- */
table.liste.fiches td:nth-child(8), table.liste.fiches td:nth-child(9) { font-size: .85rem; color: var(--gris); }
table.liste.fiches td { white-space: nowrap; }  /* une ligne par fiche : textes longs coupés, en entier au survol */
table.liste.fiches th, table.liste.fiches td { padding-inline: .5rem; }
table.liste.fiches td:nth-child(5), table.liste.fiches td:nth-child(6), table.liste.fiches td:nth-child(7) { max-width: 9rem; overflow: hidden; text-overflow: ellipsis; }
table.liste.fiches td:nth-child(8) { max-width: 12rem; overflow: hidden; text-overflow: ellipsis; }
table.liste.fiches td:nth-child(6) a { font-weight: 600; }
table.liste.fiches td:first-child a b { color: var(--bleu-fonce); }
.afficher-plus { display: flex; align-items: center; justify-content: center; gap: 1rem; margin: 1.2rem 0; color: var(--gris); }

/* ---------- Connexion : une carte centrée ---------- */
body.page-connexion .entete-app { display: none; }
body.page-connexion main { max-width: none; min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1.5rem 1rem; }
.connexion { width: 100%; max-width: 440px; background: var(--carte); border: 1px solid var(--bord); border-top: 4px solid var(--bleu-fonce); }
.connexion-form { padding: 2.4rem 2.4rem 2rem; }
.connexion-form h1 { margin: 0 0 .2rem; }
.connexion-form > .muted { margin: 0 0 1.3rem; }
.connexion-form .flash { margin: 0 0 1rem; }
.connexion-form .champ > span { display: flex; justify-content: space-between; align-items: baseline; }
.connexion-form .oubli { font-weight: 400; font-size: .82rem; }
.connexion-form .btn { width: 100%; min-height: 2.8rem; margin-top: .3rem; }
.connexion-form .aide, .connexion-form .autre-moyen { font-size: .85rem; color: var(--gris); margin: 1.2rem 0 0; }
/* œil des mots de passe (commun.js) */
.mdp { position: relative; display: block; }
.mdp input { width: 100%; padding-right: 2.6rem; }
.voir-mdp { position: absolute; top: 0; right: 0; bottom: 0; width: 2.5rem; display: flex; align-items: center; justify-content: center; padding: 0; border: 0; background: none; color: var(--gris); cursor: pointer; }
.voir-mdp:hover, .voir-mdp.vu { color: var(--bouton); }
.voir-mdp svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.voir-mdp .barre { display: none; } .voir-mdp.vu .barre { display: inline; }
.logo-connexion { display: block; width: 240px; max-width: 80%; margin: 0 0 1.8rem; }
@media (max-width: 720px) {
  body.page-connexion main { align-items: flex-start; padding: 0; }
  .connexion { max-width: none; border-width: 4px 0 0; min-height: 100vh; }
  .connexion-form { padding: 1.8rem 1.4rem 1.6rem; }
}

/* Fiche : interlocuteurs du client proposés en boutons sous le champ */
.choix-contacts { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: -.2rem 0 .4rem; }
.choix-contacts:empty { display: none; }
.choix-contacts .titre-choix { font-size: .82rem; color: var(--gris); margin-right: .2rem; }
.choix-contacts button { font: inherit; font-size: .9rem; padding: .35rem .7rem; border: 1px solid var(--bord); background: var(--carte); color: var(--bleu-fonce); cursor: pointer; border-radius: 2px; }
.choix-contacts button:hover { border-color: #057ed9; }
.choix-contacts button.choisi { background: #057ed9; border-color: #057ed9; color: #fff; }
.choix-contacts button small { color: inherit; opacity: .75; }
.choix-contacts .gerer-contacts { font-size: .82rem; margin-left: .4rem; }
/* Liste des clients : le nom déplie ses interlocuteurs et le formulaire d'ajout */
[data-deplier] { font: inherit; color: var(--bleu-fonce); text-decoration: none; text-align: left; padding: 0; }
[data-deplier]::after { content: " ▾"; color: #057ed9; font-size: .8em; }
[data-deplier][aria-expanded="true"]::after { content: " ▴"; }
.panneau-client td { background: #f3f8fc; padding: .8rem 1rem 1rem; white-space: normal; }
.panneau-client td > * { max-width: calc(100vw - 3rem); }
.panneau-client p { margin: 0 0 .4rem; }
.panneau-client select { width: auto; }
/* Espace client */
.bandeau-apercu { background: var(--peche-clair); padding: .6rem 1rem; margin: 0 0 1rem; }
.ajout.ligne input.large { flex: 1 1 20rem; }
b.doute { color: var(--doute); }
tr.demande-client td { background: color-mix(in srgb, var(--peche-clair) 45%, var(--carte)); }
table.liste.portail tr:target td { background: var(--teinte); } table.liste.portail tr:target td:first-child { box-shadow: inset 4px 0 0 var(--bleu-fonce); }
@media screen and (max-width: 899px) {  /* espace client : une carte par appareil (téléphone, tablette en hauteur) */
  table.liste.portail, table.liste.portail-demandes { display: block; overflow: visible; white-space: normal; }
  table.liste.portail thead, table.liste.portail-demandes thead { display: none; }
  table.liste.portail tbody, table.liste.portail-demandes tbody { display: block; }
  table.liste.portail tr:not([hidden]), table.liste.portail-demandes tr { display: grid; grid-template-columns: 1fr auto; gap: .25rem .6rem; padding: .75rem 0; border-bottom: 1px solid var(--bord); }
  table.liste.portail td, table.liste.portail-demandes td { display: block; padding: 0; border: 0; background: none !important; }
  table.liste.portail td:nth-child(3), table.liste.portail td:nth-child(4), table.liste.portail-demandes td:nth-child(5) { text-align: right; }
  table.liste.portail td:nth-child(n + 5), table.liste.portail-demandes td:nth-child(4) { grid-column: 1 / 3; }
  table.liste.portail td:empty { display: none; }
  table.liste.portail td:nth-child(5)::before { content: "Révisions : "; color: var(--gris); }
  table.liste.portail td:nth-child(6)::before { content: "Documents"; display: block; color: var(--gris); }
  table.liste.portail td:nth-child(7) .btn { width: 100%; }
  table.liste.portail tr:target { background: var(--teinte); box-shadow: inset 4px 0 0 var(--bleu-fonce); padding-left: .6rem; }
  table.liste.portail tr:target td:first-child { box-shadow: none; }
  table.liste.portail tr.panneau-client:not([hidden]) { display: block; padding: 0; }
  table.liste.portail-demandes td:nth-child(2)::before { content: "Appareil "; color: var(--gris); }
  table.liste.portail-demandes td:nth-child(3)::before { content: "souhaitée le "; color: var(--gris); }
}

/* statuts : mêmes couleurs partout (vert conforme, rouge non conforme), repérés par un carré */
@media screen { .verdict.ok, .verdict-court.ok { color: var(--ok); } .verdict.ko, .verdict-court.ko { color: var(--ko); }
  .verdict::before, .verdict-court::before { content: ""; display: inline-block; width: .55em; height: .55em; background: currentColor; margin-right: .4em; vertical-align: .05em; } }
.point-ok { fill: var(--ok); } .point-ko { fill: var(--ko); }
/* tableaux : chiffres de même largeur, quantités et montants alignés à droite pour se lire en colonne */
table.liste, table.classement { font-variant-numeric: tabular-nums; }
table.liste .nb { text-align: right; white-space: nowrap; }
/* accueil : trois chiffres qui demandent une action, cliquables */
.chiffres-cles { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1px; background: var(--bord); border: 1px solid var(--bord); margin-bottom: 1.2rem; }
.chiffres-cles > a { background: var(--carte); padding: .7rem 1rem; color: var(--gris); text-decoration: none; border-left: 4px solid var(--bouton); }
.chiffres-cles > a:hover { background: var(--teinte); }
.chiffres-cles > a.alerte { border-left-color: var(--ko); } .chiffres-cles > a.alerte b { color: var(--ko); }
.chiffres-cles b { display: block; font-size: 1.9rem; line-height: 1.1; color: var(--bleu-fonce); }
.chiffres-cles span { display: block; font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--gris); margin-bottom: .25rem; }
.chiffres-cles small { display: block; font-size: .78rem; }
@media screen and (max-width: 640px) { .chiffres-cles { grid-template-columns: 1fr; } .chiffres-cles > a { display: flex; align-items: baseline; gap: .6rem; flex-wrap: wrap; padding: .5rem .8rem; }
  .chiffres-cles b { display: inline; font-size: 1.4rem; } .chiffres-cles small { flex-basis: 100%; margin-top: -.2rem; } .chiffres-cles span { order: 1; margin: 0; } .chiffres-cles small { order: 2; } }
/* échéances et planning imprimables : sans menu ni filtres ni boutons, date du jour dans le titre, planning en paysage */
.imprime-le { display: none; }
@page paysage { size: A4 landscape; margin: 0; }
@media print {
  .imprimable main { padding: 10mm 10mm 0 !important; }
  .imprimable .imprime-le { display: inline; }
  .imprimable .actions { display: none !important; }
  .imprimable a { color: inherit; text-decoration: none; }
  .imprimable table.liste { white-space: normal; font-size: 9pt; }
  .imprimable table.liste th { position: static; }
  .imprimable thead { display: table-header-group; } .imprimable tr { break-inside: avoid; }
  .page-planning main { page: paysage; }
  .planning-cadre { overflow: visible; border: 0; }
  table.planning { min-width: 0; table-layout: fixed; font-size: 8pt; }
  table.planning .col-client { width: 30mm; }
  table.planning tfoot { display: table-row-group; }
}
table.sans-unite .col-unite, table.sans-serie .col-serie { display: none; }  /* colonnes vides dans toute la recherche */
.page-erreur { max-width: 560px; margin: 3rem auto; background: var(--carte); border: 1px solid var(--bord); border-top: 4px solid var(--bleu-fonce); padding: 1.5rem 1.8rem; }
.page-erreur h1 { margin: .1rem 0 .6rem; } .page-erreur > p:first-child { margin: 0; text-transform: uppercase; letter-spacing: .05em; font-size: .8rem; }
/* Fiche longue en recto-verso (commun.js ajusterA4) : deux cadres, en-tête et pied repris au verso */
.hors-page { display: none !important; }
.cadre-impression.verso { margin-top: 1rem; }
.recto .pied-imp::before { content: "CVS Industrie · Miramas · page 1/2"; }
.verso .pied-imp::before { content: "CVS Industrie · Miramas · page 2/2"; }
@media print { .cadre-impression.verso { break-before: page; margin-top: 0; } }
/* Capteur : transmetteur (relevé en 5 points) ou thermostat / pressostat / M.I.P. (basculements à des seuils ; M.I.P. sans instrument) */
.fiche-form.mode-seuil .si-transmetteur, .fiche-form:not(.mode-seuil) .si-seuil,
.fiche-form.mode-mip .sauf-mip, .fiche-form:not(.mode-mip) .si-mip { display: none !important; }
#seuils select { min-width: 11rem; }
/* Observation par ligne de pièce : à la saisie, et sur la fiche imprimée (texte libre, retour à la ligne) */
table.pieces td.obs-piece input { min-width: 8rem; }
.liste-imp td.obs-ligne { font-size: .92em; overflow-wrap: anywhere; }
@media (max-width: 640px) {
  table.pieces td.obs-piece, table.pieces td.fournisseur { grid-column: 1 / -1; display: flex; align-items: center; gap: .4rem; padding-left: 1.65rem; }
  table.pieces td.obs-piece::before { content: "Obs."; color: var(--gris); font-size: .85rem; }
  table.pieces td.fournisseur::before { content: "Fournisseur"; color: var(--gris); font-size: .85rem; }
}

/* « + Capteur » : la liste des types s'ouvre au survol (au toucher sur téléphone), à droite dans le menu, dessous ailleurs */
.choix-capteur { position: relative; display: inline-block; outline: 0; }
.choix-capteur > span { cursor: pointer; display: block; }
.choix-capteur > span i { font-style: normal; font-size: .75em; margin-left: .3rem; }
.choix-capteur .volet { display: none; position: absolute; left: 0; top: 100%; z-index: 45; min-width: 19rem; text-align: left;
  background: var(--carte); border: 1px solid var(--bord); box-shadow: 0 6px 14px rgba(0, 0, 0, .1); }
.choix-capteur.volet-droite, .choix-capteur.volet-gauche { display: block; }
.choix-capteur.volet-droite .volet { left: 100%; top: -1px; }
.choix-capteur.volet-gauche .volet { left: auto; right: 100%; top: -1px; }
.choix-capteur:hover > .volet, .choix-capteur:focus-within > .volet { display: block; }
.choix-capteur:hover > span, .choix-capteur:focus-within > span { background: var(--peche); }
.choix-capteur .volet a { display: block; padding: .45rem 1rem; color: var(--texte); text-decoration: none; border-top: 1px solid #eceff1; font-weight: 600; }
.choix-capteur .volet a:first-child { border-top: 0; }
.choix-capteur .volet a small { display: block; font-weight: 400; color: var(--gris); font-size: .78rem; }
.choix-capteur .volet a:hover { background: var(--teinte); color: var(--bleu-fonce); }
.sous-menu .choix-capteur > span { padding: .45rem 1rem; } .nouveau-menu .choix-capteur > span { font-weight: 600; color: var(--texte); display: flex; justify-content: space-between; }
.sous-menu .choix-capteur:hover > span, .sous-menu .choix-capteur:focus-within > span { background: var(--teinte); color: var(--bleu-fonce); }
@media screen and (max-width: 640px) {
  .choix-capteur .volet, .choix-capteur.volet-droite .volet, .choix-capteur.volet-gauche .volet { position: static; min-width: 0; box-shadow: none; border: 0; border-left: 3px solid var(--peche); }
}
table.imp td:empty::after { content: "\00a0"; }
/* fiche appareil (recensement), documents joints, parc, classement par année */
.fiche-appareil h2, .dossier-annee h2 { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.depot { display: block; border: 2px dashed var(--bouton); background: var(--entete-tableau); margin: .4rem 0 .8rem; }
.depot label { display: block; padding: 1.1rem; text-align: center; color: var(--bleu-fonce); font-weight: 600; cursor: pointer; }
.depot label small { display: block; font-weight: 400; color: var(--gris); margin-top: .2rem; }
.depot.survol { background: var(--teinte); border-style: solid; } .depot.envoi { opacity: .5; pointer-events: none; }
.documents .ext { display: inline-block; min-width: 2.4rem; text-align: center; font-size: .7rem; border: 1px solid var(--bleu-fonce); color: var(--bleu-fonce); padding: .1rem .2rem; }
.documents td small { display: block; } .fiche-appareil, #documents { margin-bottom: 1rem; }
.ligne-doc { display: grid; grid-template-columns: minmax(10rem, 15rem) 10rem 1fr auto auto; gap: .4rem; align-items: center; }
.ligne-doc > * { width: auto !important; min-width: 0; margin: 0 !important; }
.ligne-doc label { display: inline-flex; align-items: center; gap: .3rem; white-space: nowrap; font-size: .85rem; } .ligne-doc label input { width: auto !important; margin: 0; } .docs-client a { white-space: nowrap; }
@media screen and (max-width: 1099px) { .ligne-doc { grid-template-columns: 1fr 10rem; } .ligne-doc input[name=legende] { grid-column: 1 / -1; } .ligne-doc button { justify-self: end; } }
@media screen and (max-width: 640px) {
  table.documents, table.documents tbody { display: block; overflow: visible; } table.documents thead { display: none; }
  table.documents tr { display: grid; grid-template-columns: auto 1fr auto; gap: .3rem .6rem; align-items: center; padding: .5rem 0; border-bottom: 1px solid var(--bord); }
  table.documents td { border: 0; padding: 0; } table.documents td[colspan] { grid-column: 1 / -1; grid-row: 2; } }
.onglets, .onglets-annees { display: flex; gap: 1rem; flex-wrap: wrap; align-items: baseline; }
.etiquette .titre-recensement { font-size: 7pt; letter-spacing: .12em; color: var(--bleu-fonce); border-bottom: 1px solid var(--peche); }
.recensement .col-qr { width: 34mm; } .recensement td.obs-recensement { height: 38mm; vertical-align: top; }
.recensement .qr-recensement { text-align: center; } .recensement .qr-recensement svg { width: 26mm; height: 26mm; display: block; margin: 0 auto 1mm; }
.recensement .case-qr { width: 26mm; height: 26mm; margin: 0 auto 1mm; border: 1px dashed #b4c3d3; display: flex; align-items: center; justify-content: center; font-size: 7pt; color: var(--gris); }
.recensement tr.vide td { height: 7.5mm; } .recensement table.identite td { height: 7mm; } .recensement .qr-recensement small { font-size: 7pt; }
.lien-titre { font-family: var(--police-texte); font-size: .9rem; font-weight: 400; }

/* Tablette : listes sans colonnes secondaires (statut et « Modifier » restent visibles sans défiler), cases et boutons à la taille du doigt */
@media screen and (min-width: 900px) and (max-width: 1279px) {
  table.liste.fiches th:nth-child(n + 7):nth-child(-n + 10), table.liste.fiches td:nth-child(n + 7):nth-child(-n + 10) { display: none; }
}
/* ordinateur portable : le menu de gauche prend 236 px, l'unité et l'auteur (en entier au survol de la fiche) laissent la place */
@media screen and (min-width: 1280px) and (max-width: 1599px) {
  table.liste.fiches th:nth-child(7), table.liste.fiches td:nth-child(7), table.liste.fiches th:nth-child(10), table.liste.fiches td:nth-child(10) { display: none; }
  table.liste.fiches td:nth-child(8) { max-width: 9rem; }
}
@media screen and (min-width: 1280px) and (max-width: 1439px) { table.liste.fiches th:nth-child(9), table.liste.fiches td:nth-child(9) { display: none; } }
@media screen and (min-width: 641px) and (max-width: 1279px) {
  table.liste.parc th:nth-child(2), table.liste.parc td:nth-child(2), table.liste.parc th:nth-child(6), table.liste.parc td:nth-child(6) { display: none; }
}
@media screen and (pointer: coarse) and (min-width: 641px) {
  input[type=checkbox], input[type=radio] { width: 1.3rem; height: 1.3rem; }
  ul.valeurs .lien, .lien-danger { padding: .4rem .2rem; }
}

/* ---------- Bordereau de réparation des vannes (barème du client) : page en plus de la fiche, et saisie section 10 ---------- */
.bordereau { --b-bord: #9fb3c8; color: #14284b; font-variant-numeric: tabular-nums; }
.bordereau table { border-collapse: collapse; width: 100%; }
.bordereau td, .bordereau th { border: 1px solid var(--b-bord); padding: 0 2px; font-size: 7.2px; line-height: 1.15; text-align: center; }
.bordereau th, .bo-grille .bo-tot, .bo-synth .s1 td, .bo-synth .bo-lieu, .bo-synth .bo-total td, .bo-tete .bo-titre { background: var(--encre); color: #fff; border-color: #5a7fae; font-weight: 700; }
.bo-tete .bo-logo { width: 70px; padding: 3px; } .bo-tete img { height: 40px; }
.bo-tete .bo-titre { font: 700 15px var(--police-titre); height: 44px; letter-spacing: .02em; }
.bo-tete td:not(.bo-logo):not(.bo-titre) { text-align: left; padding: 3px 4px; font-size: 7.5px; } .bo-tete b { color: var(--bleu-fonce); }
.bo-grille th { font-size: 7px; padding: 2px; }
.bo-grille tr.bo-groupe td { background: var(--peche-clair); color: var(--bleu-fonce); font-weight: 700; font-size: 7.6px; padding: 2px 3px; border-left: 3px solid var(--peche); text-align: left; }
.bo-grille td { height: 17.6px; }
.bo-code { font-weight: 700; color: var(--bleu-fonce); width: 22px; }
.bo-desc { width: 150px; font-size: 6.8px !important; text-align: left !important; }
.bo-k { width: 19px; background: var(--carte); } .bo-k.off { background: #c3ccd6; } .bo-k.mod, .bo-q.plein { background: var(--peche); font-weight: 700; }
.bo-q { width: 17px; background: #fff9ef; }
.bo-grille .bo-tot { width: 34px; text-align: right; padding-right: 3px; }
.bo-transport { font-size: 6.5px !important; font-weight: 600; text-align: right !important; padding-right: 4px !important; }
.bo-bas { display: grid; grid-template-columns: 44fr 56fr; align-items: start; }
.bo-four td, .bo-four th, .bo-synth td { height: 16.5px; font-size: 7px; }
.bo-four th { text-align: left; } .bo-four td:first-child { font-style: italic; font-weight: 600; text-align: left; }
.bordereau .nb { text-align: right; white-space: nowrap; } .bordereau .b { font-weight: 700; }
.bo-synth .s2 td, .bo-synth .bo-prix { background: var(--peche-clair); font-weight: 700; } .bo-synth .bo-prix { background: var(--peche); }
.bo-synth .bo-th td { font-size: 6.6px; color: var(--gris); }
.bo-synth .bo-lieu { width: 30%; font-weight: 600; } .bo-synth small { display: block; font-size: 5.6px; color: var(--gris); font-weight: 400; }
.bo-synth .bo-total td { font-size: 10px; height: 18px; }
.feuille.bordereau .pied-imp { margin-top: 2mm; }
@media print { .cadre-impression + .cadre-impression { break-before: page; } }   /* page TOR, fiche de suivi, bordereau, fiche suivante d'un lot */
/* ---------- Fiche TOR (seconde page des vannes TOR) : comme le papier, bandes bleu acier, libellés sur fond gris ---------- */
.vanne-tor { font-family: Calibri, Carlito, var(--police-texte); color: #111; }
.feuille.vanne-tor { font-size: 9.6px; }
.vanne-tor table.nt { width: 100%; table-layout: fixed; border-collapse: collapse; border: 2px solid #111; margin-bottom: 3.5mm; }
.vanne-tor .nt td, .vanne-tor .nt th { border: 1px solid #111; padding: .4mm 1.3mm; height: 4.7mm; font-style: italic; vertical-align: middle; overflow: hidden; }
.vanne-tor .nt-lib { background: #d9d9d9; } .vanne-tor .nt-val { font-style: normal; }
.vanne-tor .nt-lib.centre, .vanne-tor .nt-sous, .vanne-tor td:has(> .nt-opt) { text-align: center; }
.vanne-tor .nt-sous { background: #d9d9d9; font-weight: 700; font-style: normal !important; }
.vanne-tor .nt-bande { background: #c5d5e8; font-size: 1.75em; font-weight: 400; text-align: center; padding: .6mm !important; }
.vanne-tor .nt-titre { background: #c5d5e8; font-size: 1.6em; font-weight: 700; font-style: normal !important; text-align: center; line-height: 1.35; }
.vanne-tor .nt-logo { background: var(--carte); text-align: left; } .vanne-tor .nt-logo img { max-width: 100%; max-height: 13mm; display: block; }
.vanne-tor .nt-repere { background: #c5d5e8; font-size: 1.3em; height: 7.5mm !important; padding-left: 6mm !important; }
.vanne-tor .nt-tag { font-weight: 700; font-style: normal !important; font-size: 1.3em; }
.vanne-tor .nt-opt { white-space: nowrap; margin: 0 .6em; } .vanne-tor .nt-opt .coche-imp { margin-left: .5em; border: 1.6px solid #111; }
.vanne-tor .nt-rem { height: 11mm !important; vertical-align: top !important; } .vanne-tor .nt-rem div { margin-top: 1mm; font-style: normal; }
.nt-pied { margin: 0; font-size: 8.5px; color: #6b7686; }
.feuille.suivi { font-size: 9px; } .suivi table.nt { margin-bottom: 2.5mm; } .suivi .nt td { height: 4.4mm; }
.suivi .su-opt, .suivi .su-code, .suivi .c { text-align: center; white-space: nowrap; } .suivi .su-code { padding: 0 !important; font-style: normal; }
.suivi .su-code.oui { background: #c5d5e8; font-weight: 700; } .suivi .su-fort { font-weight: 700; } .suivi .su-visa td { height: 9mm; vertical-align: top; }
/* saisie : même grille à la taille de l'écran, cases à remplir sans bordure */
.vanne-tor.saisie, .bordereau.saisie { color: var(--texte); color-scheme: light; }   /* pages client remplies dans le formulaire : papier blanc, même en mode nuit */
.vanne-tor.saisie { min-width: 860px; background: var(--carte); font-size: 12px; padding: 12px; }
.vanne-tor.saisie .nt td, .vanne-tor.saisie .nt th { height: 26px; padding: 1px 4px; }
.vanne-tor.saisie .nt-logo img { max-height: 52px; }
.fiche-form .vanne-tor.saisie .nt input:not([type=checkbox]), .vanne-tor.saisie textarea { flex: 1; min-width: 0; border: 0; background: #fffbe9; font: inherit; font-style: normal; padding: 2px 3px; min-height: 0; box-shadow: none; border-radius: 0; }
.vanne-tor .nt-ligne { display: flex; align-items: center; gap: .35em; white-space: nowrap; }
.vanne-tor.saisie textarea { display: block; margin-top: 3px; resize: vertical; }
.vanne-tor.saisie input:focus, .vanne-tor.saisie textarea:focus { outline: 2px solid var(--bouton); background: var(--carte); }
.vanne-tor.saisie .nt-opt { cursor: pointer; } .vanne-tor.saisie .nt-opt input { width: 16px; height: 16px; margin: 0 0 0 .4em; vertical-align: -3px; accent-color: var(--bleu-fonce); }
/* téléphone : la feuille se lit de haut en bas, une question par ligne, ses cases à la suite */
@media screen and (max-width: 700px) {
  .vanne-tor.saisie { min-width: 0; padding: 0; font-size: 14px; }
  .vanne-tor.saisie .nt, .vanne-tor.saisie .nt tbody { display: block; border-width: 0 0 2px; margin-bottom: 1rem; }
  .vanne-tor.saisie .nt colgroup, .vanne-tor.saisie .nt tr.nt-entetes, .vanne-tor.saisie .nt td.nt-logo { display: none; }
  .vanne-tor.saisie .nt tr { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 0; padding: 6px 0; border-bottom: 1px solid var(--bord); }
  .vanne-tor.saisie .nt td, .vanne-tor.saisie .nt th { display: block; border: 0; height: auto; padding: 2px 0; flex: 1 1 auto; text-align: left; }
  .vanne-tor.saisie .nt td:is(.nt-lib, .nt-val, .nt-rem, .nt-titre, .nt-repere), .vanne-tor.saisie .nt th { flex-basis: 100%; }
  .vanne-tor.saisie .nt td.nt-lib { background: none; font-size: 12px; font-weight: 600; color: var(--gris); }
  .vanne-tor.saisie .nt-lib.rbs::before { content: "RBS · "; } .vanne-tor.saisie .nt-lib.sm::before { content: "Servomoteur · "; }
  .vanne-tor.saisie .nt-bande, .vanne-tor.saisie .nt-titre, .vanne-tor.saisie .nt-repere { font-size: 15px; padding: 6px 8px !important; height: auto !important; }
  .vanne-tor.saisie .nt-opt { display: inline-flex; align-items: center; min-height: 36px; margin: 0 1rem 0 0; }
  .vanne-tor.saisie .nt-opt input { width: 22px; height: 22px; }
  .fiche-form .vanne-tor.saisie .nt input:not([type=checkbox]) { min-height: 36px; border: 1px solid #c3d1de; }
}
/* saisie : mêmes tableaux à la taille de l'écran, cases modifiables, colonne du DN encadrée */
.bordereau.saisie { min-width: 900px; background: var(--carte); }
.bordereau.saisie td, .bordereau.saisie th { font-size: 10.5px; padding: 1px 2px; }
.bordereau.saisie .bo-grille td { height: 22px; } .bordereau.saisie .bo-desc { width: 250px; font-size: 10.5px !important; padding-left: 4px !important; }
.bordereau.saisie .bo-code { width: 36px; } .bordereau.saisie .bo-tot { width: 56px; } .bordereau.saisie .bo-grille th { font-size: 9.5px; }
.bordereau.saisie .bo-tete .bo-titre { font-size: 17px; height: 44px; } .bordereau.saisie .bo-tete td:not(.bo-logo):not(.bo-titre) { font-size: 11px; padding: 4px 6px; }
.bordereau.saisie .bo-groupe td { font-size: 11px; padding: 3px 6px; } .bordereau.saisie .bo-transport { font-size: 10px !important; }
.bordereau.saisie .bo-four td, .bordereau.saisie .bo-synth td { height: 22px; } .bordereau.saisie .bo-synth small { font-size: 9px; }
.bordereau.saisie .bo-total td { font-size: 14px; height: 28px; }
.bordereau.saisie .bo-bas { margin-top: .6rem; gap: .6rem; }
#bordereau td input { width: 100%; height: 20px; min-height: 0; border: 0; border-radius: 0; background: transparent; text-align: center; font: inherit; padding: 0; min-width: 0; }
.bordereau.saisie input:hover, .bordereau.saisie input:focus { outline: 1px solid var(--bouton); }
.bordereau.saisie th.cur { background: var(--bouton); }
.bordereau.saisie td.cur { border-left: 2px solid var(--bleu-fonce); border-right: 2px solid var(--bleu-fonce); }
.bo-auto { color: var(--bouton); font-style: normal; }
.bo-reglages { display: flex; gap: 1rem; flex-wrap: wrap; padding: .6rem 0; } .bo-reglages .champ { flex: 1 1 280px; max-width: 420px; }
table.pointage { margin-top: .4rem; }
dialog.dialogue { border: 0; border-top: 4px solid var(--bleu-fonce); padding: 1.3rem 1.5rem; width: min(600px, calc(100vw - 2rem)); color: var(--texte); }
dialog.dialogue::backdrop { background: rgba(20,40,75,.45); }
dialog.dialogue .deux { grid-template-columns: repeat(2, minmax(0, 1fr)); } dialog.dialogue input, dialog.dialogue select { min-width: 0; }
.actions-dialogue { display: flex; justify-content: flex-end; gap: .6rem; flex-wrap: wrap; margin-top: 1rem; }
table.bareme td, table.bareme th { padding: .15rem .2rem; font-size: .8rem; } table.bareme td:nth-child(2) { min-width: 12rem; }
table.bareme input { width: 2.7rem; padding: .15rem .25rem; text-align: right; }
table.taux-tuo { width: auto; } table.taux-tuo td, table.taux-tuo th { padding: .3rem .6rem; } table.taux-tuo input { width: 6rem; text-align: right; } table.taux-tuo th input, table.taux-tuo td:first-child input { width: 11rem; text-align: left; font-weight: 600; }
.reglages-bordereau h2 { margin: .6rem 0 0; }

/* ---------- Habillage écran (style Chantiers CVS) : fond gris bleuté, cartes blanches à coins arrondis, chiffres clés, pastilles ;
   rien de tout cela ne s'imprime : la fiche A4 garde son rendu ---------- */
@media screen {
  body { background: var(--fond-ecran); }
  .tete-page { border-bottom: 0; margin: 0 0 1.3rem; padding: 0; }
  .tete-page h1 { font-size: 1.8rem; }
  .carte, .carte-centre, .vide, .bloc-echeance, .envoi-pdf, details.deroulant, table.chiffres, .info-revision, .rappel-etalons, .bandeau-attente,
  .feuille, .annexe-photos { border-radius: var(--rayon); }
  .carte, .carte-centre, .bloc-echeance, .envoi-pdf, .feuille, .annexe-photos { box-shadow: var(--ombre); border-color: var(--bord-carte); }
  .feuille, .annexe-photos { box-shadow: var(--ombre), 0 0 0 1px var(--bord-carte); }
  /* tableaux de liste : une carte blanche, en-têtes en petites capitales grises */
  table.liste { background: var(--carte); border: 1px solid var(--bord-carte); border-radius: var(--rayon); box-shadow: var(--ombre); }
  table.liste th { background: var(--carte); font-size: .7rem; font-weight: 700; letter-spacing: .07em; border-bottom: 1px solid var(--bord-carte); }
  table.liste th, table.liste td { padding: .55rem .6rem; }
  table.liste td { border-bottom-color: var(--bord-clair); }
  table.liste tbody tr:last-child > td { border-bottom: 0; }
  table.liste tbody tr:hover > td { background: var(--bleu-pale); }
  .defile-x:has(> table.liste) { border-radius: var(--rayon); box-shadow: var(--ombre); margin-bottom: 1rem; } .defile-x > table.liste { box-shadow: none; margin: 0; }
  /* sections des formulaires : une carte par section */
  .sections section { background: var(--carte); border: 1px solid var(--bord-carte); border-radius: var(--rayon); box-shadow: var(--ombre); padding: 1.1rem 1.3rem; margin: 0 0 1rem; }
  .sections h2 { font-size: 1.1rem; }
  .sommaire a { border-radius: 5px; }
  .sommaire a.actif { box-shadow: inset 3px 0 0 var(--bouton), var(--ombre); }
  .rm-entete, .rm-bloc { background: var(--carte); border: 1px solid var(--bord-carte); border-radius: var(--rayon); box-shadow: var(--ombre); padding: 1rem; margin: 0 0 .8rem; }
  .rm-entete .statut { top: 1rem; right: 1rem; }
  .rm-verdict { border-radius: 999px; }
  /* chiffres clés : cartes séparées avec un trait de couleur à gauche */
  .chiffres-cles { gap: 14px; background: none; border: 0; }
  .chiffres-cles > a { position: relative; border: 1px solid var(--bord-carte); border-left: 0; border-radius: var(--rayon); box-shadow: var(--ombre); padding: .85rem 1rem .85rem 1.2rem; overflow: hidden; }
  .chiffres-cles > a::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--bouton); }
  .chiffres-cles > a.alerte::before { background: var(--ko); }
  .chiffres-cles b { font-size: 1.9rem; }
  table.chiffres { border-collapse: separate; border-spacing: 0; border: 1px solid var(--bord-carte); box-shadow: var(--ombre); }
  table.chiffres td { border: 0; border-left: 1px solid var(--bord-clair); } table.chiffres td:first-child { border-left: 0; }
  /* pastilles : statut, verdict, type d'appareil */
  .statut, .verdict, .tag { display: inline-block; border-radius: 999px; padding: 1px 9px; font-size: .74rem; font-weight: 700; letter-spacing: .02em; white-space: nowrap; }
  .statut::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: currentColor; margin: 0 6px 1px 0; vertical-align: middle; }
  .verdict.ok { color: var(--ok); } .verdict.ko { color: var(--ko); }
  .tag { text-transform: none; }
  /* boutons, champs, onglets */
  .btn { border-radius: 4px; min-height: 2.3rem; padding: .4rem .95rem; font-size: .92rem; }
  .btn.secondaire, .btn.danger { border-color: var(--bord-carte); }
  .btn.secondaire:hover { border-color: var(--bouton); background: var(--carte); color: var(--bouton); }
  input, select, textarea, fieldset, .flash, .interrupteur .oui { border-radius: 4px; }
  .interrupteur .non { border-radius: 0 4px 4px 0; }
  .onglets a { border-radius: 0; border: 0; border-bottom: 3px solid transparent; margin-bottom: -1px; color: var(--gris); font-weight: 600; }
  .onglets a:hover { color: var(--bleu-fonce); }
  .onglets a.actif { background: none; border: 0; border-bottom: 3px solid var(--bouton); color: var(--bleu-fonce); }
  .info-revision, .rappel-etalons, .bandeau-attente, .bandeau-campagne { border-width: 0 0 0 4px; }
  .sous-menu { border-radius: 6px; }
  .actions-bas { box-shadow: 0 -2px 10px rgba(16, 40, 75, .06); }
  body.avec-menu .actions-bas { left: 236px; }
}
@media screen and (max-width: 899px) { body.avec-menu .actions-bas { left: 0; } }
@media print { body.avec-menu .cadre { display: block; } }

/* ---------- Formulaire de fiche : en-tête qui reste en haut, ce qui manque pour valider ---------- */
.a-completer { margin: .3rem 0 0; font-size: .85rem; color: var(--ko); } .a-completer:empty { display: none; }
.a-completer.complet { color: var(--ok); } .a-completer a { color: inherit; font-weight: 600; }
.sommaire a.manque::after { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--ko); margin-left: .45rem; vertical-align: middle; }
@media screen and (min-width: 900px) {
  .fiche-form .entete-form { position: sticky; top: 0; z-index: 6; background: var(--fond-ecran); margin: 0 -28px .8rem; padding: 14px 28px 10px; border-bottom: 1px solid var(--bord-carte); }
  .fiche-form .entete-form h1 { font-size: 1.4rem; margin: 0; }
  .fiche-form .sommaire { top: 110px; }
  .fiche-form .sections section { scroll-margin-top: calc(var(--haut-entete, 100px) + 12px); }
}
/* Formulaire de fiche, à l'écran : sections numérotées, groupes de champs, aides sous les cases */
@media screen {
  .fiche-form .sections { counter-reset: section; }
  .fiche-form .sections > section { padding: 0 1.4rem 1.2rem; }
  .fiche-form .sections > section > h2 { counter-increment: section; display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; margin: 0 -1.4rem 1rem;
    padding: .85rem 1.4rem; border-bottom: 1px solid var(--bord-clair); font-size: 1.15rem; }
  .fiche-form .sections > section > h2::before { content: counter(section); flex: none; display: grid; place-items: center; width: 1.75rem; height: 1.75rem;
    border-radius: 5px; background: var(--encre); color: #fff; font: 700 .9rem/1 var(--police-texte); }
  .fiche-form h2 small, .fiche-form h3 small { font: .78rem var(--police-texte); color: var(--gris); }
  .fiche-form .sections > section > h2 small { margin-left: auto; }
  .fiche-form h3 { font-size: 1rem; color: var(--bleu-fonce); margin: 1.1rem 0 .6rem; }
  .fiche-form h3.groupe { display: flex; align-items: center; gap: .7rem; margin: 1.1rem 0 .6rem; font: 700 .72rem var(--police-texte); letter-spacing: .08em;
    text-transform: uppercase; color: var(--gris); }
  .fiche-form h3.groupe::after { content: ""; flex: 1; border-top: 1px solid var(--bord-clair); }
  .fiche-form section > h3.groupe:first-of-type { margin-top: 0; }
  .fiche-form .grille { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .9rem 1.1rem; align-items: start; }
  .fiche-form .champ { gap: .3rem; }
  .fiche-form .champ > span { font-size: .8rem; font-weight: 600; color: var(--texte); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .fiche-form .champ > .aide { font-size: .74rem; line-height: 1.3; color: var(--gris); }
  .fiche-form .requis { color: var(--ko); font-style: normal; }
  .fiche-form input:not([type=checkbox]):not([type=radio]):not([type=file]), .fiche-form select { min-height: 2.45rem; border-color: #c3d1de; }
  .fiche-form textarea { border-color: #c3d1de; }
  .fiche-form input[readonly], .fiche-form select:disabled { background: var(--fond-ecran); border-color: var(--bord-carte); color: var(--gris); }
  .fiche-form .choix-contacts { order: 1; margin: .1rem 0 0; padding: .55rem .7rem; background: var(--bleu-pale); border-radius: 5px; font-size: .85rem; }
  .fiche-form .choix-contacts button { border-radius: 999px; padding: .15rem .7rem; min-height: 0; }
  /* cases à cocher en tuiles : on voit tout de suite ce qui est coché */
  .fiche-form .cases { gap: .4rem; }
  .fiche-form .cases label { border: 1px solid var(--bord-carte); border-radius: 5px; padding: .45rem .6rem; line-height: 1.3; }
  .fiche-form .cases label:hover { border-color: var(--bouton); }
  .fiche-form .cases label:has(input:checked) { background: var(--bleu-pale); border-color: var(--bouton); color: var(--bleu-fonce); }
  .fiche-form table.pieces tr.coche td { background: var(--bleu-pale); }
  /* visas et signatures */
  .fiche-form #s-obs > .champ { margin-bottom: 1rem; }
  .fiche-form .grille.etapes { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
  .fiche-form .visa { display: grid; gap: .6rem; padding: .8rem; border: 1px solid var(--bord-carte); border-radius: 5px; background: var(--fond-ecran); }
  .fiche-form .visa > b { font-size: .85rem; color: var(--bleu-fonce); }
  .fiche-form .grille.signatures { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
  .signature { position: relative; }
  .signature > span { font-size: .8rem; font-weight: 600; }
  .signature canvas { aspect-ratio: 5 / 2; border: 1px dashed #aebfd0; border-radius: 5px; background: var(--carte) linear-gradient(to top, transparent 22%, #d5e3ee 22%, #d5e3ee calc(22% + 1px), transparent calc(22% + 1px)); }
  .signature .effacer-signature { position: absolute; top: 0; right: 0; }
  /* explications longues repliées, photos */
  .fiche-form details.explication { margin: .4rem 0 .8rem; font-size: .82rem; color: var(--gris); }
  .fiche-form details.explication summary { cursor: pointer; color: var(--bleu-fonce); font-weight: 600; width: fit-content; }
  .fiche-form details.explication p { margin: .4rem 0 0; padding: .6rem .8rem; border-left: 3px solid var(--entete-feuille); background: var(--fond-ecran); }
  .fiche-form .ajout-photo { border-style: dashed; padding: .9rem 1.4rem; }
  .fiche-form .photo { border-radius: 5px; }
  .fiche-form .astuce { font-size: .78rem; }
  /* sommaire : numéros alignés */
  .fiche-form .sommaire a { font-size: .9rem; }
  body.mode-etapes .fiche-form .sections > section > h2 { display: none; }
  body.mode-etapes .fiche-form .sections > section { padding-top: 1rem; }
}
/* liste des fiches : une ligne de campagne passe à la ligne plutôt que d'élargir le tableau */
@media screen and (min-width: 641px) { table.liste.fiches tr.ligne-campagne td { white-space: normal; } table.liste.fiches tr.ligne-campagne td b { white-space: normal; } }

/* Rapport annuel client */
.bilan-rapport tr:nth-child(2) td { font-size: 1.2em; font-weight: 700; }
.bilan-rapport td.gauche { text-align: left; }
.aide-import { flex-basis: 100%; margin: .2rem 0 0; font-size: .9em; }
.import-apercu tr.muted td { color: var(--gris); }
.import-fichier label { max-width: 100%; min-width: 0; } .import-fichier input[type=file] { min-width: 0; max-width: 100%; }
.courbe-etal line.limite { stroke: var(--ko); stroke-dasharray: 6 4; stroke-width: 1.2; } .courbe-etal text.limite { fill: var(--ko); font-size: .85em; }

/* Relecture avant envoi et historique d'une fiche (écran seulement) */
.bandeau-relecture { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .4rem 1rem; padding: .7rem 1rem;
                     margin-bottom: 1rem; background: var(--teinte); border-left: 4px solid var(--bouton); }
.bandeau-relecture p { margin: 0; flex: 1 1 24rem; }
details.historique { max-width: 900px; margin: 1.5rem 0; background: var(--carte); border: 1px solid var(--bord); padding: .7rem 1rem; }
details.historique summary { cursor: pointer; font-family: "Alegreya", Georgia, serif; font-size: 1.1rem; color: var(--bleu-fonce); }
details.historique ol { list-style: none; margin: .8rem 0 0; padding: 0 0 0 1rem; border-left: 2px solid var(--bord); }
details.historique ol > li { position: relative; padding: 0 0 .8rem .6rem; }
details.historique ol > li::before { content: ""; position: absolute; left: calc(-1rem - 6px); top: .45rem; width: 10px; height: 10px; border-radius: 50%; background: var(--bouton); }
details.historique .quand { display: inline-block; min-width: 9.5rem; color: var(--gris); font-variant-numeric: tabular-nums; }
details.historique ul { margin: .25rem 0 0 9.5rem; padding-left: 1rem; color: var(--gris); font-size: .9rem; }
details.historique s { color: var(--ko); }
@media (max-width: 640px) { details.historique ul { margin-left: 0; } }
dialog.annoter { width: min(1100px, 96vw); max-height: 96vh; padding: .8rem; border: 0; box-shadow: 0 10px 40px rgba(0, 30, 70, .35); }
dialog.annoter::backdrop { background: rgba(10, 25, 50, .6); }
dialog.annoter canvas { display: block; max-width: 100%; max-height: 72vh; margin: .6rem auto; touch-action: none; cursor: crosshair; }
dialog.annoter p { margin: 0; text-align: center; }
.outils-annoter { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; } .outils-annoter .espace { flex: 1; }
.outils-annoter .actif { background: var(--encre); color: #fff; border-color: var(--bleu-fonce); }
tr[data-href] { cursor: pointer; } tr[data-href]:hover > td { background: var(--fond); }
mark { background: var(--peche-clair); color: inherit; padding: 0 1px; }
.entete-form .enregistre { font-family: "Open Sans", sans-serif; font-size: .8rem; color: var(--gris); margin-left: .4rem; }
.entete-form .enregistre.non-enregistre::after { content: " · modifications non enregistrées"; color: var(--doute); }
/* Signature à distance (lien envoyé au client) et dictée vocale */
.signature-distance { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: .6rem; }
.signer-tete, .signer-form { max-width: 210mm; margin: 0 auto 1rem; }
.signer-form { display: grid; gap: .8rem; margin-top: 1rem; padding: 1.2rem; }
.signer-form .btn { justify-self: start; }
.dicter { display: block; justify-self: start; align-self: flex-start; margin-top: .3rem; }
.dicter.actif { color: var(--ko); font-weight: 600; }

/* ---------- Direction « bleu nuit signature » : le haut de chaque page est un bandeau bleu nuit sur toute la largeur,
   accents pêche ; écran seulement ---------- */
@media screen {
  :root { --bandeau: #00336c; --bandeau-txt: #c4d8ef; --nav: #001f42; --nav-actif: #0b3a73; }
  html[data-theme=nuit] { --bandeau: #0f2238; --bandeau-txt: #9fb0c3; }
  .tete-page, .fiche-form .entete-form { border-image: linear-gradient(var(--bandeau) 0 0) fill 0 / 0 / 0 100vmax; color: #fff; }   /* bandeau pleine largeur sans rogner les volets */
  .tete-page { margin: 0 0 1.6rem; padding: 1.6rem 0 1.5rem; }
  body.avec-menu .tete-page, body.avec-menu .fiche-form .entete-form { margin-top: -22px; }   /* collé en haut : main garde son retrait */
  .fiche-form .entete-form { border-bottom: 0; }
  .tete-page h1, .fiche-form .entete-form h1 { color: #fff; } .tete-page h1 small, .fiche-form .entete-form h1 small { color: var(--bandeau-txt); }
  .tete-page .muted, .fiche-form .entete-form .muted, .tete-page .fil a { color: var(--bandeau-txt); } .tete-page .fil a:hover { color: #fff; }
  .fiche-form .entete-form a, .fiche-form .a-completer, .tete-page p a, .tete-page h1 a { color: var(--peche); }
  .page-accueil .tete-page { padding-bottom: 4.6rem; margin-bottom: -3.4rem; }
  .page-accueil .chiffres-cles { position: relative; }
  .chiffres-cles > a { box-shadow: 0 6px 20px rgba(0, 30, 70, .16); }
  .chiffres-cles > a::before { background: var(--peche); } .chiffres-cles > a.alerte::before { background: var(--ko); }
  .barre-ajout { background: rgba(255, 255, 255, .1); box-shadow: none; outline: 1px solid rgba(255, 255, 255, .28); }
  .barre-ajout > a:hover, .barre-ajout .choix-capteur:hover > span { background: rgba(255, 255, 255, .14); }
  .lateral nav a[aria-current=page] { box-shadow: inset 3px 0 var(--peche); }
  .bloc > header { background: var(--bleu-pale); }
}
@media screen and (max-width: 899px) { body.avec-menu .tete-page, body.avec-menu .fiche-form .entete-form { margin-top: -.8rem; } }
@media screen and (max-width: 640px) {  /* téléphone : tout centré */
  .tete-page, .fiche-form .entete-form, main h2, .etapes-titre, .chiffres-cles > a, .bloc > header { text-align: center; justify-content: center; }
  .tete-page > *, .fiche-form .entete-form > * { width: 100%; } .etapes-titre { flex-direction: column; align-items: center; }
  .tete-page h1, .tete-page .fil { text-align: center; justify-content: center; }
  .chiffres-cles > a { display: block; } .chiffres-cles b { display: block; }
  main form:not(.fiche-form) { justify-content: center; } .bloc > header { flex-direction: column; align-items: center; gap: .2rem; }
}
/* v41 saisie au clavier : valeur à vérifier (orange), message « Annuler » d'un retrait, aide des raccourcis, case cochable au clavier */
input.douteux, input.douteux:focus { border-color: var(--doute); background: var(--peche-clair); outline-color: var(--doute); }
.champ:has(.douteux) .erreur-champ { color: var(--doute); }
.flash[data-toast] button.lien { margin-left: .5rem; color: var(--peche); font-weight: 600; text-decoration: underline; background: none; border: 0; cursor: pointer; }
table.raccourcis { border-collapse: collapse; width: 100%; } table.raccourcis td { padding: .35rem .5rem; border-bottom: 1px solid var(--bord-clair); }
table.raccourcis td:first-child { white-space: nowrap; width: 1%; }
kbd { display: inline-block; min-width: 1.6em; padding: .1em .45em; border: 1px solid var(--bord); border-bottom-width: 2px; border-radius: 4px; background: var(--fond); font-family: inherit; font-weight: 600; font-size: .85rem; line-height: 1.3; text-align: center; }
.coche-imp[data-saisie]:focus-visible { outline: 2px solid var(--bouton); outline-offset: 2px; }
form#fiche { position: relative; }
.photo-case { position: absolute; z-index: 5; width: 26px; height: 26px; padding: 4px; border: 0; border-radius: 4px; background: transparent; color: var(--bleu-fonce); cursor: pointer; opacity: .75; }
.photo-case:hover { opacity: 1; background: var(--bord-clair); }
.photo-case.coin { width: 22px; height: 22px; padding: 3px; border: 1px solid var(--bord); border-radius: 50%; background: var(--carte); opacity: 1; box-shadow: var(--ombre); }
.fiche-form .avec-photo { padding-right: 32px; } .fiche-form select.avec-photo { padding-right: 56px; }
.photo-case svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
/* Mémo d'une page par rôle (aide) : A4 à l'écran comme à l'impression */
.memo { box-sizing: border-box; width: min(210mm, 100%); margin: 1rem auto; padding: 14mm 14mm 10mm; background: #fff; color: #14284b; box-shadow: var(--ombre); font-size: 10.5pt; line-height: 1.4; }
.memo header { display: flex; align-items: center; gap: 1.2rem; padding-bottom: .6rem; border-bottom: 3px solid #00428e; }
.memo header img { height: 42px; } .memo h1 { margin: 0; color: #00428e; font-size: 1.5rem; } .memo header p { margin: .1rem 0 0; color: #4a586c; }
.memo-colonnes { columns: 2; column-gap: 9mm; margin-top: 5mm; }
.memo section { break-inside: avoid; margin-bottom: 4mm; }
.memo h2 { margin: 0 0 1.5mm; padding: 1mm 2.5mm; background: #00428e; color: #fff; font-size: .95rem; letter-spacing: .02em; }
.memo ul { margin: 0; padding-left: 4.5mm; } .memo li { margin-bottom: 1mm; }
.memo kbd { background: #f6fbfe; border-color: #b9c9d9; color: #14284b; font-size: .8rem; }
.memo-ko { color: #c62828; } .memo-doute { color: #9a5b00; }
.memo footer { display: flex; flex-wrap: wrap; align-items: center; gap: 2mm 5mm; margin-top: 3mm; padding: 2.5mm 3mm; border: 1px solid #b6edff; background: #eef8fd; font-size: .85rem; }
.memo footer small { flex-basis: 100%; color: #4a586c; }
@media (max-width: 640px) { .memo { padding: 1rem; } .memo-colonnes { columns: 1; } }
@media print { .memo { width: auto; margin: 0; padding: 0; box-shadow: none; } @page { size: A4; margin: 12mm; } }
/* v43 : résultats de la recherche du menu pendant la frappe, témoin de la copie de secours d'une fiche */
.recherche-rapide { position: relative; }
.apercu-recherche { position: absolute; left: 0; top: calc(100% + 4px); width: min(440px, calc(100vw - 32px)); background: var(--carte); color: var(--texte); border: 1px solid var(--bord); border-radius: 6px; box-shadow: 0 8px 28px rgba(0, 20, 50, .22); padding: 4px 0; z-index: 60; }
.apercu-recherche a { display: grid; grid-template-columns: 74px auto 1fr; align-items: baseline; gap: 8px; padding: 7px 12px; color: inherit; }
.apercu-recherche a:hover, .apercu-recherche a:focus { background: var(--teinte); outline: none; }
.apercu-recherche .tag { justify-self: start; }
.apercu-recherche small { color: var(--gris); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.apercu-recherche a.tous { display: block; border-top: 1px solid var(--bord); margin-top: 4px; color: var(--bouton); font-weight: 600; }
.apercu-recherche p { margin: 0; padding: 8px 12px; color: var(--gris); }
.actions-bas .secours { font-size: .8rem; align-self: center; }
@media (max-width: 640px) { .actions-bas .secours { flex-basis: 100%; order: -1; } }
/* v44 : proportions sur ordinateur et tablette. Le tableau de relevés tient dans sa carte (colonnes qui rétrécissent,
   écart et décision sur deux lignes au besoin) ; s'il reste trop large (tablette en hauteur), il défile seul (commun.js) */
@media screen and (min-width: 641px) {
  table.mesures { max-width: none; }
  table.mesures th, table.mesures td { padding: .25rem; }
  table.mesures thead th { font-size: .76rem; line-height: 1.25; }
  table.mesures td input { min-width: 3.6rem; padding: .4rem .35rem; font-variant-numeric: tabular-nums; }
  table.mesures td.ecart, table.mesures td.decision { white-space: normal; }
  table.mesures td.ecart { min-width: 5.5rem; }
  table.mesures tbody th { white-space: nowrap; }
}

/* débit de fuite : cases calculées (Kv, fuite admissible classe IV, écarts) ; écart vert en deçà, rouge au-delà */
.fiche-form input[data-fuite] { color: var(--texte); font-weight: 600; }
.fiche-form input[data-fuite].ok, td[data-fuite].ok { color: var(--ok); } .fiche-form input[data-fuite].ko, td[data-fuite].ko { color: var(--ko); }
td[data-fuite] { font-weight: 600; }
/* sommaire de la fiche sur le côté, plus étroit tant que l'écran n'est pas très large : le tableau de relevés garde sa place */
@media screen and (min-width: 900px) and (max-width: 1599px) {
  .fiche-form .mise-en-page { grid-template-columns: 150px minmax(0, 1fr); gap: .8rem; }
  .fiche-form .sommaire a { font-size: .82rem; padding: .35rem .45rem; }
}
table.imp td.gauche { text-align: left; }
.bilan-calcul:empty { display: none; }

/* v47 : mise à jour installée (bandeau), avancement des sections dans le sommaire */
.bandeau-version { position: fixed; bottom: 1.2rem; left: 50%; transform: translateX(-50%); z-index: 70; display: flex; align-items: center; gap: .8rem;
                   max-width: calc(100vw - 2rem); padding: .55rem .6rem .55rem 1rem; background: var(--encre); color: #fff;
                   border-radius: 6px; box-shadow: 0 6px 20px rgba(0, 40, 90, .25); font-size: .92rem; }
.bandeau-version .btn { background: var(--peche); color: var(--encre); border-color: var(--peche); padding: .3rem .8rem; white-space: nowrap; }
.fiche-form .sommaire a { display: flex; align-items: baseline; gap: .4rem; }
.sommaire a .avancement { order: 1; margin-left: auto; font-size: .78em; font-weight: 400; color: var(--gris); font-variant-numeric: tabular-nums; }
.sommaire a .avancement.complet { color: var(--ok); }
body:has(.actions-bas) .bandeau-version { bottom: 5rem; }
.campagne-form .secours { margin-left: .8rem; font-size: .8rem; }
@media print { table.liste td.nowrap { white-space: normal; } }   /* listes imprimées : tiennent dans la largeur de la page */
/* Comptes : le rôle reste lisible en entier, les actions alignées à gauche */
table.liste form.ajout:has(> select) { flex-wrap: wrap; align-items: center; } table.liste form.ajout > select { flex: none; width: auto; } table.liste td.actions :is(.lien, .lien-danger) { text-align: left; }