/* Thème « flat » NTC × SODECOTON
   Bleu et cyan NTC : navigation, actions, sélection. Vert SODECOTON : identité et états favorables.
   Surfaces pleines, sans ombre ni dégradé, coins presque droits. */
:root{
  --ntc:#3266cc; --ntc-d:#234c9e; --ntc-2:#e9effa; --ntc-3:#c9d7f2;
  --cyan:#3fb4d4; --cyan-d:#1f8fb0; --cyan-2:#e2f4f9;
  --bg:#f3f5f9; --surface:#ffffff; --ink:#1b2433; --ink-2:#5a6475; --line:#dde3ec; --line-2:#eef1f6;
  --info:#3266cc; --info-bg:#e9effa;
  --radius:4px; --shadow:none;
}
body{background:var(--bg)}
a{color:var(--ntc-d)}

/* En-tête : bandeau tricolore, barre de navigation pleine */
header.top,header{border-bottom:0;box-shadow:none}
header.top::before,body>header::before{content:"";display:block;height:4px;background:linear-gradient(90deg,var(--brand) 0 50%,var(--ntc) 50% 84%,var(--cyan) 84% 100%)}
.brand-t,.hin .t{color:var(--ink)}
.pill{border-radius:3px}
.pill.clock{background:var(--ntc-2);color:var(--ntc-d)}
.pill.demo{background:#fdf1d8;color:#7a5410}
.ntc-by{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink-2);font-size:11px;font-weight:600;line-height:1.15;padding-left:12px;border-left:1px solid var(--line)}
.ntc-by img{height:40px;width:auto;display:block}
.ntc-by span b{display:block;color:var(--ntc-d);font-size:12px}
nav.tabs{background:var(--ntc);box-shadow:0 0 0 100vmax var(--ntc);clip-path:inset(0 -100vmax);gap:0}
nav.tabs a{color:rgba(255,255,255,.86);border-bottom:3px solid transparent;padding:11px 14px 9px}
nav.tabs a:hover{background:rgba(255,255,255,.1);color:#fff}
nav.tabs a.on{color:#fff;background:var(--ntc-d);border-color:var(--cyan)}
nav.tabs a.ext{color:#fff}
nav.tabs::-webkit-scrollbar{height:4px}nav.tabs::-webkit-scrollbar-thumb{background:rgba(255,255,255,.4)}
.cnt{border-radius:2px}
#subtabs{background:var(--ntc-2);box-shadow:0 0 0 100vmax var(--ntc-2);clip-path:inset(0 -100vmax);border-top:0}
#subtabs a{background:#fff;border-radius:3px;color:var(--ink)}
#subtabs a:hover{background:var(--ntc-3)}
#subtabs a.on{background:var(--ntc-d);color:#fff}
#subtabs a.on .fn{background:var(--cyan);color:#fff}
.fn{border-radius:3px;background:var(--ntc-2);color:var(--ntc-d)}
.fn.big{border-radius:4px;border:2px solid var(--ntc);background:#fff}

/* Boutons */
.btn{border:0;border-radius:3px;background:#e4e9f2;color:var(--ink);padding:8px 13px}
.btn:hover{background:#d5dcea;border:0}
.btn.sm{padding:5px 10px}
.btn.primary{background:var(--ntc);color:#fff}
.btn.primary:hover{background:var(--ntc-d)}
.btn.warn{background:#fbe7c2;color:#6e4a0e}
.why{border:0;border-radius:3px;background:var(--line-2);color:var(--ntc-d)}
.why:hover{background:var(--ntc);color:#fff}
.switch{border-radius:3px;border-color:var(--line)}

/* Cartes, titres, indicateurs */
.card{border-radius:var(--radius);box-shadow:none;border:1px solid var(--line)}
h1{color:var(--ink);letter-spacing:-.2px}
.lvl span{background:var(--ntc-d);border-radius:2px}
.h3{color:var(--ntc-d)}
.crumb{color:var(--ntc)}
.kpi .bar{width:4px}
.kpi.info .bar{background:var(--cyan)}
.kpi .v{color:var(--ink)}
.flash{animation:flashf 1.6s ease-out}
@keyframes flashf{0%{background:var(--cyan-2)}100%{background:var(--surface)}}
.filters .fgrp{border-left-color:var(--ntc)}
.filters .fgrp>b{color:var(--ntc)}
.src{border-radius:4px;border:1px dashed var(--ntc-3)}
.src:hover{border-color:var(--ntc)}
.src u{color:var(--ntc-d)}

/* Formulaires */
.inp{border-radius:3px;border-color:#cfd7e3}
.inp:focus-within{border-color:var(--ntc);box-shadow:inset 0 -2px 0 var(--ntc)}
.seg button{border-radius:3px;border-color:#cfd7e3}
.seg button.on{background:var(--ntc);border-color:var(--ntc)}
.gi,.gs{border-radius:2px;border-color:#cfd7e3}
.gi:focus,.gs:focus{border-color:var(--ntc);box-shadow:inset 0 -2px 0 var(--ntc)}
td.c input[type=checkbox],input[type=checkbox]{accent-color:var(--ntc)}
.fhead{border-bottom-color:var(--line)}
.fcode{border-radius:2px;background:var(--ntc);color:#fff}
.calc{border-radius:4px}
.calc .r.total{background:var(--ntc-2)}
.chk{border-radius:3px;border-left:4px solid transparent}
.chk.blocage{border-left-color:var(--bad)} .chk.ecart{border-left-color:var(--warn)}
.chk.alerte{background:var(--ntc-2);color:#1d3d7c;border-left-color:var(--ntc)} .chk.ok{border-left-color:var(--ok)}
.chk textarea,.modal textarea{border-radius:3px}
.visa-line span.on{color:var(--ntc-d)}
.queue{border-radius:3px}

/* Tableaux et étiquettes */
table.t th{color:var(--ink-2);text-transform:none}
table.t tfoot td{background:#f1f4f9}
table.t tr.sub td,table.grid tr.sec td{background:#f1f4f9}
table.grid tr.sec td{color:var(--ntc-d)}
table.t tr.tot td,table.t tr.sel td{background:var(--ntc-2)}
tr.drill:hover td{background:var(--ntc-2)}
.tag,.mode{border-radius:2px}
.tag.mobile{background:var(--cyan-2);color:var(--cyan-d)}
.params span{border-radius:2px;background:var(--line-2)}
.params .pv{background:var(--ntc-2);color:var(--ntc-d)}
.pbar{border-radius:2px}
.pbar i{background:var(--cyan)}
.chipl{border-radius:3px}
.chipl:hover{background:var(--ntc-2)}

/* Téléphone */
.phone{box-shadow:none}
.sbar,.appbar{background:var(--ntc)}
.pscroll .card{border-radius:4px}
.ptabs button{border-radius:3px}
.ptabs button.on{color:var(--ntc-d);background:var(--ntc-2)}

/* Fenêtres et messages */
.toast{background:var(--ntc-d);border-radius:3px;box-shadow:none}
.toast a{color:#bfe9f5}
.modal{background:rgba(20,32,60,.45)}
.modal .card{border-radius:4px}

/* Page Processus */
.pb{background:var(--ntc-2);color:var(--ntc-d);border-radius:2px}
a.pb:hover{outline-color:var(--ntc-d)}
.circ{background:var(--ntc-2);border-color:var(--ntc-d);color:var(--ntc-d)}
.doc{background:#edf1f9} .rl.doc{color:var(--ntc-d)}
.flux .loop,.flux .loop span{border-color:var(--ntc-d)}
.flux .loop:before{border-top-color:var(--ntc-d)}
.st .lnk{background:var(--ntc-d)} .st .lnk:after{border-left-color:var(--ntc-d)} .st .lnk span{color:var(--ntc-d)}
.st .val{background:var(--ntc-2);border-radius:3px}
.kc .tg{color:var(--ntc-d)}
.kc:hover{border-color:var(--ntc)}
.rl,.usn,.steps div,.prol,.dl2{border-radius:3px}

/* Page récapitulative */
.path span{border-radius:3px}
.lane{border-radius:4px}
.lane h3{color:var(--ntc-d)}
.lane h3 b{background:var(--ntc-d);border-radius:2px}
.chip{border-radius:3px}
.chip:hover{background:var(--ntc-2)}
.filters button{border-radius:3px;border-color:var(--line)}
.filters button.on{background:var(--ntc);border-color:var(--ntc)}
.thumbs img,.nothumb{border-radius:3px}
.blk{border-radius:3px}
.screens a{background:var(--ntc);border-radius:3px}
.screens a:hover{background:var(--ntc-d)}
.flow a,.visas span{border-radius:2px}
.visas span:first-child{border-color:var(--ntc);color:var(--ntc-d)}
table.m td.s{background:var(--ntc)}
table.m td.v{background:var(--ntc-2);color:var(--ntc-d)}
table.m tr.grp td{background:#f1f4f9;color:var(--ntc-d)}
table.m th{background:#f1f4f9}

/* Pied de page : réalisation NTC */
footer.credit{max-width:none;margin:30px 0 0;padding:0;color:var(--ink-2);font-size:12px;background:var(--surface);border-top:4px solid var(--ntc)}
footer.credit .fin2{max-width:1320px;margin:0 auto;padding:16px;display:flex;gap:18px;align-items:center;flex-wrap:wrap}
footer.credit img{height:56px;width:auto}
footer.credit .who2{flex:1;min-width:240px}
footer.credit .who2 b{display:block;color:var(--ntc-d);font-size:13.5px}
footer.credit .note{flex-basis:100%;border-top:1px solid var(--line-2);padding-top:10px}

@media (max-width:560px){
  .ntc-by{border-left:0;padding-left:0}
  .ntc-by img{height:30px}
}
.hin .go,.demo-badge{align-items:center}

/* Volet 2 : schémas, bilan matière, laboratoire */
.qt{border-radius:2px}
.fn.nv,.fn.big.nv{border-radius:3px}
.pb.nv{border-radius:2px}
.labband{border-radius:3px}
.bform{background:var(--ntc-2);border-color:var(--ntc-3);border-radius:4px}
.bform .eq{border-color:var(--ntc);border-radius:3px;color:var(--ntc-d)}
.bn i{border-radius:2px}
.bn u{color:var(--ntc-d)}
.phone.tab{box-shadow:none}