*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --navy:#0f1f45;--navy2:#1a3060;--navy3:#0c1835;
  --orange:#e8972b;--orange2:#f5a623;--orange-d:#c87f1e;--orange-p:rgba(232,151,43,.1);
  --bg:#edf1fa;--bg2:#ffffff;--bg3:#f4f7fd;--bg4:#e8eefa;
  --line:#dde4f4;--line2:#c4d0e8;
  --ink:#0f1f45;--ink2:#2e4070;--ink3:#6277a0;--ink4:#9daec9;
  --green:#09966a;--green-p:rgba(9,150,106,.09);
  --red:#d03050;--red-p:rgba(208,48,80,.09);
  --gold:#a87010;--gold-p:rgba(168,112,16,.1);
  --sans:"Plus Jakarta Sans",sans-serif;--mono:"JetBrains Mono",monospace;--serif:"Lora",serif;
  --sh:0 2px 16px rgba(15,31,69,.08);--sh-md:0 6px 28px rgba(15,31,69,.12);--sh-lg:0 14px 52px rgba(15,31,69,.16);
  --radius:8px;--radius-lg:12px;
}
html,body{height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:14px;-webkit-font-smoothing:antialiased;font-weight:400}
::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--line2);border-radius:99px}
.shell{display:grid;grid-template-columns:248px 1fr;grid-template-rows:60px 1fr;height:100vh}
.topbar{grid-column:1/-1;background:linear-gradient(135deg,#0b1830 0%,#0f1f45 60%,#142550 100%);border-bottom:2px solid var(--orange);display:flex;align-items:center;padding:0 20px;gap:12px;z-index:30;box-shadow:0 2px 20px rgba(10,20,50,.3)}
.sidebar{background:linear-gradient(180deg,#0c1835 0%,#0a1628 50%,#091220 100%);overflow-y:auto;display:flex;flex-direction:column;border-right:1px solid rgba(255,255,255,.06)}
.content{overflow-y:auto;background:var(--bg)}
.logo{display:flex;align-items:center;gap:10px;cursor:pointer;flex-shrink:0}
.logo img{height:38px;width:auto;filter:brightness(1.05)}
.logo-text{line-height:1.15}
.logo-main{font-size:19px;font-weight:800;color:#fff;letter-spacing:-.05em;display:block;font-family:var(--sans)}
.logo-sub{font-size:8.5px;font-weight:700;color:var(--orange2);letter-spacing:.16em;text-transform:uppercase;display:block;opacity:.85}
.nav-divider{width:1px;height:28px;background:rgba(255,255,255,.15);margin:0 6px;flex-shrink:0}
.logo-mod{font-size:11px;color:rgba(255,255,255,.4);font-weight:500}
.tb-search{flex:1;max-width:340px;margin:0 12px;position:relative}
.tb-search input{width:100%;background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.1);color:#fff;font-family:var(--sans);font-size:13px;padding:8px 14px 8px 36px;outline:none;border-radius:8px;transition:all .2s}
.tb-search input:focus{background:rgba(255,255,255,.14);border-color:var(--orange)}
.tb-search input::placeholder{color:rgba(255,255,255,.3)}
.tb-search .si{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:rgba(255,255,255,.3);font-size:14px}
.role-sw{display:flex;align-items:center;gap:7px;padding:5px 12px;background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.12);border-radius:8px;flex-shrink:0}
.role-sw label{font-size:9px;font-weight:800;color:rgba(255,255,255,.45);letter-spacing:.12em;text-transform:uppercase}
.role-sw select{background:transparent;border:none;color:#fff;font-family:var(--sans);font-size:12px;font-weight:700;outline:none;cursor:pointer;letter-spacing:-.01em}
.role-sw select option{background:#1a2e5a;color:#fff}
.tb-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.icon-btn{width:36px;height:36px;background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.1);border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:rgba(255,255,255,.6);font-size:15px;transition:all .15s;position:relative}
.icon-btn:hover{background:rgba(255,255,255,.16);color:#fff;border-color:var(--orange)}
.icon-btn .dot{position:absolute;top:6px;right:6px;width:7px;height:7px;background:var(--orange);border-radius:50%;border:2px solid var(--navy3)}
.user-chip{display:flex;align-items:center;gap:8px;padding:5px 12px 5px 5px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:99px;cursor:pointer;transition:all .15s;flex-shrink:0}
.user-chip:hover{background:rgba(255,255,255,.14);border-color:rgba(232,151,43,.5)}
.user-av{width:28px;height:28px;background:linear-gradient(135deg,var(--orange2),var(--orange-d));border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff;flex-shrink:0;box-shadow:0 2px 8px rgba(232,151,43,.4)}
.user-name{font-size:12px;font-weight:700;color:#fff;letter-spacing:-.02em}
.user-role-tag{font-size:9px;color:#f7b84a;font-family:var(--mono);letter-spacing:.04em}
.nav-sec{padding:20px 14px 5px;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.22);font-family:var(--mono)}
.nav-item{display:flex;align-items:center;gap:10px;padding:9px 12px;cursor:pointer;color:rgba(255,255,255,.48);font-size:12.5px;font-weight:500;transition:all .14s;border-radius:7px;margin:1px 7px;position:relative}
.nav-item:hover{color:rgba(255,255,255,.88);background:rgba(255,255,255,.06)}
.nav-item.active{color:#fff;background:rgba(232,151,43,.16);font-weight:700}
.nav-item.active::before{content:"";position:absolute;left:-7px;top:22%;height:56%;width:3px;background:linear-gradient(180deg,var(--orange2),var(--orange-d));border-radius:0 4px 4px 0}
.nav-item.active .ni{color:var(--orange2)}
.nav-item .ni{width:18px;text-align:center;font-size:15px}
.nav-badge{margin-left:auto;font-size:9px;font-family:var(--mono);font-weight:700;padding:2px 7px;border-radius:99px}
.nb-o{background:rgba(245,166,35,.22);color:#f7b84a;border:1px solid rgba(245,166,35,.3)}
.nb-r{background:rgba(214,56,85,.18);color:#f47;border:1px solid rgba(214,56,85,.3)}
.nb-n{background:rgba(255,255,255,.08);color:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.12)}
.sb-foot{padding:10px;border-top:1px solid rgba(255,255,255,.07);margin-top:auto}
/* api-card supprimé — données serveur internes retirées du sidebar */
.st-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.st-g{background:var(--green);animation:bl 2.2s infinite}
.st-a{background:var(--orange)}
@keyframes bl{0%,100%{opacity:1;box-shadow:0 0 5px rgba(10,158,106,.5)}55%{opacity:.4}}
.api-lbl{font-size:10px;color:rgba(255,255,255,.38);font-family:var(--mono);flex:1}
.api-val{font-size:10px;color:rgba(255,255,255,.65);font-family:var(--mono)}
.page{padding:28px 32px;min-height:100%}
.brc{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--ink3);margin-bottom:10px;font-weight:500}
.brc .bcl{cursor:pointer}.brc .bcl:hover{color:var(--orange-d);text-decoration:underline}
.brc .bcs{color:var(--ink4)}.brc .bcc{color:var(--ink);font-weight:700}
.page-title{font-family:var(--sans);font-size:24px;font-weight:800;color:var(--navy);letter-spacing:-.06em;margin-bottom:5px;line-height:1.1}
.page-title em{font-family:var(--serif);font-style:italic;font-weight:600;letter-spacing:-.02em;color:var(--orange-d)}
.page-sub{font-size:13px;color:var(--ink3);font-weight:400;line-height:1.5}
.page-acts{display:flex;gap:8px;margin-top:18px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:6px;padding:9px 17px;font-family:var(--sans);font-size:12.5px;font-weight:700;cursor:pointer;border-radius:7px;border:1.5px solid transparent;transition:all .15s;letter-spacing:-.02em;line-height:1;white-space:nowrap}
.btn-pr{background:linear-gradient(135deg,var(--orange2),var(--orange-d));color:#fff;border-color:var(--orange-d);box-shadow:0 2px 10px rgba(232,151,43,.3)}
.btn-pr:hover{background:linear-gradient(135deg,var(--orange-d),#b0700f);transform:translateY(-1px);box-shadow:0 4px 18px rgba(232,151,43,.4)}
.btn-nv{background:var(--navy);color:#fff;border-color:var(--navy);box-shadow:0 2px 8px rgba(15,31,69,.2)}
.btn-nv:hover{background:var(--navy2)}
.btn-gh{background:transparent;color:var(--ink2);border-color:var(--line2)}
.btn-gh:hover{color:var(--navy);border-color:var(--navy);background:rgba(15,31,69,.05)}
.btn-dg{background:var(--red-p);color:var(--red);border-color:var(--red)}
.btn-dg:hover{background:var(--red);color:#fff}
.btn-sc{background:var(--green-p);color:var(--green);border-color:var(--green)}
.btn-sc:hover{background:var(--green);color:#fff}
.btn-sm{padding:6px 12px;font-size:11.5px}
.btn-xs{padding:4px 9px;font-size:11px;border-radius:5px}
.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(172px,1fr));gap:14px;margin-bottom:24px}
.metric{background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px 22px;position:relative;overflow:hidden;box-shadow:0 1px 6px rgba(15,31,69,.06);transition:all .2s}
.metric:hover{box-shadow:var(--sh-md);transform:translateY(-2px)}
.ms{position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--orange),var(--orange-d))}
.ms.g{background:linear-gradient(90deg,var(--green),#0b7a56)}.ms.r{background:linear-gradient(90deg,var(--red),#a82540)}.ms.n{background:linear-gradient(90deg,var(--navy),var(--navy2))}
.m-lbl{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);margin-bottom:10px}
.m-val{font-size:34px;font-weight:800;color:var(--navy);line-height:1;letter-spacing:-.05em}
.mv-o{color:var(--orange-d)}.mv-g{color:var(--green)}.mv-r{color:var(--red)}
.m-sub{font-size:11px;color:var(--ink3);margin-top:8px;display:flex;align-items:center;gap:5px}
.dlt{font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px}
.d-up{background:var(--green-p);color:var(--green)}
.d-dn{background:var(--red-p);color:var(--red)}
.m-ic{position:absolute;right:16px;bottom:12px;font-size:30px;opacity:.09}
.card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 1px 6px rgba(15,31,69,.06)}
.card-h{padding:14px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;background:linear-gradient(135deg,var(--bg3),var(--bg2))}
.card-ic{width:30px;height:30px;background:var(--orange-p);border:1px solid rgba(232,151,43,.25);border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0}
.card-t{font-size:13px;font-weight:700;color:var(--navy);flex:1;letter-spacing:-.03em}
.card-t em{font-family:var(--serif);font-style:italic;font-weight:600}
.card-b{padding:20px}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:20px}.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}
.g21{display:grid;grid-template-columns:2fr 1fr;gap:20px}.g12{display:grid;grid-template-columns:1fr 2fr;gap:20px}
.mb20{margin-bottom:20px}
.tbl-w{overflow-x:auto}
table{width:100%;border-collapse:collapse}
thead th{padding:11px 16px;font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);font-family:var(--mono);text-align:left;background:var(--bg3);border-bottom:2px solid var(--line);white-space:nowrap}
tbody td{padding:13px 16px;border-bottom:1px solid var(--line);font-size:13px;vertical-align:middle;font-weight:400}
tbody tr:last-child td{border-bottom:none}
tbody tr{transition:background .1s;cursor:pointer}
tbody tr:hover td{background:var(--orange-p)}
.bdg{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:99px;font-size:10px;font-weight:700;font-family:var(--mono);letter-spacing:.04em;white-space:nowrap}
.bdg::before{content:"";width:5px;height:5px;border-radius:50%}
.b-dr{background:var(--bg4);color:var(--ink3);border:1px solid var(--line2)}.b-dr::before{background:var(--ink4)}
.b-sb,.b-st{background:rgba(26,46,90,.07);color:var(--navy);border:1px solid rgba(26,46,90,.18)}.b-sb::before,.b-st::before{background:var(--navy)}
.b-ap,.b-vl,.b-cl,.b-dl,.b-pd,.b-pb{background:var(--green-p);color:var(--green);border:1px solid rgba(10,158,106,.22)}.b-ap::before,.b-vl::before,.b-cl::before,.b-dl::before,.b-pd::before,.b-pb::before{background:var(--green)}
.b-rj,.b-ov{background:var(--red-p);color:var(--red);border:1px solid rgba(214,56,85,.22)}.b-rj::before,.b-ov::before{background:var(--red)}
.b-pn,.b-pg{background:var(--gold-p);color:var(--gold);border:1px solid rgba(184,122,10,.22)}.b-pn::before,.b-pg::before{background:var(--gold)}
.b-op{background:var(--orange-p);color:var(--orange-d);border:1px solid rgba(245,166,35,.28)}.b-op::before{background:var(--orange)}
.b-in,.b-cs,.b-ar{background:var(--bg4);color:var(--ink3);border:1px solid var(--line)}.b-in::before,.b-cs::before,.b-ar::before{background:var(--ink4)}
.fr{display:flex;align-items:flex-start;padding:11px 0;border-bottom:1px solid var(--line);gap:16px}
.fr:last-child{border-bottom:none}
.fl{font-size:10px;font-weight:800;color:var(--ink3);text-transform:uppercase;letter-spacing:.07em;width:170px;flex-shrink:0;padding-top:2px}
.fv{font-size:13px;color:var(--ink);flex:1;font-weight:500;line-height:1.5}
.tl{display:grid;grid-template-columns:28px 1fr;gap:14px;margin-bottom:22px;position:relative}
.tl-dot{width:28px;height:28px;border-radius:50%;border:2px solid var(--line2);display:flex;align-items:center;justify-content:center;font-size:11px;flex-shrink:0;background:var(--bg4)}
.tl-o{border-color:var(--orange);background:var(--orange-p);color:var(--orange-d)}
.tl-g{border-color:var(--green);background:var(--green-p);color:var(--green)}
.tl-r{border-color:var(--red);background:var(--red-p);color:var(--red)}
.tl-n{border-color:var(--navy);background:rgba(26,46,90,.07);color:var(--navy)}
.tl::before{content:"";position:absolute;left:13px;top:28px;bottom:-22px;width:2px;background:var(--line)}
.tl:last-child::before{display:none}
.tl-t{font-size:13px;font-weight:700;color:var(--navy);margin-bottom:3px;padding-top:5px;letter-spacing:-.02em}
.tl-m{font-size:11px;color:var(--ink3);font-family:var(--mono)}
.chart{height:140px;display:flex;align-items:flex-end;gap:5px;padding:0 0 4px}
.bar{flex:1;background:var(--orange-p);border:1px solid rgba(245,166,35,.3);border-bottom:none;border-radius:4px 4px 0 0;position:relative;transition:all .2s;cursor:pointer;min-height:3px}
.bar:hover{background:rgba(245,166,35,.22);border-color:var(--orange)}
.bar-l{position:absolute;bottom:-20px;left:50%;transform:translateX(-50%);font-size:9px;color:var(--ink3);font-family:var(--mono)}
.fg{margin-bottom:18px}
.fL{display:block;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);margin-bottom:7px}
.req{color:var(--orange-d)}
.fI,.fS,.fT{width:100%;background:var(--bg);border:1.5px solid var(--line2);color:var(--ink);font-family:var(--sans);font-size:13px;padding:9px 13px;outline:none;border-radius:8px;transition:all .15s}
.fI:focus,.fS:focus,.fT:focus{border-color:var(--orange);box-shadow:0 0 0 3px var(--orange-p)}
.fI::placeholder,.fT::placeholder{color:var(--ink4)}
.fS{appearance:none;cursor:pointer;padding-right:34px}
.fT{resize:vertical;min-height:90px;line-height:1.6}
.fR{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mo{position:fixed;inset:0;background:rgba(8,15,35,.7);backdrop-filter:blur(8px);z-index:100;display:flex;align-items:center;justify-content:center;padding:24px}
.mo.hidden{display:none}
.mb{background:var(--bg2);border:1px solid var(--line);border-radius:14px;width:100%;max-width:640px;max-height:90vh;overflow-y:auto;box-shadow:0 24px 72px rgba(8,15,35,.3)}
.mh{padding:20px 24px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,var(--bg3),var(--bg2));border-radius:14px 14px 0 0}
.m-ic2{width:38px;height:38px;background:var(--orange-p);border:1.5px solid rgba(245,166,35,.3);border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:17px}
.m-t{font-size:16px;font-weight:800;color:var(--navy);flex:1;letter-spacing:-.04em}
.m-cl{width:32px;height:32px;background:var(--bg4);border:1.5px solid var(--line2);border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink3);font-size:14px;transition:all .12s}
.m-cl:hover{color:var(--red);border-color:var(--red);background:var(--red-p)}
.m-bd{padding:26px}
.m-ft{padding:18px 26px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:8px;background:var(--bg3);border-radius:0 0 16px 16px}
.alt{padding:12px 16px;border-radius:8px;font-size:13px;display:flex;gap:10px;line-height:1.5;font-weight:500;margin-bottom:16px}
.a-w{background:var(--gold-p);border:1px solid rgba(184,122,10,.28);color:var(--gold)}
.a-i{background:var(--orange-p);border:1px solid rgba(245,166,35,.28);color:var(--orange-d)}
.a-d{background:var(--red-p);border:1px solid rgba(214,56,85,.22);color:var(--red)}
.a-s{background:var(--green-p);border:1px solid rgba(10,158,106,.22);color:var(--green)}
.a-rs{background:rgba(26,46,90,.06);border:1px solid rgba(26,46,90,.18);color:var(--navy);border-radius:8px;padding:10px 14px;font-size:12px;font-weight:600;display:flex;align-items:center;gap:8px}
.notif-p{position:fixed;top:68px;right:16px;width:360px;background:var(--bg2);border:1px solid var(--line);border-radius:12px;z-index:50;box-shadow:var(--sh-lg)}
.notif-p.hidden{display:none}
.np-h{padding:15px 18px;border-bottom:1px solid var(--line);font-size:14px;font-weight:800;color:var(--navy);display:flex;align-items:center;justify-content:space-between;background:var(--bg3);border-radius:12px 12px 0 0;letter-spacing:-.03em}
.np-i{padding:13px 18px;border-bottom:1px solid var(--line);cursor:pointer;border-left:3px solid transparent}
.np-i:hover{background:var(--bg3)}
.np-u{border-left-color:var(--orange)}
.np-t{font-size:12px;font-weight:700;color:var(--navy);margin-bottom:4px;letter-spacing:-.02em}
.np-b{font-size:11px;color:var(--ink3);line-height:1.5}
.np-tm{font-size:10px;color:var(--ink4);font-family:var(--mono);margin-top:5px}
.tw{position:fixed;bottom:24px;right:24px;z-index:200;display:flex;flex-direction:column;gap:8px}
.ts{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:13px 18px;min-width:300px;display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;animation:ti .22s ease;box-shadow:0 8px 32px rgba(8,15,35,.18);transition:opacity .3s;letter-spacing:-.02em}
@keyframes ti{from{transform:translateX(100%);opacity:0}to{transform:none;opacity:1}}
.ts.s{border-left:3px solid var(--green)}.ts.e{border-left:3px solid var(--red)}.ts.i{border-left:3px solid var(--orange-d)}
.uz{border:2px dashed var(--line2);border-radius:12px;padding:36px 24px;text-align:center;cursor:pointer;transition:all .2s}
.uz:hover{border-color:var(--orange);background:var(--orange-p)}
.uz-ic{font-size:36px;margin-bottom:10px;opacity:.3}
.uz-t{font-size:14px;font-weight:700;color:var(--ink2);margin-bottom:4px;letter-spacing:-.02em}
.pmx{border-collapse:collapse;width:100%;font-size:11px}
.pmx th{background:var(--navy);color:rgba(255,255,255,.75);padding:9px 10px;font-size:9px;letter-spacing:.1em;text-transform:uppercase;font-family:var(--mono);text-align:center;border:1px solid rgba(255,255,255,.08)}
.pmx th:first-child{text-align:left;width:210px}
.pmx td{padding:9px 10px;border:1px solid var(--line);text-align:center}
.pmx td:first-child{text-align:left;font-weight:700;color:var(--navy);font-family:var(--mono);font-size:10px}
.pmx tr:nth-child(even) td{background:var(--bg3)}
.py{color:var(--green);font-size:16px;font-weight:900}
.pp{color:var(--orange-d);font-size:16px}
.pn{color:var(--line2);font-size:16px}

/* ═══ DOCUMENTS AVEC EN-TÊTE OFFICIEL MLOG ═══ */
.doc-wrap{padding:28px 32px}
.doc-acts{display:flex;gap:8px;margin-bottom:20px;justify-content:flex-end;max-width:830px;margin-left:auto;margin-right:auto}
.doc{background:#fff;max-width:830px;margin:0 auto;padding:36px 42px 28px;border:1px solid var(--line);border-radius:6px;box-shadow:var(--sh);position:relative;font-family:var(--sans)}
.doc-hdr{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:start;padding-bottom:18px;border-bottom:3px solid var(--navy);margin-bottom:18px;position:relative;z-index:2}
.doc-lg img{height:72px;width:auto}
.doc-cn{text-align:center;padding-top:8px}
.doc-cn-n{font-family:var(--serif);font-size:22px;font-weight:600;color:var(--navy);letter-spacing:-.02em;font-style:italic;margin-bottom:2px}
.doc-cn-t{font-size:9px;font-weight:800;color:var(--orange-d);letter-spacing:.15em;text-transform:uppercase}
.doc-mr{text-align:right;font-size:11px;color:var(--ink2);line-height:2.2;font-weight:500}
.doc-mr strong{color:var(--navy);font-weight:800;display:block;font-size:12px}
.doc-band{height:3px;background:linear-gradient(90deg,var(--navy) 0%,var(--navy2) 45%,var(--orange-d) 70%,var(--orange) 100%);border-radius:2px;margin-bottom:22px}
.doc-tr{text-align:center;margin-bottom:22px;position:relative;z-index:2}
.doc-tt{font-family:var(--serif);font-size:22px;font-weight:600;font-style:italic;color:var(--navy);letter-spacing:-.01em;margin-bottom:6px}
.doc-rf{font-family:var(--mono);font-size:11px;color:var(--ink3);letter-spacing:.08em;background:var(--bg4);display:inline-block;padding:4px 14px;border-radius:99px;border:1px solid var(--line2);font-weight:600}
.doc-pt{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:22px;position:relative;z-index:2}
.doc-p{background:var(--bg3);border:1px solid var(--line);border-radius:8px;padding:14px 16px}
.doc-pt-l{font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);margin-bottom:8px;font-family:var(--mono)}
.doc-pt-n{font-size:14px;font-weight:800;color:var(--navy);letter-spacing:-.03em;margin-bottom:5px}
.doc-pt-i{font-size:12px;color:var(--ink2);line-height:1.9;font-weight:400}
.doc-tb{width:100%;border-collapse:collapse;margin-bottom:22px;position:relative;z-index:2}
.doc-tb thead th{background:var(--navy);color:#fff;padding:10px 12px;text-align:left;font-weight:700;font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.doc-tb thead th:last-child{text-align:right}
.doc-tb tbody td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.5;font-size:13px}
.doc-tb tbody td:last-child{text-align:right;font-weight:700;color:var(--navy);font-family:var(--mono)}
.doc-tb tbody tr:nth-child(even) td{background:var(--bg3)}
.doc-tot{display:flex;justify-content:flex-end;margin-bottom:24px;position:relative;z-index:2}
.doc-tot-b{width:280px;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.doc-tot-r{display:flex;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--line);font-size:13px}
.doc-tot-r:last-child{background:var(--navy);color:#fff;font-weight:800;font-size:14px;border-bottom:none;border-radius:0 0 7px 7px}
.doc-tot-r .dtl{font-weight:500}.doc-tot-r .dtv{font-weight:700;font-family:var(--mono)}
.doc-sg{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-bottom:28px;position:relative;z-index:2}
.doc-sb{border-top:2px solid var(--navy);padding-top:12px}
.doc-sl{font-size:9px;font-weight:800;color:var(--ink3);letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px;font-family:var(--mono)}
.doc-sn{font-size:12px;font-weight:700;color:var(--navy);letter-spacing:-.01em}
.doc-sd{font-size:11px;color:var(--ink3);font-family:var(--mono);margin-top:3px}
.doc-fl{border-top:2px solid var(--navy);padding-top:14px;text-align:center;position:relative;z-index:2}
.doc-fl p{font-size:9px;color:var(--ink3);line-height:2;font-weight:400}
.doc-fl strong{color:var(--navy);font-weight:700}
.doc-fb{height:3px;background:linear-gradient(90deg,var(--navy),var(--orange-d),var(--orange));border-radius:2px;margin-top:10px}
.doc-wm{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-30deg);font-family:var(--sans);font-size:90px;font-weight:900;opacity:.045;color:var(--navy);letter-spacing:.15em;pointer-events:none;text-transform:uppercase;white-space:nowrap;z-index:1}
.doc-nt{background:var(--bg3);border-left:3px solid var(--orange);padding:14px 16px;margin-bottom:20px;border-radius:0 8px 8px 0;position:relative;z-index:2}
.doc-nt-l{font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);margin-bottom:6px;font-family:var(--mono)}
.doc-nt-c{font-size:12px;color:var(--ink2);line-height:1.7}
.mono{font-family:var(--mono)}.fw7{font-weight:700}.fw8{font-weight:800}
.tx-nv{color:var(--navy)}.tx-o{color:var(--orange-d)}.tx-g{color:var(--green)}.tx-r{color:var(--red)}.tx-m{color:var(--ink3)}
.hidden{display:none!important}
@media print{
  .no-pr,.topbar,.sidebar,.doc-acts{display:none!important}
  body,.content,.shell{background:#fff;overflow:visible;height:auto;display:block}
  .doc-wrap{padding:0}
  .doc{box-shadow:none;border:none;padding:20px;max-width:none}
}


/* ═══ V10 OVERRIDES ═══ */
/* ═══════════════════════════════════════════
   V10 — Professional Design Refinement
═══════════════════════════════════════════ */
:root{
  /* Refined palette - subtler accents */
  --orange:#e89614;
  --orange2:#f0a52a;
  --orange-d:#c47a0d;
  --orange-p:rgba(232,150,20,.08);
  --navy:#15294f;
  --navy2:#1f3a6b;
  --navy3:#0f1f3c;
  --bg:#f4f6fb;
  --bg2:#fff;
  --bg3:#f8fafe;
  --bg4:#eef2f9;
  --line:#e2e7f1;
  --line2:#cdd5e6;
  --ink:#15294f;
  --ink2:#3a4e74;
  --ink3:#677a9c;
  --ink4:#9eaec8;
  --sh:0 1px 2px rgba(21,41,79,.04), 0 1px 3px rgba(21,41,79,.06);
  --sh-md:0 2px 4px rgba(21,41,79,.05), 0 4px 12px rgba(21,41,79,.08);
  --sh-lg:0 8px 32px rgba(21,41,79,.12);
}

/* ── Topbar tightening ── */
.topbar{padding:0 20px;border-bottom-width:2px;background:var(--navy3)}
.nav-divider{height:24px}
.logo-mod{font-size:10.5px;color:rgba(255,255,255,.45);font-weight:500;letter-spacing:.02em}
.logo img{height:34px}
.logo-main{font-size:18px;letter-spacing:-.03em}
.logo-sub{font-size:8.5px;letter-spacing:.16em}

.tb-search input{font-size:12.5px;padding:7px 12px 7px 34px;background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.09);border-radius:6px}
.tb-search input:focus{border-color:var(--orange);background:rgba(255,255,255,.12)}
.role-sw{padding:4px 11px;border-radius:6px;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.1)}
.role-sw label{font-size:8.5px;letter-spacing:.14em}
.role-sw select{font-size:11.5px}
.icon-btn{width:34px;height:34px;border-radius:6px;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.09)}
.icon-btn svg{stroke:rgba(255,255,255,.7)}
.icon-btn:hover svg{stroke:#fff}
.user-chip{padding:4px 12px 4px 5px;border-radius:99px;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.1)}
.user-av{width:26px;height:26px;font-size:10.5px}
.user-name{font-size:11.5px}
.user-role-tag{font-size:8.5px}

/* ── Sidebar refinement ── */
.sidebar{background:#0c1a36;border-right:1px solid rgba(255,255,255,.05)}
.nav-sec{font-size:8.5px;letter-spacing:.22em;color:rgba(255,255,255,.28);padding:18px 16px 6px;font-family:var(--mono);font-weight:600}
.nav-item{padding:8px 12px;font-size:12.5px;font-weight:500;color:rgba(255,255,255,.55);gap:11px;margin:0 8px;border-radius:6px}
.nav-item:hover{color:#fff;background:rgba(255,255,255,.05)}
.nav-item.active{color:#fff;background:rgba(232,150,20,.13);font-weight:600}
.nav-item.active::before{width:2px;left:-8px;background:var(--orange)}
.nav-item .ni{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;color:rgba(255,255,255,.55)}
.nav-item.active .ni{color:var(--orange)}
.nav-item:hover .ni{color:rgba(255,255,255,.85)}
.nav-badge{font-size:9px;font-weight:600;padding:1px 6px;border-radius:4px}

.sb-foot{padding:12px;border-top:1px solid rgba(255,255,255,.04)}
.api-card{border-radius:6px;padding:8px 11px;background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.05)}
.api-row{margin-bottom:3px}
.api-lbl,.api-val{font-size:9.5px}

/* ── Page chrome ── */
.page{padding:24px 28px}
.brc{font-size:10.5px;margin-bottom:6px;color:var(--ink3)}
.page-title{font-size:22px;font-weight:700;letter-spacing:-.04em;margin-bottom:3px}
.page-title em{font-weight:600}
.page-sub{font-size:12.5px;line-height:1.45}
.page-acts{margin-top:14px;gap:7px}

/* ── Buttons - flatter, more precise ── */
.btn{padding:8px 15px;font-size:12.5px;font-weight:600;border-radius:6px;border-width:1px;letter-spacing:-.01em;gap:6px}
.btn-pr{background:var(--orange);border-color:var(--orange);box-shadow:0 1px 2px rgba(232,150,20,.2)}
.btn-pr:hover{background:var(--orange-d);border-color:var(--orange-d);transform:none;box-shadow:0 2px 8px rgba(232,150,20,.3)}
.btn-pr::before{display:none}
.btn-nv{box-shadow:0 1px 2px rgba(21,41,79,.15)}
.btn-gh{border-color:var(--line2);font-weight:500}
.btn-gh:hover{background:var(--bg3);border-color:var(--line2);color:var(--navy)}
.btn-sm{padding:5px 11px;font-size:11.5px}
.btn-xs{padding:3px 9px;font-size:10.5px}
.btn svg{flex-shrink:0}

/* ── Cards - subtler shadows ── */
.card{border-radius:8px;box-shadow:var(--sh);border-color:var(--line)}
.card-h{padding:13px 18px;background:var(--bg3);gap:9px}
.card-ic{width:28px;height:28px;border-radius:6px;font-size:13px;color:var(--orange-d);background:var(--orange-p);border-color:rgba(232,150,20,.22)}
.card-ic svg{stroke:var(--orange-d)}
.card-t{font-size:13px;font-weight:700;letter-spacing:-.02em}
.card-sub{font-size:10.5px}
.card-b{padding:18px}

/* ── Metrics - sharper ── */
.metrics{gap:12px;margin-bottom:20px}
.metric{padding:17px 20px;border-radius:8px;box-shadow:var(--sh)}
.metric:hover{transform:none;box-shadow:var(--sh-md)}
.ms{height:2px}
.m-lbl{font-size:9.5px;letter-spacing:.11em;margin-bottom:8px}
.m-val{font-size:28px;letter-spacing:-.04em;font-weight:700}
.m-sub{font-size:10.5px;margin-top:6px}
.m-ic{font-size:24px;right:14px;bottom:10px;opacity:.06}
.dlt{font-size:9.5px;padding:1px 5px;border-radius:3px;font-weight:700}

/* ── Tables - denser ── */
thead th{padding:9px 14px;font-size:8.5px;letter-spacing:.13em;background:var(--bg3);font-weight:700;border-bottom:1px solid var(--line)}
tbody td{padding:10px 14px;font-size:12.5px;border-bottom:1px solid var(--line)}
tbody tr:hover td{background:var(--bg3)}

/* ── Badges - flatter ── */
.bdg{padding:2px 8px;font-size:9.5px;font-weight:600;letter-spacing:.04em;border-width:1px;font-family:var(--mono)}
.bdg::before{width:4px;height:4px}

/* ── Forms ── */
.fL{font-size:10.5px;letter-spacing:.09em;margin-bottom:6px;font-weight:700;color:var(--ink2)}
.fI,.fS,.fT{font-size:12.5px;padding:8px 12px;border-radius:6px;border-width:1px;background:#fff;border-color:var(--line2)}
.fI:focus,.fS:focus,.fT:focus{border-color:var(--orange);box-shadow:0 0 0 3px var(--orange-p)}

/* ── Detail rows ── */
.fr{padding:9px 0;gap:14px;border-bottom-color:var(--line)}
.fl{font-size:9.5px;letter-spacing:.07em;width:160px;color:var(--ink3);font-weight:700}
.fv{font-size:12.5px;font-weight:500;color:var(--ink)}

/* ── Modal ── */
.mb{border-radius:10px;border-color:var(--line);box-shadow:var(--sh-lg)}
.mh{padding:18px 22px;background:var(--bg3);border-bottom-color:var(--line)}
.m-ic2{width:34px;height:34px;border-radius:7px;background:var(--orange-p);border-color:rgba(232,150,20,.22)}
.m-ic2 svg{stroke:var(--orange-d)}
.m-t{font-size:15px;letter-spacing:-.03em}
.m-cl{width:28px;height:28px;border-radius:6px;border-color:var(--line2)}
.m-bd{padding:22px}
.m-ft{padding:14px 22px;background:var(--bg3);gap:7px}

/* ── Alerts ── */
.alt{padding:11px 14px;border-radius:6px;font-size:12.5px;font-weight:500;line-height:1.5;border-width:1px}
.a-rs{padding:9px 13px;border-radius:6px;font-size:11.5px;font-weight:600}

/* ── Notif panel ── */
.notif-p{border-radius:8px;box-shadow:var(--sh-lg);width:340px;top:60px;right:14px}
.np-h{padding:13px 16px;font-size:13px;letter-spacing:-.02em;border-bottom-color:var(--line);background:var(--bg3)}
.np-i{padding:11px 16px;border-bottom-color:var(--line)}
.np-t{font-size:11.5px;font-weight:600}
.np-b{font-size:10.5px}
.np-tm{font-size:9.5px;margin-top:4px}

/* ── Toast ── */
.ts{padding:11px 16px;min-width:280px;border-radius:8px;font-size:12.5px;font-weight:600;border-width:1px;box-shadow:var(--sh-lg)}

/* ── User menu (replaces tooltip) ── */
.user-menu{border-radius:8px;border-color:var(--line);box-shadow:var(--sh-lg);overflow:hidden;min-width:200px;top:calc(100% + 6px)}
.user-menu-item{padding:9px 13px;font-size:12px;color:var(--ink2);font-weight:500;gap:9px;border-bottom:1px solid var(--line)}
.user-menu-item:last-child{border-bottom:none}
.user-menu-item.danger{color:var(--red);border-top:1px solid var(--line)}
.user-menu-item .umi-ic{width:14px;height:14px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}

/* ── Charts ── */
.bar{background:var(--orange-p);border-color:rgba(232,150,20,.25);border-radius:3px 3px 0 0}
.bar:hover{background:rgba(232,150,20,.18);border-color:var(--orange)}

/* ── Documents conserved ── */
.doc{border-radius:4px;box-shadow:var(--sh-md);padding:34px 40px 26px}
.doc-cn-n{font-size:21px}



/* ═══ V100 — GÉNÉRATION SUIVANTE ═══ */

/* Hero strip — Welcome banner for executive dashboard */
.exec-hero{position:relative;background:linear-gradient(135deg,#080f25 0%,#0f1f45 40%,#162850 75%,#1a3060 100%);border-radius:var(--radius-lg);padding:28px 32px;margin-bottom:22px;color:#fff;overflow:hidden;box-shadow:0 8px 36px rgba(8,15,40,.22)}
.exec-hero::before{content:"";position:absolute;right:-80px;top:-80px;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(232,151,43,.2) 0%,transparent 65%);pointer-events:none}
.exec-hero::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent 0%,var(--orange-d) 30%,var(--orange2) 70%,transparent 100%);opacity:.8;pointer-events:none}
.exec-hero-eyebrow{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.22em;color:var(--orange2);text-transform:uppercase;display:flex;align-items:center;gap:9px;margin-bottom:10px}
.exec-hero-eyebrow::before{content:"";width:6px;height:6px;background:var(--orange);border-radius:50%;box-shadow:0 0 0 0 rgba(217,127,31,.7);animation:pulseDot 2s infinite}
@keyframes pulseDot{0%{box-shadow:0 0 0 0 rgba(217,127,31,.7)}70%{box-shadow:0 0 0 10px rgba(217,127,31,0)}100%{box-shadow:0 0 0 0 rgba(217,127,31,0)}}
.exec-hero-title{font-family:var(--sans);font-size:28px;font-weight:700;letter-spacing:-.045em;line-height:1.15;margin-bottom:7px;color:#fff;position:relative;z-index:1}
.exec-hero-title em{font-family:var(--serif);font-style:italic;font-weight:500;color:var(--orange2)}
.exec-hero-sub{font-size:13px;color:rgba(255,255,255,.65);line-height:1.55;max-width:660px;position:relative;z-index:1}
.exec-hero-stats{display:flex;gap:32px;margin-top:22px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);position:relative;z-index:1}
.eh-stat{display:flex;flex-direction:column;gap:3px}
.eh-stat-l{font-size:9.5px;font-weight:600;letter-spacing:.14em;color:rgba(255,255,255,.5);text-transform:uppercase;font-family:var(--mono)}
.eh-stat-v{font-family:var(--sans);font-size:22px;font-weight:700;color:#fff;letter-spacing:-.03em;line-height:1.1}
.eh-stat-v em{font-family:var(--serif);font-style:italic;color:var(--orange2);font-weight:500;font-size:14px;margin-left:4px}
.eh-stat-d{font-size:10px;color:var(--orange2);font-weight:700;font-family:var(--mono);letter-spacing:.04em;margin-top:2px}

/* World operations map */
.world-map{background:#fff;border:1px solid var(--line);border-radius:10px;padding:22px;position:relative;overflow:hidden}
.wm-h{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px}
.wm-t{font-size:13px;font-weight:700;color:var(--navy);letter-spacing:-.02em;display:flex;align-items:center;gap:9px}
.wm-t em{font-family:var(--serif);font-style:italic;font-weight:500;color:var(--orange-d)}
.wm-svg{width:100%;height:auto;display:block}
.wm-region{fill:#e3e8f1;stroke:#cbd4e3;stroke-width:.5;transition:fill .2s}
.wm-region.active{fill:#cee2d6}
.wm-region.hub{fill:#f7d9bb}
.wm-region:hover{fill:#fec88a;cursor:pointer}
.wm-hotspot{fill:var(--orange);stroke:#fff;stroke-width:2;filter:drop-shadow(0 2px 4px rgba(217,127,31,.5));cursor:pointer}
.wm-hotspot-pulse{fill:rgba(217,127,31,.35);animation:hotspotPulse 2.5s infinite ease-out;transform-origin:center}
@keyframes hotspotPulse{0%{r:6;opacity:1}100%{r:18;opacity:0}}
.wm-label{font-family:var(--mono);font-size:9px;font-weight:700;fill:var(--navy);text-anchor:middle;pointer-events:none}
.wm-legend{display:flex;gap:16px;font-size:11px;color:var(--ink3);margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.wm-leg-item{display:flex;align-items:center;gap:6px;font-weight:600}
.wm-leg-dot{width:10px;height:10px;border-radius:50%}

/* Live tracking timeline */
.tk-list{display:flex;flex-direction:column;gap:12px}
.tk-row{background:#fff;border:1px solid var(--line);border-left:3px solid var(--orange-d);border-radius:9px;padding:15px 18px;display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;transition:all .18s;cursor:pointer;position:relative}
.tk-row:hover{border-left-color:var(--orange2);box-shadow:var(--sh-md);transform:translateY(-1px)}
.tk-row.live::after{content:"DIRECT";position:absolute;right:14px;top:14px;font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:.14em;color:#fff;background:#0c8a5f;padding:2px 7px;border-radius:3px}
.tk-row.live::before{content:"";position:absolute;right:62px;top:18px;width:6px;height:6px;background:#0c8a5f;border-radius:50%;animation:pulseDot 1.6s infinite}
.tk-ref{font-family:var(--mono);font-size:13px;font-weight:700;color:var(--navy);min-width:120px}
.tk-info{display:flex;flex-direction:column;gap:3px}
.tk-meta{display:flex;gap:14px;font-size:11px;color:var(--ink3)}
.tk-meta strong{color:var(--ink2);font-weight:600}
.tk-route{font-size:13px;font-weight:600;color:var(--navy);letter-spacing:-.02em;display:flex;align-items:center;gap:8px}
.tk-progress{width:200px}
.tk-progress-bar{height:6px;background:var(--bg4);border-radius:99px;overflow:hidden;margin-bottom:6px}
.tk-progress-fill{height:100%;background:linear-gradient(90deg,var(--orange),var(--orange-d));border-radius:99px;transition:width .5s}
.tk-progress-l{font-size:10px;color:var(--ink3);font-weight:600;letter-spacing:.04em;text-transform:uppercase}

/* Timeline detail */
.timeline{position:relative;padding-left:28px}
.timeline::before{content:"";position:absolute;left:9px;top:8px;bottom:8px;width:2px;background:var(--line)}
.tl-evt{position:relative;padding-bottom:18px}
.tl-evt:last-child{padding-bottom:0}
.tl-evt::before{content:"";position:absolute;left:-23px;top:5px;width:14px;height:14px;border-radius:50%;background:var(--orange-p);border:2px solid var(--orange-d)}
.tl-evt.done::before{background:var(--green);border-color:#0a7d56}
.tl-evt.live::before{background:var(--orange);border-color:#fff;box-shadow:0 0 0 3px var(--orange-p),0 0 0 3px rgba(217,127,31,.3);animation:pulseDot 2s infinite}
.tl-evt.pending::before{background:#fff;border-color:var(--line2)}
.tl-time{font-family:var(--mono);font-size:10px;font-weight:600;color:var(--ink3);letter-spacing:.04em}
.tl-evt-t{font-size:13px;font-weight:600;color:var(--navy);letter-spacing:-.02em;margin:3px 0 4px}
.tl-evt-d{font-size:11.5px;color:var(--ink3);line-height:1.5}
.tl-loc{font-family:var(--mono);font-size:10.5px;font-weight:600;color:var(--orange-d);background:var(--orange-p);padding:2px 7px;border-radius:4px;display:inline-block;margin-top:4px}

/* Chat / Messaging */
.chat-layout{display:grid;grid-template-columns:320px 1fr;gap:14px;height:calc(100vh - 230px);min-height:520px}
.chat-list{background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column}
.chat-search-w{padding:12px;border-bottom:1px solid var(--line);background:var(--bg3)}
.chat-search-w input{width:100%;border:1px solid var(--line2);padding:7px 12px;border-radius:6px;font-size:12px;background:#fff}
.chat-threads{flex:1;overflow-y:auto}
.chat-thread{padding:14px 16px;border-bottom:1px solid var(--line);cursor:pointer;transition:all .15s;position:relative}
.chat-thread:hover{background:var(--bg3)}
.chat-thread.active{background:var(--orange-p);border-left:3px solid var(--orange);padding-left:13px}
.chat-thread-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.chat-thread-n{font-size:12.5px;font-weight:700;color:var(--navy);letter-spacing:-.02em}
.chat-thread-t{font-size:9.5px;color:var(--ink3);font-family:var(--mono)}
.chat-thread-p{font-size:11px;color:var(--ink3);line-height:1.4;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.chat-thread-meta{display:flex;align-items:center;gap:6px;margin-top:6px}
.chat-thread-tag{font-size:9px;font-weight:700;font-family:var(--mono);padding:1px 6px;border-radius:3px;letter-spacing:.04em}
.chat-thread-tag.client{background:var(--orange-p);color:var(--orange-d)}
.chat-thread-tag.intern{background:var(--bg4);color:var(--ink2)}
.chat-thread-unread{margin-left:auto;background:var(--orange);color:#fff;font-size:9.5px;font-weight:700;padding:1px 7px;border-radius:99px;min-width:18px;text-align:center}

.chat-conv{background:#fff;border:1px solid var(--line);border-radius:10px;display:flex;flex-direction:column;overflow:hidden}
.chat-conv-h{padding:14px 20px;border-bottom:1px solid var(--line);background:var(--bg3);display:flex;justify-content:space-between;align-items:center}
.chat-conv-h-l{display:flex;flex-direction:column;gap:2px}
.chat-conv-t{font-size:14px;font-weight:700;color:var(--navy);letter-spacing:-.02em}
.chat-conv-sub{font-size:11px;color:var(--ink3);display:flex;gap:10px;align-items:center}
.chat-conv-actions{display:flex;gap:6px}
.chat-conv-body{flex:1;overflow-y:auto;padding:22px;background:var(--bg3);display:flex;flex-direction:column;gap:14px}
.msg-day{font-family:var(--mono);font-size:9.5px;font-weight:600;color:var(--ink3);text-align:center;letter-spacing:.14em;margin:8px 0;text-transform:uppercase}
.msg{max-width:75%;display:flex;flex-direction:column}
.msg.me{margin-left:auto;align-items:flex-end}
.msg.them{margin-right:auto;align-items:flex-start}
.msg-h{font-size:10.5px;color:var(--ink3);margin-bottom:3px;display:flex;gap:8px;align-items:center;font-weight:500}
.msg-h strong{color:var(--ink2);font-weight:700}
.msg-bubble{padding:10px 14px;border-radius:14px;font-size:12.5px;line-height:1.45;letter-spacing:-.005em}
.msg.them .msg-bubble{background:#fff;color:var(--ink);border:1px solid var(--line);border-top-left-radius:4px}
.msg.me .msg-bubble{background:var(--navy);color:#fff;border-top-right-radius:4px}
.msg-time{font-size:9.5px;color:var(--ink4);margin-top:3px;font-family:var(--mono)}
.msg.me .msg-time{margin-right:4px}
.msg.them .msg-time{margin-left:4px}
.chat-composer{padding:14px 18px;border-top:1px solid var(--line);background:#fff;display:flex;gap:10px;align-items:flex-end}
.chat-composer textarea{flex:1;border:1px solid var(--line2);padding:9px 12px;border-radius:8px;font-size:12.5px;font-family:var(--sans);resize:none;min-height:42px;max-height:120px;line-height:1.4}
.chat-composer textarea:focus{border-color:var(--orange);outline:none;box-shadow:0 0 0 3px var(--orange-p)}
.chat-send{display:flex;align-items:center;justify-content:center;width:42px;height:42px;background:var(--orange);color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all .15s;box-shadow:0 1px 3px rgba(217,127,31,.25)}
.chat-send:hover{background:var(--orange-d)}
.chat-attach{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--bg4);color:var(--ink2);border:1px solid var(--line);border-radius:7px;cursor:pointer;transition:all .15s}
.chat-attach:hover{background:var(--bg);border-color:var(--orange);color:var(--orange-d)}

/* Partner cards */
.partner-tabs{display:flex;gap:8px;margin-bottom:18px;flex-wrap:wrap}
.partner-tab{padding:7px 14px;background:#fff;border:1px solid var(--line);border-radius:99px;font-size:11.5px;font-weight:600;color:var(--ink2);cursor:pointer;transition:all .15s;letter-spacing:-.01em;display:flex;align-items:center;gap:6px}
.partner-tab:hover{border-color:var(--orange);color:var(--orange-d)}
.partner-tab.active{background:var(--navy);color:#fff;border-color:var(--navy)}
.partner-tab-count{background:rgba(255,255,255,.15);padding:1px 7px;border-radius:99px;font-size:10px;font-weight:700;font-family:var(--mono)}
.partner-tab.active .partner-tab-count{background:var(--orange)}
.partner-tab:not(.active) .partner-tab-count{background:var(--bg4);color:var(--ink2)}

.partner-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px;transition:all .2s;position:relative;overflow:hidden}
.partner-card:hover{transform:translateY(-2px);box-shadow:var(--sh-md);border-color:var(--orange)}
.partner-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--orange),var(--orange-d));opacity:0;transition:opacity .2s}
.partner-card:hover::before{opacity:1}
.pc-h{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.pc-logo{width:48px;height:48px;border-radius:9px;background:linear-gradient(135deg,var(--bg4),var(--bg));border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:14px;font-weight:800;color:var(--ink2);letter-spacing:-.03em;flex-shrink:0}
.pc-logo.shipping{background:linear-gradient(135deg,#dbe9f7,#bdd4ec);color:#1a4d8c}
.pc-logo.bank{background:linear-gradient(135deg,#dce8d8,#bcd7b3);color:#0c6e3d}
.pc-logo.inspect{background:linear-gradient(135deg,#f7e8d8,#ecd0b3);color:#8c5a1a}
.pc-logo.agent{background:linear-gradient(135deg,#e8d8f7,#d4b3ec);color:#5a1a8c}
.pc-logo.insurance{background:linear-gradient(135deg,#f7d8d8,#ecb3b3);color:#8c1a1a}
.pc-logo.customs{background:linear-gradient(135deg,#d8e9f7,#b3cfec);color:#1a4f8c}
.pc-info{flex:1;min-width:0}
.pc-name{font-size:13.5px;font-weight:700;color:var(--navy);letter-spacing:-.02em;margin-bottom:1px;line-height:1.2}
.pc-loc{font-size:10.5px;color:var(--ink3);display:flex;align-items:center;gap:5px;font-weight:500}
.pc-status{position:absolute;top:14px;right:14px;display:flex;align-items:center;gap:5px;font-family:var(--mono);font-size:9px;font-weight:700;color:#0c8a5f;letter-spacing:.07em;text-transform:uppercase}
.pc-status::before{content:"";width:6px;height:6px;background:#0c8a5f;border-radius:50%}
.pc-services{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:12px}
.pc-svc{font-size:9.5px;font-weight:700;font-family:var(--mono);color:var(--ink2);background:var(--bg4);padding:2px 7px;border-radius:4px;letter-spacing:.04em}
.pc-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:12px;border-top:1px solid var(--line);font-size:10.5px}
.pc-stat-l{font-size:8.5px;color:var(--ink3);font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:2px;font-family:var(--mono)}
.pc-stat-v{font-size:13px;color:var(--navy);font-weight:700;font-family:var(--mono);letter-spacing:-.01em}

/* KPI big numbers */
.kpi-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:18px}
@media(max-width:1400px){.kpi-strip{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.kpi-strip{grid-template-columns:repeat(2,1fr)}}
.kpi-mega{background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px 20px;position:relative;overflow:hidden;transition:all .2s}
.kpi-mega:hover{box-shadow:var(--sh-md);border-color:var(--orange)}
.kpi-mega::after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--bg4);border-radius:2px 2px 0 0}
.kpi-mega.green::after{background:linear-gradient(90deg,var(--green),#0a7d56)}
.kpi-mega.orange::after{background:linear-gradient(90deg,var(--orange),var(--orange-d))}
.kpi-mega.navy::after{background:linear-gradient(90deg,var(--navy),var(--navy2))}
.kpi-mega.red::after{background:linear-gradient(90deg,var(--red),#a52a3d)}
.kpi-mega-h{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}
.kpi-mega-l{font-size:10px;font-weight:700;letter-spacing:.13em;color:var(--ink3);text-transform:uppercase;font-family:var(--mono)}
.kpi-mega-ic{width:30px;height:30px;background:var(--bg4);border-radius:7px;display:flex;align-items:center;justify-content:center;color:var(--ink2);flex-shrink:0}
.kpi-mega.green .kpi-mega-ic{background:rgba(12,138,95,.1);color:#0a7d56}
.kpi-mega.orange .kpi-mega-ic{background:var(--orange-p);color:var(--orange-d)}
.kpi-mega.navy .kpi-mega-ic{background:rgba(28,45,79,.08);color:var(--navy)}
.kpi-mega.red .kpi-mega-ic{background:var(--red-p);color:var(--red)}
.kpi-mega-v{font-size:26px;font-weight:700;color:var(--navy);letter-spacing:-.04em;line-height:1.05;font-family:var(--sans);display:flex;align-items:baseline;gap:5px}
.kpi-mega-v em{font-family:var(--serif);font-style:italic;color:var(--ink3);font-weight:500;font-size:13px}
.kpi-mega-sub{font-size:11px;color:var(--ink3);margin-top:6px;line-height:1.45;display:flex;align-items:center;gap:6px}
.kpi-trend{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:700;padding:1px 6px;border-radius:3px;font-family:var(--mono);letter-spacing:.04em}
.kpi-trend.up{background:rgba(12,138,95,.1);color:#0a7d56}
.kpi-trend.down{background:rgba(192,51,74,.1);color:var(--red)}
.kpi-trend.stable{background:var(--bg4);color:var(--ink3)}
.kpi-spark{width:100%;height:32px;margin-top:10px}

/* Activity feed */
.activity-feed{background:#fff;border:1px solid var(--line);border-radius:10px;padding:0;overflow:hidden}
.af-h{padding:13px 18px;background:var(--bg3);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
.af-t{font-size:13px;font-weight:700;color:var(--navy);display:flex;align-items:center;gap:9px;letter-spacing:-.02em}
.af-t em{font-family:var(--serif);font-style:italic;font-weight:500;color:var(--orange-d)}
.af-live{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:9.5px;font-weight:700;color:#0c8a5f;letter-spacing:.1em;text-transform:uppercase}
.af-live::before{content:"";width:6px;height:6px;background:#0c8a5f;border-radius:50%;animation:pulseDot 1.6s infinite}
.af-list{max-height:380px;overflow-y:auto}
.af-item{display:flex;gap:13px;padding:12px 18px;border-bottom:1px solid var(--line);transition:background .15s}
.af-item:last-child{border-bottom:none}
.af-item:hover{background:var(--bg3)}
.af-ic{width:32px;height:32px;border-radius:7px;background:var(--bg4);display:flex;align-items:center;justify-content:center;color:var(--ink2);flex-shrink:0}
.af-ic.success{background:rgba(12,138,95,.1);color:#0a7d56}
.af-ic.alert{background:var(--orange-p);color:var(--orange-d)}
.af-ic.info{background:rgba(28,45,79,.08);color:var(--navy)}
.af-body{flex:1;min-width:0}
.af-msg{font-size:12px;color:var(--ink);line-height:1.45}
.af-msg strong{color:var(--navy);font-weight:700}
.af-meta{font-size:10px;color:var(--ink3);margin-top:3px;display:flex;gap:10px;font-family:var(--mono);font-weight:500}

/* Network strength visualization (partner page) */
.network-strength{background:linear-gradient(135deg,#fff,var(--bg3));border:1px solid var(--line);border-radius:10px;padding:20px 24px;display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:24px;margin-bottom:20px}
.ns-item{display:flex;flex-direction:column;gap:6px}
.ns-l{font-size:9.5px;font-weight:700;letter-spacing:.13em;color:var(--ink3);text-transform:uppercase;font-family:var(--mono)}
.ns-v{font-size:28px;font-weight:700;color:var(--navy);letter-spacing:-.04em;font-family:var(--sans);line-height:1}
.ns-v em{font-family:var(--serif);font-style:italic;color:var(--orange-d);font-weight:500;font-size:14px;margin-left:3px}
.ns-d{font-size:11px;color:var(--ink3);margin-top:2px}

/* Regional cards */
.region-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.region-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px;display:flex;align-items:center;gap:13px;transition:all .2s;cursor:pointer}
.region-card:hover{border-color:var(--orange);box-shadow:var(--sh-md);transform:translateY(-1px)}
.region-flag{width:42px;height:42px;border-radius:7px;background:linear-gradient(135deg,var(--bg4),var(--bg));display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;border:1px solid var(--line)}
.region-info{flex:1;min-width:0}
.region-n{font-size:13px;font-weight:700;color:var(--navy);letter-spacing:-.02em;margin-bottom:2px}
.region-stats{display:flex;gap:10px;font-size:10.5px;color:var(--ink3);font-weight:500}
.region-stats strong{color:var(--navy);font-weight:700}
.region-bar{height:3px;background:var(--bg4);border-radius:99px;margin-top:6px;overflow:hidden}
.region-bar-fill{height:100%;background:linear-gradient(90deg,var(--orange),var(--orange-d));border-radius:99px}

/* Showcase banner */
.showcase{background:linear-gradient(135deg,#fff,var(--orange-p));border:1px solid rgba(217,127,31,.2);border-left:3px solid var(--orange);border-radius:10px;padding:20px 24px;display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:20px}
.showcase-l{font-family:var(--mono);font-size:9.5px;font-weight:700;color:var(--orange-d);letter-spacing:.18em;text-transform:uppercase;margin-bottom:8px}
.showcase-t{font-size:17px;font-weight:700;color:var(--navy);letter-spacing:-.03em;margin-bottom:4px;line-height:1.2}
.showcase-t em{font-family:var(--serif);font-style:italic;font-weight:500;color:var(--orange-d)}
.showcase-d{font-size:12px;color:var(--ink3);line-height:1.5;max-width:540px}

/* Live indicator dot (reusable) */
.live-dot{display:inline-block;width:7px;height:7px;background:#0c8a5f;border-radius:50%;margin-right:6px;animation:pulseDot 1.6s infinite;vertical-align:middle}

/* Trust badges */
.trust-row{display:flex;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line);flex-wrap:wrap}
.trust-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;background:var(--bg3);border:1px solid var(--line);border-radius:99px;font-size:10.5px;font-weight:600;color:var(--ink2);font-family:var(--mono);letter-spacing:.04em}
.trust-badge svg{stroke:#0a7d56}

/* Sidebar v100 - new section: Excellence */
.nav-sec-vitrine{color:rgba(217,127,31,.7) !important}



/* ═══ V200 — WORLD-CLASS ADAPTATION ═══ */

/* AI Assistant - Floating FAB + Chat */
.ai-fab{position:fixed;bottom:24px;right:24px;width:56px;height:56px;background:linear-gradient(135deg,var(--orange),var(--orange-d));color:#fff;border:none;border-radius:50%;box-shadow:0 8px 24px rgba(217,127,31,.35);cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:100;transition:all .25s;animation:fabPulse 3s infinite ease-in-out}
@keyframes fabPulse{0%,100%{box-shadow:0 8px 24px rgba(217,127,31,.35)}50%{box-shadow:0 8px 32px rgba(217,127,31,.55),0 0 0 8px rgba(217,127,31,.15)}}
.ai-fab:hover{transform:scale(1.08);animation:none}
.ai-fab::before{content:"";position:absolute;top:6px;right:6px;width:11px;height:11px;background:#0c8a5f;border:2px solid #fff;border-radius:50%}
.ai-panel{position:fixed;bottom:88px;right:24px;width:420px;max-width:calc(100vw - 48px);height:600px;max-height:calc(100vh - 120px);background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 60px rgba(15,28,60,.25);z-index:99;display:flex;flex-direction:column;overflow:hidden;animation:aiSlideIn .25s cubic-bezier(.16,1,.3,1)}
@keyframes aiSlideIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.ai-panel.hidden{display:none}
.ai-h{padding:14px 18px;background:linear-gradient(135deg,#0c1a36,#15294f);color:#fff;display:flex;justify-content:space-between;align-items:center}
.ai-h-l{display:flex;align-items:center;gap:11px}
.ai-h-av{width:34px;height:34px;background:linear-gradient(135deg,var(--orange),var(--orange-d));border-radius:9px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:14px}
.ai-h-info{display:flex;flex-direction:column;gap:1px}
.ai-h-n{font-size:13.5px;font-weight:700;letter-spacing:-.02em}
.ai-h-s{font-size:10px;color:rgba(255,255,255,.6);display:flex;align-items:center;gap:5px}
.ai-h-s::before{content:"";width:6px;height:6px;background:#0c8a5f;border-radius:50%;animation:pulseDot 1.6s infinite}
.ai-h-close{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);color:#fff;width:28px;height:28px;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.ai-body{flex:1;overflow-y:auto;padding:18px;background:var(--bg3);display:flex;flex-direction:column;gap:11px}
.ai-msg{max-width:88%}
.ai-msg.bot{align-self:flex-start}
.ai-msg.me{align-self:flex-end}
.ai-bubble{padding:10px 14px;border-radius:12px;font-size:12px;line-height:1.5}
.ai-msg.bot .ai-bubble{background:#fff;border:1px solid var(--line);border-top-left-radius:4px;color:var(--ink)}
.ai-msg.me .ai-bubble{background:var(--navy);color:#fff;border-top-right-radius:4px}
.ai-suggest{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ai-chip{padding:5px 11px;background:#fff;border:1px solid var(--line2);border-radius:99px;font-size:11px;font-weight:500;color:var(--ink2);cursor:pointer;transition:all .15s}
.ai-chip:hover{border-color:var(--orange);color:var(--orange-d);background:var(--orange-p)}
.ai-composer{padding:12px 14px;background:#fff;border-top:1px solid var(--line);display:flex;gap:8px}
.ai-composer input{flex:1;border:1px solid var(--line2);padding:8px 12px;border-radius:8px;font-size:12px}
.ai-composer input:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px var(--orange-p)}
.ai-send-btn{width:36px;height:36px;background:var(--orange);border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}

/* Disruption alerts */
.disrupt-hero{background:linear-gradient(135deg,#c0334a 0%,#9b2438 100%);color:#fff;border-radius:12px;padding:22px 26px;margin-bottom:18px;position:relative;overflow:hidden}
.disrupt-hero::after{content:"";position:absolute;right:-80px;top:-80px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.08) 0,transparent 70%)}
.dh-eyebrow{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.22em;color:rgba(255,255,255,.7);text-transform:uppercase;margin-bottom:8px;display:flex;align-items:center;gap:9px}
.dh-eyebrow::before{content:"";width:7px;height:7px;background:#fff;border-radius:50%;animation:pulseDot 1.4s infinite;box-shadow:0 0 0 0 rgba(255,255,255,.7)}
.dh-title{font-size:22px;font-weight:700;letter-spacing:-.04em;margin-bottom:5px}
.dh-sub{font-size:12.5px;color:rgba(255,255,255,.75);line-height:1.5;max-width:560px}
.dh-stats{display:flex;gap:28px;margin-top:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,.15)}
.dh-st{display:flex;flex-direction:column;gap:2px}
.dh-st-l{font-size:9.5px;font-weight:600;letter-spacing:.13em;color:rgba(255,255,255,.6);text-transform:uppercase;font-family:var(--mono)}
.dh-st-v{font-size:22px;font-weight:700;letter-spacing:-.03em}

.disrupt-card{background:#fff;border:1px solid var(--line);border-left:3px solid;border-radius:8px;padding:14px 18px;margin-bottom:10px;display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;transition:all .15s}
.disrupt-card:hover{box-shadow:var(--sh-md);transform:translateY(-1px)}
.disrupt-card.p0{border-left-color:#c0334a;background:linear-gradient(90deg,rgba(192,51,74,.04),#fff 30%)}
.disrupt-card.p1{border-left-color:#d97f1f;background:linear-gradient(90deg,rgba(217,127,31,.04),#fff 30%)}
.disrupt-card.p2{border-left-color:#a76d0a}
.disrupt-card.p3{border-left-color:#5b6b88}
.dc-sev{width:42px;height:42px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;font-weight:800;letter-spacing:.05em}
.dc-sev.p0{background:rgba(192,51,74,.1);color:#c0334a}
.dc-sev.p1{background:rgba(217,127,31,.1);color:#d97f1f}
.dc-sev.p2{background:rgba(167,109,10,.1);color:#a76d0a}
.dc-sev.p3{background:rgba(91,107,136,.1);color:#5b6b88}
.dc-body{min-width:0}
.dc-h{display:flex;align-items:center;gap:9px;margin-bottom:3px}
.dc-t{font-size:13px;font-weight:700;color:var(--navy);letter-spacing:-.02em}
.dc-loc{font-family:var(--mono);font-size:9.5px;font-weight:600;color:var(--ink3);background:var(--bg4);padding:1px 6px;border-radius:3px;letter-spacing:.04em}
.dc-d{font-size:11.5px;color:var(--ink2);line-height:1.45}
.dc-meta{display:flex;gap:14px;font-size:10px;color:var(--ink3);margin-top:5px;font-family:var(--mono);font-weight:500}
.dc-imp{text-align:right;display:flex;flex-direction:column;gap:3px;min-width:90px}
.dc-imp-l{font-size:8.5px;color:var(--ink3);font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.dc-imp-v{font-size:14px;color:var(--navy);font-weight:700;font-family:var(--mono)}

/* Port congestion gauge */
.port-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:11px;margin-bottom:18px}
.port-card{background:#fff;border:1px solid var(--line);border-radius:8px;padding:13px 15px}
.pc-name{font-size:11px;font-weight:700;color:var(--navy);letter-spacing:-.01em;margin-bottom:9px;display:flex;justify-content:space-between;align-items:center}
.pc-flag{font-size:16px}
.pc-gauge{height:5px;background:var(--bg4);border-radius:99px;overflow:hidden;margin-bottom:6px}
.pc-gauge-fill{height:100%;border-radius:99px;transition:width .5s}
.pc-gauge-fill.low{background:linear-gradient(90deg,#0c8a5f,#0a7d56)}
.pc-gauge-fill.med{background:linear-gradient(90deg,#d97f1f,#b56a16)}
.pc-gauge-fill.high{background:linear-gradient(90deg,#c0334a,#9b2438)}
.pc-stat{display:flex;justify-content:space-between;font-size:10px;color:var(--ink3);font-weight:500}
.pc-stat strong{color:var(--navy);font-weight:700;font-family:var(--mono)}

/* Carbon / ESG */
.carbon-hero{background:linear-gradient(135deg,#0c8a5f 0%,#0a7d56 50%,#085f42 100%);color:#fff;border-radius:12px;padding:22px 26px;margin-bottom:18px;position:relative;overflow:hidden}
.carbon-hero::after{content:"";position:absolute;right:-80px;top:-80px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.06) 0,transparent 70%)}
.ch-eyebrow{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.22em;color:rgba(255,255,255,.7);text-transform:uppercase;margin-bottom:8px}
.ch-title{font-size:23px;font-weight:700;letter-spacing:-.04em;margin-bottom:6px}
.ch-title em{font-family:var(--serif);font-style:italic;color:rgba(255,255,255,.85);font-weight:500}
.ch-sub{font-size:12.5px;color:rgba(255,255,255,.75);line-height:1.5;max-width:600px}
.ch-stats{display:flex;gap:30px;margin-top:20px;padding-top:18px;border-top:1px solid rgba(255,255,255,.15)}
.ch-st{display:flex;flex-direction:column;gap:2px}
.ch-st-l{font-size:9.5px;font-weight:600;letter-spacing:.13em;color:rgba(255,255,255,.6);text-transform:uppercase;font-family:var(--mono)}
.ch-st-v{font-size:24px;font-weight:700;letter-spacing:-.03em;font-family:var(--sans)}
.ch-st-v em{font-family:var(--serif);font-style:italic;font-size:14px;color:rgba(255,255,255,.7);font-weight:500;margin-left:3px}

.carbon-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:18px}
.cb-mode{background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px;text-align:center;transition:all .2s}
.cb-mode:hover{border-color:var(--green);box-shadow:var(--sh-md)}
.cb-mode-ic{width:46px;height:46px;border-radius:10px;background:rgba(12,138,95,.1);color:var(--green);display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.cb-mode-l{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--ink3);text-transform:uppercase;font-family:var(--mono);margin-bottom:6px}
.cb-mode-v{font-size:22px;font-weight:700;color:var(--navy);letter-spacing:-.04em;line-height:1.1;font-family:var(--sans)}
.cb-mode-v em{font-family:var(--serif);font-style:italic;font-size:13px;color:var(--ink3);font-weight:500;margin-left:3px}
.cb-mode-d{font-size:10.5px;color:var(--ink3);margin-top:4px;font-weight:500}

/* Score rings - sustainability */
.score-ring{position:relative;width:100px;height:100px}
.score-ring svg{transform:rotate(-90deg)}
.score-ring-bg{fill:none;stroke:var(--bg4);stroke-width:8}
.score-ring-fg{fill:none;stroke-linecap:round;stroke-width:8;transition:stroke-dashoffset 1s ease-out}
.score-ring-fg.green{stroke:#0c8a5f}
.score-ring-fg.orange{stroke:#d97f1f}
.score-ring-fg.red{stroke:#c0334a}
.score-ring-text{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.score-ring-v{font-size:22px;font-weight:700;color:var(--navy);letter-spacing:-.03em;line-height:1}
.score-ring-l{font-size:9px;color:var(--ink3);font-weight:700;letter-spacing:.13em;text-transform:uppercase;font-family:var(--mono);margin-top:3px}

/* Multi-modal comparison */
.mm-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mm-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:0;overflow:hidden;transition:all .2s;cursor:pointer;position:relative}
.mm-card:hover{border-color:var(--orange);box-shadow:var(--sh-lg);transform:translateY(-3px)}
.mm-card.recommended{border-color:var(--green);box-shadow:0 0 0 2px rgba(12,138,95,.12)}
.mm-card.recommended::before{content:"RECOMMANDÉ";position:absolute;top:14px;right:14px;background:var(--green);color:#fff;font-family:var(--mono);font-size:9px;font-weight:800;letter-spacing:.1em;padding:3px 8px;border-radius:4px;z-index:1}
.mm-h{padding:18px 20px;background:linear-gradient(135deg,var(--bg3),#fff)}
.mm-mode{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.mm-mode-ic{width:42px;height:42px;border-radius:10px;background:var(--bg4);display:flex;align-items:center;justify-content:center;color:var(--ink2)}
.mm-mode-ic.sea{background:rgba(28,45,79,.08);color:var(--navy)}
.mm-mode-ic.air{background:rgba(217,127,31,.1);color:var(--orange-d)}
.mm-mode-ic.road{background:rgba(91,107,136,.1);color:var(--ink2)}
.mm-mode-n{font-size:15px;font-weight:700;color:var(--navy);letter-spacing:-.02em}
.mm-mode-d{font-size:11px;color:var(--ink3);margin-top:2px}
.mm-price{font-size:26px;font-weight:700;color:var(--navy);letter-spacing:-.04em;line-height:1.05;font-family:var(--sans)}
.mm-price em{font-family:var(--serif);font-style:italic;font-size:14px;color:var(--ink3);font-weight:500;margin-left:4px}
.mm-price-l{font-size:10px;color:var(--ink3);font-weight:600;letter-spacing:.08em;text-transform:uppercase;margin-top:3px;font-family:var(--mono)}
.mm-feats{padding:14px 20px;display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line);font-size:11.5px}
.mm-feat{display:flex;justify-content:space-between;align-items:center;color:var(--ink2)}
.mm-feat strong{color:var(--navy);font-weight:700;font-family:var(--mono);font-size:11.5px}
.mm-feat.co2{padding-top:8px;border-top:1px solid var(--line);margin-top:4px}
.mm-co2-badge{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:99px;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.04em}
.mm-co2-badge.low{background:rgba(12,138,95,.1);color:#0a7d56}
.mm-co2-badge.med{background:rgba(217,127,31,.1);color:#b56a16}
.mm-co2-badge.high{background:rgba(192,51,74,.1);color:#9b2438}
.mm-cta{padding:14px 20px;border-top:1px solid var(--line);background:var(--bg3)}
.mm-cta button{width:100%;padding:9px;border-radius:7px;font-weight:700;font-size:12px;letter-spacing:-.01em;cursor:pointer;border:none}

/* Exception management */
.exc-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin-bottom:10px;display:grid;grid-template-columns:auto 1fr auto auto;gap:18px;align-items:center;transition:all .15s}
.exc-card:hover{box-shadow:var(--sh-md)}
.exc-sla{width:60px;height:60px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0;font-family:var(--mono);position:relative}
.exc-sla svg{position:absolute;inset:0;transform:rotate(-90deg)}
.exc-sla-bg{fill:none;stroke:var(--bg4);stroke-width:5}
.exc-sla-fg{fill:none;stroke-width:5;stroke-linecap:round}
.exc-sla-fg.ok{stroke:#0c8a5f}
.exc-sla-fg.warn{stroke:#d97f1f}
.exc-sla-fg.crit{stroke:#c0334a}
.exc-sla-v{font-size:14px;font-weight:800;color:var(--navy);line-height:1;position:relative;z-index:1}
.exc-sla-l{font-size:7.5px;color:var(--ink3);font-weight:700;letter-spacing:.07em;text-transform:uppercase;position:relative;z-index:1;margin-top:1px}
.exc-body{min-width:0}
.exc-h{display:flex;align-items:center;gap:9px;margin-bottom:3px}
.exc-t{font-size:13px;font-weight:700;color:var(--navy);letter-spacing:-.02em}
.exc-ref{font-family:var(--mono);font-size:10px;font-weight:600;color:var(--orange-d);background:var(--orange-p);padding:1px 7px;border-radius:3px;letter-spacing:.04em}
.exc-d{font-size:11.5px;color:var(--ink2);line-height:1.45}
.exc-meta{display:flex;gap:14px;font-size:10px;color:var(--ink3);margin-top:5px;font-family:var(--mono);font-weight:500}
.exc-meta strong{color:var(--ink2);font-weight:700}
.exc-prio{display:flex;flex-direction:column;align-items:center;gap:4px}
.exc-prio-tag{font-family:var(--mono);font-size:9px;font-weight:800;padding:3px 9px;border-radius:4px;letter-spacing:.07em}
.exc-prio-tag.high{background:rgba(192,51,74,.1);color:#c0334a}
.exc-prio-tag.med{background:rgba(217,127,31,.1);color:#b56a16}
.exc-prio-tag.low{background:rgba(91,107,136,.1);color:var(--ink2)}
.exc-act button{padding:6px 12px;font-size:11px;font-weight:600;border-radius:6px;cursor:pointer;border:1px solid var(--line2);background:#fff;color:var(--ink2)}
.exc-act button.primary{background:var(--orange);border-color:var(--orange);color:#fff}

/* AI suggestion banner */
.ai-suggestion{background:linear-gradient(135deg,rgba(217,127,31,.05),rgba(28,45,79,.04));border:1px solid rgba(217,127,31,.2);border-left:3px solid var(--orange);border-radius:8px;padding:14px 18px;display:flex;gap:12px;align-items:flex-start;margin-bottom:14px}
.ai-sugg-ic{width:32px;height:32px;background:linear-gradient(135deg,var(--orange),var(--orange-d));color:#fff;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-weight:800;font-size:12px;letter-spacing:-.02em}
.ai-sugg-body{flex:1;min-width:0}
.ai-sugg-l{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.16em;color:var(--orange-d);text-transform:uppercase;margin-bottom:4px}
.ai-sugg-t{font-size:13px;font-weight:700;color:var(--navy);letter-spacing:-.02em;margin-bottom:3px}
.ai-sugg-d{font-size:11.5px;color:var(--ink2);line-height:1.5}
.ai-sugg-act{display:flex;gap:7px;margin-top:9px}

/* World-class trust banner */
.trust-banner{background:linear-gradient(135deg,#0c1a36,#15294f);color:#fff;border-radius:12px;padding:20px 26px;margin-bottom:18px;position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:center;gap:24px}
.trust-banner::after{content:"";position:absolute;right:-60px;bottom:-60px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(217,127,31,.12) 0,transparent 70%)}
.tb-l{position:relative;z-index:1}
.tb-eyebrow{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.22em;color:var(--orange2);text-transform:uppercase;margin-bottom:6px}
.tb-title{font-size:18px;font-weight:700;color:#fff;letter-spacing:-.03em;margin-bottom:3px;line-height:1.25}
.tb-title em{font-family:var(--serif);font-style:italic;font-weight:500;color:var(--orange2)}
.tb-sub{font-size:11.5px;color:rgba(255,255,255,.65);max-width:520px;line-height:1.55}
.tb-badges{display:flex;gap:8px;position:relative;z-index:1;flex-wrap:wrap;justify-content:flex-end;max-width:300px}
.tb-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:99px;font-size:10.5px;font-weight:600;color:rgba(255,255,255,.9);font-family:var(--mono);letter-spacing:.04em}
.tb-badge svg{stroke:var(--orange2)}



/* ═══ V300 — MODIFICATIONS CHIRURGICALES ═══ */

/* SUPPRESSIONS : role switcher + bouton créer hidden */
.role-sw, .tb-quick { display: none !important; }

/* === AUTH SCREEN : Fil d'actualités à la place de "La logistique camerounaise réinventée" === */
.auth-presentation { padding: 60px 50px 40px !important; }
.auth-presentation .auth-pres-eyebrow,
.auth-presentation .auth-pres-title,
.auth-presentation .auth-pres-sub,
.auth-presentation .auth-pres-features { display: none !important; }

.auth-newsfeed { position: relative; z-index: 2; display: flex; flex-direction: column; gap: 16px; max-height: calc(100vh - 140px); overflow-y: auto; padding-right: 10px; }
.auth-newsfeed::-webkit-scrollbar { width: 6px; }
.auth-newsfeed::-webkit-scrollbar-thumb { background: rgba(255,255,255,.2); border-radius: 99px; }
.afh { font-family: var(--mono); font-size: 10.5px; font-weight: 700; letter-spacing: .22em; color: var(--orange2); text-transform: uppercase; margin-bottom: 4px; display: flex; align-items: center; gap: 9px }
.afh::before { content: ""; width: 7px; height: 7px; background: var(--orange); border-radius: 50%; box-shadow: 0 0 0 0 rgba(217,127,31,.7); animation: pulseDot 2s infinite }
.aft { font-size: 22px; font-weight: 700; letter-spacing: -.04em; line-height: 1.2; margin-bottom: 4px; color: #fff }
.aft em { font-family: var(--serif); font-style: italic; font-weight: 500; color: var(--orange2) }
.afs { font-size: 12px; color: rgba(255,255,255,.55); line-height: 1.5; margin-bottom: 16px }

.news-card { background: rgba(255,255,255,.05); backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.08); border-radius: 10px; padding: 14px 16px; transition: all .15s; cursor: pointer }
.news-card:hover { background: rgba(255,255,255,.08); border-color: rgba(217,127,31,.3); transform: translateX(2px) }
.news-card-h { display: flex; align-items: center; gap: 10px; margin-bottom: 8px }
.news-card-ic { width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; background: rgba(217,127,31,.15); border: 1px solid rgba(217,127,31,.3); color: var(--orange2) }
.news-card-ic.green { background: rgba(34,196,137,.15); border-color: rgba(34,196,137,.3); color: #22c489 }
.news-card-ic.navy { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.15); color: #cfd9ea }
.news-card-meta { flex: 1; min-width: 0 }
.news-card-cat { font-family: var(--mono); font-size: 8.5px; font-weight: 700; letter-spacing: .12em; color: var(--orange2); text-transform: uppercase; margin-bottom: 1px }
.news-card-time { font-family: var(--mono); font-size: 9px; color: rgba(255,255,255,.5); font-weight: 600 }
.news-card-t { font-size: 13px; font-weight: 700; color: #fff; letter-spacing: -.02em; line-height: 1.3; margin-bottom: 4px }
.news-card-d { font-size: 11px; color: rgba(255,255,255,.6); line-height: 1.5 }
.news-card-d strong { color: rgba(255,255,255,.85); font-weight: 700 }

.auth-pres-foot { display: none !important }
.auth-newsfeed-foot { position: absolute; bottom: 20px; left: 50px; right: 50px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.08); display: flex; justify-content: space-between; align-items: center; font-size: 10.5px; color: rgba(255,255,255,.4) }

/* === COTATION TEMPLATE COMPLET (style facture Excel) === */
.cot-section { background: #fff; border: 1px solid var(--line); border-radius: 9px; margin-bottom: 14px; overflow: hidden }
.cot-section-h { background: linear-gradient(135deg, var(--navy), var(--navy2)); color: #fff; padding: 11px 18px; display: flex; justify-content: space-between; align-items: center }
.cot-section-t { font-family: var(--sans); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase }
.cot-section-total { font-family: var(--mono); font-size: 13px; font-weight: 700; color: var(--orange2) }
.cot-table { width: 100%; border-collapse: collapse }
.cot-table th { background: var(--bg3); padding: 8px 12px; font-size: 9.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ink3); text-align: left; border-bottom: 1px solid var(--line); font-family: var(--mono) }
.cot-table th.r { text-align: right }
.cot-table td { padding: 6px 12px; border-bottom: 1px solid var(--line); font-size: 12px; vertical-align: middle }
.cot-table td.r { text-align: right; font-family: var(--mono); font-weight: 600 }
.cot-table td.action { width: 30px; text-align: center }
.cot-table input.cot-inp { width: 100%; border: 1px solid transparent; padding: 4px 8px; font-size: 11.5px; background: transparent; border-radius: 4px; font-family: var(--sans) }
.cot-table input.cot-inp:hover { border-color: var(--line) }
.cot-table input.cot-inp:focus { outline: none; border-color: var(--orange); background: #fff }
.cot-table input.cot-inp.num { text-align: right; font-family: var(--mono) }
.cot-section-foot { background: var(--bg3); padding: 8px 18px; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--line) }
.cot-add-btn { font-size: 10.5px; font-weight: 600; color: var(--orange-d); background: none; border: none; cursor: pointer; padding: 4px 10px; border-radius: 4px; display: inline-flex; align-items: center; gap: 5px }
.cot-add-btn:hover { background: var(--orange-p) }
.cot-st-l { font-family: var(--mono); font-size: 10.5px; font-weight: 700; color: var(--ink3); text-transform: uppercase; letter-spacing: .08em }
.cot-st-v { font-family: var(--mono); font-size: 14px; font-weight: 700; color: var(--navy); letter-spacing: -.01em }

.cot-grand-total { background: linear-gradient(135deg, var(--navy), var(--navy2)); color: #fff; border-radius: 10px; padding: 18px 24px; display: flex; justify-content: space-between; align-items: center; margin-top: 18px; box-shadow: 0 6px 18px rgba(15,28,60,.18) }
.cot-grand-l { font-family: var(--mono); font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.7) }
.cot-grand-v { font-family: var(--sans); font-size: 28px; font-weight: 700; letter-spacing: -.04em }
.cot-grand-v em { font-family: var(--serif); font-style: italic; color: var(--orange2); font-weight: 500; font-size: 16px; margin-left: 6px }

/* Cotation header info card */
.cot-info { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px }
.cot-info-card { background: #fff; border: 1px solid var(--line); border-radius: 9px; padding: 14px 18px }
.cot-info-h { font-family: var(--mono); font-size: 9px; font-weight: 700; letter-spacing: .14em; color: var(--orange-d); text-transform: uppercase; margin-bottom: 9px; padding-bottom: 7px; border-bottom: 1px solid var(--line) }
.cot-info-row { display: grid; grid-template-columns: 110px 1fr; gap: 10px; margin-bottom: 5px; align-items: center }
.cot-info-l { font-size: 10.5px; font-weight: 600; color: var(--ink3); font-family: var(--mono); letter-spacing: .03em }
.cot-info-v input { width: 100%; border: 1px solid var(--line2); padding: 5px 10px; font-size: 11.5px; border-radius: 5px; background: #fff }
.cot-info-v input:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 2px var(--orange-p) }

/* === EMAIL COMPOSER === */
.email-composer-fab { position: fixed; bottom: 24px; right: 92px; width: 50px; height: 50px; background: #fff; color: var(--navy); border: 1px solid var(--line); border-radius: 50%; cursor: pointer; box-shadow: 0 6px 18px rgba(15,28,60,.18); display: flex; align-items: center; justify-content: center; z-index: 198; transition: all .15s }
.email-composer-fab:hover { transform: scale(1.05); border-color: var(--orange); color: var(--orange-d); box-shadow: 0 10px 24px rgba(217,127,31,.25) }

.email-panel { position: fixed; bottom: 0; right: 24px; width: 540px; height: 540px; background: #fff; border: 1px solid var(--line); border-top-left-radius: 12px; border-top-right-radius: 12px; box-shadow: 0 -8px 32px rgba(15,28,60,.18); display: flex; flex-direction: column; z-index: 197; transform: translateY(100%); transition: transform .25s ease-out }
.email-panel.open { transform: translateY(0) }
.email-h { padding: 12px 16px; background: var(--navy); color: #fff; display: flex; align-items: center; gap: 10px; border-top-left-radius: 12px; border-top-right-radius: 12px }
.email-h-t { flex: 1; font-size: 13px; font-weight: 700; letter-spacing: -.02em }
.email-h-actions { display: flex; gap: 5px }
.email-h-actions button { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15); color: #fff; width: 26px; height: 26px; border-radius: 5px; cursor: pointer; display: flex; align-items: center; justify-content: center }
.email-body { padding: 14px 18px; display: flex; flex-direction: column; gap: 10px; flex: 1; overflow-y: auto }
.email-row { display: grid; grid-template-columns: 70px 1fr; align-items: center; gap: 10px }
.email-row label { font-family: var(--mono); font-size: 10px; font-weight: 700; letter-spacing: .1em; color: var(--ink3); text-transform: uppercase }
.email-row input { border: none; border-bottom: 1px solid var(--line); padding: 6px 0; font-size: 12.5px; font-family: var(--sans); background: transparent }
.email-row input:focus { outline: none; border-bottom-color: var(--orange) }
.email-attach-row { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px 0 }
.email-attach-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 9px; background: var(--bg3); border: 1px solid var(--line); border-radius: 99px; font-size: 10.5px; font-weight: 600; color: var(--ink2) }
.email-attach-chip button { background: none; border: none; cursor: pointer; color: var(--ink3); padding: 0 }
.email-body-area { flex: 1; padding: 8px 0; border-top: 1px solid var(--line); margin-top: 4px }
.email-body-area textarea { width: 100%; height: 100%; min-height: 200px; border: none; padding: 8px 0; font-family: var(--sans); font-size: 12.5px; line-height: 1.55; resize: none; outline: none; color: var(--ink) }
.email-foot { padding: 10px 18px; border-top: 1px solid var(--line); background: var(--bg3); display: flex; justify-content: space-between; align-items: center }
.email-toolbar { display: flex; gap: 4px }
.email-toolbar button { background: #fff; border: 1px solid var(--line); width: 28px; height: 28px; border-radius: 5px; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--ink3) }
.email-toolbar button:hover { color: var(--navy); border-color: var(--orange) }
.email-send { background: var(--orange); color: #fff; border: none; padding: 7px 16px; border-radius: 6px; font-size: 12px; font-weight: 700; cursor: pointer; display: inline-flex; align-items: center; gap: 6px }
.email-send:hover { background: var(--orange-d) }

/* === FISCAL INFO FORM (inscription client) === */
.fiscal-section { background: linear-gradient(135deg, rgba(217,127,31,.04), #fff); border: 1px solid rgba(217,127,31,.15); border-radius: 9px; padding: 14px 18px; margin-top: 12px }
.fiscal-h { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; font-family: var(--mono); font-size: 10px; font-weight: 700; letter-spacing: .14em; color: var(--orange-d); text-transform: uppercase }
.fiscal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px }
.fiscal-grid .auth-fg { margin-bottom: 0 }
.acf-alert { display: flex; gap: 9px; padding: 9px 12px; background: var(--orange-p); border: 1px solid rgba(217,127,31,.2); border-left: 3px solid var(--orange); border-radius: 6px; margin-top: 10px; font-size: 10.5px; line-height: 1.45; color: var(--ink2) }
.acf-alert svg { stroke: var(--orange-d); flex-shrink: 0; margin-top: 1px }
.acf-alert strong { color: var(--orange-d); font-weight: 700 }
.doc-upload-zone { border: 2px dashed var(--line2); border-radius: 8px; padding: 16px; text-align: center; cursor: pointer; margin-top: 10px; transition: all .15s; background: var(--bg3) }
.doc-upload-zone:hover { border-color: var(--orange); background: var(--orange-p) }
.doc-upload-ic { color: var(--ink3); margin-bottom: 6px }
.doc-upload-t { font-size: 11.5px; font-weight: 600; color: var(--ink2); margin-bottom: 2px }
.doc-upload-s { font-size: 10px; color: var(--ink3) }
.doc-list { margin-top: 8px; display: flex; flex-direction: column; gap: 5px }
.doc-item { display: flex; align-items: center; gap: 8px; padding: 5px 10px; background: var(--bg3); border: 1px solid var(--line); border-radius: 5px; font-size: 10.5px }
.doc-item-n { flex: 1; color: var(--ink); font-weight: 600 }
.doc-item-s { font-size: 9.5px; color: var(--ink3); font-family: var(--mono) }
.doc-item button { background: none; border: none; cursor: pointer; color: var(--ink3) }
.doc-item button:hover { color: var(--red) }



/* ═══ V310 — CORRECTIONS CLIENT ═══ */

/* === SIDEBAR COLLAPSIBLE SECTIONS — old rules neutralized === */
.nav-sec::after  { display:none !important; content:none !important; }
.nav-sec::before { display:none !important; content:none !important; }
.nav-sec.collapsed + .nav-items-group { max-height: 0 !important; overflow: hidden !important; opacity: 0 !important; padding-bottom:0 !important; }

.nav-items-group {
  max-height: 1000px;
  opacity: 1;
  transition: max-height .3s ease-out, opacity .2s;
  overflow: hidden;
}

/* Hover indicator that section is interactive */
.nav-sec {
  position: relative;
}
.nav-sec::before {
  content: none;
}

/* === INDUSTRY NEWS BADGE === */
.news-card-cat.industry { color: #5ab3ff !important; }
.news-card-cat.regulation { color: #ff9747 !important; }
.news-card-cat.market { color: #22c489 !important; }
.news-card-cat.geopolitics { color: #ff6b6b !important; }
.news-card-cat.tech { color: #b58dff !important; }

.news-card-source {
  font-family: var(--mono);
  font-size: 9px;
  color: rgba(255,255,255,.4);
  letter-spacing: .05em;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid rgba(255,255,255,.05);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.news-card-tag {
  display: inline-block;
  padding: 1px 6px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 3px;
  font-size: 8.5px;
  letter-spacing: .04em;
  font-weight: 700;
  text-transform: uppercase;
}

/* === FISCAL INFO STATUS BADGES === */
.acf-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 99px;
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.acf-status.valid { background: rgba(12,138,95,.1); color: #0a7d56; border: 1px solid rgba(12,138,95,.2); }
.acf-status.expiring { background: var(--orange-p); color: var(--orange-d); border: 1px solid rgba(217,127,31,.2); }
.acf-status.expired { background: var(--red-p); color: var(--red); border: 1px solid rgba(192,51,74,.2); animation: pulseDot 2s infinite; }
.acf-status.missing { background: var(--bg4); color: var(--ink3); border: 1px solid var(--line); }
.acf-status::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}

/* === FISCAL INFO DISPLAY PANEL (on company detail) === */
.fiscal-display {
  background: linear-gradient(135deg, var(--bg3), #fff);
  border: 1px solid var(--line);
  border-left: 3px solid var(--orange);
  border-radius: 9px;
  padding: 18px 22px;
  margin-top: 14px;
}
.fiscal-display-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.fiscal-display-t {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--orange-d);
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 8px;
}
.fiscal-display-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px 24px;
}
.fiscal-field {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.fiscal-field-l {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--ink3);
  text-transform: uppercase;
}
.fiscal-field-v {
  font-size: 13px;
  font-weight: 600;
  color: var(--navy);
  font-family: var(--mono);
  letter-spacing: -.01em;
}
.fiscal-field-v.empty { color: var(--ink4); font-style: italic; font-weight: 500; font-family: var(--sans); }
.fiscal-docs {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.fiscal-doc-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.fiscal-doc {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 9px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 5px;
  font-size: 11px;
  color: var(--ink2);
  font-weight: 600;
  cursor: pointer;
  transition: all .15s;
}
.fiscal-doc:hover { border-color: var(--orange); color: var(--orange-d); }
.fiscal-doc svg { color: var(--orange-d); }

/* ACF tracking dashboard cards */
.acf-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 18px;
}
.acf-stat {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 16px 18px;
  position: relative;
  overflow: hidden;
}
.acf-stat::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
}
.acf-stat.valid::before { background: linear-gradient(90deg, #0c8a5f, #13a371); }
.acf-stat.expiring::before { background: linear-gradient(90deg, var(--orange), var(--orange-d)); }
.acf-stat.expired::before { background: linear-gradient(90deg, var(--red), #a32a3d); }
.acf-stat.missing::before { background: var(--ink3); }
.acf-stat-l {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: .13em;
  color: var(--ink3);
  text-transform: uppercase;
  margin-bottom: 8px;
}
.acf-stat-v {
  font-size: 26px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.04em;
  line-height: 1;
}
.acf-stat-s {
  font-size: 11px;
  color: var(--ink3);
  margin-top: 5px;
}



/* ═══ V10000 — SAUT GÉNÉRATIONNEL ═══ */

/* === DARK MODE === */
:root[data-theme="dark"] {
  --bg: #080e1c;
  --bg2: #0d1426;
  --bg3: #111b30;
  --bg4: #18253e;
  --ink: #e8edf6;
  --ink2: #b8c4d8;
  --ink3: #7d8fa8;
  --ink4: #506080;
  --line: rgba(255,255,255,.07);
  --line2: rgba(255,255,255,.12);
  --sh-md: 0 4px 12px rgba(0,0,0,.4);
}
:root[data-theme="dark"] body { background: var(--bg2); color: var(--ink); }
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .nav-item:hover,
:root[data-theme="dark"] .modal-content,
:root[data-theme="dark"] .auth-form,
:root[data-theme="dark"] .fI,
:root[data-theme="dark"] .fS,
:root[data-theme="dark"] .auth-input,
:root[data-theme="dark"] table {
  background: var(--bg3) !important;
  border-color: var(--line) !important;
  color: var(--ink);
}
:root[data-theme="dark"] table th { background: var(--bg4) !important; color: var(--ink3) !important; }
:root[data-theme="dark"] table td { border-bottom-color: var(--line) !important; }
:root[data-theme="dark"] .page-title em { color: var(--orange2); }
:root[data-theme="dark"] .news-card { background: rgba(255,255,255,.03); }
:root[data-theme="dark"] .cot-info-card,
:root[data-theme="dark"] .cot-section,
:root[data-theme="dark"] .partner-card,
:root[data-theme="dark"] .region-card,
:root[data-theme="dark"] .kpi-mega,
:root[data-theme="dark"] .activity-feed,
:root[data-theme="dark"] .world-map,
:root[data-theme="dark"] .port-card,
:root[data-theme="dark"] .modal-option,
:root[data-theme="dark"] .exc-col,
:root[data-theme="dark"] .exc-card,
:root[data-theme="dark"] .disruption-card,
:root[data-theme="dark"] .tk-row,
:root[data-theme="dark"] .chat-list,
:root[data-theme="dark"] .chat-conv,
:root[data-theme="dark"] .acf-stat,
:root[data-theme="dark"] .fiscal-display {
  background: var(--bg3) !important;
  border-color: var(--line) !important;
  color: var(--ink);
}
:root[data-theme="dark"] .chat-conv-body { background: var(--bg2); }
:root[data-theme="dark"] .msg.them .msg-bubble { background: var(--bg4); color: var(--ink); border-color: var(--line); }
:root[data-theme="dark"] .ai-panel,
:root[data-theme="dark"] .email-panel { background: var(--bg3); border-color: var(--line); }
:root[data-theme="dark"] .ai-msg.bot .ai-msg-bubble { background: var(--bg4); color: var(--ink); border-color: var(--line); }
:root[data-theme="dark"] .ai-body { background: linear-gradient(180deg, var(--bg2), var(--bg3)); }
:root[data-theme="dark"] .ai-suggestion { background: var(--bg4); border-color: var(--line); color: var(--ink); }
:root[data-theme="dark"] .ai-suggestion strong { color: var(--ink) !important; }
:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea { background: var(--bg4) !important; color: var(--ink); border-color: var(--line2); }

/* === COMMAND PALETTE === */
.cmdk-backdrop {
  position: fixed; inset: 0;
  background: rgba(8,12,24,.6);
  backdrop-filter: blur(8px);
  z-index: 999;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding-top: 12vh;
  animation: cmdkFadeIn .15s ease-out;
}
.cmdk-backdrop.open { display: flex; }
@keyframes cmdkFadeIn { from { opacity: 0 } to { opacity: 1 } }
.cmdk-panel {
  width: 640px;
  max-width: calc(100vw - 32px);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 24px 80px rgba(0,0,0,.3);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  max-height: 70vh;
  animation: cmdkSlideUp .2s ease-out;
}
:root[data-theme="dark"] .cmdk-panel { background: var(--bg3); }
@keyframes cmdkSlideUp { from { transform: translateY(-20px); opacity: 0 } to { transform: translateY(0); opacity: 1 } }
.cmdk-input-w {
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 11px;
}
.cmdk-input-ic { color: var(--ink3); flex-shrink: 0 }
.cmdk-input {
  flex: 1;
  border: none;
  outline: none;
  font-family: var(--sans);
  font-size: 15px;
  background: transparent;
  color: var(--ink);
  letter-spacing: -.01em;
}
.cmdk-kbd {
  display: inline-flex; align-items: center; padding: 2px 7px;
  background: var(--bg4);
  border: 1px solid var(--line);
  border-radius: 4px;
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  color: var(--ink2);
  letter-spacing: .04em;
}
.cmdk-body { flex: 1; overflow-y: auto; padding: 6px }
.cmdk-group { padding: 8px 4px 4px }
.cmdk-group-l {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--ink3);
  text-transform: uppercase;
  padding: 0 12px 5px;
}
.cmdk-item {
  display: flex; align-items: center; gap: 11px;
  padding: 9px 12px;
  border-radius: 7px;
  cursor: pointer;
  font-size: 13px;
  color: var(--ink);
  transition: background .1s;
}
.cmdk-item:hover, .cmdk-item.active {
  background: var(--orange-p);
}
:root[data-theme="dark"] .cmdk-item:hover, :root[data-theme="dark"] .cmdk-item.active { background: var(--bg4); }
.cmdk-item-ic {
  width: 28px; height: 28px;
  background: var(--bg4);
  border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  color: var(--ink2);
  flex-shrink: 0;
}
.cmdk-item.active .cmdk-item-ic { background: var(--orange); color: #fff }
.cmdk-item-body { flex: 1; min-width: 0 }
.cmdk-item-t { font-weight: 600; letter-spacing: -.01em; line-height: 1.3 }
.cmdk-item-d { font-size: 11px; color: var(--ink3); margin-top: 1px }
.cmdk-item-meta { font-family: var(--mono); font-size: 9.5px; color: var(--ink3); font-weight: 600 }
.cmdk-foot {
  padding: 9px 16px;
  border-top: 1px solid var(--line);
  background: var(--bg3);
  display: flex; gap: 14px; align-items: center;
  font-size: 10.5px;
  color: var(--ink3);
}
.cmdk-foot-hint { display: inline-flex; align-items: center; gap: 6px }
.cmdk-empty {
  padding: 40px 20px;
  text-align: center;
  color: var(--ink3);
}
.cmdk-empty-ic { margin-bottom: 12px; opacity: .4 }
.cmdk-empty-t { font-size: 13px; font-weight: 600; color: var(--ink2); margin-bottom: 4px }
.cmdk-empty-d { font-size: 11.5px }

/* === GLOBAL SEARCH BAR (in topbar) === */
.tb-search {
  display: flex; align-items: center; gap: 8px;
  background: var(--bg3);
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 6px 11px;
  width: 320px;
  cursor: text;
  transition: all .15s;
}
.tb-search:hover { border-color: var(--orange); }
.tb-search-ic { color: var(--ink3); flex-shrink: 0 }
.tb-search-ph { flex: 1; font-size: 12px; color: var(--ink3); font-weight: 500 }
.tb-search-kbd {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  color: var(--ink3);
  background: var(--bg4);
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid var(--line);
  letter-spacing: .04em;
}

/* === NOTIFICATIONS DROPDOWN === */
.notif-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 380px;
  max-height: 480px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 11px;
  box-shadow: 0 16px 48px rgba(0,0,0,.15);
  z-index: 100;
  display: none;
  flex-direction: column;
  overflow: hidden;
  animation: cmdkSlideUp .15s ease-out;
}
:root[data-theme="dark"] .notif-dropdown { background: var(--bg3); }
.notif-dropdown.open { display: flex }
.notif-h {
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  display: flex; justify-content: space-between; align-items: center;
}
.notif-h-t {
  font-size: 12px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.02em;
}
:root[data-theme="dark"] .notif-h-t { color: var(--ink); }
.notif-h-action {
  font-size: 10.5px;
  font-family: var(--mono);
  font-weight: 600;
  color: var(--orange-d);
  cursor: pointer;
  letter-spacing: .03em;
}
.notif-list {
  flex: 1;
  overflow-y: auto;
  max-height: 360px;
}
.notif-item {
  padding: 11px 16px;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 11px;
  cursor: pointer;
  transition: background .12s;
  align-items: flex-start;
}
.notif-item:hover { background: var(--bg3); }
.notif-item.unread { background: rgba(217,127,31,.03); }
.notif-item.unread::before {
  content: "";
  width: 6px; height: 6px;
  background: var(--orange);
  border-radius: 50%;
  margin-top: 8px;
  flex-shrink: 0;
}
.notif-item-ic {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: var(--bg4);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  color: var(--ink2);
}
.notif-item-ic.success { background: rgba(12,138,95,.1); color: #0a7d56; }
.notif-item-ic.alert { background: var(--orange-p); color: var(--orange-d); }
.notif-item-ic.danger { background: var(--red-p); color: var(--red); }
.notif-item-body { flex: 1; min-width: 0 }
.notif-item-t {
  font-size: 12px;
  font-weight: 600;
  color: var(--navy);
  line-height: 1.35;
  margin-bottom: 2px;
}
:root[data-theme="dark"] .notif-item-t { color: var(--ink); }
.notif-item-d {
  font-size: 11px;
  color: var(--ink3);
  line-height: 1.4;
}
.notif-item-time {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 600;
  color: var(--ink4);
  margin-top: 4px;
  letter-spacing: .03em;
}
.notif-foot {
  padding: 9px 16px;
  border-top: 1px solid var(--line);
  text-align: center;
}
.notif-foot a {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--orange-d);
  cursor: pointer;
  text-decoration: none;
}

/* === THEME TOGGLE === */
.theme-toggle {
  width: 34px; height: 34px;
  background: var(--bg3);
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--ink2);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all .15s;
}
.theme-toggle:hover { border-color: var(--orange); color: var(--orange-d); }

/* === SKELETON LOADERS === */
.skel {
  background: linear-gradient(90deg, var(--bg4) 0%, var(--bg3) 50%, var(--bg4) 100%);
  background-size: 200% 100%;
  animation: skelPulse 1.4s ease-in-out infinite;
  border-radius: 6px;
}
@keyframes skelPulse {
  0% { background-position: 200% 0 }
  100% { background-position: -200% 0 }
}

/* === PRINT STYLESHEET === */
@media print {
  body { background: #fff !important; }
  .sidebar, .topbar, .ai-fab, .ai-panel, .email-composer-fab, .email-panel,
  .cmdk-backdrop, .notif-dropdown, .toast-w,
  .breadcrumb, .btn, button { display: none !important; }
  .shell { display: block !important; }
  .main { padding: 0 !important; margin: 0 !important; }
  .page { box-shadow: none !important; }
  * { color: #000 !important; background: #fff !important; }
  table { page-break-inside: avoid; }
  .cot-section { page-break-inside: avoid; border: 1px solid #ccc !important; }
  .cot-grand-total {
    background: #fff !important;
    color: #000 !important;
    border: 2px solid #000 !important;
  }
  .cot-grand-total * { color: #000 !important; }
}

/* === KEYBOARD SHORTCUTS HELP === */
.kbd-help {
  position: fixed; bottom: 24px; left: 24px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 11px 14px;
  box-shadow: var(--sh-md);
  font-size: 11px;
  color: var(--ink3);
  display: none;
  align-items: center; gap: 9px;
  z-index: 50;
  animation: cmdkSlideUp .2s;
}
:root[data-theme="dark"] .kbd-help { background: var(--bg3); }
.kbd-help.show { display: flex }
.kbd-help-kbd {
  background: var(--bg4);
  border: 1px solid var(--line);
  padding: 2px 7px;
  border-radius: 4px;
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  color: var(--ink2);
}

/* === IMPROVED LOADING STATES === */
.btn[disabled] { opacity: .55; cursor: not-allowed; pointer-events: none; }
.btn.loading {
  position: relative;
  color: transparent !important;
}
.btn.loading::after {
  content: "";
  position: absolute;
  width: 14px; height: 14px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  top: 50%; left: 50%;
  margin-top: -7px; margin-left: -7px;
  animation: spin .7s linear infinite;
  color: #fff !important;
}
@keyframes spin { to { transform: rotate(360deg) } }

/* === POLISH: Better hover on cards === */
.card { transition: all .2s ease-out; }
.tb-search:hover .tb-search-ic { color: var(--orange-d); }

/* === Smooth page transitions === */
.page {
  animation: pageEnter .25s ease-out;
}
@keyframes pageEnter {
  from { opacity: 0; transform: translateY(6px) }
  to { opacity: 1; transform: translateY(0) }
}



/* ═══ V20000 — WORKSPACE EDITION ═══ */

/* === WORKSPACE HEADER === */
.ws-header {
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy2) 60%, #1e3870 100%);
  color: #fff;
  border-radius: var(--radius-lg);
  padding: 22px 26px;
  margin-bottom: 16px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(8,15,40,.2);
}
.ws-header::before {
  content: "";
  position: absolute;
  top: 0; right: -100px;
  width: 300px; height: 100%;
  background: radial-gradient(circle, rgba(217,127,31,.12) 0%, transparent 70%);
  pointer-events: none;
}
.ws-h-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  position: relative;
  z-index: 1;
}
.ws-h-l {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .22em;
  color: var(--orange2);
  text-transform: uppercase;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  gap: 9px;
}
.ws-h-l::before {
  content: "";
  width: 7px;
  height: 7px;
  background: var(--orange);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--orange);
}
.ws-h-t {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -.04em;
  line-height: 1.15;
  color: #fff;
  margin-bottom: 4px;
}
.ws-h-t em {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 500;
  color: var(--orange2);
}
.ws-h-d {
  font-size: 12px;
  color: rgba(255,255,255,.65);
  line-height: 1.5;
  max-width: 600px;
}
.ws-h-kpis {
  display: flex;
  gap: 18px;
  flex-shrink: 0;
}
.ws-h-kpi {
  text-align: right;
}
.ws-h-kpi-v {
  font-family: var(--sans);
  font-size: 26px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -.03em;
  line-height: 1;
}
.ws-h-kpi-l {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  color: rgba(255,255,255,.55);
  text-transform: uppercase;
  margin-top: 4px;
}

/* === QUICK ACTIONS BAR === */
.ws-actions {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.1);
  position: relative;
  z-index: 1;
}
.ws-action {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 14px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 7px;
  font-size: 12px;
  font-weight: 600;
  color: #fff;
  cursor: pointer;
  transition: all .15s;
  font-family: var(--sans);
}
.ws-action:hover {
  background: var(--orange);
  border-color: var(--orange);
  transform: translateY(-1px);
}
.ws-action.primary {
  background: var(--orange);
  border-color: var(--orange);
}
.ws-action.primary:hover {
  background: var(--orange-d);
}

/* === TABS NAVIGATION === */
.ws-tabs {
  display: flex;
  gap: 4px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 18px;
  overflow-x: auto;
}
.ws-tab {
  padding: 11px 18px;
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink3);
  letter-spacing: -.01em;
  white-space: nowrap;
  transition: all .15s;
  display: flex;
  align-items: center;
  gap: 7px;
  position: relative;
  margin-bottom: -1px;
}
.ws-tab:hover {
  color: var(--orange-d);
}
.ws-tab.active {
  color: var(--navy);
  border-bottom-color: var(--orange);
  font-weight: 700;
}
:root[data-theme="dark"] .ws-tab.active { color: var(--ink); }
.ws-tab-count {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  padding: 1px 7px;
  border-radius: 99px;
  background: var(--bg4);
  color: var(--ink2);
  letter-spacing: .04em;
}
.ws-tab.active .ws-tab-count {
  background: var(--orange-p);
  color: var(--orange-d);
}

/* === TAB CONTENT === */
.ws-tab-content {
  animation: tabEnter .25s ease-out;
}
@keyframes tabEnter {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* === CALCULATOR PANEL === */
.calc-panel {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 11px;
  overflow: hidden;
}
:root[data-theme="dark"] .calc-panel { background: var(--bg3); }
.calc-h {
  padding: 14px 20px;
  background: linear-gradient(135deg, var(--navy), var(--navy2));
  color: #fff;
  display: flex;
  align-items: center;
  gap: 11px;
}
.calc-h-ic {
  width: 32px;
  height: 32px;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 7px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.calc-h-t {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.calc-h-s {
  font-size: 10.5px;
  color: rgba(255,255,255,.6);
  margin-top: 1px;
}
.calc-body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 380px;
}
.calc-inputs {
  padding: 18px 22px;
  border-right: 1px solid var(--line);
  background: var(--bg3);
}
:root[data-theme="dark"] .calc-inputs { background: var(--bg2); }
.calc-results {
  padding: 18px 22px;
  display: flex;
  flex-direction: column;
}
.calc-section-l {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--ink3);
  text-transform: uppercase;
  margin-bottom: 11px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}
.calc-field {
  margin-bottom: 12px;
}
.calc-field-l {
  display: block;
  font-size: 11px;
  font-weight: 600;
  color: var(--ink2);
  margin-bottom: 5px;
  letter-spacing: -.01em;
}
.calc-field input,
.calc-field select {
  width: 100%;
  border: 1px solid var(--line2);
  padding: 8px 11px;
  font-size: 12.5px;
  border-radius: 6px;
  background: #fff;
  font-family: var(--sans);
}
:root[data-theme="dark"] .calc-field input,
:root[data-theme="dark"] .calc-field select {
  background: var(--bg4);
  color: var(--ink);
}
.calc-field input:focus,
.calc-field select:focus {
  outline: none;
  border-color: var(--orange);
  box-shadow: 0 0 0 3px var(--orange-p);
}
.calc-result-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 9px 0;
  border-bottom: 1px dashed var(--line);
  font-size: 12.5px;
}
.calc-result-l {
  color: var(--ink2);
  font-weight: 500;
}
.calc-result-v {
  font-family: var(--mono);
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.01em;
}
:root[data-theme="dark"] .calc-result-v { color: var(--ink); }
.calc-total-row {
  background: var(--navy);
  color: #fff;
  padding: 14px 18px;
  border-radius: 9px;
  margin-top: 14px;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.calc-total-l {
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.7);
}
.calc-total-v {
  font-family: var(--sans);
  font-size: 22px;
  font-weight: 700;
  color: var(--orange2);
  letter-spacing: -.03em;
}

/* === WAREHOUSE GRID (visual stock map) === */
.wh-grid {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 5px;
  padding: 14px;
  background: var(--bg3);
  border: 1px solid var(--line);
  border-radius: 9px;
}
.wh-cell {
  aspect-ratio: 1;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  color: var(--ink3);
  cursor: pointer;
  transition: all .15s;
  position: relative;
}
.wh-cell.empty {
  background: #fff;
  border: 1px dashed var(--line);
}
:root[data-theme="dark"] .wh-cell.empty { background: var(--bg4); }
.wh-cell.full {
  background: linear-gradient(135deg, var(--orange), var(--orange-d));
  color: #fff;
}
.wh-cell.reserved {
  background: var(--bg4);
  color: var(--ink2);
  border: 1px solid var(--line2);
}
.wh-cell.refrigerated {
  background: linear-gradient(135deg, #5fb8ff, #2d8fde);
  color: #fff;
}
.wh-cell:hover {
  transform: scale(1.06);
  z-index: 2;
}
.wh-legend {
  display: flex;
  gap: 14px;
  margin-top: 11px;
  font-size: 11px;
  color: var(--ink3);
}
.wh-leg-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
}
.wh-leg-sw {
  width: 14px;
  height: 14px;
  border-radius: 3px;
}

/* === FORM WIZARD === */
.wiz-steps {
  display: flex;
  align-items: center;
  margin-bottom: 22px;
  gap: 8px;
}
.wiz-step {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 14px;
  background: var(--bg3);
  border: 1px solid var(--line);
  border-radius: 8px;
  cursor: pointer;
  transition: all .15s;
}
:root[data-theme="dark"] .wiz-step { background: var(--bg4); }
.wiz-step.active {
  background: linear-gradient(135deg, var(--orange-p), var(--bg3));
  border-color: var(--orange);
}
.wiz-step.done {
  background: rgba(12,138,95,.05);
  border-color: rgba(12,138,95,.2);
}
.wiz-step-n {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--bg4);
  color: var(--ink3);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  flex-shrink: 0;
}
.wiz-step.active .wiz-step-n {
  background: var(--orange);
  color: #fff;
}
.wiz-step.done .wiz-step-n {
  background: #0c8a5f;
  color: #fff;
}
.wiz-step-l {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--ink2);
  letter-spacing: -.01em;
}
.wiz-step.active .wiz-step-l {
  color: var(--navy);
  font-weight: 700;
}
.wiz-step-arrow {
  color: var(--ink4);
  flex-shrink: 0;
}

/* === HS CODE FINDER === */
.hs-finder {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
}
:root[data-theme="dark"] .hs-finder { background: var(--bg3); }
.hs-search {
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  gap: 10px;
}
.hs-search input {
  flex: 1;
  border: none;
  font-size: 13px;
  outline: none;
  font-family: var(--sans);
  background: transparent;
}
.hs-results {
  max-height: 360px;
  overflow-y: auto;
}
.hs-item {
  padding: 11px 18px;
  border-bottom: 1px solid var(--line);
  display: grid;
  grid-template-columns: 100px 1fr auto;
  gap: 14px;
  align-items: center;
  cursor: pointer;
  transition: background .12s;
}
.hs-item:hover { background: var(--bg3); }
.hs-code {
  font-family: var(--mono);
  font-size: 12.5px;
  font-weight: 700;
  color: var(--orange-d);
  letter-spacing: -.01em;
}
.hs-desc {
  font-size: 12px;
  color: var(--ink);
  line-height: 1.4;
}
.hs-rate {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  background: var(--bg4);
  padding: 3px 9px;
  border-radius: 4px;
  color: var(--ink2);
  letter-spacing: .04em;
}

/* === VESSEL CARD (Consignation workspace) === */
.vessel-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 12px;
  transition: all .2s;
}
:root[data-theme="dark"] .vessel-card { background: var(--bg3); }
.vessel-card:hover {
  box-shadow: var(--sh-md);
  transform: translateY(-1px);
}
.vessel-h {
  padding: 14px 18px;
  background: var(--bg3);
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
:root[data-theme="dark"] .vessel-h { background: var(--bg4); }
.vessel-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.02em;
  display: flex;
  align-items: center;
  gap: 9px;
}
:root[data-theme="dark"] .vessel-name { color: var(--ink); }
.vessel-imo {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  color: var(--ink3);
  background: var(--bg4);
  padding: 2px 7px;
  border-radius: 4px;
  letter-spacing: .04em;
}
.vessel-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .07em;
  padding: 3px 9px;
  border-radius: 99px;
  text-transform: uppercase;
}
.vessel-status.berthed { background: rgba(12,138,95,.1); color: #0a7d56; }
.vessel-status.expected { background: var(--orange-p); color: var(--orange-d); }
.vessel-status.departed { background: var(--bg4); color: var(--ink2); }
.vessel-body {
  padding: 14px 18px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.vessel-field {
  display: flex;
  flex-direction: column;
}
.vessel-field-l {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--ink3);
  text-transform: uppercase;
  margin-bottom: 3px;
}
.vessel-field-v {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--navy);
  font-family: var(--mono);
}
:root[data-theme="dark"] .vessel-field-v { color: var(--ink); }
.vessel-actions {
  padding: 11px 18px;
  background: var(--bg3);
  border-top: 1px solid var(--line);
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
:root[data-theme="dark"] .vessel-actions { background: var(--bg4); }



/* ═══ V21000 — WORKFLOW CLIENT/MLOG/FOURNISSEUR ═══ */

/* === PENDING ACCOUNT BANNER === */
.pending-banner {
  background: linear-gradient(135deg, #fff7e8, #ffeacc);
  border: 1px solid rgba(217,127,31,.3);
  border-left: 4px solid var(--orange);
  border-radius: 10px;
  padding: 16px 22px;
  margin-bottom: 18px;
  display: flex;
  gap: 14px;
  align-items: center;
  animation: pendingPulse 3s infinite;
}
@keyframes pendingPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(217,127,31,.15); }
  50% { box-shadow: 0 0 0 8px rgba(217,127,31,0); }
}
.pending-ic {
  width: 42px; height: 42px;
  background: linear-gradient(135deg, var(--orange), var(--orange-d));
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  flex-shrink: 0;
}
.pending-body { flex: 1 }
.pending-l {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: .18em;
  color: var(--orange-d);
  text-transform: uppercase;
  margin-bottom: 3px;
}
.pending-t {
  font-size: 14px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.02em;
  margin-bottom: 2px;
}
:root[data-theme="dark"] .pending-t { color: var(--ink); }
.pending-d {
  font-size: 11.5px;
  color: var(--ink2);
  line-height: 1.5;
}
.pending-d strong { color: var(--orange-d); font-weight: 700; }

/* === STATUS PILL (account status) === */
.acct-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 99px;
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.acct-status::before {
  content: "";
  width: 6px; height: 6px;
  border-radius: 50%;
  background: currentColor;
}
.acct-status.pending { background: var(--orange-p); color: var(--orange-d); }
.acct-status.pending::before { animation: pulseDot 1.6s infinite; }
.acct-status.approved { background: rgba(12,138,95,.1); color: #0a7d56; }
.acct-status.rejected { background: var(--red-p); color: var(--red); }
.acct-status.suspended { background: var(--bg4); color: var(--ink3); }

/* === APPROVAL CARD (in pending queue) === */
.approval-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 11px;
  overflow: hidden;
  margin-bottom: 14px;
}
:root[data-theme="dark"] .approval-card { background: var(--bg3); }
.approval-h {
  padding: 14px 20px;
  background: linear-gradient(135deg, var(--bg3), #fff);
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
}
:root[data-theme="dark"] .approval-h { background: var(--bg4); }
.approval-h-l { flex: 1; min-width: 0; }
.approval-co-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.02em;
  margin-bottom: 4px;
}
:root[data-theme="dark"] .approval-co-name { color: var(--ink); }
.approval-co-meta {
  display: flex; gap: 12px;
  font-size: 11px;
  color: var(--ink3);
  font-weight: 500;
}
.approval-co-meta strong { color: var(--ink2); font-weight: 700; }
.approval-time {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--ink3);
  letter-spacing: .04em;
}
.approval-body {
  padding: 16px 20px;
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 24px;
}
.approval-section-l {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--ink3);
  text-transform: uppercase;
  margin-bottom: 9px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--line);
}
.approval-field-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.approval-field { display: flex; flex-direction: column; gap: 3px; }
.approval-field-l {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--ink3);
  text-transform: uppercase;
}
.approval-field-v {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink);
  font-family: var(--mono);
}
.approval-docs {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.approval-doc {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 11px;
  background: var(--bg3);
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: 11px;
  cursor: pointer;
  transition: all .15s;
}
:root[data-theme="dark"] .approval-doc { background: var(--bg4); }
.approval-doc:hover { border-color: var(--orange); }
.approval-doc-ic { color: var(--orange-d); flex-shrink: 0; }
.approval-doc-n { flex: 1; color: var(--ink2); font-weight: 600; }
.approval-doc-s { font-family: var(--mono); font-size: 9.5px; color: var(--ink3); }
.approval-actions {
  padding: 13px 20px;
  background: var(--bg3);
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
:root[data-theme="dark"] .approval-actions { background: var(--bg4); }
.approval-actions-l {
  font-size: 11px;
  color: var(--ink3);
}
.approval-actions-r {
  display: flex;
  gap: 7px;
}

/* === WORKFLOW TRIANGLE === */
.workflow-triangle {
  background: linear-gradient(135deg, var(--bg3), #fff);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 26px 22px;
  margin-bottom: 18px;
  position: relative;
  overflow: hidden;
}
:root[data-theme="dark"] .workflow-triangle { background: var(--bg3); }
.wf-h {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .18em;
  color: var(--orange-d);
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 4px;
}
.wf-t {
  font-size: 16px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.03em;
  text-align: center;
  margin-bottom: 22px;
}
:root[data-theme="dark"] .wf-t { color: var(--ink); }
.wf-t em { font-family: var(--serif); font-style: italic; font-weight: 500; color: var(--orange-d); }
.wf-grid {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  gap: 0;
  align-items: stretch;
}
.wf-node {
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 11px;
  padding: 18px 16px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  transition: all .2s;
  cursor: pointer;
}
:root[data-theme="dark"] .wf-node { background: var(--bg4); }
.wf-node:hover { border-color: var(--orange); transform: translateY(-2px); box-shadow: var(--sh-md); }
.wf-node-ic {
  width: 48px; height: 48px;
  border-radius: 11px;
  display: flex; align-items: center; justify-content: center;
  color: #fff;
}
.wf-node.client .wf-node-ic { background: linear-gradient(135deg, #5fb8ff, #2d8fde); }
.wf-node.mlog .wf-node-ic { background: linear-gradient(135deg, var(--orange), var(--orange-d)); }
.wf-node.supplier .wf-node-ic { background: linear-gradient(135deg, #0c8a5f, #066e4b); }
.wf-node-r {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--ink3);
  text-transform: uppercase;
}
.wf-node-l {
  font-size: 15px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.02em;
}
:root[data-theme="dark"] .wf-node-l { color: var(--ink); }
.wf-node-d {
  font-size: 10.5px;
  color: var(--ink3);
  line-height: 1.4;
  margin-bottom: 5px;
}
.wf-node-stat {
  font-family: var(--mono);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--navy);
}
:root[data-theme="dark"] .wf-node-stat { color: var(--ink); }
.wf-node-stat-l {
  font-family: var(--mono);
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--ink3);
  text-transform: uppercase;
  margin-top: -3px;
}
.wf-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  color: var(--orange);
  position: relative;
}
.wf-arrow::after {
  content: "";
  position: absolute;
  left: 0; right: 0;
  top: 50%;
  height: 1.5px;
  background: linear-gradient(90deg, transparent, var(--orange), transparent);
}
.wf-arrow svg {
  background: #fff;
  padding: 0 4px;
  position: relative;
  z-index: 1;
}
:root[data-theme="dark"] .wf-arrow svg { background: var(--bg3); }
.wf-arrow-l {
  font-family: var(--mono);
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--orange-d);
  text-transform: uppercase;
  position: absolute;
  top: -5px;
  background: #fff;
  padding: 1px 6px;
  border-radius: 99px;
}
:root[data-theme="dark"] .wf-arrow-l { background: var(--bg3); }

/* === KIND BADGE === */
.kind-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  border-radius: 4px;
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.kind-badge.client { background: rgba(95,184,255,.12); color: #1e6cb8; }
.kind-badge.supplier { background: rgba(12,138,95,.1); color: #0a7d56; }
.kind-badge.internal { background: var(--orange-p); color: var(--orange-d); }



/* ===== Bloc suivant ===== */


/* ═══════════ AUTH OVERLAY ═══════════ */
.auth-overlay{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px;background:linear-gradient(135deg,#060d20 0%,#0f1f45 50%,#182f65 100%);overflow-y:auto}
.auth-overlay.hidden{display:none}
.auth-overlay::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 15% 25%,rgba(232,151,43,.18) 0,transparent 50%),radial-gradient(circle at 85% 75%,rgba(24,47,101,.5) 0,transparent 50%),radial-gradient(circle at 50% 100%,rgba(232,151,43,.06) 0,transparent 50%);pointer-events:none}
.auth-overlay::after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Cpath d='M30 30m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0' fill='%23fff' opacity='.04'/%3E%3C/svg%3E");pointer-events:none}

.auth-brand{position:absolute;top:32px;left:32px;display:flex;align-items:center;gap:12px;z-index:2}
.auth-brand img{height:42px;filter:brightness(1.1)}
.auth-brand-txt{line-height:1.15}
.auth-brand-main{font-size:22px;font-weight:800;color:#fff;letter-spacing:-.04em;display:block}
.auth-brand-sub{font-size:9px;font-weight:700;color:var(--orange);letter-spacing:.14em;text-transform:uppercase;display:block}

.auth-card{position:relative;z-index:2;width:100%;max-width:440px;background:rgba(255,255,255,.06);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:42px 38px;box-shadow:0 28px 90px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.14);animation:authIn .5s cubic-bezier(.16,1,.3,1)}
@keyframes authIn{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:none}}

.auth-logo-c{display:flex;justify-content:center;margin-bottom:22px}
.auth-logo-c img{height:64px;filter:brightness(1.1) drop-shadow(0 6px 20px rgba(0,0,0,.3))}

.auth-title{font-family:var(--sans);font-size:26px;font-weight:800;color:#fff;letter-spacing:-.05em;text-align:center;margin-bottom:6px;line-height:1.15}
.auth-title em{font-family:var(--serif);font-style:italic;font-weight:600;color:var(--orange2);letter-spacing:-.02em}
.auth-sub{font-size:13px;color:rgba(255,255,255,.55);text-align:center;margin-bottom:30px;font-weight:400;letter-spacing:-.01em}

.auth-fg{margin-bottom:16px}
.auth-fL{display:block;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.7);margin-bottom:7px}
.auth-input{width:100%;background:rgba(255,255,255,.06);border:1.5px solid rgba(255,255,255,.13);color:#fff;font-family:var(--sans);font-size:14px;padding:12px 16px;outline:none;border-radius:10px;transition:all .2s;font-weight:500}
.auth-input:focus{background:rgba(255,255,255,.1);border-color:var(--orange);box-shadow:0 0 0 4px rgba(245,166,35,.15)}
.auth-input::placeholder{color:rgba(255,255,255,.32);font-weight:400}
.auth-input-wrap{position:relative}
.auth-input-ic{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-size:14px;color:rgba(255,255,255,.4);pointer-events:none}
.auth-input.has-ic{padding-left:42px}
.auth-input-eye{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:14px;color:rgba(255,255,255,.5);cursor:pointer;background:none;border:none;padding:4px}
.auth-input-eye:hover{color:#fff}

.auth-select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23ffffff80' fill='none' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.auth-select option{background:#1a2e5a;color:#fff}

.auth-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.auth-options{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;font-size:12px}
.auth-cb{display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.7);cursor:pointer;user-select:none}
.auth-cb input{width:16px;height:16px;accent-color:var(--orange);cursor:pointer}
.auth-link{color:var(--orange2);font-weight:700;cursor:pointer;text-decoration:none;transition:color .15s}
.auth-link:hover{color:var(--orange)}

.auth-btn{width:100%;padding:13px 20px;background:linear-gradient(135deg,var(--orange),var(--orange-d));color:#fff;border:none;border-radius:10px;font-family:var(--sans);font-size:14px;font-weight:800;cursor:pointer;letter-spacing:-.02em;transition:all .2s;box-shadow:0 4px 16px rgba(245,166,35,.35);display:flex;align-items:center;justify-content:center;gap:8px}
.auth-btn:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(245,166,35,.45)}
.auth-btn:active{transform:translateY(0)}
.auth-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}

.auth-divider{display:flex;align-items:center;gap:14px;margin:24px 0;color:rgba(255,255,255,.3);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.auth-divider::before,.auth-divider::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.1)}

.auth-foot{text-align:center;font-size:13px;color:rgba(255,255,255,.6);margin-top:22px}

.auth-msg{padding:12px 14px;border-radius:10px;font-size:12.5px;font-weight:500;line-height:1.5;margin-bottom:20px;display:flex;align-items:flex-start;gap:10px}
.auth-msg.err{background:rgba(214,56,85,.15);border:1px solid rgba(214,56,85,.35);color:#ff8da3}
.auth-msg.ok{background:rgba(10,158,106,.15);border:1px solid rgba(10,158,106,.35);color:#4dd4a0}
.auth-msg.info{background:rgba(245,166,35,.12);border:1px solid rgba(245,166,35,.3);color:var(--orange2)}

.auth-pending{text-align:center;padding:20px 0}
.auth-pending-ic{width:80px;height:80px;background:rgba(245,166,35,.15);border:2px solid rgba(245,166,35,.4);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:38px;margin:0 auto 24px;animation:pulse-ic 2.4s infinite}
@keyframes pulse-ic{0%,100%{box-shadow:0 0 0 0 rgba(245,166,35,.4)}50%{box-shadow:0 0 0 16px rgba(245,166,35,0)}}
.auth-pending-t{font-size:22px;font-weight:800;color:#fff;letter-spacing:-.04em;margin-bottom:8px}
.auth-pending-s{font-size:13px;color:rgba(255,255,255,.6);line-height:1.6;margin-bottom:24px}
.auth-pending-info{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:14px 16px;text-align:left;margin-bottom:24px}
.auth-pending-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;font-size:12px}
.auth-pending-row .pl{color:rgba(255,255,255,.5);font-weight:600;letter-spacing:.04em;text-transform:uppercase;font-size:10px}
.auth-pending-row .pv{color:#fff;font-weight:700;font-family:var(--mono);font-size:12px}

.auth-footer{position:absolute;bottom:24px;left:0;right:0;text-align:center;color:rgba(255,255,255,.4);font-size:11px;letter-spacing:.04em;z-index:2}
.auth-footer strong{color:var(--orange2);font-weight:700}

/* ═══════════ GLASSMORPHISM POLISH on main shell ═══════════ */
.topbar{backdrop-filter:saturate(1.2);background:linear-gradient(180deg,#1a2e5a 0%,#152444 100%)}
.metric{transition:all .25s cubic-bezier(.16,1,.3,1)}
.metric:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(26,46,90,.16)}
.card{transition:box-shadow .25s}
.btn-pr{position:relative;overflow:hidden}
.btn-pr::before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}
.btn-pr:hover::before{left:100%}

/* Logout button in user chip */
.user-menu{position:absolute;top:calc(100% + 8px);right:0;background:#fff;border:1px solid var(--line);border-radius:10px;min-width:200px;box-shadow:var(--sh-lg);overflow:hidden;z-index:50}
.user-menu.hidden{display:none}
.user-menu-item{display:flex;align-items:center;gap:10px;padding:11px 16px;font-size:13px;color:var(--ink2);cursor:pointer;font-weight:500;transition:all .12s}
.user-menu-item:hover{background:var(--orange-p);color:var(--orange-d)}
.user-menu-item.danger{color:var(--red);border-top:1px solid var(--line)}
.user-menu-item.danger:hover{background:var(--red-p)}
.user-menu-item .umi-ic{font-size:14px;width:18px;text-align:center}

@media (max-width:520px){
  .auth-card{padding:30px 22px}
  .auth-brand{top:18px;left:18px}
  .auth-brand-main{font-size:18px}
}

/* ── V11 LOGIN FIX ── */
.entry-msg { 
  display:none; padding:10px 14px; border-radius:8px; 
  font-size:12.5px; font-weight:600; margin-bottom:14px; 
  line-height:1.5; animation:fadeIn .2s ease;
}
.entry-msg.ok   { background:rgba(9,150,106,.15);  border:1px solid rgba(9,150,106,.3);  color:#22c489; }
.entry-msg.err  { background:rgba(208,48,80,.12);  border:1px solid rgba(208,48,80,.3);  color:#ff6b8a; }
.entry-msg.info { background:rgba(232,151,43,.12); border:1px solid rgba(232,151,43,.3); color:var(--orange2); }
@keyframes fadeIn { from{opacity:0;transform:translateY(-4px)} to{opacity:1;transform:none} }
.entry-submit:disabled { opacity:.7; cursor:not-allowed; }
.entry-input:focus { border-color:var(--orange) !important; box-shadow:0 0 0 3px rgba(232,151,43,.15) !important; }


/* ══════════════════════════════════════════════════════
   SIDEBAR REDESIGN — Synthetic Professional v11
   ══════════════════════════════════════════════════════ */

/* ── Core shell ── */
.sidebar {
  background: #070d1a !important;
  border-right: 0.5px solid rgba(255,255,255,.05) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

/* ── Scrollable area ── */
.sidebar > *:not(.sb-foot) { overflow: visible; }
.sidebar::-webkit-scrollbar { width: 3px !important; }
.sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,.07) !important; border-radius: 99px !important; }

/* ── Section headers ── */
.nav-sec {
  all: unset !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 16px 3px !important;
  font-family: var(--mono) !important;
  font-size: 9.5px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,.22) !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}
.nav-sec:hover { color: rgba(255,255,255,.4) !important; }
.nav-sec-l { display: flex !important; align-items: center !important; gap: 6px !important; }
.nav-sec-ic { display: none !important; }
.nav-sec-label { font-size: 9.5px !important; font-weight: 500 !important; letter-spacing: .12em !important; text-transform: uppercase !important; font-family: var(--mono) !important; }
.nav-sec-total { display: none !important; }
.nav-chevron { color: rgba(255,255,255,.15) !important; opacity: 0 !important; transition: opacity .15s !important; }
.nav-sec:hover .nav-chevron { opacity: 1 !important; }

/* ── Nav items ── */
.nav-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 6px 10px !important;
  margin: 1px 4px !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  color: rgba(255,255,255,.42) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  transition: all .1s !important;
  position: relative !important;
  letter-spacing: 0 !important;
}
.nav-item:hover {
  color: rgba(255,255,255,.72) !important;
  background: rgba(255,255,255,.05) !important;
  transform: none !important;
}
.nav-item.active {
  color: rgba(255,255,255,.92) !important;
  background: rgba(255,255,255,.07) !important;
  font-weight: 500 !important;
}
.nav-item.active::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 22% !important;
  height: 56% !important;
  width: 2px !important;
  background: #e8972b !important;
  border-radius: 0 2px 2px 0 !important;
}
.nav-item .ni {
  font-size: 15px !important;
  width: 18px !important;
  text-align: center !important;
  flex-shrink: 0 !important;
  color: rgba(255,255,255,.35) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.nav-item:hover .ni { color: rgba(255,255,255,.65) !important; }
.nav-item.active .ni { color: #e8972b !important; }
.nav-item.active .ni svg { stroke: #e8972b !important; }
.nav-item .ni svg { stroke: rgba(255,255,255,.35) !important; transition: stroke .1s !important; }
.nav-item:hover .ni svg { stroke: rgba(255,255,255,.65) !important; }

/* ── Badges ── */
.nav-badge {
  margin-left: auto !important;
  font-size: 9px !important;
  font-family: var(--mono) !important;
  font-weight: 500 !important;
  padding: 1px 5px !important;
  border-radius: 3px !important;
  letter-spacing: .02em !important;
  border: none !important;
}
.nb-o { background: rgba(232,151,43,.15) !important; color: #e8972b !important; }
.nb-r { background: rgba(220,60,80,.15) !important; color: #f07070 !important; }
.nb-n { background: rgba(255,255,255,.07) !important; color: rgba(255,255,255,.35) !important; }

/* ── Dividers between nav groups ── */
.nav-items-group {
  max-height: 1000px !important;
  opacity: 1 !important;
  overflow: hidden !important;
  transition: max-height .25s ease, opacity .15s !important;
  margin-bottom: 2px !important;
}
.nav-items-group.collapsed {
  max-height: 0 !important;
  opacity: 0 !important;
}

/* ── Footer / user card ── */
.sb-foot {
  padding: 8px 10px !important;
  border-top: 0.5px solid rgba(255,255,255,.05) !important;
  margin-top: auto !important;
  flex-shrink: 0 !important;
}
.sb-foot > div {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 6px 8px !important;
  border-radius: 7px !important;
  cursor: pointer !important;
  transition: background .12s !important;
}
.sb-foot > div:hover { background: rgba(255,255,255,.04) !important; }

#sb-user-av {
  width: 26px !important;
  height: 26px !important;
  background: #111d35 !important;
  border: 1.5px solid rgba(232,151,43,.3) !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 9.5px !important;
  font-weight: 600 !important;
  color: #e8972b !important;
  flex-shrink: 0 !important;
}
#sb-user-name {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,.75) !important;
  letter-spacing: -.01em !important;
}
#sb-user-role {
  font-size: 9px !important;
  color: rgba(255,255,255,.25) !important;
  font-family: var(--mono) !important;
  letter-spacing: .03em !important;
  margin-top: 1px !important;
}

/* ── API status card — hidden ── */
.api-card { display: none !important; }

/* ── Logo area refinement ── */
.logo-badge {
  width: 28px !important;
  height: 28px !important;
  background: #e8972b !important;
  border-radius: 7px !important;
  box-shadow: none !important;
}
.logo-main { font-size: 14px !important; font-weight: 600 !important; letter-spacing: -.02em !important; }
.logo-sub { font-size: 8px !important; letter-spacing: .1em !important; opacity: .5 !important; }

/* ── Content area dot-grid ── */
.content {
  background: #f4f6fb !important;
  background-image: radial-gradient(circle, rgba(15,31,69,.05) 1px, transparent 1px) !important;
  background-size: 24px 24px !important;
}

/* ── Shell refinement ── */
.shell { grid-template-columns: 220px 1fr !important; grid-template-rows: 54px 1fr !important; }
.topbar { height: 54px !important; }


/* ── Topbar refinement ── */
.topbar {
  background: #070d1a !important;
  border-bottom: 0.5px solid rgba(255,255,255,.06) !important;
  box-shadow: none !important;
}
.tb-search {
  background: rgba(255,255,255,.05) !important;
  border: 0.5px solid rgba(255,255,255,.08) !important;
  border-radius: 7px !important;
}
.tb-search:hover { background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.14) !important; }
.icon-btn {
  background: rgba(255,255,255,.05) !important;
  border: 0.5px solid rgba(255,255,255,.08) !important;
  border-radius: 7px !important;
}
.icon-btn:hover { background: rgba(255,255,255,.1) !important; border-color: rgba(232,151,43,.3) !important; }
.user-chip {
  background: rgba(255,255,255,.05) !important;
  border: 0.5px solid rgba(255,255,255,.08) !important;
  border-radius: 99px !important;
}
.user-chip:hover { background: rgba(255,255,255,.09) !important; }

/* ══════════════════════════════════════════════════════
   SIDEBAR REDESIGN — Professionnel & Synthétique v12
   ══════════════════════════════════════════════════════ */

/* ── Base ── */
.sidebar {
  background: #0b1120 !important;
  border-right: 1px solid rgba(255,255,255,.05) !important;
  width: 232px !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 8px 0 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
.sidebar::-webkit-scrollbar { width: 0 !important; }

/* ── Logo zone in topbar ── */
.topbar {
  background: #0b1120 !important;
  border-bottom: 1px solid rgba(255,255,255,.05) !important;
  box-shadow: none !important;
}

/* ── Section headers (accordion triggers) ── */
.nav-sec {
  all: unset !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 10px 0 14px !important;
  height: 36px !important;
  margin: 1px 6px !important;
  border-radius: 7px !important;
  cursor: pointer !important;
  transition: background .12s !important;
  user-select: none !important;
  color: rgba(255,255,255,.55) !important;
  box-sizing: border-box !important;
  font-family: var(--sans) !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  gap: 0 !important;
}
.nav-sec:hover {
  background: rgba(255,255,255,.04) !important;
  color: rgba(255,255,255,.85) !important;
}
.nav-sec-l {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  flex: 1 !important;
  min-width: 0 !important;
}

/* ── Section icon — uniform, no color blocks ── */
.nav-sec-ic {
  width: 20px !important;
  height: 20px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  color: rgba(255,255,255,.35) !important;
  transition: color .12s !important;
}
.nav-sec:hover .nav-sec-ic {
  color: var(--orange2) !important;
  transform: none !important;
}

/* ── Section label ── */
.nav-sec-label {
  font-size: 12.5px !important;
  font-weight: 500 !important;
  letter-spacing: -.01em !important;
  color: inherit !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  flex: 1 !important;
}
.nav-sec-total {
  font-size: 9px !important;
  font-family: var(--mono) !important;
  font-weight: 700 !important;
  padding: 1px 5px !important;
  border-radius: 3px !important;
  margin-right: 4px !important;
  background: rgba(232,151,43,.18) !important;
  color: var(--orange2) !important;
  border: none !important;
}

/* ── Chevron ── */
.nav-chevron {
  color: rgba(255,255,255,.2) !important;
  flex-shrink: 0 !important;
  transition: transform .2s, color .12s !important;
}
.nav-sec:hover .nav-chevron { color: rgba(255,255,255,.4) !important; }
.nav-sec.collapsed .nav-chevron { transform: rotate(-90deg) !important; }

/* ── Nav items ── */
.nav-items-group {
  overflow: hidden !important;
  max-height: 1000px !important;
  transition: max-height .25s ease-out !important;
  padding-bottom: 4px !important;
}
.nav-items-group.collapsed-group {
  max-height: 0 !important;
  padding-bottom: 0 !important;
}

.nav-item {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 7px 10px 7px 38px !important;
  margin: 0 6px !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  color: rgba(255,255,255,.42) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  transition: all .1s !important;
  position: relative !important;
  letter-spacing: -.005em !important;
}
.nav-item:hover {
  color: rgba(255,255,255,.8) !important;
  background: rgba(255,255,255,.04) !important;
  transform: none !important;
}
.nav-item.active {
  color: #fff !important;
  background: rgba(232,151,43,.1) !important;
  font-weight: 600 !important;
}
.nav-item.active::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  top: 20% !important;
  height: 60% !important;
  width: 2px !important;
  background: var(--orange) !important;
  border-radius: 0 2px 2px 0 !important;
}
.nav-item .ni {
  color: rgba(255,255,255,.3) !important;
  flex-shrink: 0 !important;
  width: 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: absolute !important;
  left: 14px !important;
}
.nav-item.active .ni,
.nav-item:hover .ni { color: rgba(255,255,255,.65) !important; }
.nav-item.active .ni { color: var(--orange2) !important; }

/* ── Badges ── */
.nav-badge {
  margin-left: auto !important;
  font-size: 9px !important;
  font-family: var(--mono) !important;
  font-weight: 700 !important;
  padding: 1px 6px !important;
  border-radius: 3px !important;
  letter-spacing: 0 !important;
  border: none !important;
}
.nb-o { background: rgba(232,151,43,.15) !important; color: var(--orange2) !important; }
.nb-r { background: rgba(208,48,80,.15)  !important; color: #f47 !important; }
.nb-n { background: rgba(255,255,255,.06)!important; color: rgba(255,255,255,.4) !important; }

/* ── Divider between sections ── */
.nav-sec-divider {
  height: 1px !important;
  background: rgba(255,255,255,.04) !important;
  margin: 4px 16px !important;
}

/* ── Sidebar footer ── */
.sb-foot {
  padding: 10px 8px !important;
  border-top: 1px solid rgba(255,255,255,.05) !important;
  margin-top: auto !important;
  flex-shrink: 0 !important;
}
.sb-foot > div {
  border-radius: 7px !important;
  padding: 7px 8px !important;
  transition: background .12s !important;
  cursor: default !important;
}
.sb-foot > div:hover { background: rgba(255,255,255,.04) !important; }

#sb-user-name {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: rgba(255,255,255,.8) !important;
  letter-spacing: -.01em !important;
}
#sb-user-role {
  font-size: 9.5px !important;
  color: rgba(255,255,255,.3) !important;
  font-family: var(--mono) !important;
  letter-spacing: .02em !important;
}
#sb-user-av {
  background: rgba(232,151,43,.15) !important;
  border: 1px solid rgba(232,151,43,.25) !important;
  color: var(--orange2) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
}

/* ── Shell grid update ── */
.shell { grid-template-columns: 232px 1fr !important; }

/* ── TOPBAR PROFESSIONAL v12 ── */
.topbar {
  background: #0b1120 !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.03) !important;
  backdrop-filter: none !important;
}
.logo-main { font-size: 17px !important; font-weight: 800 !important; letter-spacing: -.04em !important; }
.logo-sub   { font-size: 7.5px !important; letter-spacing: .2em !important; opacity: .55 !important; }

/* Search bar */
.tb-search {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  width: 300px !important;
}
.tb-search:hover {
  background: rgba(255,255,255,.07) !important;
  border-color: rgba(255,255,255,.12) !important;
  box-shadow: none !important;
}

/* Icon buttons */
.icon-btn {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 8px !important;
}
.icon-btn:hover {
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.12) !important;
  box-shadow: none !important;
  color: #fff !important;
}

/* User chip */
.user-chip {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 8px !important;
}
.user-chip:hover {
  background: rgba(255,255,255,.07) !important;
  border-color: rgba(255,255,255,.12) !important;
}

/* ── SHELL grid ── */
.shell { grid-template-columns: 232px 1fr !important; grid-template-rows: 54px 1fr !important; }

/* ══ SIDEBAR RESIZE HANDLE v12 — Toujours visible, rien de caché ══ */
.sidebar {
  position: relative !important;
  min-width: 180px !important;
  max-width: 400px !important;
  transition: none !important;
  will-change: width !important;
}

/* Bordure droite permanente — toujours visible */
.sb-resize-handle {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  width: 4px !important;
  height: 100% !important;
  cursor: col-resize !important;
  z-index: 50 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(255,255,255,.04) !important;
  transition: background .15s !important;
}

/* Pill central toujours visible */
.sb-resize-handle::before {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 3px !important;
  height: 36px !important;
  background: rgba(232,151,43,.35) !important;
  border-radius: 99px !important;
  transition: height .15s, background .15s, box-shadow .15s !important;
}

.sb-resize-handle:hover {
  background: rgba(232,151,43,.08) !important;
}
.sb-resize-handle:hover::before {
  height: 56px !important;
  background: rgba(232,151,43,.8) !important;
  box-shadow: 0 0 8px rgba(232,151,43,.4) !important;
}
.sb-resize-handle.dragging {
  background: rgba(232,151,43,.12) !important;
}
.sb-resize-handle.dragging::before {
  height: 72px !important;
  background: var(--orange) !important;
  box-shadow: 0 0 12px rgba(232,151,43,.6) !important;
}

/* Drag — pas de sélection */
body.sb-dragging {
  user-select: none !important;
  cursor: col-resize !important;
}
body.sb-dragging * { pointer-events: none !important; }
body.sb-dragging .sb-resize-handle { pointer-events: all !important; }

/* Shell adapte */
.shell { transition: grid-template-columns .0s !important; }

/* ══════════════════════════════════════════════════════════
   SIDEBAR MENU v12 — Accordéon exclusif avec icônes colorées
   ══════════════════════════════════════════════════════════ */
.sidebar {
  background: #0f1723 !important;
  border-right: 1px solid rgba(255,255,255,.06) !important;
  width: 248px !important;
  min-width: 180px !important;
  max-width: 360px !important;
  display: flex !important;
  flex-direction: column !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 6px 0 0 !important;
  position: relative !important;
}
.sidebar::-webkit-scrollbar { width: 0 !important; }

/* ── MENU label ── */
.sb-menu-label {
  font-family: var(--mono) !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .2em !important;
  color: rgba(255,255,255,.18) !important;
  padding: 8px 16px 6px !important;
  text-transform: uppercase !important;
}

/* ── Section header ── */
.nav-sec {
  all: unset !important;
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  padding: 0 12px !important;
  height: 44px !important;
  margin: 1px 6px !important;
  border-radius: 10px !important;
  cursor: pointer !important;
  transition: background .12s !important;
  user-select: none !important;
  box-sizing: border-box !important;
  font-family: var(--sans) !important;
  color: rgba(255,255,255,.75) !important;
  position: relative !important;
}
.nav-sec:hover {
  background: rgba(255,255,255,.05) !important;
  color: #fff !important;
}
.nav-sec.active-sec {
  background: rgba(255,255,255,.07) !important;
  color: #fff !important;
}

/* ── Colored icon square ── */
.nav-sec-ic {
  width: 32px !important;
  height: 32px !important;
  border-radius: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.25) !important;
  transition: transform .15s, box-shadow .15s !important;
}
.nav-sec:hover .nav-sec-ic {
  transform: scale(1.06) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.35) !important;
}

/* ── Label ── */
.nav-sec-label {
  flex: 1 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: -.02em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  color: inherit !important;
}

/* ── Chevron ── */
.nav-chevron {
  color: rgba(255,255,255,.22) !important;
  flex-shrink: 0 !important;
  transition: transform .2s ease, color .12s !important;
}
.nav-sec:hover .nav-chevron { color: rgba(255,255,255,.45) !important; }
.nav-sec.active-sec .nav-chevron {
  transform: rotate(90deg) !important;
  color: rgba(255,255,255,.6) !important;
}

/* ── Sub-items group ── */
.nav-items-group {
  overflow: hidden !important;
  max-height: 0 !important;
  transition: max-height .28s cubic-bezier(.4,0,.2,1) !important;
  padding-left: 0 !important;
}
.nav-items-group.open {
  max-height: 600px !important;
}

/* ── Nav item ── */
.nav-item {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 8px 14px 8px 52px !important;
  margin: 0 6px !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  color: rgba(255,255,255,.45) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  transition: all .1s !important;
  position: relative !important;
  letter-spacing: -.01em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.nav-item:hover {
  color: rgba(255,255,255,.85) !important;
  background: rgba(255,255,255,.05) !important;
}
.nav-item.active {
  color: #fff !important;
  background: rgba(255,255,255,.08) !important;
  font-weight: 600 !important;
}
.nav-item.active::before {
  content: '' !important;
  position: absolute !important;
  left: 34px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 4px !important;
  height: 4px !important;
  border-radius: 50% !important;
  background: var(--orange) !important;
}
.nav-item .ni {
  position: absolute !important;
  left: 36px !important;
  color: rgba(255,255,255,.3) !important;
  flex-shrink: 0 !important;
  display: none !important; /* icon already visible via active dot */
}

/* ── Séparateur ── */
.sb-sep {
  height: 1px !important;
  background: rgba(255,255,255,.06) !important;
  margin: 6px 14px !important;
}

/* ── Badges ── */
.nav-badge {
  margin-left: auto !important;
  font-size: 9px !important;
  font-family: var(--mono) !important;
  font-weight: 700 !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  letter-spacing: 0 !important;
  border: none !important;
  flex-shrink: 0 !important;
}
.nb-o { background: rgba(232,151,43,.2) !important; color: #f7b84a !important; }
.nb-r { background: rgba(208,48,80,.2)  !important; color: #f47 !important; }
.nb-n { background: rgba(255,255,255,.08) !important; color: rgba(255,255,255,.45) !important; }

/* ── Footer ── */
.sb-foot {
  padding: 8px !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
  margin-top: auto !important;
  flex-shrink: 0 !important;
}

/* ── Shell ── */
.shell { grid-template-columns: 248px 1fr !important; }


/* ===== Bloc suivant ===== */


/* ──── PAGE D'ENTRÉE MLOG ──── */
.mlog-entry{display:flex;flex-direction:column;min-height:100vh;width:100%;padding:0;}

/* TOP BAR */
.entry-topbar{display:flex;align-items:center;justify-content:space-between;padding:18px 48px;border-bottom:1px solid rgba(255,255,255,.07);flex-shrink:0;z-index:2;position:relative}
.entry-logo{display:flex;align-items:center;gap:14px}
.entry-logo-badge{width:42px;height:42px;background:linear-gradient(135deg,var(--orange),var(--orange-d));border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:900;color:#fff;letter-spacing:-.04em;box-shadow:0 4px 14px rgba(232,151,43,.35)}
.entry-logo-text{line-height:1.15}
.entry-logo-main{font-size:20px;font-weight:800;color:#fff;letter-spacing:-.04em;display:block}
.entry-logo-sub{font-size:8.5px;font-weight:700;color:var(--orange);letter-spacing:.18em;text-transform:uppercase;display:block}
.entry-contact{font-size:11px;color:rgba(255,255,255,.4);font-family:var(--mono)}
.entry-contact a{color:var(--orange2);text-decoration:none}

/* MAIN LAYOUT */
.entry-main{display:flex;flex:1;overflow:hidden}

/* LEFT — MARKETING */
.entry-marketing{flex:1;padding:40px 48px 32px;overflow-y:auto;display:flex;flex-direction:column;gap:16px;border-right:1px solid rgba(255,255,255,.06);min-width:0}
.entry-hero{margin-bottom:4px}
.entry-hero-eyebrow{
  font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.22em;
  color:var(--orange2);text-transform:uppercase;margin-bottom:14px;
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(232,151,43,.12);border:1px solid rgba(232,151,43,.22);
  padding:5px 12px;border-radius:99px;
}
.entry-hero-eyebrow::before{content:"";width:7px;height:7px;background:var(--orange);border-radius:50%;box-shadow:0 0 0 0 rgba(232,151,43,.7);animation:pulseDot 2s infinite}
.entry-hero-title{
  font-size:42px;font-weight:900;letter-spacing:-.06em;line-height:1.1;
  color:#fff;margin-bottom:14px;
  text-shadow:0 2px 40px rgba(0,0,0,.4);
}
.entry-hero-title em{
  font-family:var(--serif);font-style:italic;font-weight:600;
  color:var(--orange2);display:block;font-size:44px;
}
.entry-hero-sub{
  font-size:14px;color:rgba(255,255,255,.78);line-height:1.7;
  max-width:500px;font-weight:400;
  border-left:3px solid rgba(232,151,43,.4);padding-left:14px;
}

/* STATS ROW */
.entry-stats{display:flex;gap:10px;margin-top:4px}
.entry-stat{flex:1;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:14px 12px;text-align:center;transition:all .2s;backdrop-filter:blur(4px)}
.entry-stat:hover{background:rgba(232,151,43,.12);border-color:rgba(232,151,43,.3);transform:translateY(-2px)}
.entry-stat-v{font-size:28px;font-weight:900;color:#fff;letter-spacing:-.06em;display:block;line-height:1;text-shadow:0 0 20px rgba(232,151,43,.5)}
.entry-stat-l{font-size:9px;font-family:var(--mono);color:rgba(255,255,255,.5);letter-spacing:.1em;text-transform:uppercase;margin-top:5px;display:block;font-weight:600}

/* SERVICE GRID */
.entry-services{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.entry-svc{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:16px 18px;cursor:default;transition:all .2s;position:relative;overflow:hidden}
.entry-svc::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--svc-color,var(--orange));opacity:.6;transition:opacity .2s}
.entry-svc:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12);transform:translateY(-2px)}
.entry-svc:hover::before{opacity:1}
.entry-svc-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.entry-svc-ic{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.entry-svc-label{font-size:9px;font-family:var(--mono);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--svc-color,var(--orange2));flex:1}
.entry-svc-badge{font-size:8px;padding:2px 6px;border-radius:3px;font-family:var(--mono);font-weight:700;background:rgba(255,255,255,.06);color:rgba(255,255,255,.4)}
.entry-svc-title{font-size:12.5px;font-weight:700;color:#fff;line-height:1.35;margin-bottom:5px}
.entry-svc-desc{font-size:11px;color:rgba(255,255,255,.45);line-height:1.55}


/* ──── VIDEO SPOTS ──── */
.vspot-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}

.vspot{border-radius:10px;overflow:hidden;cursor:pointer;background:#0a1628;border:1px solid rgba(255,255,255,.08);transition:transform .2s,box-shadow .2s}
.vspot:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(0,0,0,.5)}

/* ÉCRAN VIDÉO */
.vspot-screen{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden}

/* BACKGROUNDS ANIMÉS — chaque spot a son propre film CSS */
.vspot-bg{position:absolute;inset:0;background-size:200% 200%;animation:none}
.vspot-bg.playing{animation-play-state:running !important}

/* TRANSIT — vagues orangées en mouvement */
.vs-transit{
  background:linear-gradient(135deg,#0d1f3c 0%,#1a3a6e 30%,#e8972b 60%,#0d1f3c 100%);
  background-size:300% 300%;
  animation:vsTransit 4s ease infinite paused}
@keyframes vsTransit{
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}}

/* PORT — bleu-vert océan */
.vs-port{
  background:linear-gradient(135deg,#061a2e 0%,#0d4a3a 40%,#22c489 70%,#061a2e 100%);
  background-size:300% 300%;
  animation:vsPort 5s ease infinite paused}
@keyframes vsPort{
  0%{background-position:0% 0%}
  50%{background-position:100% 100%}
  100%{background-position:0% 0%}}

/* DOUANE — bleu acier */
.vs-douane{
  background:linear-gradient(135deg,#0a1628 0%,#1e3a5f 35%,#4a6fa5 65%,#0a1628 100%);
  background-size:300% 300%;
  animation:vsDouane 4.5s ease infinite paused}
@keyframes vsDouane{
  0%{background-position:50% 0%}
  50%{background-position:50% 100%}
  100%{background-position:50% 0%}}

/* STOCK — violet entrepôt */
.vs-stock{
  background:linear-gradient(135deg,#100820 0%,#2d1b4e 40%,#7c3aed 65%,#100820 100%);
  background-size:300% 300%;
  animation:vsStock 3.5s ease infinite paused}
@keyframes vsStock{
  0%{background-position:0% 100%}
  50%{background-position:100% 0%}
  100%{background-position:0% 100%}}

/* TRACK — cyan radar */
.vs-track{
  background:linear-gradient(135deg,#041018 0%,#0a3040 40%,#0891b2 65%,#041018 100%);
  background-size:300% 300%;
  animation:vsTrack 3s linear infinite paused}
@keyframes vsTrack{
  0%{background-position:0% 50%}
  100%{background-position:200% 50%}}

/* COTATION — orange chaud */
.vs-cotation{
  background:linear-gradient(135deg,#1a0a00 0%,#3d1f00 40%,#d97706 65%,#1a0a00 100%);
  background-size:300% 300%;
  animation:vsCotation 4s ease infinite paused}
@keyframes vsCotation{
  0%{background-position:0% 0%}
  33%{background-position:100% 50%}
  66%{background-position:50% 100%}
  100%{background-position:0% 0%}}

/* PARTICULES / GRAIN CINÉMA */
.vspot-overlay{
  position:absolute;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='80' height='80' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E");
  opacity:.6;pointer-events:none;mix-blend-mode:overlay}

/* LIGNE DE SCAN */
.vspot-scan{
  position:absolute;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent);
  top:-4px;opacity:0;pointer-events:none}
.vspot-screen.playing .vspot-scan{animation:vsScan 2.5s linear infinite;opacity:1}
@keyframes vsScan{from{top:-4px}to{top:calc(100% + 4px)}}

/* GRILLE CINÉMA (horizontales/verticales légères) */
.vspot-screen::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.015) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.015) 1px,transparent 1px);
  background-size:30px 30px}

/* CONTENU TEXTUEL */
.vspot-content{
  position:absolute;bottom:36px;left:0;right:0;padding:12px 14px;
  background:linear-gradient(transparent,rgba(0,0,0,.75) 50%,rgba(0,0,0,.9));
  transform:translateY(8px);transition:transform .3s;opacity:0}
.vspot-screen.playing .vspot-content{opacity:1;transform:translateY(0)}
.vspot-badge{
  display:inline-block;font-family:var(--mono);font-size:8px;font-weight:800;
  letter-spacing:.18em;padding:3px 7px;border-radius:3px;color:#fff;margin-bottom:5px}
.vspot-headline{font-size:12.5px;font-weight:800;color:#fff;line-height:1.25;letter-spacing:-.02em;margin-bottom:2px}
.vspot-tagline{font-size:10px;color:rgba(255,255,255,.6);font-family:var(--mono)}

/* BOUTON PLAY */
.vspot-play-btn{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-60%);
  width:44px;height:44px;border-radius:50%;
  background:rgba(255,255,255,.18);backdrop-filter:blur(6px);
  border:2px solid rgba(255,255,255,.35);
  display:flex;align-items:center;justify-content:center;
  transition:all .2s;opacity:1}
.vspot-play-btn svg{margin-left:3px}
.vspot-screen.playing .vspot-play-btn{opacity:0;transform:translate(-50%,-60%) scale(.8)}

/* TITRE SOUS L'ÉCRAN (toujours visible) */
.vspot-info{padding:8px 10px 10px}
.vspot-cat{font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:2px}
.vspot-title{font-size:11px;font-weight:600;color:rgba(255,255,255,.75);line-height:1.3}

/* CONTRÔLES BAS */
.vspot-controls{
  position:absolute;bottom:0;left:0;right:0;padding:5px 8px 6px;
  background:rgba(0,0,0,.7);backdrop-filter:blur(4px);
  display:flex;flex-direction:column;gap:4px}
.vspot-timeline{height:3px;background:rgba(255,255,255,.15);border-radius:99px;overflow:hidden;cursor:pointer}
.vspot-progress{height:100%;width:0%;background:var(--svc-clr,var(--orange));border-radius:99px;transition:width .4s linear}
.vspot-meta{display:flex;justify-content:space-between;align-items:center}
.vspot-dur{font-family:var(--mono);font-size:9px;color:rgba(255,255,255,.5);font-weight:700}
.vspot-vol{font-size:10px;cursor:pointer;opacity:.5}

/* ÉTAT HOVER sans play */
.vspot:hover .vspot-play-btn{background:rgba(255,255,255,.28);border-color:rgba(255,255,255,.6)}
.vspot:hover .vspot-bg{animation-play-state:running !important}

/* RESPONSIVE */
@media(max-width:1100px){.vspot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.vspot-grid{grid-template-columns:1fr}}

/* ──── BANDEAU PUBLICITAIRE DÉFILANT (MARQUEE) — GRAND FORMAT ──── */
.ad-marquee{
  position:relative;
  background:linear-gradient(90deg,rgba(232,151,43,.18) 0%,rgba(15,31,69,.55) 35%,rgba(15,31,69,.55) 65%,rgba(232,151,43,.18) 100%);
  border:1.5px solid rgba(232,151,43,.35);
  border-radius:14px;
  overflow:hidden;
  height:90px;
  display:flex;
  align-items:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 28px rgba(0,0,0,.35);
}
.ad-marquee::before,.ad-marquee::after{
  content:"";position:absolute;top:0;bottom:0;width:90px;z-index:3;pointer-events:none;
}
.ad-marquee::before{left:0;background:linear-gradient(90deg,#0a1628 0%,rgba(10,22,40,0) 100%)}
.ad-marquee::after{right:0;background:linear-gradient(270deg,#0a1628 0%,rgba(10,22,40,0) 100%)}
.ad-marquee-label{
  position:relative;z-index:4;flex-shrink:0;
  background:linear-gradient(135deg,var(--orange2),var(--orange-d));
  color:#fff;font-family:var(--mono);font-size:13px;font-weight:800;
  letter-spacing:.18em;text-transform:uppercase;
  padding:14px 22px;height:100%;
  display:flex;align-items:center;gap:10px;
  box-shadow:3px 0 18px rgba(232,151,43,.4);
  writing-mode:horizontal-tb;
}
.ad-marquee-label::before{
  content:"";width:10px;height:10px;background:#fff;border-radius:50%;
  box-shadow:0 0 12px #fff;animation:adBlink 1.2s infinite;
}
@keyframes adBlink{0%,100%{opacity:1}50%{opacity:.3}}
.ad-marquee-track{
  display:flex;align-items:center;gap:60px;
  white-space:nowrap;
  animation:adScroll 65s linear infinite;
  padding-left:40px;
  will-change:transform;
}
.ad-marquee:hover .ad-marquee-track{animation-play-state:paused}
@keyframes adScroll{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}
.ad-item{
  display:inline-flex;align-items:center;gap:14px;
  font-size:24px;font-weight:800;color:#fff;
  letter-spacing:-.02em;
  text-shadow:0 2px 12px rgba(0,0,0,.4);
}
.ad-item .ad-ic{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:10px;
  font-size:22px;
  background:rgba(232,151,43,.22);
  border:1.5px solid rgba(232,151,43,.4);
  flex-shrink:0;
}
.ad-item.promo{color:#ffd99a}
.ad-item.promo .ad-ic{background:rgba(232,151,43,.32);border-color:var(--orange2);box-shadow:0 0 18px rgba(232,151,43,.3)}
.ad-item.news{color:#9dd4ff}
.ad-item.news .ad-ic{background:rgba(56,189,248,.2);border-color:rgba(56,189,248,.5);box-shadow:0 0 18px rgba(56,189,248,.25)}
.ad-item.stat{color:#9ff5c8}
.ad-item.stat .ad-ic{background:rgba(34,196,137,.2);border-color:rgba(34,196,137,.5);box-shadow:0 0 18px rgba(34,196,137,.25)}
.ad-item strong{color:#fff;font-weight:900;letter-spacing:-.01em}
.ad-sep{
  display:inline-block;width:10px;height:10px;border-radius:50%;
  background:rgba(232,151,43,.6);flex-shrink:0;
  box-shadow:0 0 10px rgba(232,151,43,.5);
}

/* Deuxième bandeau (sens inverse) pour remplir l'espace des vidéos */
.ad-marquee.reverse .ad-marquee-track{animation:adScrollRev 70s linear infinite}
@keyframes adScrollRev{
  0%{transform:translateX(-50%)}
  100%{transform:translateX(0)}
}
.ad-marquee.reverse .ad-marquee-label{
  background:linear-gradient(135deg,#22c489,#0b7a56);
  box-shadow:3px 0 18px rgba(34,196,137,.4);
}

/* Troisième bandeau */
.ad-marquee.alt .ad-marquee-label{
  background:linear-gradient(135deg,#3b82f6,#1e40af);
  box-shadow:3px 0 18px rgba(59,130,246,.4);
}
.ad-marquee.alt .ad-marquee-track{animation-duration:75s}

.ad-stack{display:flex;flex-direction:column;gap:14px;margin:8px 0 4px}

@media(max-width:900px){
  .ad-marquee{height:72px}
  .ad-item{font-size:18px;gap:11px}
  .ad-item .ad-ic{width:36px;height:36px;font-size:18px}
}
@media(max-width:600px){
  .ad-marquee{height:58px}
  .ad-marquee-label{font-size:10px;padding:10px 14px}
  .ad-item{font-size:14px;gap:9px}
  .ad-item .ad-ic{width:30px;height:30px;font-size:15px}
}

/* TRUST BAR */
.entry-trust{background:rgba(232,151,43,.07);border:1px solid rgba(232,151,43,.15);border-radius:10px;padding:14px 18px;display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.entry-trust-item{font-size:11px;color:rgba(255,255,255,.65);display:flex;align-items:center;gap:6px}
.entry-trust-item strong{color:var(--orange2)}

/* RIGHT — CONNEXION */
.entry-login{width:360px;flex-shrink:0;padding:40px 36px;display:flex;flex-direction:column;justify-content:center;gap:0;background:rgba(0,0,0,.15)}
.entry-login-tag{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.18em;color:var(--orange2);text-transform:uppercase;margin-bottom:10px}
.entry-login-title{font-size:22px;font-weight:800;color:#fff;letter-spacing:-.04em;margin-bottom:4px}
.entry-login-title em{font-family:var(--serif);font-style:italic;font-weight:500;color:var(--orange2)}
.entry-login-sub{font-size:11.5px;color:rgba(255,255,255,.45);margin-bottom:24px;line-height:1.5}

.entry-form-group{margin-bottom:14px}
.entry-form-label{font-size:10.5px;font-weight:700;color:rgba(255,255,255,.55);letter-spacing:.06em;text-transform:uppercase;font-family:var(--mono);display:block;margin-bottom:6px}
.entry-input-wrap{position:relative}
.entry-input{width:100%;padding:10px 12px 10px 36px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:8px;color:#fff;font-size:13px;font-family:var(--sans);outline:none;transition:all .15s;box-sizing:border-box}
.entry-input::placeholder{color:rgba(255,255,255,.25)}
.entry-input:focus{background:rgba(255,255,255,.09);border-color:var(--orange);box-shadow:0 0 0 3px rgba(232,151,43,.12)}
.entry-input-ic{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:rgba(255,255,255,.3);pointer-events:none}

.entry-options{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.entry-cb{display:flex;align-items:center;gap:6px;font-size:11px;color:rgba(255,255,255,.45);cursor:pointer}
.entry-cb input{accent-color:var(--orange);width:13px;height:13px}
.entry-forgot{font-size:11px;color:var(--orange2);cursor:pointer;background:none;border:none;padding:0;font-family:var(--sans)}
.entry-forgot:hover{text-decoration:underline}

.entry-submit{width:100%;padding:12px;background:linear-gradient(135deg,var(--orange),var(--orange-d));border:none;border-radius:9px;color:#fff;font-size:13.5px;font-weight:700;font-family:var(--sans);cursor:pointer;transition:all .2s;box-shadow:0 4px 16px rgba(232,151,43,.3);display:flex;align-items:center;justify-content:center;gap:8px;letter-spacing:-.01em}
.entry-submit:hover{background:linear-gradient(135deg,#f4a94a,var(--orange));box-shadow:0 6px 20px rgba(232,151,43,.4);transform:translateY(-1px)}
.entry-submit:active{transform:translateY(0)}

.entry-divider{display:flex;align-items:center;gap:10px;margin:18px 0;color:rgba(255,255,255,.2);font-size:11px;font-family:var(--mono)}
.entry-divider::before,.entry-divider::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.1)}

.entry-secure-strip{margin-top:18px;padding:11px 14px;background:linear-gradient(135deg,rgba(34,196,137,.08),rgba(34,196,137,.03));border:1px solid rgba(34,196,137,.22);border-radius:8px;display:flex;align-items:center;gap:10px;font-size:11px;font-weight:500;color:rgba(255,255,255,.65);letter-spacing:-.01em}
.entry-secure-ic{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;background:rgba(34,196,137,.18);border-radius:6px;color:#5fd8a8;flex-shrink:0}

.entry-demo-select{width:100%;padding:9px 12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:8px;color:rgba(255,255,255,.6);font-size:12px;font-family:var(--sans);outline:none;cursor:pointer;box-sizing:border-box}
.entry-demo-select option{background:#0f1f45;color:#fff}

.entry-foot{margin-top:20px;text-align:center;font-size:11px;color:rgba(255,255,255,.3);line-height:1.6}
.entry-foot a{color:var(--orange2);cursor:pointer}

.entry-msg{display:none;padding:10px 12px;border-radius:7px;font-size:11.5px;font-weight:600;margin-bottom:14px;line-height:1.4}
.entry-msg.ok{background:rgba(34,196,137,.1);border:1px solid rgba(34,196,137,.25);color:#22c489;display:block}
.entry-msg.err{background:rgba(231,76,60,.1);border:1px solid rgba(231,76,60,.25);color:#e74c3c;display:block}
.entry-msg.info{background:rgba(232,151,43,.1);border:1px solid rgba(232,151,43,.25);color:var(--orange2);display:block}

/* BOTTOM BAR */
.entry-footer{padding:12px 48px;border-top:1px solid rgba(255,255,255,.07);display:flex;justify-content:space-between;align-items:center;font-size:10px;color:rgba(255,255,255,.25);font-family:var(--mono);flex-shrink:0}
.entry-footer strong{color:rgba(255,255,255,.4)}

@media(max-width:900px){
  .entry-main{flex-direction:column}
  .entry-marketing{border-right:none;border-bottom:1px solid rgba(255,255,255,.06)}
  .entry-login{width:100%;padding:32px 24px}
  .entry-services{grid-template-columns:1fr}
  .entry-topbar{padding:14px 24px}
}

/* ═════════ MODULE RH — STYLES ═════════ */
.rh-tabs{display:flex;gap:2px;margin-top:18px;border-bottom:2px solid var(--line);overflow-x:auto;padding-bottom:0}
.rh-tab{display:inline-flex;align-items:center;gap:7px;padding:11px 16px;background:transparent;border:none;border-bottom:2px solid transparent;margin-bottom:-2px;cursor:pointer;font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--ink3);letter-spacing:-.01em;transition:all .15s;white-space:nowrap;border-radius:6px 6px 0 0}
.rh-tab:hover{color:var(--navy);background:var(--bg3)}
.rh-tab.active{color:var(--orange-d);border-bottom-color:var(--orange-d);background:linear-gradient(180deg,rgba(232,151,43,.06),transparent);font-weight:800}
.rh-tab-ic{display:inline-flex;align-items:center;color:inherit}
.rh-tab-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 6px;font-family:var(--mono);font-size:9.5px;font-weight:800;border-radius:99px;margin-left:2px}
.rh-content{padding-top:18px;animation:rhFade .25s ease-out}
@keyframes rhFade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

.rh-alert{display:flex;align-items:center;gap:11px;padding:12px 16px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .15s}
.rh-alert:hover{background:var(--bg3)}
.rh-alert:last-child{border-bottom:none}
.rh-alert-ic{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}
.rh-alert-t{font-size:12.5px;font-weight:700;color:var(--navy);letter-spacing:-.01em;margin-bottom:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rh-alert-d{font-size:11px;color:var(--ink3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.rh-filters{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.rh-search{flex:1;min-width:240px;padding:10px 14px;background:var(--bg2);border:1.5px solid var(--line);border-radius:8px;font-family:var(--sans);font-size:13px;outline:none;transition:border-color .15s}
.rh-search:focus{border-color:var(--orange-d)}
.rh-filter-sel{padding:10px 14px;background:var(--bg2);border:1.5px solid var(--line);border-radius:8px;font-family:var(--sans);font-size:12px;font-weight:600;color:var(--navy);outline:none;cursor:pointer;min-width:160px}
.rh-filter-sel:focus{border-color:var(--orange-d)}

.rh-emp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.rh-emp-card{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:18px;cursor:pointer;transition:all .2s;box-shadow:0 1px 4px rgba(15,31,69,.05);position:relative;overflow:hidden}
.rh-emp-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--orange2),var(--orange-d))}
.rh-emp-card:hover{transform:translateY(-3px);box-shadow:0 8px 28px rgba(15,31,69,.12);border-color:var(--orange-d)}
.rh-emp-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}
.rh-emp-avatar{width:54px;height:54px;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;font-weight:800;letter-spacing:-.04em;box-shadow:0 4px 14px rgba(0,0,0,.15)}
.rh-emp-statut{font-family:var(--mono);font-size:9px;font-weight:800;padding:3px 8px;border-radius:99px;letter-spacing:.06em}
.rh-emp-name{font-size:14px;font-weight:600;color:var(--ink2);line-height:1.3;margin-bottom:2px}
.rh-emp-name strong{font-weight:800;color:var(--navy);text-transform:uppercase;letter-spacing:-.01em}
.rh-emp-poste{font-size:12px;color:var(--ink2);font-weight:600;margin-bottom:2px}
.rh-emp-dept{font-family:var(--mono);font-size:10px;font-weight:700;margin-bottom:12px;letter-spacing:.04em}
.rh-emp-info{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:11px;background:var(--bg3);border-radius:8px;margin-bottom:12px}
.rh-emp-info div{display:flex;flex-direction:column}
.rh-emp-info span{font-size:9px;color:var(--ink3);text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.rh-emp-info strong{font-family:var(--mono);font-size:11px;color:var(--navy);font-weight:800;margin-top:2px}
.rh-emp-actions{display:flex;gap:5px}
.rh-emp-actions .btn{flex:1;justify-content:center}

.rh-mini-avatar{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:11px;font-weight:800;flex-shrink:0}

.org-node{background:var(--bg2);border:2px solid var(--line);border-radius:12px;padding:16px;cursor:pointer;transition:all .2s;text-align:center}
.org-node:hover{border-color:var(--orange-d);transform:translateY(-2px);box-shadow:0 6px 18px rgba(15,31,69,.12)}
.org-node-top{background:linear-gradient(135deg,#0f1f45,#1a3060);color:#fff;border-color:var(--orange-d);box-shadow:0 8px 26px rgba(15,31,69,.25);max-width:260px}
.org-node-top .org-name{color:#fff}
.org-node-top .org-poste{color:rgba(255,255,255,.7)}
.org-node-top .org-matricule{color:var(--orange2)}
.org-avatar{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:15px;font-weight:800;margin:0 auto 9px;box-shadow:0 4px 12px rgba(0,0,0,.15)}
.org-avatar-lg{width:64px;height:64px;border-radius:16px;font-size:20px}
.org-name{font-size:13px;font-weight:800;color:var(--navy);letter-spacing:-.02em;line-height:1.2}
.org-poste{font-size:11px;color:var(--ink3);font-weight:600;margin-top:3px}
.org-matricule{font-family:var(--mono);font-size:9px;color:var(--orange-d);margin-top:6px;letter-spacing:.05em;font-weight:700}
.org-team{font-family:var(--mono);font-size:9.5px;color:var(--ink3);margin-top:6px;letter-spacing:.05em;font-weight:700;text-transform:uppercase}
.org-node-sub{display:flex;align-items:center;gap:10px;text-align:left;padding:9px 12px;border:1px solid var(--line);border-radius:8px;background:var(--bg2)}
.org-node-sub:hover{border-color:var(--orange-d);transform:translateX(2px)}
.org-mini-avatar{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;font-weight:800;flex-shrink:0}
.org-name-sub{font-size:11.5px;font-weight:700;color:var(--navy);line-height:1.2}
.org-poste-sub{font-size:10px;color:var(--ink3);margin-top:2px}

/* Modal RH léger */
.rh-modal-overlay{position:fixed;inset:0;background:rgba(15,31,69,.6);backdrop-filter:blur(4px);z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .25s}
.rh-modal-overlay.open{opacity:1;pointer-events:auto}
.rh-modal{background:var(--bg2);border-radius:14px;box-shadow:0 28px 80px rgba(0,0,0,.4);width:100%;max-width:680px;max-height:92vh;display:flex;flex-direction:column;overflow:hidden;transform:scale(.95);transition:transform .25s}
.rh-modal-overlay.open .rh-modal{transform:scale(1)}
.rh-modal-h{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,#0f1f45,#1a3060);color:#fff}
.rh-modal-t{font-size:15px;font-weight:800;letter-spacing:-.02em}
.rh-modal-x{background:rgba(255,255,255,.1);border:none;color:#fff;width:30px;height:30px;border-radius:8px;cursor:pointer;font-size:20px;display:flex;align-items:center;justify-content:center;transition:background .15s}
.rh-modal-x:hover{background:rgba(255,255,255,.2)}
.rh-modal-b{padding:22px;overflow-y:auto;flex:1}
.rh-modal-f{display:flex;justify-content:flex-end;gap:8px;padding:14px 22px;border-top:1px solid var(--line);background:var(--bg3)}

.fiche-block{background:var(--bg3);border:1px solid var(--line);border-radius:10px;padding:13px 15px}
.fiche-block-t{font-family:var(--mono);font-size:9.5px;font-weight:800;color:var(--orange-d);text-transform:uppercase;letter-spacing:.12em;margin-bottom:9px}
.fiche-row{display:flex;justify-content:space-between;gap:14px;padding:5px 0;font-size:11.5px;border-bottom:1px dashed var(--line)}
.fiche-row:last-child{border-bottom:none}
.fiche-row span{color:var(--ink3)}
.fiche-row strong{color:var(--navy);font-weight:700;text-align:right;overflow:hidden;text-overflow:ellipsis}
.fiche-stat{background:var(--bg3);border:1px solid var(--line);border-radius:9px;padding:11px;text-align:center}
.fiche-stat-l{font-size:9.5px;color:var(--ink3);text-transform:uppercase;letter-spacing:.08em;font-weight:700;margin-bottom:4px}
.fiche-stat-v{font-family:var(--mono);font-size:18px;font-weight:800}

@media(max-width:900px){
  .rh-tabs{font-size:11.5px}
  .rh-tab{padding:9px 12px;font-size:11.5px}
  .rh-emp-grid{grid-template-columns:1fr}
}

/* Barre d'actions opérationnelles (dossiers, factures, etc.) */
.op-actions-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:14px 0;padding:12px 14px;background:linear-gradient(135deg,rgba(232,151,43,.06),rgba(15,31,69,.02));border:1px dashed rgba(232,151,43,.4);border-radius:10px}
.op-actions-l{font-family:var(--mono);font-size:10px;font-weight:800;color:var(--orange-d);letter-spacing:.14em;text-transform:uppercase;display:flex;align-items:center;gap:6px;margin-right:8px}
.op-act{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;background:var(--bg2);border:1px solid var(--line2);border-radius:7px;font-family:var(--sans);font-size:11.5px;font-weight:700;color:var(--ink2);cursor:pointer;transition:all .15s;letter-spacing:-.01em}
.op-act:hover{background:var(--orange-d);color:#fff;border-color:var(--orange-d);transform:translateY(-1px);box-shadow:0 4px 12px rgba(232,151,43,.3)}
.op-act svg{flex-shrink:0}

/* ████████████████████████████████████████████████████
   MLOG PRO MAX — Comprehensive UI Polish v10 000 000
   ████████████████████████████████████████████████████ */

/* ── 1. DESIGN TOKENS ── */
:root {
  --shadow-xs: 0 1px 2px rgba(15,31,69,.04);
  --shadow-sm: 0 2px 8px rgba(15,31,69,.07), 0 1px 2px rgba(15,31,69,.04);
  --shadow-md: 0 4px 16px rgba(15,31,69,.1), 0 1px 4px rgba(15,31,69,.06);
  --shadow-lg: 0 8px 32px rgba(15,31,69,.14), 0 2px 8px rgba(15,31,69,.08);
  --shadow-xl: 0 16px 48px rgba(15,31,69,.18), 0 4px 12px rgba(15,31,69,.1);
  --radius-xs: 5px; --radius-sm: 7px; --radius-md: 10px; --radius-lg: 12px; --radius-xl: 16px;
  --transition: all .18s cubic-bezier(.4,0,.2,1);
}

/* ── 2. PAGE ENTRÉE ANIMÉE ── */
@keyframes fadeUp {
  from { opacity:0; transform:translateY(12px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes scaleIn { from{opacity:0;transform:scale(.96)} to{opacity:1;transform:scale(1)} }
@keyframes slideRight { from{opacity:0;transform:translateX(-8px)} to{opacity:1;transform:translateX(0)} }

.page { animation: fadeUp .28s cubic-bezier(.4,0,.2,1) both; }
.card { animation: fadeIn .2s ease both; }

/* ── 3. TOPBAR ELITE ── */
.topbar {
  background: linear-gradient(90deg, #080f1e 0%, #0c1835 40%, #0f1f45 100%) !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.04), 0 4px 20px rgba(0,0,0,.3) !important;
  height: 56px !important;
  padding: 0 20px 0 0 !important;
}
.logo {
  height: 56px !important;
  padding: 0 20px !important;
  border-right: 1px solid rgba(255,255,255,.06) !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  transition: var(--transition) !important;
  flex-shrink: 0 !important;
}
.logo:hover { background: rgba(255,255,255,.03) !important; }
.logo-badge {
  width: 34px !important; height: 34px !important;
  background: linear-gradient(135deg, var(--orange2), var(--orange-d)) !important;
  border-radius: 9px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: 13px !important; font-weight: 900 !important; color: #fff !important;
  box-shadow: 0 3px 10px rgba(232,151,43,.4) !important;
  letter-spacing: -.03em !important;
}
.logo-main { font-size: 16px !important; font-weight: 800 !important; letter-spacing: -.05em !important; }
.logo-sub  { font-size: 8px !important; letter-spacing: .18em !important; }

/* Search bar */
.tb-search {
  flex: 1 !important; max-width: 380px !important;
  background: rgba(255,255,255,.06) !important;
  border: 1.5px solid rgba(255,255,255,.08) !important;
  border-radius: 9px !important;
  display: flex !important; align-items: center !important; gap: 8px !important;
  padding: 0 14px !important; height: 36px !important;
  cursor: pointer !important; transition: var(--transition) !important;
}
.tb-search:hover { background: rgba(255,255,255,.09) !important; border-color: rgba(255,255,255,.14) !important; }
.tb-search-ic { color: rgba(255,255,255,.35) !important; display: flex !important; }
.tb-search-ph { font-size: 12.5px !important; color: rgba(255,255,255,.3) !important; flex: 1 !important; }
.tb-search-kbd {
  font-family: var(--mono) !important; font-size: 10px !important; font-weight: 700 !important;
  padding: 2px 7px !important; border-radius: 5px !important;
  background: rgba(255,255,255,.08) !important; border: 1px solid rgba(255,255,255,.1) !important;
  color: rgba(255,255,255,.35) !important;
}

/* Topbar icon buttons */
.theme-toggle {
  width: 36px !important; height: 36px !important;
  background: rgba(255,255,255,.06) !important;
  border: 1.5px solid rgba(255,255,255,.08) !important;
  border-radius: 9px !important; cursor: pointer !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  color: rgba(255,255,255,.55) !important; transition: var(--transition) !important;
}
.theme-toggle:hover { background: rgba(255,255,255,.12) !important; color: #fff !important; border-color: rgba(255,255,255,.2) !important; }

/* ── 4. SIDEBAR ELITE ── */
.sidebar {
  background: #07101e !important;
  border-right: 1px solid rgba(255,255,255,.05) !important;
  display: flex !important; flex-direction: column !important;
  overflow-y: auto !important; overflow-x: hidden !important;
}
.sidebar::-webkit-scrollbar { width: 2px !important; }
.sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,.08) !important; }

/* Sidebar user card at bottom */
.sb-foot {
  padding: 10px !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
  margin-top: auto !important;
  flex-shrink: 0 !important;
}

/* ── 5. CARDS ÉLITE ── */
.card {
  background: #fff !important;
  border: 1px solid rgba(15,31,69,.08) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-sm) !important;
  transition: box-shadow .2s, border-color .2s !important;
  overflow: hidden !important;
}
.card:hover { box-shadow: var(--shadow-md) !important; }
.card-h {
  padding: 14px 18px !important;
  border-bottom: 1px solid rgba(15,31,69,.06) !important;
  background: linear-gradient(135deg, #f8faff, #fff) !important;
  display: flex !important; align-items: center !important; gap: 10px !important;
}
.card-t {
  font-size: 13.5px !important; font-weight: 700 !important;
  color: var(--navy) !important; letter-spacing: -.03em !important;
}
.card-b { padding: 16px 18px !important; }
.card-ic {
  width: 30px !important; height: 30px !important;
  background: linear-gradient(135deg,var(--orange-p), rgba(232,151,43,.05)) !important;
  border-radius: 8px !important; border: 1px solid rgba(232,151,43,.15) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  flex-shrink: 0 !important; color: var(--orange-d) !important;
}

/* ── 6. MÉTRIQUES ÉLITE ── */
.metrics { display: grid !important; grid-template-columns: repeat(auto-fill,minmax(180px,1fr)) !important; gap: 12px !important; margin: 20px 0 !important; }
.metric {
  background: #fff !important;
  border: 1px solid rgba(15,31,69,.08) !important;
  border-radius: var(--radius-lg) !important;
  padding: 18px 20px 16px !important;
  position: relative !important; overflow: hidden !important;
  box-shadow: var(--shadow-sm) !important;
  transition: var(--transition) !important;
}
.metric::after {
  content: '' !important; position: absolute !important;
  inset: 0 !important; border-radius: inherit !important;
  background: linear-gradient(135deg, rgba(255,255,255,.8) 0%, transparent 60%) !important;
  pointer-events: none !important;
}
.metric:hover { transform: translateY(-2px) !important; box-shadow: var(--shadow-md) !important; }
.m-val { font-size: 32px !important; font-weight: 900 !important; letter-spacing: -.06em !important; line-height: 1 !important; }
.m-lbl { font-size: 11px !important; font-weight: 600 !important; color: var(--ink3) !important; letter-spacing: .04em !important; text-transform: uppercase !important; margin-bottom: 6px !important; }
.m-sub { font-size: 11px !important; color: var(--ink3) !important; margin-top: 6px !important; }
.m-ic { color: var(--orange-p) !important; margin-bottom: 8px !important; }
.ms { height: 3px !important; border-radius: 99px !important; }

/* ── 7. TABLES ÉLITE ── */
table { width: 100% !important; border-collapse: collapse !important; }
thead tr { background: linear-gradient(135deg,#f8faff,#f0f4fd) !important; }
th {
  padding: 10px 14px !important;
  font-size: 10.5px !important; font-weight: 700 !important;
  color: var(--ink3) !important; letter-spacing: .08em !important; text-transform: uppercase !important;
  border-bottom: 2px solid rgba(15,31,69,.08) !important;
  white-space: nowrap !important; text-align: left !important;
}
td {
  padding: 12px 14px !important;
  font-size: 13px !important; color: var(--ink2) !important;
  border-bottom: 1px solid rgba(15,31,69,.05) !important;
  vertical-align: middle !important;
}
tbody tr:last-child td { border-bottom: none !important; }
tbody tr { transition: background .1s !important; }
tbody tr:hover { background: #f8faff !important; }
tbody tr:hover td { color: var(--navy) !important; }

/* ── 8. BUTTONS ÉLITE ── */
.btn {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  padding: 9px 17px !important;
  font-family: var(--sans) !important; font-size: 12.5px !important; font-weight: 700 !important;
  cursor: pointer !important; border-radius: 8px !important;
  border: 1.5px solid transparent !important;
  transition: var(--transition) !important;
  letter-spacing: -.02em !important; line-height: 1 !important; white-space: nowrap !important;
  position: relative !important; overflow: hidden !important;
}
.btn::after { content: '' !important; position: absolute !important; inset: 0 !important; background: rgba(255,255,255,0) !important; transition: background .15s !important; }
.btn:hover::after { background: rgba(255,255,255,.1) !important; }
.btn:active { transform: scale(.98) !important; }

.btn-pr {
  background: linear-gradient(135deg, var(--orange2), var(--orange-d)) !important;
  color: #fff !important; border-color: var(--orange-d) !important;
  box-shadow: 0 2px 12px rgba(232,151,43,.35), inset 0 1px 0 rgba(255,255,255,.2) !important;
}
.btn-pr:hover { box-shadow: 0 4px 20px rgba(232,151,43,.45), inset 0 1px 0 rgba(255,255,255,.2) !important; transform: translateY(-1px) !important; }

.btn-nv { background: var(--navy) !important; color: #fff !important; border-color: var(--navy) !important; box-shadow: var(--shadow-sm) !important; }
.btn-nv:hover { background: var(--navy2) !important; }

.btn-gh {
  background: #fff !important; color: var(--ink2) !important;
  border-color: rgba(15,31,69,.14) !important; box-shadow: var(--shadow-xs) !important;
}
.btn-gh:hover { background: #f8faff !important; border-color: var(--navy) !important; color: var(--navy) !important; }

.btn-sc { background: rgba(9,150,106,.08) !important; color: var(--green) !important; border-color: rgba(9,150,106,.2) !important; }
.btn-sc:hover { background: rgba(9,150,106,.14) !important; }

.btn-dg { background: rgba(192,51,74,.08) !important; color: var(--red) !important; border-color: rgba(192,51,74,.2) !important; }
.btn-dg:hover { background: rgba(192,51,74,.14) !important; }

.btn-sm  { padding: 6px 13px !important; font-size: 11.5px !important; }
.btn-xs  { padding: 4px 10px !important; font-size: 11px !important; border-radius: 6px !important; }

/* ── 9. INPUTS ÉLITE ── */
.fI, input.fI, select.fS, textarea.fI {
  width: 100% !important;
  background: #fff !important;
  border: 1.5px solid rgba(15,31,69,.14) !important;
  border-radius: 8px !important;
  padding: 9px 13px !important;
  font-size: 13px !important; font-family: var(--sans) !important;
  color: var(--navy) !important; outline: none !important;
  transition: var(--transition) !important;
  box-shadow: var(--shadow-xs) !important;
  box-sizing: border-box !important;
}
.fI:focus, select.fS:focus {
  border-color: var(--orange) !important;
  box-shadow: 0 0 0 3px rgba(232,151,43,.12), var(--shadow-xs) !important;
}
.fI::placeholder { color: rgba(15,31,69,.25) !important; }

/* ── 10. BADGES ÉLITE ── */
.bdg {
  display: inline-flex !important; align-items: center !important;
  font-family: var(--mono) !important; font-size: 10px !important; font-weight: 700 !important;
  padding: 3px 9px !important; border-radius: 99px !important;
  letter-spacing: .04em !important; white-space: nowrap !important;
}
.b-ap  { background: rgba(9,150,106,.1) !important; color: #057a55 !important; border: 1px solid rgba(9,150,106,.2) !important; }
.b-rj  { background: rgba(192,51,74,.1) !important; color: #9b1c3a !important; border: 1px solid rgba(192,51,74,.2) !important; }
.b-op  { background: rgba(232,151,43,.12) !important; color: #9a6415 !important; border: 1px solid rgba(232,151,43,.25) !important; }
.b-sb  { background: rgba(59,130,246,.1) !important; color: #1d4ed8 !important; border: 1px solid rgba(59,130,246,.2) !important; }
.b-dr  { background: rgba(15,31,69,.07) !important; color: var(--navy2) !important; border: 1px solid rgba(15,31,69,.12) !important; }

/* ── 11. MODAL ÉLITE ── */
.mo { background: rgba(7,16,30,.65) !important; backdrop-filter: blur(8px) !important; }
.mb {
  background: #fff !important;
  border-radius: var(--radius-xl) !important;
  box-shadow: var(--shadow-xl) !important;
  animation: scaleIn .22s cubic-bezier(.4,0,.2,1) both !important;
  border: 1px solid rgba(15,31,69,.08) !important;
}
.mh {
  padding: 18px 22px 14px !important;
  border-bottom: 1px solid rgba(15,31,69,.07) !important;
  display: flex !important; align-items: center !important; gap: 10px !important;
}
.m-t { font-size: 15px !important; font-weight: 700 !important; color: var(--navy) !important; letter-spacing: -.03em !important; flex: 1 !important; }
.m-bd { padding: 18px 22px !important; }
.m-ft { padding: 12px 22px 18px !important; display: flex !important; justify-content: flex-end !important; gap: 8px !important; }
.m-cl { cursor: pointer !important; color: var(--ink3) !important; font-size: 18px !important; line-height: 1 !important; padding: 2px 6px !important; border-radius: 6px !important; transition: var(--transition) !important; }
.m-cl:hover { background: var(--bg3) !important; color: var(--red) !important; }
.m-ic2 { width: 32px !important; height: 32px !important; background: var(--orange-p) !important; border-radius: 9px !important; display: flex !important; align-items: center !important; justify-content: center !important; color: var(--orange-d) !important; flex-shrink: 0 !important; }

/* ── 12. PAGE HEADER ÉLITE ── */
.page { padding: 28px 32px !important; }
.page-title { font-size: 23px !important; font-weight: 800 !important; color: var(--navy) !important; letter-spacing: -.05em !important; margin-bottom: 4px !important; }
.page-title em { font-family: var(--serif) !important; font-style: italic !important; font-weight: 600 !important; color: var(--orange-d) !important; }
.page-sub { font-size: 13px !important; color: var(--ink3) !important; margin-bottom: 0 !important; line-height: 1.5 !important; }
.page-acts { display: flex !important; align-items: center !important; gap: 8px !important; margin: 16px 0 !important; flex-wrap: wrap !important; }

/* ── 13. BREADCRUMB ÉLITE ── */
.brc { display: flex !important; align-items: center !important; gap: 4px !important; margin-bottom: 14px !important; flex-wrap: wrap !important; }
.bcl { font-size: 11.5px !important; color: var(--ink3) !important; transition: color .12s !important; }
.bcl:hover { color: var(--orange-d) !important; }
.bcs { font-size: 11.5px !important; color: var(--ink4) !important; margin: 0 2px !important; }
.bca { font-size: 11.5px !important; font-weight: 700 !important; color: var(--navy) !important; }

/* ── 14. TOAST NOTIFICATION ÉLITE ── */
.tw { position: fixed !important; bottom: 28px !important; right: 28px !important; display: flex !important; flex-direction: column !important; gap: 8px !important; z-index: 9999 !important; pointer-events: none !important; }
.toast {
  background: #fff !important; border: 1px solid rgba(15,31,69,.1) !important;
  border-radius: 10px !important; padding: 12px 16px !important;
  font-size: 13px !important; font-weight: 600 !important; color: var(--navy) !important;
  box-shadow: var(--shadow-lg) !important;
  display: flex !important; align-items: center !important; gap: 10px !important;
  min-width: 260px !important; max-width: 380px !important;
  animation: slideRight .25s cubic-bezier(.4,0,.2,1) both !important;
  pointer-events: all !important;
}
.toast.s { border-left: 3px solid var(--green) !important; }
.toast.e { border-left: 3px solid var(--red) !important; }
.toast.i { border-left: 3px solid var(--orange) !important; }
.toast.w { border-left: 3px solid #eab308 !important; }
.toast-dot { width: 8px !important; height: 8px !important; border-radius: 50% !important; flex-shrink: 0 !important; }
.toast.s .toast-dot { background: var(--green) !important; }
.toast.e .toast-dot { background: var(--red) !important; }
.toast.i .toast-dot { background: var(--orange) !important; }
.toast.w .toast-dot { background: #eab308 !important; }

/* ── 15. SECTION HEADERS ── */
.section-h { display: flex !important; align-items: center !important; gap: 12px !important; margin: 24px 0 14px !important; }
.section-h-t { font-size: 11px !important; font-weight: 800 !important; color: var(--ink3) !important; letter-spacing: .12em !important; text-transform: uppercase !important; white-space: nowrap !important; }
.section-h-line { flex: 1 !important; height: 1px !important; background: rgba(15,31,69,.08) !important; }

/* ── 16. PALETTE DE COMMANDES ÉLITE ── */
.cmdk-backdrop { background: rgba(7,16,30,.7) !important; backdrop-filter: blur(12px) !important; }
.cmdk-panel {
  background: #fff !important;
  border-radius: var(--radius-xl) !important;
  border: 1px solid rgba(15,31,69,.1) !important;
  box-shadow: var(--shadow-xl) !important;
  animation: scaleIn .18s cubic-bezier(.4,0,.2,1) !important;
  overflow: hidden !important;
}
.cmdk-input-w { padding: 14px 16px !important; border-bottom: 1px solid rgba(15,31,69,.07) !important; display: flex !important; align-items: center !important; gap: 10px !important; }
.cmdk-input { border: none !important; outline: none !important; font-size: 15px !important; font-weight: 500 !important; color: var(--navy) !important; flex: 1 !important; background: transparent !important; font-family: var(--sans) !important; }
.cmdk-input::placeholder { color: rgba(15,31,69,.3) !important; }
.cmdk-foot { padding: 8px 14px !important; border-top: 1px solid rgba(15,31,69,.07) !important; background: #f8faff !important; display: flex !important; align-items: center !important; gap: 12px !important; }
.cmdk-foot-hint { display: flex !important; align-items: center !important; gap: 5px !important; font-size: 11px !important; color: var(--ink3) !important; }
.cmdk-kbd { font-family: var(--mono) !important; font-size: 10px !important; font-weight: 700 !important; padding: 2px 7px !important; background: rgba(15,31,69,.07) !important; border: 1px solid rgba(15,31,69,.1) !important; border-radius: 5px !important; color: var(--ink2) !important; }
.cmdk-result { padding: 7px 12px !important; display: flex !important; align-items: center !important; gap: 10px !important; cursor: pointer !important; border-radius: 7px !important; margin: 1px 6px !important; transition: var(--transition) !important; }
.cmdk-result:hover, .cmdk-result.sel { background: #f0f5ff !important; }
.cmdk-result-ic { width: 28px !important; height: 28px !important; background: var(--bg3) !important; border-radius: 7px !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; }
.cmdk-result-label { font-size: 13px !important; font-weight: 600 !important; color: var(--navy) !important; }
.cmdk-result-desc { font-size: 11.5px !important; color: var(--ink3) !important; }
.cmdk-grp-title { font-size: 10px !important; font-weight: 800 !important; color: var(--ink4) !important; letter-spacing: .12em !important; text-transform: uppercase !important; padding: 8px 18px 4px !important; }

/* ── 17. ALERTS / BANNERS ── */
.alt { border-radius: 9px !important; padding: 12px 15px !important; font-size: 12.5px !important; line-height: 1.55 !important; display: flex !important; align-items: flex-start !important; gap: 10px !important; margin-bottom: 16px !important; }
.a-i { background: rgba(59,130,246,.07) !important; border: 1px solid rgba(59,130,246,.18) !important; color: #1d4ed8 !important; }
.a-w { background: rgba(232,151,43,.08) !important; border: 1px solid rgba(232,151,43,.2) !important; color: #9a6415 !important; }
.a-d { background: rgba(192,51,74,.07) !important; border: 1px solid rgba(192,51,74,.18) !important; color: #9b1c3a !important; }
.a-s { background: rgba(9,150,106,.07) !important; border: 1px solid rgba(9,150,106,.18) !important; color: #065f46 !important; }

/* ── 18. EMPTY STATES ── */
.empty-state {
  display: flex !important; flex-direction: column !important; align-items: center !important;
  padding: 64px 32px !important; text-align: center !important;
}
.empty-state-icon { font-size: 40px !important; margin-bottom: 16px !important; opacity: .6 !important; }
.empty-state-title { font-size: 16px !important; font-weight: 700 !important; color: var(--navy) !important; margin-bottom: 6px !important; letter-spacing: -.03em !important; }
.empty-state-desc { font-size: 13px !important; color: var(--ink3) !important; max-width: 340px !important; line-height: 1.6 !important; margin-bottom: 20px !important; }

/* ── 19. TABS ÉLITE ── */
.ws-tabs { display: flex !important; gap: 2px !important; border-bottom: 2px solid rgba(15,31,69,.08) !important; margin-bottom: 20px !important; }
.ws-tab {
  padding: 9px 16px !important; font-size: 12.5px !important; font-weight: 600 !important;
  color: var(--ink3) !important; background: none !important; border: none !important;
  cursor: pointer !important; border-radius: 8px 8px 0 0 !important;
  transition: var(--transition) !important; position: relative !important; bottom: -2px !important;
  font-family: var(--sans) !important; display: flex !important; align-items: center !important; gap: 7px !important;
  border-bottom: 2px solid transparent !important;
}
.ws-tab:hover { color: var(--navy) !important; background: rgba(15,31,69,.04) !important; }
.ws-tab.active { color: var(--navy) !important; border-bottom-color: var(--orange) !important; font-weight: 700 !important; }

/* ── 20. SCROLLBAR GLOBALE ── */
.content::-webkit-scrollbar, main::-webkit-scrollbar { width: 5px !important; }
.content::-webkit-scrollbar-thumb, main::-webkit-scrollbar-thumb { background: rgba(15,31,69,.12) !important; border-radius: 99px !important; }
.content::-webkit-scrollbar-thumb:hover { background: rgba(15,31,69,.22) !important; }

/* ── 21. FORM GROUPS ── */
.fg { margin-bottom: 16px !important; }
.fL { display: block !important; font-size: 11.5px !important; font-weight: 700 !important; color: var(--navy) !important; margin-bottom: 5px !important; letter-spacing: -.01em !important; }
.fR { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 14px !important; }
.fS { appearance: none !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 12px center !important; padding-right: 36px !important; }

/* ── 22. HIGHLIGHT ACTIF DANS LE MENU ── */
.nav-item.active {
  background: linear-gradient(90deg, rgba(232,151,43,.12), rgba(232,151,43,.06)) !important;
  color: var(--navy2) !important;
  font-weight: 700 !important;
}
.nav-item.active .ni { color: var(--orange2) !important; }
.nav-item.active::before {
  content: '' !important; position: absolute !important; left: -6px !important; top: 18% !important;
  height: 64% !important; width: 3px !important;
  background: linear-gradient(180deg, var(--orange2), var(--orange-d)) !important;
  border-radius: 0 4px 4px 0 !important;
}

/* ── 23. RESPONSIVE POLISH ── */
@media (max-width: 900px) {
  .page { padding: 20px !important; }
  .metrics { grid-template-columns: repeat(2,1fr) !important; }
  .fR { grid-template-columns: 1fr !important; }
}

/* ═══════════════════════════════════════════════════
   SIDEBAR ACCORDÉON PREMIUM — World-class redesign
   ═══════════════════════════════════════════════════ */

.sidebar {
  background: #080f1e !important;
  border-right: 1px solid rgba(255,255,255,.05) !important;
  padding-top: 6px !important;
}

/* ── Section header (trigger accordéon) ── */
.nav-sec {
  all: unset !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 10px 0 10px !important;
  height: 40px !important;
  margin: 2px 6px !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  transition: background .14s !important;
  user-select: none !important;
  color: rgba(255,255,255,.75) !important;
  box-sizing: border-box !important;
  font-family: var(--sans) !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}
.nav-sec:hover { background: rgba(255,255,255,.06) !important; color: #fff !important; }
.nav-sec:hover .nav-chevron { opacity: 1 !important; }

/* Layout interne du header */
.nav-sec-l {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  min-width: 0 !important;
}

/* Icône section — carré coloré arrondi */
.nav-sec-ic {
  width: 26px !important;
  height: 26px !important;
  border-radius: 7px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  transition: transform .15s !important;
}
.nav-sec:hover .nav-sec-ic { transform: scale(1.08) !important; }

/* Label section */
.nav-sec-label {
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: -.015em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Badge total sur section (alertes) */
.nav-sec-total {
  font-family: var(--mono) !important;
  font-size: 9.5px !important;
  font-weight: 700 !important;
  padding: 1px 6px !important;
  border-radius: 4px !important;
  letter-spacing: .02em !important;
  flex-shrink: 0 !important;
}

/* Chevron SVG animé */
.nav-chevron {
  color: rgba(255,255,255,.3) !important;
  opacity: .6 !important;
  transition: transform .22s ease, opacity .15s !important;
  flex-shrink: 0 !important;
}
.nav-sec.collapsed .nav-chevron { transform: rotate(-90deg) !important; }

/* ── Séparateur entre sections ── */
.nav-items-group + .nav-sec {
  margin-top: 2px !important;
}
.nav-items-group + .nav-sec::before {
  display: none !important;
}

/* ── Groupe d'items (zone dépliable) ── */
.nav-items-group {
  max-height: 600px !important;
  overflow: hidden !important;
  opacity: 1 !important;
  transition: max-height .28s cubic-bezier(.4,0,.2,1), opacity .2s !important;
  padding-bottom: 4px !important;
}
.nav-sec.collapsed + .nav-items-group {
  max-height: 0 !important;
  opacity: 0 !important;
  padding-bottom: 0 !important;
}

/* ── Nav items ── */
.nav-item {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 7px 10px 7px 14px !important;
  margin: 1px 6px 1px 8px !important;
  border-radius: 6px !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,.45) !important;
  letter-spacing: -.01em !important;
  transition: background .12s, color .12s !important;
  cursor: pointer !important;
  position: relative !important;
}
.nav-item:hover {
  color: rgba(255,255,255,.9) !important;
  background: rgba(255,255,255,.055) !important;
}

/* Ligne de connexion visuelle items → section */
.nav-item::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important; top: 50% !important;
  width: 2px !important; height: 0 !important;
  background: transparent !important;
  border-radius: 2px !important;
}
.nav-item.active::before {
  height: 60% !important;
  top: 20% !important;
  background: var(--orange) !important;
  left: -2px !important;
}

/* Icônes items */
.nav-item .ni {
  width: 15px !important; height: 15px !important;
  display: inline-flex !important;
  align-items: center !important; justify-content: center !important;
  flex-shrink: 0 !important;
  color: rgba(255,255,255,.28) !important;
  transition: color .12s !important;
}
.nav-item:hover .ni { color: rgba(255,255,255,.65) !important; }

/* État actif */
.nav-item.active {
  color: #fff !important;
  background: rgba(217,127,31,.14) !important;
  font-weight: 600 !important;
}
.nav-item.active .ni { color: var(--orange2) !important; }

/* Badges items */
.nav-badge {
  margin-left: auto !important;
  font-family: var(--mono) !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  padding: 1px 6px !important;
  border-radius: 3px !important;
  letter-spacing: .02em !important;
  border: none !important;
}
.nb-o { background: rgba(217,127,31,.2) !important; color: #f7b84a !important; }
.nb-r { background: rgba(239,68,68,.2) !important; color: #f87171 !important; }
.nb-n { background: rgba(255,255,255,.08) !important; color: rgba(255,255,255,.5) !important; }

/* Pied sidebar */
.sb-foot { padding: 10px !important; border-top: 1px solid rgba(255,255,255,.04) !important; margin-top: auto !important; }
.api-card { background: rgba(255,255,255,.02) !important; border: 1px solid rgba(255,255,255,.04) !important; border-radius: 7px !important; padding: 8px 11px !important; }
.api-lbl { font-size: 9px !important; color: rgba(255,255,255,.26) !important; }
.api-val { font-size: 9px !important; color: rgba(255,255,255,.42) !important; }
.api-row { margin-bottom: 2px !important; }
.api-row:last-child { margin-bottom: 0 !important; }

/* ████████████████████████████████████████████████████████
   ULTRA PRO MAX FINAL — v10,000,000
   ████████████████████████████████████████████████████████ */

/* ── CONTENT AREA: subtle dot grid background ── */
.content {
  background:
    radial-gradient(circle, rgba(15,31,69,.04) 1px, transparent 1px),
    linear-gradient(135deg, #edf1f9 0%, #e8eef8 50%, #edf1f9 100%) !important;
  background-size: 28px 28px, 100% 100% !important;
  background-attachment: local !important;
}

/* ── SHELL GRID — topbar height fix ── */
.shell { grid-template-rows: 56px 1fr !important; }

/* ── TOPBAR GLASSMORPHISM ── */
.topbar {
  background: linear-gradient(90deg,
    rgba(7,10,24,.98) 0%,
    rgba(10,16,35,.96) 35%,
    rgba(13,20,45,.97) 100%) !important;
  backdrop-filter: blur(20px) !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important;
  box-shadow:
    0 1px 0 rgba(232,151,43,.15),
    0 4px 24px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.03) !important;
}

/* ── LOGO BADGE ── */
.logo-badge {
  background: linear-gradient(135deg, #f4a430, #c87a1a) !important;
  box-shadow: 0 2px 12px rgba(232,151,43,.5), inset 0 1px 0 rgba(255,255,255,.3) !important;
  letter-spacing: -.04em !important;
}

/* ── TOPBAR SEARCH ── */
.tb-search {
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 10px !important;
  transition: all .18s !important;
}
.tb-search:hover {
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.15) !important;
  box-shadow: 0 0 0 3px rgba(232,151,43,.08) !important;
}

/* ── ICON BUTTONS IN TOPBAR ── */
.icon-btn {
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 9px !important;
  transition: all .15s !important;
}
.icon-btn:hover {
  background: rgba(255,255,255,.12) !important;
  border-color: rgba(232,151,43,.35) !important;
  color: #fff !important;
  box-shadow: 0 0 0 3px rgba(232,151,43,.1) !important;
}
.icon-btn .dot { background: var(--orange) !important; box-shadow: 0 0 0 2px rgba(7,10,24,.98) !important; }

/* ── USER CHIP ── */
.user-chip {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 99px !important;
  transition: all .15s !important;
}
.user-chip:hover {
  background: rgba(255,255,255,.1) !important;
  border-color: rgba(232,151,43,.4) !important;
}
.user-av {
  background: linear-gradient(135deg, var(--orange2), var(--orange-d)) !important;
  box-shadow: 0 2px 10px rgba(232,151,43,.45) !important;
}

/* ── SIDEBAR FINAL POLISH ── */
.sidebar {
  background: linear-gradient(180deg, #06101d 0%, #080f1e 60%, #070d1b 100%) !important;
}

/* Nav item hover state */
.nav-item:hover {
  background: rgba(255,255,255,.07) !important;
  color: rgba(255,255,255,.92) !important;
  transform: translateX(1px) !important;
}
.nav-item { transition: all .12s ease !important; }

/* Sidebar footer user card */
.sb-foot > div {
  border-radius: 9px !important;
  transition: background .15s !important;
}
.sb-foot > div:hover { background: rgba(255,255,255,.05) !important; }

/* ── PAGE HEADERS ── */
.page-title {
  font-size: 24px !important;
  font-weight: 900 !important;
  letter-spacing: -.07em !important;
  color: #0b1830 !important;
  line-height: 1.1 !important;
}
.page-sub {
  font-size: 13px !important;
  color: #6b82a8 !important;
  line-height: 1.55 !important;
  font-weight: 400 !important;
}

/* ── CARDS ── */
.card {
  border-radius: 14px !important;
  border: 1px solid rgba(15,31,69,.07) !important;
  box-shadow:
    0 1px 2px rgba(15,31,69,.04),
    0 4px 16px rgba(15,31,69,.06) !important;
  transition: box-shadow .2s, transform .2s !important;
  overflow: hidden !important;
}
.card:hover {
  box-shadow:
    0 2px 4px rgba(15,31,69,.06),
    0 8px 32px rgba(15,31,69,.1) !important;
}
.card-h {
  background: linear-gradient(135deg, #f9faff 0%, #ffffff 100%) !important;
  border-bottom: 1px solid rgba(15,31,69,.06) !important;
  padding: 13px 18px !important;
}

/* ── METRIC CARDS ── */
.metric {
  background: #fff !important;
  border-radius: 14px !important;
  border: 1px solid rgba(15,31,69,.07) !important;
  box-shadow: 0 1px 2px rgba(15,31,69,.04), 0 4px 16px rgba(15,31,69,.06) !important;
  transition: all .2s !important;
  cursor: default !important;
}
.metric:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 4px 12px rgba(15,31,69,.08), 0 16px 40px rgba(15,31,69,.12) !important;
  border-color: rgba(232,151,43,.2) !important;
}
.ms { height: 3px !important; border-radius: 0 !important; }
.m-val { font-size: 34px !important; font-weight: 900 !important; letter-spacing: -.07em !important; }
.m-lbl {
  font-size: 10.5px !important; font-weight: 700 !important; letter-spacing: .08em !important;
  text-transform: uppercase !important; color: #8298be !important;
  margin-bottom: 8px !important;
}
.m-ic {
  position: absolute !important; right: 14px !important; bottom: 14px !important;
  opacity: .07 !important; pointer-events: none !important;
}

/* ── TABLES ── */
thead th {
  background: linear-gradient(135deg, #f6f9ff, #f0f4fc) !important;
  font-size: 10px !important; letter-spacing: .12em !important; font-weight: 800 !important;
  color: #8298be !important; padding: 11px 16px !important;
  border-bottom: 1.5px solid rgba(15,31,69,.08) !important;
  text-align: left !important;
}
tbody td {
  padding: 13px 16px !important; font-size: 13px !important;
  border-bottom: 1px solid rgba(15,31,69,.05) !important;
  color: #2e4070 !important; vertical-align: middle !important;
}
tbody tr:hover { background: rgba(232,151,43,.04) !important; }
tbody tr:last-child td { border-bottom: none !important; }

/* ── BUTTONS — extra refinements ── */
.btn-pr {
  background: linear-gradient(135deg, #f5a934, #d07a1a) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.2) inset,
    0 3px 14px rgba(232,151,43,.38) !important;
}
.btn-pr:hover {
  box-shadow:
    0 1px 0 rgba(255,255,255,.25) inset,
    0 6px 22px rgba(232,151,43,.5) !important;
  transform: translateY(-1px) !important;
}
.btn-gh {
  background: rgba(255,255,255,.9) !important;
  border: 1.5px solid rgba(15,31,69,.12) !important;
  color: #3a5080 !important;
}
.btn-gh:hover {
  background: #fff !important;
  border-color: #3a5080 !important;
  box-shadow: 0 2px 12px rgba(15,31,69,.1) !important;
}

/* ── INPUTS ── */
.fI, .fS {
  background: #fff !important;
  border: 1.5px solid rgba(15,31,69,.12) !important;
  border-radius: 9px !important;
  font-size: 13.5px !important;
  color: #0b1830 !important;
  box-shadow: 0 1px 2px rgba(15,31,69,.04) !important;
  transition: all .16s !important;
}
.fI:focus, .fS:focus {
  border-color: #e8922b !important;
  box-shadow: 0 0 0 3px rgba(232,146,43,.12), 0 1px 2px rgba(15,31,69,.04) !important;
  outline: none !important;
}

/* ── MODALS ── */
.mo { backdrop-filter: blur(12px) saturate(1.5) !important; }
.mb {
  border-radius: 18px !important;
  box-shadow: 0 8px 32px rgba(7,16,30,.16), 0 32px 80px rgba(7,16,30,.22) !important;
  border: 1px solid rgba(15,31,69,.08) !important;
}
.mh {
  background: linear-gradient(135deg, #f9faff, #fff) !important;
  border-radius: 18px 18px 0 0 !important;
}
.m-ft {
  background: #f8faff !important;
  border-radius: 0 0 18px 18px !important;
  border-top: 1px solid rgba(15,31,69,.07) !important;
}

/* ── TOAST ── */
.ts, .toast {
  border-radius: 12px !important;
  box-shadow: 0 4px 12px rgba(7,16,30,.1), 0 16px 40px rgba(7,16,30,.16) !important;
  backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(15,31,69,.08) !important;
}

/* ── BADGES FINAL ── */
.bdg::before { width: 4px !important; height: 4px !important; }
.b-ap  { background: #f0fdf8 !important; color: #065f46 !important; border-color: #a7f3d0 !important; }
.b-rj  { background: #fff5f5 !important; color: #9b1c3a !important; border-color: #fecaca !important; }
.b-op  { background: #fffbf0 !important; color: #92590b !important; border-color: #fed7aa !important; }
.b-sb  { background: #eff6ff !important; color: #1d4ed8 !important; border-color: #bfdbfe !important; }
.b-dr  { background: #f8f9fd !important; color: #4b6080 !important; border-color: rgba(15,31,69,.12) !important; }

/* ── SECTION HEADERS ── */
.section-h-t { color: #9aaccb !important; letter-spacing: .14em !important; }
.section-h-line { background: rgba(15,31,69,.07) !important; }

/* ── PAGE LOAD ANIMATION ── */
.page > * { animation: fadeUp .22s cubic-bezier(.4,0,.2,1) both; }
.page > *:nth-child(1) { animation-delay: .00s }
.page > *:nth-child(2) { animation-delay: .03s }
.page > *:nth-child(3) { animation-delay: .06s }
.page > *:nth-child(4) { animation-delay: .09s }
.page > *:nth-child(5) { animation-delay: .12s }
.page > *:nth-child(n+6) { animation-delay: .15s }

/* ── BREADCRUMB ── */
.brc { gap: 5px !important; margin-bottom: 12px !important; }
.bcl { font-size: 12px !important; color: #8298be !important; font-weight: 500 !important; }
.bcl:hover { color: #e8922b !important; }
.bcs { color: #c0cfe6 !important; }
.bcc, .bca { font-size: 12px !important; font-weight: 700 !important; color: #0b1830 !important; }

/* ── ALERTS ── */
.alt {
  border-radius: 10px !important;
  font-size: 12.5px !important; line-height: 1.6 !important;
  font-weight: 500 !important;
}
.a-i { background: #f0f7ff !important; border-color: #bfdbfe !important; color: #1e40af !important; }
.a-w { background: #fffbf0 !important; border-color: #fed7aa !important; color: #92590b !important; }
.a-d { background: #fff5f5 !important; border-color: #fecaca !important; color: #9b1c3a !important; }
.a-s { background: #f0fdf8 !important; border-color: #a7f3d0 !important; color: #065f46 !important; }

/* ── TABS ── */
.ws-tab.active {
  color: #0b1830 !important;
  border-bottom-color: #e8922b !important;
  font-weight: 700 !important;
}
.ws-tab:hover { background: rgba(15,31,69,.04) !important; color: #0b1830 !important; }

/* ── SCROLLBARS ── */
* { scrollbar-width: thin !important; scrollbar-color: rgba(15,31,69,.15) transparent !important; }
::-webkit-scrollbar { width: 5px !important; height: 5px !important; }
::-webkit-scrollbar-thumb { background: rgba(15,31,69,.14) !important; border-radius: 99px !important; }
::-webkit-scrollbar-thumb:hover { background: rgba(15,31,69,.25) !important; }

/* ── ST-SECTION (settings) ── */
.st-card {
  border-radius: 12px !important;
  border: 1px solid rgba(15,31,69,.07) !important;
  box-shadow: 0 1px 2px rgba(15,31,69,.04) !important;
}
.st-row { padding: 13px 18px !important; }
.st-sec-title { font-size: 14px !important; font-weight: 800 !important; letter-spacing: -.03em !important; }

/* ── SELECTION ── */
::selection { background: rgba(232,151,43,.18) !important; color: #0b1830 !important; }


/* ===== Bloc suivant ===== */


    .reg-section{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:20px 22px;margin-bottom:16px}
    .reg-section-title{font-size:11.5px;font-weight:700;color:#1e40af;letter-spacing:.04em;text-transform:uppercase;margin-bottom:14px;display:flex;align-items:center;gap:6px}
    .reg-fg{margin-bottom:14px}
    .reg-fg:last-child{margin-bottom:0}
    .reg-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:0}
    .reg-lbl{display:block;font-size:11.5px;font-weight:600;color:#374151;margin-bottom:5px}
    .reg-input{width:100%;border:1.5px solid #e2e8f0;border-radius:8px;padding:9px 13px;font-size:13px;font-family:var(--sans);background:#f8faff;color:#0f172a;outline:none;transition:border .15s;box-sizing:border-box}
    .reg-input:focus{border-color:#3b82f6;background:#fff;box-shadow:0 0 0 3px rgba(59,130,246,.12)}
    .req{color:#ef4444}
    @media(max-width:640px){
      #auth-register > div{grid-template-columns:1fr!important}
      #auth-register > div > div:first-child{display:none}
      .reg-grid2{grid-template-columns:1fr!important}
    }
  

/* ===== Bloc suivant ===== */


/* ═══════════════════════════════════════════════════════════
   MLOG v12 — Style HIKMA · Sidebar flat + resize handle
   ═══════════════════════════════════════════════════════════ */

/* ── SHELL ── */
.shell {
  display: grid;
  grid-template-columns: var(--sb-w, 252px) 1fr;
  grid-template-rows: 0px 1fr;   /* topbar intégré dans sidebar */
  height: 100vh;
}
/* masquer la topbar originale, on met tout dans la sidebar */
.topbar { display: none !important; }
.content { grid-column: 2; grid-row: 1 / -1; overflow-y: auto; }

/* ── SIDEBAR ── */
.sidebar {
  grid-column: 1;
  grid-row: 1 / -1;
  background: #0d1424;
  border-right: 1px solid rgba(255,255,255,.07);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  width: var(--sb-w, 252px);
  min-width: 200px;
  max-width: 400px;
}
#sb-nav {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 4px 0 8px;
}
#sb-nav::-webkit-scrollbar { width: 3px; }
#sb-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.08); border-radius: 99px; }

/* ── LOGO ── */
.sb-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 20px 18px 14px;
  flex-shrink: 0;
}
.sb-logo-mark {
  width: 36px; height: 36px;
  background: var(--orange);
  border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 900; color: #fff;
  letter-spacing: -.04em;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(232,151,43,.35);
}
.sb-logo-name {
  font-size: 15px; font-weight: 800;
  color: #fff; letter-spacing: -.04em;
  line-height: 1.2;
}
.sb-logo-name span { color: var(--orange2); }
.sb-logo-sub {
  font-size: 9.5px; color: rgba(255,255,255,.35);
  letter-spacing: .04em; margin-top: 1px;
}

/* ── CARTE UTILISATEUR (style HIKMA) ── */
.sb-user-card {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 10px 12px;
  padding: 10px 12px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px;
  flex-shrink: 0;
}
.sb-user-av {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--orange2), var(--orange-d));
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800; color: #fff;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(232,151,43,.3);
}
.sb-user-info { flex: 1; min-width: 0; }
.sb-user-name {
  font-size: 13px; font-weight: 700;
  color: rgba(255,255,255,.9);
  letter-spacing: -.02em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sb-user-role {
  font-size: 10px; color: rgba(255,255,255,.35);
  font-family: var(--mono); margin-top: 1px;
}
.sb-logout-btn {
  background: none; border: none; cursor: pointer;
  color: rgba(255,255,255,.22); padding: 5px;
  border-radius: 6px; transition: all .15s;
  flex-shrink: 0; display: flex; align-items: center;
}
.sb-logout-btn:hover { color: rgba(255,255,255,.65); background: rgba(255,255,255,.06); }

/* ── SÉPARATEUR ── */
.sb-divider {
  height: 1px;
  background: rgba(255,255,255,.06);
  margin: 6px 14px;
}

/* ── LABEL DE SECTION (style HIKMA) ── */
.sb-section-label {
  font-family: var(--sans);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.28);
  padding: 10px 18px 4px;
  white-space: nowrap;
}

/* ── ITEM (style HIKMA) ── */
.sb-item {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 8px 14px 8px 18px;
  margin: 1px 8px;
  border-radius: 8px;
  cursor: pointer;
  color: rgba(255,255,255,.58);
  font-size: 13px;
  font-weight: 400;
  transition: background .1s, color .1s;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
  user-select: none;
  position: relative;
}
.sb-item:hover {
  color: rgba(255,255,255,.88);
  background: rgba(255,255,255,.05);
}
.sb-item.active {
  color: var(--orange2) !important;
  background: rgba(232,151,43,.08) !important;
  font-weight: 600;
}
.sb-item.active .sb-icon {
  stroke: var(--orange2) !important;
}

/* ── ICÔNE (outline, simple) ── */
.sb-icon {
  width: 16px; height: 16px;
  flex-shrink: 0;
  stroke: rgba(255,255,255,.38);
  stroke-width: 1.8px;
  fill: none;
  transition: stroke .1s;
}
.sb-item:hover .sb-icon { stroke: rgba(255,255,255,.75); }

/* ── BADGE ── */
.sb-badge {
  margin-left: auto;
  min-width: 18px; height: 18px;
  background: var(--orange);
  color: #fff;
  font-size: 9.5px; font-weight: 800;
  font-family: var(--mono);
  border-radius: 99px;
  display: none;
  align-items: center; justify-content: center;
  padding: 0 5px;
  flex-shrink: 0;
}
.sb-badge.visible { display: flex; }

/* ── POIGNÉE RESIZE ── */
.sb-resize-handle {
  position: absolute;
  top: 0; right: 0;
  width: 4px; height: 100%;
  cursor: col-resize;
  z-index: 60;
  background: transparent;
  transition: background .15s;
}
.sb-resize-handle::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 3px; height: 44px;
  background: rgba(232,151,43,.25);
  border-radius: 99px;
  transition: height .2s, background .15s;
}
.sb-resize-handle:hover { background: rgba(232,151,43,.05); }
.sb-resize-handle:hover::after { height: 68px; background: rgba(232,151,43,.7); }
.sb-resize-handle.is-dragging { background: rgba(232,151,43,.08); }
.sb-resize-handle.is-dragging::after {
  height: 90px;
  background: var(--orange);
  box-shadow: 0 0 10px rgba(232,151,43,.5);
}
body.sb-resizing { user-select: none !important; cursor: col-resize !important; }
body.sb-resizing * { pointer-events: none; }
body.sb-resizing .sb-resize-handle { pointer-events: all; }

/* masquer les anciens éléments nav */
.nav-sec, .nav-items-group, .nav-item,
.sb-menu-label, .sb-sep { display: none !important; }


/* ===== Bloc suivant ===== */


/* ── ENTRY HERO v12 — Typographie propre ── */
.entry-hero-title {
  font-size: clamp(28px, 4vw, 46px) !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  letter-spacing: -.04em !important;
  color: #fff !important;
  margin-bottom: 12px !important;
}
.entry-hero-title em {
  color: var(--orange2) !important;
  font-style: italic !important;
}
.entry-hero-sub {
  font-size: 13.5px !important;
  color: rgba(255,255,255,.5) !important;
  line-height: 1.7 !important;
  font-weight: 400 !important;
  margin-bottom: 0 !important;
}