:root{
  --navy:#223167; --gold:#FCC60E;
  --g50:#F8FAFC;--g100:#F1F5F9;--g200:#E2E8F0;--g300:#CBD5E1;--g400:#94A3B8;
  --g500:#64748B;--g600:#475569;--g700:#334155;--g800:#1E293B;--g900:#0F172A;
  --ok:#16A34A;--danger:#DC2626;--warn:#D97706;--info:#2563EB;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  color:var(--g800);background:var(--g50);font-size:13px}
a{color:var(--navy);text-decoration:none}
.topbar{background:var(--navy);color:#fff;display:flex;align-items:center;
  padding:0 18px;height:88px;gap:16px}
.topbar .logochip{background:#fff;border-radius:9px;padding:7px 11px;display:flex;align-items:center}
.topbar .brandlogo{height:54px;width:auto;display:block}
.topbar .brand{font-weight:700;font-size:18px;letter-spacing:-.4px}
.topbar .brand small{color:var(--gold);font-size:10px;font-weight:600;letter-spacing:.5px;margin-left:6px}
.topbar nav{display:flex;gap:4px;margin-left:12px}
.topbar nav a{color:#dbe1f0;padding:8px 12px;border-radius:6px;font-weight:500}
.topbar nav a:hover{background:#2c3d78;color:#fff}
.topbar nav a.active{background:#2c3d78;color:#fff}
.topbar .right{margin-left:auto;display:flex;align-items:center;gap:14px;color:#dbe1f0;font-size:12px}
.goldstripe{height:4px;background:var(--gold)}
.wrap{padding:18px 22px}
.pagehead{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.pagehead h1{font-size:20px;color:var(--navy);margin:0}
.btn{background:var(--navy);color:#fff;border:0;border-radius:6px;padding:8px 14px;
  font-weight:600;cursor:pointer;font-size:13px}
.btn.sec{background:#fff;color:var(--navy);border:1px solid var(--navy)}
.card{background:#fff;border:1px solid var(--g200);border-radius:8px}
table.grid{width:100%;border-collapse:collapse;background:#fff;font-size:12px}
table.grid th{background:var(--navy);color:#fff;text-align:left;padding:8px 9px;font-weight:600;
  position:sticky;top:0;font-size:11px}
table.grid td{padding:7px 9px;border-bottom:1px solid var(--g100)}
table.grid tr:hover td{background:var(--g50)}
.chk{color:var(--ok);font-weight:700}
.xx{color:var(--danger);font-weight:700}
.badge{display:inline-block;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:600}
.badge.gold{background:#fef3c7;color:#92600e}
.badge.blk{background:#fee2e2;color:#991b1b}
.badge.watch{background:#ffedd5;color:#9a3412}
.tier{font-weight:600;color:var(--g600)}
.muted{color:var(--g500)}
.center{text-align:center}
/* login */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,var(--navy),#16224a)}
.login-card{background:#fff;border-radius:12px;padding:34px 30px;width:360px;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.login-card .brand{color:var(--navy);font-weight:700;font-size:26px;text-align:center}
.login-card .brand small{display:block;color:var(--g500);font-size:11px;letter-spacing:2px;margin-top:2px}
.login-card .stripe{height:4px;width:60px;background:var(--gold);margin:12px auto 22px;border-radius:2px}
.login-card label{display:block;font-size:12px;font-weight:600;color:var(--g600);margin:12px 0 4px}
.login-card input{width:100%;padding:10px 12px;border:1px solid var(--g300);border-radius:7px;font-size:14px}
.login-card .btn{width:100%;margin-top:20px;padding:11px}
.err{background:#fee2e2;color:#991b1b;padding:8px 12px;border-radius:6px;font-size:12px;margin-bottom:8px}

/* search + forms + detail (customer screens) */
.searchbar{position:relative;max-width:420px;margin-bottom:12px}
.searchbar input{width:100%;padding:9px 12px 9px 34px;border:1px solid var(--g300);border-radius:8px;font-size:14px}
.searchbar .ic{position:absolute;left:11px;top:10px;color:var(--g500)}
.nm{color:var(--navy);font-weight:600}
.tierchip{font-size:11px;font-weight:600;padding:2px 9px;border-radius:20px}
.tG{background:#fef3c7;color:#92600e}.tS{background:#e2e8f0;color:#475569}.tB{background:#f5e9df;color:#7c4a1e}
.badge.vip{background:#fef3c7;color:#92600e}
.formcard{border-radius:10px;margin-bottom:14px;overflow:hidden}
.sechead{background:var(--navy);color:#fff;font-weight:600;font-size:13px;padding:9px 14px;display:flex;justify-content:space-between;align-items:center}
.sechead .headnote{color:#cbd5e1;font-size:11px;font-weight:500}
.secbody{padding:14px 16px}
.secbody label,.klabel{display:block;font-size:11px;color:var(--g600);font-weight:600;margin:0 0 3px}
label .req{color:var(--danger)}
.field{margin-bottom:10px}
.secbody input,.secbody select,.secbody textarea{width:100%;padding:7px 9px;border:1px solid var(--g300);border-radius:6px;font-size:13px;font-family:inherit;background:#fff}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:10px 26px}
.chkline{display:flex;align-items:center;gap:8px;padding-top:4px;font-size:13px;color:var(--g800)}
.chkline input{width:auto!important}
.foot{display:flex;gap:8px;justify-content:center;margin:6px 0 24px}
.chead{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.chead h1{font-size:22px;color:var(--navy);margin:0}
.grid2{display:grid;grid-template-columns:1.3fr 1fr;gap:14px;align-items:start}
.kv{display:grid;grid-template-columns:120px 1fr;gap:6px 12px;font-size:13px}
.kv .k{color:var(--g500);font-weight:600}
table.g{width:100%;border-collapse:collapse;font-size:12px}
table.g th{background:var(--g100);color:var(--g600);text-align:left;padding:7px 9px;font-weight:600;font-size:11px}
table.g td{padding:7px 9px;border-bottom:1px solid var(--g100)}
table.g .num{text-align:right;font-variant-numeric:tabular-nums}
.tierbox{background:#fef9ec;border:1px solid #fde68a;border-radius:8px;padding:10px 12px;margin-bottom:10px;font-size:12px;color:#92600e}
.stat{font-size:10px;font-weight:600;padding:2px 8px;border-radius:20px;background:var(--g100);color:var(--g600)}
.stat.shipped,.stat.manifested{background:#e1f5ee;color:#0f6e56}
.stat.sli-saved{background:#e6f1fb;color:#0c447c}
.stat.in-warehouse{background:#ede9fe;color:#5b21b6}
.stat.priced,.stat.open{background:#faeeda;color:#854f0b}
.warnbanner{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5;border-radius:8px;padding:8px 12px;font-size:12px;font-weight:600;margin-bottom:12px}
.watchbanner{background:#ffedd5;color:#9a3412;border:1px solid #fdba74;border-radius:8px;padding:8px 12px;font-size:12px;font-weight:600;margin-bottom:12px}

/* offer form + pricing panel */
.subhead{color:var(--g500);font-size:13px;font-weight:500;margin-left:8px}
.cols4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px 18px}
.inlab{display:inline-flex;align-items:center;gap:5px;margin-right:14px;font-weight:400!important;font-size:13px!important;color:var(--g800)!important}
.itemsblock{border-top:1px solid var(--g200);margin-top:8px;padding-top:12px}
table.items{width:100%;border-collapse:collapse;font-size:12px;margin-top:4px}
table.items th{background:var(--g100);color:var(--g600);text-align:left;padding:7px 9px;font-weight:600;font-size:11px}
table.items td{padding:5px 7px;border-bottom:1px solid var(--g100)}
table.items .num{text-align:right;font-variant-numeric:tabular-nums}
table.items .act a{color:var(--danger);font-weight:600}
.addbar{display:flex;align-items:center;gap:16px;margin-top:10px}
.totvol{margin-left:auto;color:var(--g600);font-size:13px}
.btn.gold{background:var(--gold);color:var(--navy)}
.pricegrid{display:grid;grid-template-columns:1fr 1fr;gap:10px 40px;align-items:start}
.pricerow{display:grid;grid-template-columns:170px 1fr;gap:10px;align-items:center;margin-bottom:7px}
.pricerow label{margin:0;font-size:12px}
.pricerow label.eur{color:#7c5e10}
.pricerow .cur{display:flex;align-items:center;gap:6px;color:var(--g500);font-size:13px}
.pricerow .cur input{max-width:140px;text-align:right;font-variant-numeric:tabular-nums}
.totline{display:flex;justify-content:space-between;padding:6px 2px;font-size:13px;border-top:1px solid var(--g200)}
.totline.grand{font-weight:700;color:var(--navy);font-size:15px}
.totline .eur{color:#7c5e10}
.rate{font-size:12px;padding:4px 0;border-bottom:1px dashed var(--g200)}
.rate .ni{color:var(--g500)}
.rate.eur{color:#7c5e10}
.pillrow{display:flex;gap:8px;margin:14px 0 24px}

/* warehouse board */
.chips{display:flex;gap:12px;margin-bottom:14px}
.chip{background:#fff;border:1px solid var(--g200);border-radius:10px;padding:10px 16px;min-width:150px}
.chip .n{font-size:22px;font-weight:700;font-variant-numeric:tabular-nums}
.chip .l{font-size:11px;color:var(--g500);font-weight:600}
.chip.ny .n{color:var(--ok)} .chip.transit .n{color:var(--warn)} .chip.ma .n{color:var(--g600)}
.whlayout{display:grid;grid-template-columns:1.6fr .9fr;gap:14px;align-items:start}
.badge.bny{background:#e1f5ee;color:#0f6e56}
.badge.btr{background:#ffedd5;color:#9a3412}
.badge.bma{background:#e2e8f0;color:#475569}
.okbanner{background:#e1f5ee;color:#0f6e56;border:1px solid #86efac;border-radius:8px;padding:8px 12px;font-size:12px;font-weight:600;margin-bottom:8px}
.stepnum{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--gold);color:var(--navy);font-weight:700;font-size:12px;margin-right:8px}
@media print{.topbar,.goldstripe,.noprint,.pagehead .btn,form.noprint{display:none!important}body{background:#fff}}
.ac{position:absolute;z-index:30;background:#fff;border:1px solid var(--g300);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.12);width:100%;max-height:260px;overflow:auto;display:none}
.ac div{padding:8px 12px;cursor:pointer;font-size:13px}
.ac div:hover{background:var(--g50)}

/* QC round 6: save-at-bottom, workspace jump nav, type-ahead contact line */
.formfoot{display:flex;justify-content:center;gap:8px;margin:4px 0 6px;padding-top:10px;border-top:1px solid var(--g200)}
.jumpnav{font-size:12.5px;color:var(--g500);align-self:center}
.jumpnav a{color:var(--navy);font-weight:600;text-decoration:none}
.jumpnav a:hover{text-decoration:underline}
.ac div .sub{display:block;font-size:11px;color:var(--g500);margin-top:1px}

/* QC round 7: collapsible workspace sections + repacking module */
.secfold{margin:14px 0}
.secfold>summary{cursor:pointer;list-style:none;background:var(--navy);color:#fff;
  padding:9px 14px;border-radius:8px;font-weight:600;font-size:13.5px;
  display:flex;align-items:center;gap:10px;user-select:none}
.secfold>summary::-webkit-details-marker{display:none}
.secfold>summary::before{content:"▸";color:var(--gold);font-size:12px;transition:transform .15s}
.secfold[open]>summary{border-radius:8px 8px 0 0}
.secfold[open]>summary::before{transform:rotate(90deg)}
.secfold>summary .foldhint{font-weight:400;font-size:11.5px;color:#c7cde4;margin-left:auto}
.secfold[open]>summary .foldhint{color:var(--gold)}
.secfold>form>.card,.secfold>.card{border-top-left-radius:0;border-top-right-radius:0;margin-top:0}
.secttl{font-weight:700;color:var(--navy);font-size:13px;margin-bottom:6px}
.chipbtn{background:var(--g100);border:1px solid var(--g300);border-radius:14px;
  padding:3px 10px;font-size:11.5px;color:var(--navy);cursor:pointer}
.chipbtn:hover{background:var(--gold);border-color:var(--gold)}
.linkbtn{background:none;border:0;padding:0;color:var(--danger);cursor:pointer;font-size:12.5px;text-decoration:underline}
.chips{flex-wrap:wrap;row-gap:6px}

/* QC round 9: HRM-style hover dropdowns on the top nav */
.topbar nav{align-items:center}
.topbar nav .navdrop{position:relative;display:flex;align-items:center}
.topbar nav .navdrop>a.hasmenu::after{content:" \25BE";font-size:9px;opacity:.7}
.navdrop .dropmenu{display:none;position:absolute;left:0;top:100%;background:var(--navy);
  min-width:185px;z-index:60;border-radius:0 0 8px 8px;box-shadow:0 10px 24px rgba(0,0,0,.25);
  padding:4px 0;border-top:2px solid var(--gold)}
.navdrop:hover .dropmenu{display:block}
.navdrop .dropmenu a{display:block;padding:8px 14px;border-radius:0;color:#dbe1f0;font-weight:500}
.navdrop .dropmenu a:hover{background:#2c3d78;color:var(--gold)}