/* TANDEM — compléments à style.css (copie de l'app Inventaire). Mêmes jetons ; seules couleurs ajoutées :
   la palette des graphiques (--s1…--s6, validée daltonisme), réservée aux données. */
:root{--s1:#FF6500;--s2:#2F6FB0;--s3:#4E8A3E;--s4:#8A4FA8;--s5:#D9A300;--s6:#C2185B}

.b-second{background:var(--card);color:var(--text);border-color:var(--border)}
.b-second:hover{background:var(--bg);border-color:var(--text)}
.b-petit{height:38px;padding:0 14px;font-size:14px}
.droite{text-align:right}
.titre{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.titre p{margin:6px 0 0;color:var(--muted);font-weight:600}
.lien-retour{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-weight:800;font-size:14px;margin-bottom:14px;text-decoration:none}
.hd-user .nom{display:flex;flex-direction:column;line-height:1.15}
.hd-user .role{font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}

/* Drapeaux FR / EN */
.drapeaux{display:flex;gap:4px;padding:4px;border-radius:12px;background:var(--bg)}
.drapeaux a{display:flex;align-items:center;justify-content:center;width:40px;height:32px;border-radius:8px;opacity:.45;transition:opacity .2s,background .2s}
.drapeaux a svg{border-radius:3px;box-shadow:0 0 0 1px var(--border)}
.drapeaux a:hover{opacity:.8}
.drapeaux a.on{opacity:1;background:var(--card);box-shadow:0 1px 0 var(--border)}

/* Puces */
.chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:800;padding:3px 9px;border-radius:999px;background:var(--track);color:var(--muted);white-space:nowrap}
.chip.vert{background:var(--green-bg);color:var(--green-dark)}
.chip.orange{background:var(--orange-bg);color:var(--amber)}
.chip.rouge{background:var(--danger-bg);color:var(--danger-text)}
.chip.noir{background:var(--text);color:#fff}
.chip .ic{width:13px;height:13px}

/* Tuiles chiffres */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin:0 0 22px}
.stat{display:flex;flex-direction:column;gap:4px;padding:18px 20px;border-radius:var(--r-card);background:var(--card);border:1px solid var(--border);position:relative;overflow:hidden}
.stat .n{font-family:var(--f-display);font-weight:800;font-size:36px;line-height:1;letter-spacing:-.5px}
.stat .n small{font-size:18px;color:var(--muted)}
.stat .l{font-size:13px;font-weight:800;color:var(--muted)}
.stat .ic-fond{position:absolute;right:14px;top:14px;width:26px;height:26px;color:var(--disabled)}
.stat.vert .n{color:var(--green)}
.stat.orange{background:var(--orange-bg);border-color:var(--orange-bd)}
.stat.danger{background:var(--danger-bg);border-color:var(--danger-bd)}
.stat.danger .n{color:var(--danger-text)}
.stat.heros{background:var(--text);color:#fff;border-color:var(--text)}
.stat.heros .l{color:rgba(255,255,255,.7)}
.stat.heros .ic-fond{color:var(--orange)}

/* Listes de réceptions */
.liste{display:flex;flex-direction:column;gap:10px}
.ligne-rec{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;padding:14px 18px;border-radius:var(--r-card);background:var(--card);border:1px solid var(--border);color:var(--text);text-decoration:none;transition:border-color .2s,box-shadow .2s}
.ligne-rec:hover{border-color:var(--text);color:var(--text);box-shadow:0 10px 26px rgba(20,20,20,.06)}
.ligne-rec .quand{display:flex;flex-direction:column;align-items:center;justify-content:center;width:74px;height:66px;border-radius:14px;background:var(--bg);font-family:var(--f-display);font-weight:800;line-height:1.05}
.ligne-rec .quand .j{font-size:12px;color:var(--muted);text-transform:uppercase}
.ligne-rec .quand .d{font-size:20px}
.ligne-rec .quand .h{font-size:13px;font-family:var(--f-mono)}
.ligne-rec.aujourdhui .quand{background:var(--orange);color:#fff}
.ligne-rec.aujourdhui .quand .j{color:#fff}
.ligne-rec .corps{display:flex;flex-direction:column;gap:6px;min-width:0}
.ligne-rec .num{font-family:var(--f-mono);font-weight:800;font-size:15px}
.ligne-rec .meta{display:flex;gap:6px 14px;flex-wrap:wrap;color:var(--muted);font-weight:700;font-size:13px}
.ligne-rec .meta span{display:inline-flex;align-items:center;gap:5px}
.ligne-rec .fin{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.vide-carte{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;padding:36px;color:var(--muted)}

/* Fiche */
.fiche-tete{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.fiche-tete h1{font-family:var(--f-mono);font-size:28px}
.grille-fiche{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:20px;align-items:start}
.dl{display:grid;grid-template-columns:minmax(140px,auto) 1fr;gap:10px 18px;margin:0}
.dl dt{color:var(--muted);font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.4px;padding-top:2px}
.dl dd{margin:0;font-weight:700}
.carte h3{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.carte+.carte{margin-top:18px}
.bandeau{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:var(--r-card);border:1px solid var(--border);background:var(--card);margin-bottom:18px}
.bandeau.orange{background:var(--orange-bg);border-color:var(--orange-bd)}
.bandeau.vert{background:var(--green-bg);border-color:var(--green-bd)}
.bandeau.rouge{background:var(--danger-bg);border-color:var(--danger-bd)}
.bandeau .corps{flex:1;display:flex;flex-direction:column;gap:8px}
.bandeau .actions{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end}
.form-ligne{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.form-ligne>div{flex:1;min-width:180px}
.form-ligne label{margin-top:0}
.docs{display:flex;flex-direction:column;gap:8px}
.doc{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:var(--bg);color:var(--text);text-decoration:none;font-weight:700}
.doc:hover{color:var(--text);background:var(--track)}
.doc .t{margin-left:auto;color:var(--muted);font-size:12px;white-space:nowrap}
.vignettes{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.vignettes a{display:block;width:84px;height:84px;border-radius:12px;overflow:hidden;background:var(--bg);border:1px solid var(--border)}
.vignettes img{width:100%;height:100%;object-fit:cover}
.chrono{display:flex;flex-direction:column;gap:0}
.chrono .ev{display:grid;grid-template-columns:110px 1fr;gap:10px;padding:8px 0;border-top:1px solid var(--border-soft);font-size:14px}
.chrono .ev:first-child{border-top:none}
.chrono .ev .q{color:var(--muted);font-weight:700;font-family:var(--f-mono);font-size:12px}
.anomalie{border:1px solid var(--border);border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.anomalie+.anomalie{margin-top:10px}
.anomalie.a_confirmer{border-color:var(--orange-bd);background:var(--orange-bg)}
.anomalie .tete{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.anomalie .tete b{font-size:15px}
.decision{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:4px}
.decision textarea{min-height:44px;height:44px;flex:1;min-width:200px}

/* Formulaire d'annonce */
.form-carte{max-width:980px}
.form-carte fieldset{border:none;padding:0;margin:0 0 22px}
.form-carte legend{font-family:var(--f-display);font-weight:800;font-size:17px;display:flex;align-items:center;gap:8px;margin-bottom:4px}
.grille-champs{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:4px 16px}
.req::after{content:" *";color:var(--orange)}
.choix{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-top:8px}
.choix label{display:flex;align-items:center;gap:12px;margin:0;padding:14px 16px;border:2px solid var(--border);border-radius:16px;cursor:pointer;background:var(--card);font-weight:800}
.choix label small{display:block;color:var(--muted);font-weight:700;font-size:12px}
.choix label:has(input:checked){border-color:var(--text);background:var(--bg)}
.choix input[type=radio]{width:20px;height:20px;margin:0;accent-color:var(--text);flex-shrink:0;padding:0}
.aide-eta{margin-top:10px;padding:12px 14px;border-radius:14px;background:var(--bg);font-weight:700;font-size:14px;display:flex;flex-direction:column;gap:6px}
.aide-eta.ok{background:var(--green-bg);color:var(--green-dark)}
.aide-eta.ko{background:var(--danger-bg);color:var(--danger-text)}
.numero-apercu{font-family:var(--f-mono);font-weight:800;font-size:22px;padding:10px 16px;border-radius:14px;background:var(--text);color:#fff;display:inline-block}

/* Graphiques (SVG + barres HTML, données en texte : jamais la couleur seule) */
.grille-graph{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.graph{background:var(--card);border:1px solid var(--border);border-radius:var(--r-card);padding:20px}
.graph h3{margin:0 0 4px}
.graph .sous{color:var(--muted);font-weight:700;font-size:13px;margin:0 0 14px}
.barres{display:flex;flex-direction:column;gap:10px}
.barre-l{display:grid;grid-template-columns:minmax(90px,38%) 1fr auto;gap:10px;align-items:center;font-size:14px;font-weight:700}
.barre-l .nom{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.barre-l .piste{height:14px;border-radius:4px;background:var(--track);overflow:hidden}
.barre-l .piste span{display:block;height:100%;border-radius:0 4px 4px 0;transform-origin:left;animation:grow .8s var(--ease) both}
.barre-l .v{font-family:var(--f-mono);font-weight:800;min-width:34px;text-align:right}
.legende{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;font-weight:800;color:var(--muted);margin-bottom:8px}
.legende i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.colonnes{width:100%;height:auto;display:block;overflow:visible}
.colonnes text{font-family:var(--f-body);font-size:12px;font-weight:700;fill:var(--muted)}
.colonnes .val{fill:var(--text);font-family:var(--f-mono);font-weight:800}
.colonnes rect.m:hover{filter:brightness(1.1)}
.donut-boite{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.donut-boite svg{flex-shrink:0}
.anneau-txt{font-family:var(--f-display);font-weight:800}
.filtres{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:20px}
.filtres input[type=date]{width:auto;height:40px;margin:0}
.seg a{display:flex;align-items:center;gap:8px;height:40px;padding:0 14px;border-radius:10px;color:var(--text);font-weight:800;font-size:14px;text-decoration:none;white-space:nowrap}
.seg a.on{background:var(--text);color:#fff}

/* Paramétrage */
.table-param input,.table-param select{height:40px;margin:0;font-size:14px}
.table-param td{padding:8px 6px}
.heure{width:110px !important}

@media (max-width:900px){
  .page{padding:18px 16px 32px}
  .hd{padding:0 14px;gap:12px}
  .grille-fiche,.grille-graph{grid-template-columns:1fr}
  .ligne-rec{grid-template-columns:auto 1fr}
  .ligne-rec .fin{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between}
  .dl{grid-template-columns:1fr}
  .hd-user .nom{display:none}
}
@media (max-width:640px){
  .hd{height:auto;flex-wrap:wrap;padding:10px 12px}
  .hd-nav{order:3;width:100%}
  .hd-mark{display:none}
}
.seg a .n{min-width:24px;height:24px;padding:0 6px;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--text)}
.seg a.on .n{background:rgba(255,255,255,.18);color:#fff}

/* Contrôle au démarrage de la réception : plaque, plomb, CMR */
.controles{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:16px 0 6px}
.controle{border:2px solid var(--border);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:10px;background:var(--card)}
.controle:has(.ok input:checked){border-color:var(--green-bd);background:var(--green-bg)}
.controle:has(.ko input:checked){border-color:var(--danger-bd);background:var(--danger-bg)}
.ctl-tete{display:flex;flex-direction:column;gap:4px}
.ctl-annonce{color:var(--muted);font-weight:700;font-size:14px}
.ctl-annonce .mono{color:var(--text);font-size:18px}
.ctl-choix{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ctl-choix label{display:flex;align-items:center;justify-content:center;gap:6px;margin:0;height:48px;border:2px solid var(--border);border-radius:12px;cursor:pointer;background:var(--card);font-weight:800}
.ctl-choix input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.ctl-choix .ok:has(input:checked){background:var(--green);border-color:var(--green);color:#fff}
.ctl-choix .ko:has(input:checked){background:var(--danger);border-color:var(--danger);color:#fff}
.ctl-choix label:has(input:focus-visible){box-shadow:0 0 0 4px rgba(255,101,0,.25)}
.ctl-lu input{margin-top:0}
.ctl-confirme{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:var(--orange-bg);border:1px solid var(--orange-bd);font-size:15px}
.ctl-confirme input{flex-shrink:0;margin-top:1px}

/* Paramétrage > Comptes */
.table-comptes tr.desactive td{opacity:.6}
.table-comptes tr.desactive td:last-child{opacity:1}
.plus-actions{display:inline-block;position:relative}
.plus-actions summary{list-style:none;display:inline-flex}
.plus-actions summary::-webkit-details-marker{display:none}
.menu-actions{position:absolute;right:0;top:44px;z-index:5;display:flex;flex-direction:column;gap:10px;padding:14px;background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:0 16px 36px rgba(20,20,20,.12)}
