:root{
    --bg:#f6f7f9; --panel:#fff; --ink:#1c2430; --muted:#657084; --line:#dfe3ea;
    --accent:#1f5eff; --accent-ink:#fff; --danger:#c62828; --ok:#1b7f3b;
  }
  @media (prefers-color-scheme: dark){
    :root{ --bg:#12161c; --panel:#1a2029; --ink:#e7ebf1; --muted:#98a3b5; --line:#2b3442;
           --accent:#5b8cff; --accent-ink:#0b1020; --danger:#ff6b6b; --ok:#4cc16f; }
  }
  *{box-sizing:border-box}
  body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif}
  .app{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100vh}
  nav{background:var(--panel);border-right:1px solid var(--line);padding:12px 8px;overflow-y:auto}
  nav h1{font-size:16px;margin:4px 10px 12px}
  nav .sec{display:block;width:100%;text-align:left;background:none;border:0;color:var(--ink);
    padding:8px 10px;border-radius:6px;font:inherit;font-weight:600;cursor:pointer}
  nav .sec:hover{background:var(--bg)}
  nav .sub{display:none;margin:0 0 4px 10px;border-left:2px solid var(--line)}
  nav .sub.open{display:block}
  nav .sub button{display:block;width:100%;text-align:left;background:none;border:0;color:var(--ink);
    padding:5px 10px;font:inherit;font-size:13px;cursor:pointer;border-radius:0 6px 6px 0}
  nav .sub button:hover:not(:disabled){background:var(--bg)}
  nav .sub button.on{background:var(--accent);color:var(--accent-ink)}
  nav .sub button:disabled{color:var(--muted);cursor:not-allowed;opacity:.65}
  main{padding:14px 18px;max-width:none;width:100%;min-width:0}
  h2{margin:0 0 14px;font-size:20px}
  h3{margin:22px 0 8px;font-size:15px}
  .bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
  input,select,button.btn{font:inherit;padding:7px 9px;border:1px solid var(--line);border-radius:6px;
    background:var(--panel);color:var(--ink)}
  input:focus,select:focus{outline:2px solid var(--accent);outline-offset:-1px}
  button.btn{cursor:pointer}
  button.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
  .card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:14px;margin-bottom:14px}
  table{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--line);border-radius:8px}
  th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
  th{color:var(--muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.03em}
  tr.click{cursor:pointer} tr.click:not([class*="l-"]):hover td{background:var(--bg)}
  td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
  .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
  label{display:block;font-size:12px;color:var(--muted);margin-bottom:3px}
  label input:not([type=checkbox]),label select{width:100%}
  label:has(> input[type=checkbox]){display:flex;align-items:center;gap:6px;color:var(--ink);font-size:14px;margin:0}
  input[type=search]{min-width:260px}
  .tag{display:inline-block;padding:1px 7px;border-radius:10px;font-size:12px;background:var(--bg);border:1px solid var(--line)}
  .msg{padding:9px 12px;border-radius:6px;margin:0 0 12px;border:1px solid var(--line);background:var(--panel)}
  .slot{position:sticky;top:8px;z-index:5}
  .msg.err{border-color:var(--danger);color:var(--danger)} .msg.ok{border-color:var(--ok);color:var(--ok)}
  .muted{color:var(--muted)}
  .pager{display:flex;gap:8px;align-items:center;margin-top:10px}
  .tabs{display:flex;gap:2px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin:14px 0}
  .tabs button{background:none;border:1px solid transparent;border-bottom:0;padding:7px 12px;font:inherit;color:var(--ink);
    cursor:pointer;border-radius:6px 6px 0 0}
  .tabs button.on{background:var(--panel);border-color:var(--line);font-weight:600;margin-bottom:-1px}
  .tabs button:disabled{color:var(--muted);cursor:not-allowed;opacity:.6}
  dl.fiche{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:6px 16px;margin:0}
  dl.fiche dt{color:var(--muted)} dl.fiche dd{margin:0;word-break:break-word}
  .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:14px}
  .keyfig{font-size:22px;font-weight:600} .keyfig small{font-size:13px;font-weight:400;color:var(--muted)}
  @media (max-width:720px){
    .app{grid-template-columns:1fr} nav{border-right:0;border-bottom:1px solid var(--line);max-height:40vh}
    nav h1{display:none} main{padding:14px 16px}
  }

/* --- ajouts : formulaires d'édition, connexion, barre utilisateur --- */
.login{max-width:340px;margin:12vh auto;padding:24px}
.login h1{margin:0 0 4px;font-size:22px} .login p{margin:0 0 16px;color:var(--muted)}
.login label{margin-bottom:12px}
.user{margin:auto 0 0;padding:10px;border-top:1px solid var(--line);font-size:13px}
nav{display:flex;flex-direction:column}
.editgrid{display:grid;grid-template-columns:minmax(140px,200px) 1fr;gap:6px 14px;align-items:center}
.editgrid label{margin:0;color:var(--muted)}
.editgrid input:not([type=checkbox]),.editgrid select,.editgrid textarea{width:100%}
textarea{font:inherit;padding:7px 9px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);min-height:80px}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0;align-items:center}
button.danger{color:var(--danger);border-color:var(--danger)}
.banner{padding:9px 12px;border-radius:6px;margin:0 0 12px;background:var(--panel);border:1px solid var(--danger);color:var(--danger)}
.foot{color:var(--muted);font-size:12px;margin-top:8px}
button:disabled{opacity:.55;cursor:not-allowed}

/* --- dialogues, notifications, squelettes --- */
.modal-overlay{position:fixed;inset:0;background:rgba(10,14,20,.5);display:flex;align-items:flex-start;justify-content:center;padding:8vh 16px;z-index:100;overflow:auto}
.modal{background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:18px 20px;width:100%;max-width:460px;box-shadow:0 18px 50px rgba(0,0,0,.28)}
.modal.wide{max-width:760px}
.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px;flex-wrap:wrap}
#toasts{position:fixed;top:14px;right:14px;display:flex;flex-direction:column;gap:8px;z-index:120;max-width:min(420px,calc(100vw - 28px))}
.toast{padding:10px 14px;border-radius:8px;background:var(--panel);border:1px solid var(--line);box-shadow:0 6px 24px rgba(0,0,0,.18);transition:opacity .4s,transform .4s}
.toast.ok{border-color:var(--ok);color:var(--ok)} .toast.err{border-color:var(--danger);color:var(--danger)}
.toast.partir{opacity:0;transform:translateX(20px)}
.squelette .barre{height:14px;border-radius:6px;background:linear-gradient(90deg,var(--line),var(--bg),var(--line));background-size:200% 100%;animation:sq 1.2s infinite;margin:12px 0}
@keyframes sq{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.squelette .barre{animation:none}.toast{transition:none}}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
thead th{position:sticky;top:0;background:var(--panel);z-index:1}

/* --- recherche globale, tableau de bord --- */
.palette{background:var(--panel);border:1px solid var(--line);border-radius:12px;width:100%;max-width:620px;box-shadow:0 18px 50px rgba(0,0,0,.3);overflow:hidden}
.palette input{width:100%;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:14px 16px;font-size:16px;background:transparent}
.palette input:focus{outline:none}
.palette-liste{max-height:52vh;overflow:auto}
.palette-groupe{padding:8px 16px 2px;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.palette-item{display:flex;justify-content:space-between;gap:12px;padding:8px 16px;cursor:pointer}
.palette-item.on{background:var(--accent);color:var(--accent-ink)} .palette-item.on .muted{color:inherit;opacity:.8}
.palette-pied{padding:8px 16px;border-top:1px solid var(--line);font-size:12px}
kbd{border:1px solid var(--line);border-bottom-width:2px;border-radius:4px;padding:0 5px;font:12px system-ui;background:var(--bg)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.kpi{text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px 14px;cursor:pointer;color:var(--ink);font:inherit}
.kpi:hover{border-color:var(--accent)} .kpi-titre{font-size:12px;color:var(--muted)} .kpi-valeur{font-size:24px;font-weight:650;margin:2px 0;font-variant-numeric:tabular-nums}
.kpi.attention{border-left:4px solid var(--accent)} .kpi.alerte{border-left:4px solid var(--danger)}
.graphique{width:100%;height:auto} .barre{fill:var(--line)} .barre-actuelle{fill:var(--accent)} .graphique-lib{font-size:10px;fill:var(--muted)}
.raccourcis{display:flex;gap:8px;flex-wrap:wrap}
.search-btn{display:flex;justify-content:space-between;align-items:center;width:100%;margin:0 0 10px;padding:7px 10px;border:1px solid var(--line);border-radius:6px;background:var(--bg);color:var(--muted);font:inherit;cursor:pointer}
.menu-toggle{display:none}
@media (max-width:720px){
  .menu-toggle{display:block;position:fixed;top:10px;left:10px;z-index:60;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:6px 10px;font:inherit;color:var(--ink)}
  .app nav{display:none} .app.nav-open nav{display:flex;position:fixed;inset:0;z-index:55;max-height:none;padding-top:52px}
  main{padding-top:52px !important}
}

/* --- catalogue d'articles, suggestions, colonnes, livraison --- */
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}
.petit{font-size:12px}
.cat-overlay{padding:3vh 12px;align-items:flex-start}
.cat{background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:12px;width:100%;max-width:1180px;height:92vh;display:flex;flex-direction:column;box-shadow:0 18px 50px rgba(0,0,0,.3)}
.cat-tete{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line)}
.cat-filtres{padding:10px 16px;margin:0;border-bottom:1px solid var(--line)}
.cat-filtres input[type=search]{flex:1 1 320px;font-size:16px;padding:9px 12px}
.cat-filtres select{max-width:230px}
.cat-resultats{flex:1;overflow:auto;padding:14px 16px}
.cat-pied{display:flex;align-items:center;gap:12px;padding:10px 16px;border-top:1px solid var(--line)}
.cat-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:12px}
.carte{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--panel)}
.carte:hover,.carte:focus-within{border-color:var(--accent)}
.carte.deja{background:color-mix(in srgb,var(--accent) 7%,var(--panel))}
.carte-img{position:relative;aspect-ratio:5/2;background:var(--bg);display:flex;align-items:center;justify-content:center}
.carte-img .vignette{width:100%;height:100%}
.vignette{object-fit:contain;display:block}
.tuile{display:flex;align-items:center;justify-content:center;font-weight:700;font-size:22px;letter-spacing:.04em;color:hsl(var(--teinte) 45% 32%);background:hsl(var(--teinte) 60% 92%)}
@media (prefers-color-scheme:dark){.tuile{color:hsl(var(--teinte) 60% 80%);background:hsl(var(--teinte) 30% 22%)}}
.chip-deja{position:absolute;top:8px;right:8px;background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.carte-corps{padding:10px 12px;display:flex;flex-direction:column;gap:3px;flex:1}
.carte-ref{font-weight:700}
.carte-des{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
.carte-prix{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-top:4px} .carte-prix strong{font-size:18px}
.barre-prix{text-decoration:line-through;color:var(--muted)}
.carte-act{display:flex;gap:6px;padding:0 12px 12px}
.cat-qte{width:78px;text-align:right}
.stock{display:inline-block;align-self:flex-start;padding:1px 8px;border-radius:10px;font-size:12px;font-weight:600;border:1px solid}
.stock small{font-weight:400}
.stock.ok{color:var(--ok);border-color:var(--ok)} .stock.warn{color:#b26a00;border-color:#b26a00}
@media (prefers-color-scheme:dark){.stock.warn{color:#ffb454;border-color:#ffb454}}
.stock.bad{color:var(--danger);border-color:var(--danger)} .stock.neutre{color:var(--muted);border-color:var(--line)}
.cat-l-img{width:54px} .cat-l-img .vignette{width:44px;height:44px;border-radius:6px}
.cat-l-act{display:flex;gap:6px;justify-content:flex-end;white-space:nowrap}
.sugg{position:fixed;z-index:130;max-height:min(58vh,440px);overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 36px rgba(0,0,0,.28)}
.sugg-item{display:flex;align-items:center;gap:10px;padding:7px 10px;cursor:pointer;border-bottom:1px solid var(--line)}
.sugg-item:last-child{border-bottom:0}
.sugg-item .vignette{width:38px;height:38px;border-radius:6px;flex:none;font-size:14px}
.sugg-item.on{background:color-mix(in srgb,var(--accent) 14%,var(--panel))}
.sugg-txt{display:flex;flex-direction:column;min-width:0;flex:1} .sugg-txt span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sugg-droite{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex:none}
.sugg-vide{padding:12px 14px}
.cols-choix{max-height:52vh;overflow:auto}
.cols-ligne{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:3px 0;border-bottom:1px solid var(--line)}
.cols-mv{display:flex;gap:4px} .cols-mv .btn{padding:2px 8px}
.livraison-bloc{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;align-items:end}
.totaux-box{max-width:460px;margin-left:auto}
.totaux-box td,.totaux-box th{padding:5px 10px}
.totaux-box .remise-ligne input{width:70px;text-align:right}
.retrait-info{padding:8px 12px;border-radius:8px;border:1px dashed var(--accent);color:var(--accent);margin-top:8px}
.btn-ligne{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}

/* --- aperçu d'impression, suivi des commandes --- */
.apercu-overlay{padding:2vh 12px}
.apercu{background:var(--panel);border:1px solid var(--line);border-radius:12px;width:100%;max-width:1000px;height:96vh;display:flex;flex-direction:column;box-shadow:0 18px 50px rgba(0,0,0,.3)}
.apercu-frame{flex:1;border:0;background:#fff;border-radius:0 0 12px 12px}
tr.l-totale td{background:rgba(46,160,90,.20)} tr.l-plus50 td{background:rgba(240,140,60,.24)} tr.l-moins50 td{background:rgba(235,205,60,.26)}
tr.l-hors_catalogue td{background:rgba(70,130,255,.16)} tr.l-bloquee td{background:rgba(215,60,60,.24)}
tr.click.l-totale:hover td,tr.click.l-plus50:hover td,tr.click.l-moins50:hover td,tr.click.l-hors_catalogue:hover td,tr.click.l-bloquee:hover td{filter:brightness(.95)}
.pastille{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;font-size:11px;font-weight:700;color:#fff;margin-right:3px;vertical-align:middle}
.pastille.non{background:#c94a4a} .pastille.partielle{background:#e0a020} .pastille.totale{background:#3b9a5d}
.pastille.a_faire{background:#c94a4a} .pastille.partiel{background:#e0a020} .pastille.effectue{background:#3b9a5d}
.puce{display:inline-block;width:38px;height:14px;border-radius:3px;vertical-align:middle;margin-right:8px;border:1px solid var(--line)}
.puce.l-totale{background:rgba(46,160,90,.35)} .puce.l-plus50{background:rgba(240,140,60,.4)} .puce.l-moins50{background:rgba(235,205,60,.45)} .puce.l-hors_catalogue{background:rgba(70,130,255,.3)} .puce.l-bloquee{background:rgba(215,60,60,.4)}
.avancement{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-bottom:12px}
.avancement button{text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px 12px;color:var(--ink);font:inherit;cursor:pointer}
.avancement button:hover{border-color:var(--accent)} .avancement b{font-size:20px;font-variant-numeric:tabular-nums}
.filtres-grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px 12px;align-items:end;margin-bottom:10px}
.filtres-grille label{margin:0} .filtres-grille input,.filtres-grille select{width:100%}
.legende h4{margin:14px 0 6px} .legende p{margin:4px 0}

/* --- bon de préparation / livraison : deux listes --- */
.transfert{display:grid;grid-template-columns:minmax(0,1fr) 130px minmax(0,1fr);gap:12px;align-items:start}
.transfert > div:not(.transfert-milieu){max-height:340px;overflow:auto}
.transfert-milieu{display:flex;flex-direction:column;gap:8px;align-items:stretch;padding-top:34px}
.transfert-milieu label{margin:0}
.transfert-milieu input{width:100%}
@media (max-width:900px){.transfert{grid-template-columns:1fr}.transfert-milieu{flex-direction:row;flex-wrap:wrap;padding-top:0}}
/* --- affaire --- */
.affaire-haut{display:grid;grid-template-columns:minmax(300px,1fr) minmax(300px,1.4fr);gap:14px;align-items:start}
.affaire-bas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:6px}
.affaire-bas .card{margin:0;display:flex;flex-direction:column;min-height:230px}
.affaire-bas .card > div.tableau{flex:1;overflow:auto}
.affaire-bas h3{margin:0 0 8px}
.recap{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 24px}
.recap div{display:flex;justify-content:space-between;gap:10px;font-variant-numeric:tabular-nums}
@media (max-width:1100px){.affaire-haut,.affaire-bas{grid-template-columns:1fr}}
.transfert table th,.transfert table td{padding:6px 8px;font-size:13px}

/* --- pleine largeur, menu repliable --- */
.nav-tete{display:flex;align-items:center;justify-content:space-between;padding-right:4px}
.nav-tete h1{margin:4px 10px 12px}
.nav-replier{padding:2px 9px;font-size:16px}
.nav-rouvrir{display:none;position:fixed;top:8px;left:8px;z-index:40;padding:4px 10px}
.app.nav-collapsed{grid-template-columns:0 minmax(0,1fr)}
.app.nav-collapsed nav{display:none}
.app.nav-collapsed .nav-rouvrir{display:block}
.app.nav-collapsed main{padding-top:46px;grid-column:2}
.app.nav-collapsed{display:block}
.cat{max-width:min(1900px,98vw)}
.apercu{max-width:min(1200px,98vw)}
label.case{display:flex;align-items:center;gap:6px;color:var(--ink);font-size:14px;margin:3px 0}
label input[type=radio]{width:auto}
.type-libre{margin-top:4px;font-size:12px;padding:2px 4px;max-width:150px}
.barres-mois{display:flex;align-items:flex-end;gap:4px;height:140px;padding:6px 0;border-bottom:1px solid var(--line)}
.barre-mois{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;min-width:0}
.barre-mois div{width:100%;background:var(--accent);border-radius:3px 3px 0 0;min-height:2px}
.barre-mois span{font-size:10px;color:var(--muted);margin-top:2px}

/* ======================= Refonte visuelle : menu, onglets, fiches ======================= */
:root{--ombre:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.08);--rayon:10px}
body{-webkit-font-smoothing:antialiased}
h2{font-size:22px;letter-spacing:-.01em}
.card{box-shadow:var(--ombre);border-radius:var(--rayon)}
button.btn{transition:background .12s,border-color .12s,filter .12s}
button.btn:hover:not(:disabled){border-color:var(--accent)}
button.primary:hover:not(:disabled){filter:brightness(1.08)}
.tag.alerte{color:var(--danger);border-color:var(--danger)}

/* Menu : familles colorées, dépliées par défaut, pictogrammes */
.app{grid-template-columns:270px minmax(0,1fr)}
nav{padding:12px 10px}
nav h1{display:flex;align-items:center;gap:8px;font-size:18px;margin:4px 6px 12px}
nav h1 .logo{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:var(--accent);color:var(--accent-ink);font-size:18px}
nav .sec{display:flex;align-items:center;gap:10px;margin-top:8px;padding:8px 10px;border-radius:10px;font-weight:650;
  background:hsl(var(--teinte,210) 75% 96%);border:1px solid hsl(var(--teinte,210) 45% 88%);color:hsl(var(--teinte,210) 50% 26%)}
nav .sec:hover{background:hsl(var(--teinte,210) 75% 93%)}
nav .sec .ico-sec,nav .sec .ico{width:28px;height:28px;flex:none;display:grid;place-items:center;border-radius:8px;font-size:16px;background:hsl(var(--teinte,210) 70% 90%)}
nav .sec .chev{margin-left:auto;font-size:12px;opacity:.7;transition:transform .15s}
nav .sec[aria-expanded="false"] .chev{transform:rotate(-90deg)}
nav .sec.accueil{--teinte:210}
nav .sub{margin:4px 0 8px 16px;padding-left:6px;border-left:2px solid hsl(var(--teinte,210) 45% 80%)}
nav .sub button{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;font-size:13.5px}
nav .sub button .ico{width:22px;text-align:center;flex:none;font-size:15px}
nav .sub button:hover:not(:disabled){background:hsl(var(--teinte,210) 70% 95%)}
nav .sub button.on{background:hsl(var(--teinte,210) 62% 44%);color:#fff;font-weight:600}
@media (prefers-color-scheme:dark){
  nav .sec{background:hsl(var(--teinte,210) 28% 19%);border-color:hsl(var(--teinte,210) 25% 27%);color:hsl(var(--teinte,210) 65% 86%)}
  nav .sec:hover{background:hsl(var(--teinte,210) 28% 23%)}
  nav .sec .ico-sec,nav .sec .ico{background:hsl(var(--teinte,210) 30% 27%)}
  nav .sub{border-left-color:hsl(var(--teinte,210) 25% 32%)}
  nav .sub button:hover:not(:disabled){background:hsl(var(--teinte,210) 25% 22%)}
  nav .sub button.on{background:hsl(var(--teinte,210) 55% 40%)}
}

/* Onglets */
.tabs{display:flex;flex-wrap:wrap;gap:4px;border-bottom:2px solid var(--line);margin:16px 0 16px;padding:0 4px}
.tabs button{display:flex;align-items:center;gap:6px;padding:9px 14px;margin-bottom:-2px;border:1px solid transparent;border-bottom:2px solid transparent;border-radius:10px 10px 0 0;
  background:transparent;color:var(--muted);font:inherit;font-weight:500;cursor:pointer}
.tabs button .ico{font-size:15px}
.tabs button:hover:not(:disabled):not(.on){background:var(--panel);color:var(--ink);border-color:var(--line);border-bottom-color:transparent}
.tabs button.on{background:var(--panel);color:var(--accent);font-weight:650;border-color:var(--line);border-bottom-color:var(--panel);box-shadow:inset 0 3px 0 var(--accent)}
.tabs button:disabled{opacity:.45}

/* Fiches : en-tête, champs toujours visibles */
.fiche-tete{display:flex;align-items:center;gap:14px;margin:6px 0 4px}
.fiche-tete .avatar{width:52px;height:52px;flex:none;display:grid;place-items:center;font-size:26px;border-radius:14px;background:var(--panel);border:1px solid var(--line);box-shadow:var(--ombre)}
.fiche-sous{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin-top:4px;font-size:13px}
.editgrid{row-gap:8px}
.editgrid.lecture{align-items:stretch}
.editgrid.lecture label{display:flex;align-items:center}
.champ{min-height:36px;padding:7px 10px;border:1px solid var(--line);border-radius:6px;background:var(--bg);word-break:break-word;display:flex;align-items:center}
.champ.vide{background:transparent;border-style:dashed}
.champ.multi{min-height:78px;align-items:flex-start;white-space:pre-wrap}
.case-lue{width:20px;height:20px;display:inline-grid;place-items:center;border:1.5px solid var(--line);border-radius:5px;background:var(--bg);font-size:13px;font-weight:700;color:var(--accent-ink)}
.case-lue.on{background:var(--accent);border-color:var(--accent)}
.editgrid input:not([type=checkbox]),.editgrid select,.editgrid textarea{border-color:var(--line)}
.encours{margin-top:10px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:var(--bg);font-size:13px}
.encours.alerte{border-color:var(--danger);color:var(--danger);background:color-mix(in srgb,var(--danger) 7%,var(--panel))}
.signature-zone{border:2px dashed var(--line);border-radius:10px;background:#fff;touch-action:none;width:100%;height:220px;display:block}
.carte-frame{width:100%;height:320px;border:0;border-radius:8px;background:var(--bg);display:block}
.maj{text-transform:uppercase}
.champ.vide.oblig{border-color:var(--danger);color:var(--danger);font-size:12px;font-style:italic}
input.invalide,select.invalide,textarea.invalide{border-color:var(--danger) !important;outline:2px solid color-mix(in srgb,var(--danger) 30%,transparent)}
.banniere-entreprise{margin:0 0 12px;padding:8px 12px;border:1px solid var(--ok);border-radius:8px;color:var(--ok);background:color-mix(in srgb,var(--ok) 7%,var(--panel));font-size:13px}
.zone-depot{border:2px dashed var(--line);border-radius:10px;padding:18px;text-align:center;color:var(--muted)}
.zone-depot.survol{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 6%,var(--panel));color:var(--ink)}
.kpi.tache.fait{opacity:.6}
.kpi.tache.fait .kpi-valeur{color:var(--ok)}
tr.l-en_edition td{background:rgba(140,140,140,.30)} tr.click.l-en_edition:hover td{filter:brightness(.95)} .puce.l-en_edition{background:rgba(140,140,140,.45)}
.exp-haut{align-items:start} .exp-haut .apercu-commande{max-height:260px;overflow:auto} .exp-bas{position:sticky;bottom:0;margin-top:10px}
/* ---- Terminal de préparation (Zebra TC26) : gros caractères, gros boutons ---- */
body.mode-terminal .app{display:block} body.mode-terminal .app nav,body.mode-terminal .menu-toggle,body.mode-terminal .nav-rouvrir{display:none !important}
body.mode-terminal main{padding:8px;max-width:760px;margin:0 auto}
.term-zone{font-size:16px} .term-tete{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:8px} .term-tete strong{margin-right:auto;font-size:18px}
.term-tete .btn{padding:10px 12px;font-size:15px}
.term-scanbar{position:sticky;top:0;z-index:5;background:var(--bg);padding:4px 0}
.term-scan{width:100%;font-size:20px;padding:14px 12px;border:3px solid var(--accent);border-radius:10px;box-sizing:border-box}
.term-msg{margin:8px 0;padding:14px;border-radius:10px;font-size:18px;font-weight:600;background:var(--panel);border:1px solid var(--line)}
.term-msg.ok{background:rgba(46,160,90,.18);border-color:#2ea05a} .term-msg.err{background:rgba(215,60,60,.18);border-color:#d73c3c} .term-msg.info{background:rgba(70,130,255,.15);border-color:#4682ff}
.term-carte{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px;margin:8px 0} .term-alerte{border-color:#d73c3c} .term-ok{border-color:#2ea05a}
.term-attente{background:rgba(240,140,60,.15);border:2px solid #f08c3c;border-radius:10px;padding:14px;margin:8px 0;text-align:center}
.term-gros{font-size:28px;font-weight:800} .term-invite{font-size:20px;font-weight:700;margin:10px 0} .term-qte{display:flex;gap:16px;justify-content:center;align-items:center;font-size:26px;margin:8px 0}
.term-qte .btn{width:56px;height:56px;font-size:28px}
.term-ligne{display:flex;gap:10px;align-items:center;border-top:1px solid var(--line);padding:8px 0} .term-emp{min-width:84px;font-size:20px;font-weight:800;background:rgba(70,130,255,.15);border-radius:8px;text-align:center;padding:8px 4px}
.term-corps{flex:1;min-width:0} .term-nb{font-size:22px;font-weight:800}
.term-cmd{border-top:1px solid var(--line);padding:8px 0} .term-cmd.fait strong{color:#2ea05a} .term-barre{height:10px;background:var(--line);border-radius:5px;margin:4px 0;overflow:hidden} .term-barre span{display:block;height:100%;background:#2ea05a}
.term-actions{display:flex;flex-direction:column;gap:8px;margin-top:10px} .term-grand{padding:16px;font-size:18px} .term-lot{display:block;width:100%;margin:6px 0;padding:14px;font-size:17px}
.term-etape{background:var(--panel);border:2px solid var(--accent);border-radius:12px;padding:14px;margin:8px 0;text-align:center}
.term-titre{font-size:17px;font-weight:700;margin-top:10px;color:var(--muted)} .term-sous{font-size:14px;color:var(--muted)}
.term-empgros{font-size:44px;font-weight:900;letter-spacing:1px;background:rgba(70,130,255,.15);border-radius:10px;padding:10px;margin:6px 0}
.term-prendre{font-size:28px;margin:6px 0} .term-qtegrosse{font-size:40px;font-weight:900;color:#f08c3c}
.term-etapes{display:flex;flex-direction:column;gap:8px;margin-top:12px;text-align:left} .term-pas{padding:12px;border-radius:10px;border:1px solid var(--line);font-size:17px;opacity:.75}
.term-pas.courant{opacity:1;border:2px solid #4682ff;background:rgba(70,130,255,.10);font-weight:700} .term-pas.ok{background:rgba(46,160,90,.15);border-color:#2ea05a;opacity:1}
.term-progres{margin:6px 0} .term-bacmap{display:flex;gap:12px;align-items:center;text-align:left;border-top:1px solid var(--line);padding:8px 0}
.term-scanbar{display:flex;gap:6px;align-items:stretch} .term-scanbar .term-scan{flex:1;min-width:0} .term-ok{padding:0 18px;font-size:18px}
/* ---- Terminal v2 : plein écran TC26 (≈ 360 × 640), une consigne à la fois, sans défilement ---- */
body.mode-terminal{overflow:hidden;overscroll-behavior:none} body.mode-terminal main{padding:0;max-width:none;margin:0}
.term-zone{display:flex;flex-direction:column;height:100vh;height:100dvh;padding:6px;gap:6px;box-sizing:border-box;font-size:15px;position:relative}
.term-tete{display:flex;gap:6px;align-items:center;flex:none} .term-tete .btn{padding:9px 10px;font-size:14px;flex:none} .term-lotnom{flex:1;text-align:center;font-weight:700;color:var(--muted);white-space:nowrap}
.term-scanbar{display:flex;gap:6px;align-items:stretch;flex:none;position:static;padding:0} .term-scanbar .btn{padding:0 12px;font-size:16px}
.term-scan{width:auto;flex:1;min-width:0;font-size:18px;padding:10px;border:3px solid var(--accent);border-radius:10px;box-sizing:border-box}
.term-msg{flex:none;margin:0;padding:8px 10px;border-radius:10px;font-size:14px;font-weight:600;line-height:1.25;max-height:3.9em;overflow:hidden;background:var(--panel);border:1px solid var(--line)}
.term-main{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column} .term-main>*{margin:0 !important} .term-main>.term-etape,.term-main>.term-carte{flex:1}
.term-bas{flex:none;display:flex;flex-direction:column;gap:6px} .term-bas .term-grand{padding:14px;font-size:17px}
.term-etape{display:flex;flex-direction:column;justify-content:center;gap:4px;padding:10px;background:var(--panel);border:2px solid var(--accent);border-radius:12px;text-align:center}
.term-titre{font-size:14px;font-weight:700;color:var(--muted);margin-top:6px} .term-sous{font-size:13px;color:var(--muted)}
.term-empgros{font-size:34px;font-weight:900;letter-spacing:1px;background:rgba(70,130,255,.15);border-radius:10px;padding:6px}
.term-prendre{font-size:26px;line-height:1.15} .term-invite{font-size:19px;font-weight:800;margin:8px 0 2px;color:var(--accent)}
.term-phase-bac{background:rgba(240,140,60,.18);border-color:#f08c3c} .term-phase-bac .term-invite{color:#c25e00}
.term-recap{font-size:17px;background:rgba(46,160,90,.18);border-radius:8px;padding:6px}
.term-bacgros{font-size:54px;font-weight:900;letter-spacing:1px;line-height:1.05;background:#f08c3c;color:#fff;border-radius:12px;padding:16px 4px;margin:8px 0;word-break:break-word}
.term-bacpetit{min-width:104px;font-size:19px;font-weight:800;background:rgba(240,140,60,.25);border-radius:8px;text-align:center;padding:6px 4px}
.term-menu{overflow-y:auto}
.term-demarrage{position:fixed;inset:0;z-index:100;background:var(--accent);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:24px}
.term-demarrage-ico{font-size:72px} .term-demarrage .term-invite{color:#fff;font-size:22px}
@media (max-height:600px){.term-empgros{font-size:28px}.term-bacgros{font-size:44px;padding:10px 4px}.term-prendre{font-size:22px}}
body.mode-terminal .app main,body.mode-terminal .app.nav-collapsed main{padding:0 !important;max-width:none;margin:0}
body.mode-terminal .app{display:block;min-height:0}