:root{
  --bg:#f3f5f8; --panel:#ffffff; --ink:#1b2430; --muted:#5f6b7a; --line:#e2e7ee;
  --brand:#0b5fa5; --brand-ink:#ffffff; --brand-soft:#e6f0fa;
  --side:#0f2a44; --side-ink:#c9d6e3; --side-active:#1d4a73;
  --good:#1a7f4b; --good-soft:#e3f4ea; --warn:#a86400; --warn-soft:#fdf1dc;
  --bad:#c0352b; --bad-soft:#fbe6e4; --input:#fffbea;
  --radius:10px; --shadow:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.08);
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#0f141a; --panel:#18202a; --ink:#e6ebf1; --muted:#9aa7b6; --line:#2a3542;
    --brand:#4c9be0; --brand-ink:#0b1520; --brand-soft:#16304a;
    --side:#0b1118; --side-ink:#aab8c7; --side-active:#1c3550;
    --good:#4cc38a; --good-soft:#123323; --warn:#e6a23c; --warn-soft:#3a2a10;
    --bad:#f07167; --bad-soft:#3b1a17; --input:#232c37;
  }
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
a{color:var(--brand)}
button,input,select,textarea{font:inherit;color:inherit}
.hidden{display:none!important}
.boot{padding:40px;text-align:center;color:var(--muted)}

/* layout */
.layout{display:grid;grid-template-columns:230px 1fr;min-height:100vh}
.side{background:var(--side);color:var(--side-ink);padding:14px 10px;position:sticky;top:0;height:100vh;overflow:auto}
.side .logo{color:#fff;font-weight:700;font-size:15px;padding:6px 10px 2px}
.side .sub{font-size:12px;padding:0 10px 14px;opacity:.75}
.side h4{font-size:11px;letter-spacing:.06em;text-transform:uppercase;opacity:.6;margin:16px 10px 6px}
.side a{display:block;color:var(--side-ink);text-decoration:none;padding:7px 10px;border-radius:7px;margin:1px 0}
.side a:hover{background:rgba(255,255,255,.06)}
.side a.active{background:var(--side-active);color:#fff}
.main{min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;align-items:center;gap:10px;padding:10px 18px;background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.topbar h1{font-size:17px;margin:0;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar .who{color:var(--muted);font-size:13px}
.menu-btn{display:none}
.content{padding:18px;max-width:1500px;width:100%}

@media (max-width:900px){
  .layout{grid-template-columns:1fr}
  .side{position:fixed;z-index:20;left:0;top:0;width:250px;transform:translateX(-100%);transition:transform .2s}
  .side.open{transform:none;box-shadow:0 0 40px rgba(0,0,0,.4)}
  .menu-btn{display:inline-flex}
  .content{padding:12px}
  .topbar .who{display:none}
}

/* controls */
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--panel);padding:7px 12px;border-radius:8px;cursor:pointer;white-space:nowrap}
.btn:hover{border-color:var(--brand)}
.btn.primary{background:var(--brand);color:var(--brand-ink);border-color:var(--brand)}
.btn.danger{color:var(--bad);border-color:var(--bad)}
.btn.small{padding:4px 9px;font-size:12.5px}
.icon-btn{border:0;background:transparent;cursor:pointer;font-size:18px;padding:4px 8px;color:var(--muted)}
input[type=text],input[type=number],input[type=date],input[type=password],input[type=search],input[type=email],input[type=tel],select,textarea{
  width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:7px;background:var(--panel)}
.form-grid input,.form-grid select,.form-grid textarea{background:var(--input)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--brand);outline-offset:-1px}
label{font-size:12.5px;color:var(--muted);display:block;margin-bottom:3px}

.filters{display:flex;flex-wrap:wrap;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px;margin-bottom:14px;box-shadow:var(--shadow)}
.filters .f{min-width:150px;flex:1 1 150px;max-width:240px}
.filters .f select{background:var(--input)}
.period{font-size:12.5px;color:var(--muted);margin:-6px 0 12px}

/* cards */
.kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:14px}
@media (max-width:1200px){.kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:11px 13px;box-shadow:var(--shadow);min-width:0}
.kpi .t{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.kpi .v{font-size:20px;font-weight:700;margin-top:3px;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi .s{font-size:12px;color:var(--muted)}
.kpi.good .v{color:var(--good)} .kpi.bad .v{color:var(--bad)} .kpi.warn .v{color:var(--warn)}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:14px}
@media (max-width:1100px){.grid3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:800px){.grid2,.grid3{grid-template-columns:1fr}}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:13px 14px;box-shadow:var(--shadow);min-width:0;margin-bottom:14px}
.grid2 .card,.grid3 .card{margin-bottom:0}
.card h3{font-size:14px;margin:0 0 10px}
.card .hint{font-size:12px;color:var(--muted);margin:-6px 0 10px}
.chart-box{position:relative;height:280px}

/* tables */
.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.toolbar .grow{flex:1}
.toolbar input[type=search]{max-width:280px}
.tbl-wrap{overflow:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);max-height:70vh}
table{border-collapse:collapse;width:100%;font-size:13px}
th,td{padding:7px 9px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
th{position:sticky;top:0;background:var(--brand-soft);font-weight:600;z-index:1;cursor:pointer;user-select:none}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
tr:hover td{background:rgba(11,95,165,.04)}
tr.total td{font-weight:700;background:var(--brand-soft)}
td.calc{color:var(--muted)}
.wrap{white-space:normal;min-width:220px}
.pill{display:inline-block;padding:1px 8px;border-radius:20px;font-size:12px;font-weight:600}
.pill.good{background:var(--good-soft);color:var(--good)}
.pill.bad{background:var(--bad-soft);color:var(--bad)}
.pill.warn{background:var(--warn-soft);color:var(--warn)}
.pill.muted{background:var(--line);color:var(--muted)}
.neg{color:var(--bad)}
.pager{display:flex;gap:8px;align-items:center;justify-content:flex-end;margin-top:8px;color:var(--muted);font-size:13px}

/* modal */
.modal{position:fixed;inset:0;background:rgba(10,15,25,.55);display:flex;align-items:flex-start;justify-content:center;z-index:50;padding:30px 12px;overflow:auto}
.modal-box{background:var(--panel);border-radius:12px;width:100%;max-width:860px;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line)}
.modal-head h3{margin:0;font-size:16px}
.modal-body{padding:16px}
.modal-foot{padding:12px 16px;border-top:1px solid var(--line);display:flex;gap:8px;justify-content:flex-end}
.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.form-grid .full{grid-column:1/-1}
@media (max-width:700px){.form-grid{grid-template-columns:1fr}}
.calc-box{background:var(--brand-soft);border-radius:8px;padding:9px 11px;font-size:13px;margin-top:12px;display:flex;flex-wrap:wrap;gap:6px 18px}
.calc-box b{font-variant-numeric:tabular-nums}
.warnbox{background:var(--warn-soft);color:var(--warn);border-radius:8px;padding:8px 11px;margin-top:10px;font-size:13px}

/* login */
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}
.login .box{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:26px;width:100%;max-width:400px;box-shadow:var(--shadow)}
.login h2{margin:0 0 4px}
.login p{color:var(--muted);margin:0 0 18px}
.login .row{margin-bottom:12px}
.err{color:var(--bad);font-size:13px;min-height:18px;margin-bottom:6px}

.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:#1b2430;color:#fff;padding:10px 16px;border-radius:8px;z-index:60;box-shadow:var(--shadow);max-width:90vw}
.toast.bad{background:var(--bad)}

@media print{
  .side,.topbar,.toolbar,.filters .f select{display:none!important}
  .layout{display:block}
  .tbl-wrap{max-height:none;overflow:visible;border:0}
  th{position:static}
  body{background:#fff;color:#000}
}

.side a.locked{opacity:.55}
.side a.locked span{font-size:11px}
.plan-bar{padding:8px 18px;font-size:13px;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.plan-bar.warn{background:var(--warn-soft);color:var(--warn)}
.plan-bar.bad{background:var(--bad-soft);color:var(--bad)}
.plan-bar.info{background:var(--brand-soft);color:var(--ink)}
.plan-bar a{color:inherit;font-weight:600}
#ctx-box select{max-width:230px;padding:5px 8px;font-size:13px;background:var(--input)}
.plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.plan-card{border:1.5px solid var(--line);border-radius:10px;padding:14px;background:var(--panel);display:flex;flex-direction:column;gap:6px;cursor:pointer}
.plan-card.sel{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.plan-card .pc-price{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums}
.plan-card .pc-cur{font-size:12px;color:var(--muted)}
.plan-card .pc-off{font-size:12.5px;color:var(--warn);font-weight:600}
.pages-pick{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:4px 14px;margin-top:6px}
.pages-pick h5{grid-column:1/-1;margin:10px 0 2px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.pages-pick label{display:flex;gap:6px;align-items:center;color:var(--ink);margin:0;font-size:13px}
.pages-pick input{width:auto}
.stat-row{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px}
.stat-row .kpi{flex:1 1 160px}

.drillable{cursor:pointer}
td.drillable:hover{background:var(--brand-soft)!important;text-decoration:underline;text-decoration-color:var(--brand);text-underline-offset:3px}
.kpi.drillable:hover,.kpi.drillable:focus-visible{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
tr.drillable:hover td{background:var(--brand-soft)}
.drill-hint{color:var(--brand);font-weight:600}
.drill-set{margin-bottom:16px}
.drill-set h4{margin:0 0 8px;font-size:14px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}

.appr-panel{margin-top:14px;border:1.5px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--bg)}
.appr-head{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.appr-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.appr-steps>div{border-top:3px solid var(--line);padding-top:8px;font-size:13px;min-width:0}
.appr-steps>div.done{border-top-color:var(--good)}
.appr-steps>div>span:first-child{display:block;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.appr-steps em{display:block;font-size:12px;color:var(--muted);margin-top:3px}
@media (max-width:640px){.appr-steps{grid-template-columns:1fr}}
.seg{display:flex;gap:6px;flex-wrap:wrap}
#print-area{display:none}
@media print{
  body.printing-doc > *:not(#print-area){display:none!important}
  body.printing-doc #print-area{display:block!important}
}
.pt{font:13px/1.45 Arial,sans-serif;color:#000;padding:10mm}
.pt-top{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:2px solid #000;padding-bottom:8px;margin-bottom:12px}
.pt-co{font-size:18px;font-weight:700}
.pt-doc{font-size:15px;text-transform:uppercase;letter-spacing:.06em;margin-top:2px}
.pt-st{text-align:right;font-size:12px}
.pt-tbl{width:100%;border-collapse:collapse}
.pt-tbl th,.pt-tbl td{border:1px solid #888;padding:6px 8px;text-align:left;vertical-align:top;white-space:normal;position:static;background:none;color:#000}
.pt-tbl th{width:32%;font-weight:600;background:#f1f1f1}
.pt-in{width:100%;border-collapse:collapse}.pt-in th,.pt-in td{border:1px solid #bbb;padding:3px 5px;font-size:12px}
.pt-sigs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px}
.pt-sig{border:1px solid #888;padding:8px;min-height:120px;display:flex;flex-direction:column;gap:4px}
.pt-sig-t{font-weight:700;text-transform:uppercase;font-size:12px;letter-spacing:.05em}
.pt-line{margin-top:auto;border-top:1px solid #000;padding-top:3px;font-size:11px;color:#444}
.pt-rej{margin-top:14px;font-weight:700}
.pn{font-weight:600}
.ppos{display:inline-block;font-size:11.5px;color:var(--accent,#1f5f8b);font-weight:600;letter-spacing:.01em}
.waitfor{font-size:12px;color:var(--muted)}
.waitfor b{color:var(--ink);font-weight:600}
.ap-stages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px}
.ap-stage{border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;cursor:pointer;background:var(--card,#fff)}
.ap-stage:hover{border-color:var(--ink)}
.ap-stage .t{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.ap-stage .v{font-size:22px;font-weight:700;margin:2px 0}
.ap-stage .s{font-size:12px;color:var(--muted)}
.ap-stage.warn{border-top:4px solid var(--warn,#c98a00)}.ap-stage.muted{border-top:4px solid #8a94a6}.ap-stage.good{border-top:4px solid var(--good)}.ap-stage.bad{border-top:4px solid var(--bad,#c0392b)}
.ap-people{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 12px}
.ap-chip{border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-size:12.5px;cursor:pointer;background:var(--bg)}
.ap-chip:hover{border-color:var(--ink)}
.ap-chip small{color:var(--muted)}
@media (max-width:760px){.ap-stages{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ro-val{padding:8px 10px;border:1.5px dashed var(--line);border-radius:8px;font-weight:600;background:var(--bg);min-height:38px}
.lines-wrap{max-height:none;margin-bottom:6px}
table.lines{min-width:720px}
table.lines td{padding:3px 4px}
table.lines input,table.lines select{padding:6px 7px;font-size:13px}
table.lines td:nth-child(2) input{min-width:220px}
.chk-box{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:6px;max-height:220px;overflow:auto;border:1.5px solid var(--line);border-radius:8px;padding:8px;background:var(--bg)}
.chk{display:flex;gap:8px;align-items:baseline;margin:0;color:var(--ink);font-size:13px;cursor:pointer}
.chk input{width:auto}
.chk small{color:var(--muted);font-size:11.5px;margin-left:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:50%}
.chk small.neg{color:var(--bad,#c0392b)}
.doc-frame{width:100%;height:68vh;border:1.5px solid var(--line);border-radius:8px;background:#fff}
.att-panel{margin-top:14px;border:1.5px solid var(--line);border-radius:10px;padding:12px 14px}
.att-head{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:baseline;margin-bottom:8px}
.att-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.att-item{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:8px;padding:8px;min-width:0;background:var(--bg)}
.att-item img{width:64px;height:64px;object-fit:cover;border-radius:6px;display:block}
.att-ico{width:64px;height:64px;border-radius:6px;background:var(--line);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;color:var(--ink);text-decoration:none;flex:none}
.att-meta{min-width:0;display:flex;flex-direction:column;gap:2px;font-size:13px}
.att-meta>a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.att-meta small{color:var(--muted);font-size:11.5px}
.att-up{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;align-items:center}
.att-up input[type=text]{flex:1;min-width:200px}
.att-n{font-size:12px;white-space:nowrap}
.warnbox.gate{border-color:var(--bad,#c0392b)}
.gantt{position:relative;height:12px;min-width:160px;background:var(--bg);border:1px solid var(--line);border-radius:6px}
.gantt span{position:absolute;top:1px;bottom:1px;border-radius:5px}
.gantt i{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--ink)}
/* type-to-search drop-downs */
.ss-wrap{position:relative;width:100%;min-width:0}
.ss-native{position:absolute!important;inset:0;width:100%!important;height:100%!important;opacity:0!important;pointer-events:none!important;margin:0}
.ss-input{padding-right:28px!important;text-overflow:ellipsis;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%)!important;
  background-position:calc(100% - 15px) 52%,calc(100% - 10px) 52%!important;background-size:5px 5px,5px 5px!important;background-repeat:no-repeat!important}
.ss-input:focus{cursor:text}
.ss-wrap.ss-dis .ss-input{opacity:.75;cursor:default}
.ss-wrap.ss-bad .ss-input{border-color:var(--bad,#c0392b)}
.filters .f .ss-input,.form-grid .ss-input{background-color:var(--input)}
#ctx-box .ss-wrap{max-width:230px}#ctx-box .ss-input{padding:5px 8px;font-size:13px;background-color:var(--input)}
table.lines .ss-input{padding:6px 24px 6px 7px;font-size:13px}
.ss-list{position:fixed;z-index:200;background:var(--panel,#fff);color:var(--ink,#1b2430);border:1px solid var(--line,#d5dbe3);border-radius:8px;box-shadow:0 10px 30px rgba(0,0,0,.18);overflow:auto;padding:4px 0;font-size:13.5px}
.ss-list.hidden{display:none}
.ss-opt{padding:7px 11px;cursor:pointer;line-height:1.3}
.ss-opt b{font-weight:700;color:var(--brand,#1f5f8b)}
.ss-opt.hi{background:color-mix(in srgb,var(--brand,#1f5f8b) 14%,transparent)}
.ss-opt.sel{font-weight:600}
.ss-opt.dis{opacity:.45;cursor:default}
.ss-opt.empty{color:var(--muted,#6b7685)}
.ss-none,.ss-more{padding:8px 11px;color:var(--muted,#6b7685);font-size:12.5px}
@media print{.filters .ss-input,.ss-list{display:none!important}}
/* keep wide forms inside the screen on phones */
.form-grid>div{min-width:0}
.lines-wrap{overflow-x:auto;max-width:100%}
.modal-box{min-width:0}.modal-body{min-width:0;overflow-x:hidden}
/* tasks */
.tbar{display:inline-block;width:64px;height:7px;border-radius:4px;background:var(--line);vertical-align:middle;overflow:hidden}
.tbar i{display:block;height:100%;background:var(--good)}
.tboard{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;align-items:start}
.tcol{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px;min-width:0}
.tcol-h{display:flex;gap:8px;align-items:center;margin:2px 4px 8px}
.tcard{background:var(--panel);border:1px solid var(--line);border-left:4px solid #1f5f8b;border-radius:8px;padding:8px 10px;margin-bottom:8px;cursor:pointer;font-size:13px}
.tcard:hover{border-color:var(--ink)}
.tcard.late{border-left-color:var(--bad,#c0392b)}
.tc-t{font-weight:600;margin-bottom:4px}
.tc-m{display:flex;flex-wrap:wrap;gap:6px;justify-content:space-between;color:var(--muted);font-size:12px;margin-bottom:4px}
.tcard .tbar{width:100%}
.tu-hist{margin-top:10px;max-height:240px;overflow:auto;border-top:1px solid var(--line)}
.tu{padding:7px 2px;border-bottom:1px solid var(--line);font-size:13px}
.tu small{color:var(--muted)}
/* menu: collapsible groups + search */
.side .nav-q{margin:2px 10px 6px;width:calc(100% - 20px);padding:6px 9px;font-size:13px;border-radius:7px;border:1px solid rgba(255,255,255,.18)!important;background:rgba(255,255,255,.08)!important;color:#fff}
.side .nav-q::placeholder{color:rgba(255,255,255,.55)}
.nav-g{margin:2px 0}
.nav-h{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:0;color:inherit;opacity:.62;font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;padding:12px 10px 6px;cursor:pointer;text-align:left}
.nav-h:hover{opacity:1}
.nav-h i{font-style:normal;transition:transform .15s}
.nav-g.closed:not(.searching) .nav-items{display:none}
.nav-g.closed:not(.searching) .nav-h i{transform:rotate(-90deg)}
/* reports centre */
.rc-group{margin-bottom:16px}
.rc-h{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:14px 2px 8px}
.rc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.rc-card{display:flex;flex-direction:column;gap:4px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px 14px;text-decoration:none;color:var(--ink);box-shadow:var(--shadow)}
.rc-card:hover{border-color:var(--brand)}
.rc-card b{font-size:14.5px}
.rc-card span{font-size:12.5px;color:var(--muted);line-height:1.35}
/* dashboard tabs */
.dash-tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1.5px solid var(--line);margin:4px 0 14px}
.dash-tabs button{border:0;background:none;padding:9px 14px;font-size:14px;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1.5px;border-radius:6px 6px 0 0}
.dash-tabs button:hover{color:var(--ink);background:var(--bg)}
.dash-tabs button.on{color:var(--brand);border-bottom-color:var(--brand)}
.dt-n{display:inline-block;min-width:18px;padding:0 5px;border-radius:9px;background:var(--bad,#c0392b);color:#fff;font-size:11px;line-height:18px;text-align:center;margin-left:4px}
.att-list{display:flex;flex-direction:column}
.att-row{display:grid;grid-template-columns:14px 1fr auto minmax(110px,auto) 60px;gap:10px;align-items:center;padding:9px 6px;border-bottom:1px solid var(--line);cursor:pointer;font-size:13.5px}
.att-row:last-child{border-bottom:0}
.att-row:hover{background:var(--bg)}
.att-dot{width:10px;height:10px;border-radius:50%;background:var(--warn,#c98a00)}
.att-row.bad .att-dot{background:var(--bad,#c0392b)}
.att-n{font-size:15px}
.att-a{color:var(--muted);font-size:12.5px;text-align:right}
.att-go{font-size:12.5px;text-align:right}
@media (max-width:640px){.att-row{grid-template-columns:12px 1fr auto;}.att-a,.att-go{display:none}}
.ubar{position:relative;display:inline-block;width:90px;height:8px;border-radius:4px;background:var(--line);vertical-align:middle;overflow:hidden}
.ubar i,.ubar em{position:absolute;left:0;top:0;bottom:0;border-radius:4px}
.ubar em{background:color-mix(in srgb,var(--warn,#c98a00) 45%,transparent)}
/* purchase invoice view */
.inv-head{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-bottom:12px}
.inv-head>div{border:1px solid var(--line);border-radius:8px;padding:8px 10px;display:flex;flex-direction:column;gap:3px;min-width:0;background:var(--bg)}
.inv-head span{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.inv-head small{color:var(--muted);font-size:12px}
.print-preview{background:#fff;color:#111;padding:16px;border:1px solid var(--line);border-radius:8px}

/* supplier payment allocation */
.alloc-tbl{font-size:13px}
.alloc-tbl td,.alloc-tbl th{padding:6px 8px}
.alloc-tbl .al-amt{padding:5px 8px}
.al-tools{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0}
.al-foot{margin-top:4px}
.pay-bar{height:6px;border-radius:4px;background:var(--line,#e5e7eb);margin-top:8px;overflow:hidden}
.pay-bar span{display:block;height:100%;background:var(--good,#16a34a)}
#inv-table td.pick{width:34px;text-align:center}
#inv-paybar.calc-box{margin:8px 0;align-items:center}