:root, html[data-theme="beige"]{
  --navy:#3a2a1c;--navy2:#2a1d14;--navy3:#5a4030;--navy4:#6d5140;
  --white:#f7f1e6;--bg:#e4d3b8;--bg2:#d4c09e;--card:#f4ead8;
  --border:#c4ad8c;--border2:#ad9470;
  --text:#2a1c12;--muted:#6b5644;--light:#a08c74;
  --red:#8a3328;--green:#2f5a38;--amber:#8a6230;
  --gold:#8d6a32;--accent:#6d5132;
  --cong-bg:#edd9a4;--cong-fg:#5a3e10;
  --lon-bg:#e4c09a;--lon-fg:#6a3414;
  --latvat-bg:#ddd2c2;--latvat-fg:#4e463e;
  --tt-bg:#d5e0c4;--tt-fg:#243f28;
  --on:#f7f1e6;--on-dim:rgba(247,241,230,.72);--on-faint:rgba(247,241,230,.42);
  --chrome-line:rgba(247,241,230,.16);--chrome-hover:rgba(247,241,230,.08);
  --mark:#e6d3a3;--debt:#f0c2b4;
  --band-red:#f0c2b4;--band-green:#c9e2c4;--band-amber:#f0dd9a;--total-fg:#f0dd9a;
  --sum:#0b3a82;--sum-bg:#d6e4f5;--hd:#fbf6e4;
  --hd-row:#fbf6e4;--hd-row-h:#f3ead0;--nohd:#fbe7b0;--nohd-h:#f5d88a;--nohd-edge:#c8902a;
  --stripe:rgba(212,192,158,.55);--hover:rgba(141,106,50,.12);--chuyen:#f0d0c6;
  --desk:#d4c4a8;--home1:#efe2cc;--home2:#e0ccae;--glow:rgba(141,106,50,.22);
  --overlay:rgba(42,29,20,.5);--paper:#fffdf8;--ok:#2f5a38;
  --sidebar-w:280px;--radius:8px;--radius2:12px;
}
html[data-theme="mono"]{
  --navy:#111111;--navy2:#000000;--navy3:#2a2a2a;--navy4:#3a3a3a;
  --white:#ffffff;--bg:#f3f3f3;--bg2:#e6e6e6;--card:#ffffff;
  --border:#cfcfcf;--border2:#b5b5b5;
  --text:#111111;--muted:#5c5c5c;--light:#8a8a8a;
  --red:#222222;--green:#333333;--amber:#444444;
  --gold:#222222;--accent:#111111;
  --cong-bg:#f4f4f4;--cong-fg:#111111;
  --lon-bg:#e2e2e2;--lon-fg:#111111;
  --latvat-bg:#f7f7f7;--latvat-fg:#444444;
  --tt-bg:#dedede;--tt-fg:#111111;
  --on:#ffffff;--on-dim:rgba(255,255,255,.78);--on-faint:rgba(255,255,255,.45);
  --chrome-line:rgba(255,255,255,.16);--chrome-hover:rgba(255,255,255,.08);
  --mark:#ffffff;--debt:#ffffff;
  --band-red:#ffffff;--band-green:#d8d8d8;--band-amber:#eeeeee;--total-fg:#ffffff;
  --sum:#111111;--sum-bg:#e8e8e8;--hd:#ececec;
  --hd-row:#ffffff;--hd-row-h:#f2f2f2;--nohd:#dcdcdc;--nohd-h:#cdcdcd;--nohd-edge:#111111;
  --stripe:rgba(0,0,0,.04);--hover:rgba(0,0,0,.06);--chuyen:#ececec;
  --desk:#e5e5e5;--home1:#f7f7f7;--home2:#e8e8e8;--glow:rgba(0,0,0,.06);
  --overlay:rgba(0,0,0,.55);--paper:#ffffff;--ok:#222222;
  --sidebar-w:280px;--radius:8px;--radius2:12px;
}
html[data-theme="navy"]{
  --navy:#071833;--navy2:#041026;--navy3:#12315f;--navy4:#1a4178;
  --white:#ffffff;--bg:#f3f6fb;--bg2:#e4ebf5;--card:#ffffff;
  --border:#d3deee;--border2:#b7c7de;
  --text:#0e1c33;--muted:#5a6d86;--light:#8aa0bb;
  --red:#9b2c2c;--green:#1f6b45;--amber:#8a5a12;
  --gold:#d6e4f7;--accent:#12315f;
  --cong-bg:#e7eef8;--cong-fg:#12315f;
  --lon-bg:#d9e3f2;--lon-fg:#0e1c33;
  --latvat-bg:#eef2f7;--latvat-fg:#4d5e74;
  --tt-bg:#e5f2ea;--tt-fg:#1f6b45;
  --on:#ffffff;--on-dim:rgba(255,255,255,.78);--on-faint:rgba(255,255,255,.42);
  --chrome-line:rgba(255,255,255,.14);--chrome-hover:rgba(255,255,255,.08);
  --mark:#ffffff;--debt:#f3c7c7;
  --band-red:#f3c7c7;--band-green:#c9ead6;--band-amber:#f6e3b0;--total-fg:#f6e3b0;
  --sum:#0b3a82;--sum-bg:#d6e4f5;--hd:#fbf6e4;
  --hd-row:#fbf6e4;--hd-row-h:#f3ead0;--nohd:#fbe7b0;--nohd-h:#f5d88a;--nohd-edge:#c8902a;
  --stripe:rgba(18,49,95,.05);--hover:rgba(18,49,95,.07);--chuyen:#f8e4e4;
  --desk:#d5deea;--home1:#f7f9fc;--home2:#e7eef8;--glow:rgba(18,49,95,.12);
  --overlay:rgba(4,16,38,.55);--paper:#ffffff;--ok:#1f6b45;
  --sidebar-w:280px;--radius:8px;--radius2:12px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
html{zoom:1.1;}
body{font-family:Roboto,"Segoe UI",system-ui,sans-serif;font-size:13px;color:var(--text);background:var(--bg);line-height:1.35;text-transform:uppercase;}
button,input,select,textarea{font-family:inherit;text-transform:inherit;}
input[type="password"],#lg-user,#lg-pass{text-transform:none;}
.num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;}
.center{text-align:center;}
.wrap{overflow-wrap:break-word;word-break:break-word;}
.up{text-transform:uppercase;}
.app{display:flex;height:calc(100vh / 1.1);}
.sidebar{width:var(--sidebar-w);background:var(--navy);color:var(--on);display:flex;flex-direction:column;flex-shrink:0;overflow:hidden;}
.sidebar-header{padding:10px 12px 8px;border-bottom:1px solid var(--chrome-line);cursor:pointer;}
.sidebar-header .co{font-size:10px;font-weight:700;letter-spacing:.16em;color:var(--on-dim);margin-bottom:2px;}
.sidebar-header h1{font-size:14px;font-weight:900;letter-spacing:.04em;line-height:1.25;color:var(--on);}
.sidebar-nav{flex:1;overflow-y:auto;padding:6px 0;}
.nav-group{margin-bottom:10px;}
.nav-group-label{font-size:10px;font-weight:700;letter-spacing:.16em;color:var(--on-faint);padding:8px 12px 3px;}
.nav-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:6px 12px;border:none;border-left:3px solid transparent;background:transparent;color:var(--on-dim);font-size:12px;font-weight:700;letter-spacing:.03em;cursor:pointer;text-align:left;line-height:1.25;text-transform:uppercase;}
.nav-item:hover{background:var(--chrome-hover);color:var(--on);}
.nav-item.active{border-left-color:var(--mark);background:var(--chrome-hover);color:var(--on);}
.nav-item .dot{width:10px;height:10px;border-radius:3px;flex-shrink:0;}
.nav-item .debt{font-size:11px;font-weight:600;color:var(--debt);}
.nav-item .debt.zero{color:var(--on-faint);}
.sidebar-footer{border-top:1px solid var(--chrome-line);padding:8px 12px;display:flex;flex-direction:column;gap:6px;}
.sidebar-footer button{display:flex;align-items:center;gap:6px;width:100%;padding:6px 10px;background:var(--chrome-hover);border:1px solid var(--chrome-line);border-radius:var(--radius);color:var(--on-dim);font-size:11px;font-weight:700;letter-spacing:.05em;cursor:pointer;text-transform:uppercase;}
.sidebar-footer button:hover{background:var(--chrome-hover);color:var(--on);}
.sidebar-footer button.on{color:var(--on);border-color:var(--mark);}
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0;background:var(--bg);}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:8px 14px;background:var(--card);border-bottom:1px solid var(--border);flex-shrink:0;gap:8px;}
.topbar .label{font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;}
.topbar .title{font-size:15px;font-weight:900;letter-spacing:.03em;color:var(--navy);text-transform:uppercase;}
.topbar-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.content{flex:1;overflow-y:auto;padding:12px;}
.btn{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;border-radius:var(--radius);font-size:11px;font-weight:700;letter-spacing:.04em;cursor:pointer;border:none;text-transform:uppercase;line-height:1.2;}
.btn-primary{background:var(--navy3);color:var(--on);}
.btn-primary:hover{background:var(--navy);}
.btn-outline{background:transparent;color:var(--navy3);border:1.5px solid var(--navy3);}
.btn-outline:hover{background:rgba(109,83,64,.06);}
.btn-danger{background:var(--red);color:#fff;}
.btn-ghost{background:transparent;color:var(--muted);}
.btn-ghost:hover{background:var(--bg2);color:var(--text);}
.btn-sm{padding:3px 8px;font-size:10px;}
.btn-icon{padding:2px 4px;border-radius:3px;background:transparent;border:none;cursor:pointer;color:var(--muted);font-size:13px;}
.btn-icon:hover{background:var(--bg2);color:var(--text);}
.btn:disabled{opacity:.55;cursor:wait;}
.filter-bar{display:flex;gap:6px;align-items:center;margin-bottom:8px;flex-wrap:wrap;}
.filter-bar select,.filter-bar input{padding:5px 8px;border:1.5px solid var(--border);border-radius:var(--radius);font-size:12px;font-weight:700;background:var(--card);color:var(--text);letter-spacing:.03em;text-transform:uppercase;}
.filter-bar select:focus,.filter-bar input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(166,133,74,.18);}
.card{background:var(--card);border-radius:var(--radius2);border:1px solid var(--border);overflow:visible;margin-bottom:8px;}
.card-header{padding:6px 10px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;}
.card-header h3{font-size:12px;font-weight:900;letter-spacing:.05em;color:var(--navy);text-transform:uppercase;}
.tbl-print-bar{display:flex;justify-content:flex-end;padding:6px 8px 0;}
.card-header .btn-print{margin-left:auto;}
.ke-card-name .btn-print{margin-left:8px;flex-shrink:0;background:#fff;color:#1a1a1a;border-color:#fff;}
.color-dot{width:12px;height:12px;border-radius:3px;flex-shrink:0;}
.band{display:grid;grid-template-columns:repeat(4,1fr);background:var(--navy);color:var(--on);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;}
.band>div{padding:8px 10px;text-align:center;}
.band>div .val{font-size:15px;font-weight:900;margin-top:2px;color:var(--on);}
.band>div .val.red{color:var(--band-red);}
.band>div .val.green{color:var(--band-green);}
.band>div .val.amber{color:var(--band-amber);}
.tbl{width:100%;border-collapse:collapse;font-size:12px;}
.tbl th{background:var(--navy);color:var(--on);padding:5px 7px;font-weight:700;letter-spacing:.05em;text-align:center;border:1px solid var(--navy2);white-space:nowrap;font-size:11px;text-transform:uppercase;}
.tbl thead th{position:sticky;top:0;z-index:4;}
.tbl td{padding:4px 6px;border:1px solid var(--border);vertical-align:middle;line-height:1.35;}
.tbl tr:nth-child(even) td{background:var(--stripe);}
.tbl tr:hover td{background:var(--hover);}
.tbl .row-cong td{background:var(--cong-bg)!important;color:var(--cong-fg);}
.tbl .row-lon td{background:var(--lon-bg)!important;color:var(--lon-fg);}
.tbl .row-latvat td{background:var(--latvat-bg)!important;color:var(--latvat-fg);}
.tbl .row-tt td{background:var(--tt-bg)!important;color:var(--tt-fg);font-style:italic;font-weight:700;}
.tbl .row-chuyen-tx td{background:var(--chuyen)!important;color:var(--red);font-style:italic;font-weight:700;}
.tbl .row-band td{background:var(--navy);color:var(--on);font-weight:900;}
.tbl td.sum{color:var(--sum);font-weight:900;}
.tbl tr.row-total td,.tbl tr.row-total:hover td{background:var(--sum)!important;color:#fff!important;font-weight:900;}
.tbl tr.row-hd td{background:var(--hd-row)!important;}
.tbl tr.row-hd:hover td{background:var(--hd-row-h)!important;}
.tbl tr.row-nohd td{background:var(--nohd)!important;}
.tbl tr.row-nohd:hover td{background:var(--nohd-h)!important;}
.tbl tr.row-nohd td:first-child{box-shadow:inset 4px 0 0 var(--nohd-edge);}
.hd-legend{display:flex;gap:14px;align-items:center;justify-content:flex-end;margin:0 2px 6px;font-family:Roboto,"Segoe UI",system-ui,sans-serif;font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--muted);text-transform:uppercase;}
.hd-leg{display:inline-flex;align-items:center;gap:6px;}
.hd-sw{display:inline-block;width:22px;height:13px;border-radius:3px;border:1px solid var(--border2);}
.hd-sw-no{background:var(--nohd);box-shadow:inset 4px 0 0 var(--nohd-edge);}
.hd-sw-yes{background:var(--hd-row);}
.tbl tr.row-phieu{cursor:pointer;}
.card.sum-fit{width:max-content;max-width:100%;overflow-x:auto;}
.tbl.tbl-sum{width:max-content;max-width:none;table-layout:fixed;}
.tbl.tbl-sum th,.tbl.tbl-sum td{white-space:nowrap;padding:4px 5px;}
.tbl.tbl-sum:has(> thead > tr > th:nth-child(6)) th:nth-child(1),
.tbl.tbl-sum:has(> thead > tr > th:nth-child(6)) td:nth-child(1){width:36px;}
.tbl.tbl-sum:has(> thead > tr > th:nth-child(6)) th:nth-child(2),
.tbl.tbl-sum:has(> thead > tr > th:nth-child(6)) td:nth-child(2){width:280px;}
.tbl.tbl-sum:has(> thead > tr > th:nth-child(6)) th:nth-child(n+3),
.tbl.tbl-sum:has(> thead > tr > th:nth-child(6)) td:nth-child(n+3){width:98px;}
.tbl.tbl-sum:not(:has(> thead > tr > th:nth-child(6))) th:nth-child(1),
.tbl.tbl-sum:not(:has(> thead > tr > th:nth-child(6))) td:nth-child(1){width:118px;}
.tbl.tbl-sum:not(:has(> thead > tr > th:nth-child(6))) th:nth-child(n+2),
.tbl.tbl-sum:not(:has(> thead > tr > th:nth-child(6))) td:nth-child(n+2){width:98px;}
.tabs{display:flex;gap:0;border-bottom:2px solid var(--border);margin-bottom:10px;}
.tab{padding:6px 12px;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--muted);cursor:pointer;border:none;border-bottom:2px solid transparent;margin-bottom:-2px;background:none;text-transform:uppercase;}
.tab.active{color:var(--navy);border-bottom-color:var(--gold);}
.modal-overlay{position:fixed;inset:0;background:var(--overlay);z-index:200;display:none;align-items:center;justify-content:center;}
.modal-overlay.show{display:flex;}
.modal{background:var(--card);border-radius:var(--radius2);width:92%;max-width:760px;max-height:86vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 18px 50px rgba(61,43,31,.28);border:1px solid var(--border);}
.modal.wide{max-width:980px;}
.modal-header{background:var(--navy);color:var(--on);padding:10px 14px;display:flex;align-items:center;justify-content:space-between;}
.modal-header h3{font-size:14px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;}
.modal-header .close{background:none;border:none;color:rgba(255,253,248,.7);font-size:20px;cursor:pointer;}
.modal-body{padding:12px;overflow-y:auto;flex:1;}
.modal-footer{padding:8px 12px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px;}
.form-group{margin-bottom:10px;}
.form-group label{display:block;font-size:10px;font-weight:700;letter-spacing:.08em;color:var(--muted);margin-bottom:3px;text-transform:uppercase;}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:7px 8px;border:1.5px solid var(--border);border-radius:var(--radius);font-size:12px;font-weight:500;background:var(--paper);color:var(--text);text-transform:uppercase;}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(166,133,74,.16);}
.form-row{display:flex;gap:8px;}
.form-row>*{flex:1;}
.line-items{border:1.5px solid var(--border);border-radius:var(--radius);overflow:auto;}
.line-items-header,.line-item-row{display:grid;grid-template-columns:1.6fr 46px 58px 90px 100px 1fr 28px;gap:5px;padding:4px 6px;align-items:center;}
.line-items-header{background:var(--bg);font-size:10px;font-weight:700;color:var(--muted);letter-spacing:.03em;text-transform:uppercase;}
.line-item-row{border-top:1px solid var(--border);}
.line-item-row input{padding:4px 6px;border:1px solid var(--border);border-radius:3px;font-size:11px;width:100%;text-transform:uppercase;}
.line-item-row .rm{background:none;border:none;color:var(--red);cursor:pointer;font-size:16px;}
.line-items-footer{padding:6px 8px;background:var(--bg);display:flex;justify-content:space-between;align-items:center;border-top:2px solid var(--gold);}
.line-items-footer .total-val{font-size:14px;font-weight:900;color:var(--navy);}
.add-line-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:6px;background:var(--bg);border:1px dashed var(--border2);border-radius:var(--radius);font-size:11px;font-weight:700;color:var(--navy3);cursor:pointer;width:100%;margin-top:4px;text-transform:uppercase;}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;}
.settings-card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:10px;}
.settings-card h4{font-size:12px;font-weight:900;color:var(--navy);margin-bottom:6px;letter-spacing:.05em;text-transform:uppercase;}
.settings-card .item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 0;border-bottom:1px solid var(--border);font-size:12px;}
.settings-card .item:last-child{border-bottom:none;}
.toast-container{position:fixed;top:16px;right:16px;z-index:300;display:flex;flex-direction:column;gap:8px;}
.toast{padding:8px 14px;border-radius:var(--radius);font-size:12px;font-weight:700;letter-spacing:.03em;box-shadow:0 4px 16px rgba(61,43,31,.16);text-transform:uppercase;}
.toast-success{background:var(--ok);color:var(--on);}
.toast-error{background:var(--red);color:#fff;}
.print-overlay{position:fixed;inset:0;background:var(--overlay);z-index:250;display:none;align-items:center;justify-content:center;}
.print-overlay.show{display:flex;}
.print-box{background:var(--card);border-radius:var(--radius2);width:98vw;height:96vh;display:flex;flex-direction:column;}
.print-header{background:var(--navy);color:var(--on);padding:10px 14px;display:flex;align-items:center;justify-content:space-between;gap:8px;flex-shrink:0;}
.print-actions{display:flex;gap:8px;flex-wrap:wrap;}
.print-body{flex:1;overflow:auto;background:var(--desk);}
.print-body iframe{width:100%;height:100%;border:none;background:var(--desk);}
.badge{display:inline-block;padding:1px 5px;border-radius:3px;font-size:10px;font-weight:700;letter-spacing:.04em;}
.badge-cong{background:var(--cong-bg);color:var(--cong-fg);}
.badge-lon{background:var(--lon-bg);color:var(--lon-fg);}
.badge-latvat{background:var(--latvat-bg);color:var(--latvat-fg);}
.badge-ok{background:var(--tt-bg);color:var(--tt-fg);}
.badge-kh{background:var(--cong-bg);color:var(--cong-fg);}
.badge-no{background:var(--band-red);color:var(--red);}
.tbl tr.row-nhot td{font-style:italic;}
.empty-state{text-align:center;padding:22px 8px;color:var(--muted);font-size:12px;font-weight:600;text-transform:uppercase;}
.login-wrap,.home-wrap{min-height:calc(100vh / 1.1);display:flex;align-items:center;justify-content:center;padding:24px;background:
  radial-gradient(1200px 500px at 10% -10%, var(--glow), transparent 50%),
  linear-gradient(180deg,var(--home1),var(--home2));}
.login-card,.home-card{width:min(1080px,100%);}
.login-card{width:min(420px,100%);background:var(--card);border:1px solid var(--border);border-radius:16px;padding:28px 26px 22px;box-shadow:0 16px 40px rgba(74,55,40,.08);}
.brand-kicker{font-size:11px;letter-spacing:.18em;font-weight:700;color:var(--gold);text-transform:uppercase;}
.brand-title{font-size:22px;font-weight:900;color:var(--navy);letter-spacing:.04em;margin:6px 0 4px;text-transform:uppercase;}
.brand-sub{color:var(--muted);font-size:13px;margin-bottom:18px;}
.home-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:18px;}
.mod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;}
.mod{text-align:left;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px;cursor:pointer;min-height:132px;display:flex;flex-direction:column;gap:6px;}
.mod:hover{border-color:var(--gold);box-shadow:0 8px 20px rgba(74,55,40,.06);}
.mod.soon{cursor:default;opacity:.72;}
.mod.soon:hover{border-color:var(--border);box-shadow:none;}
.mod .k{font-size:10px;letter-spacing:.14em;font-weight:700;color:var(--gold);text-transform:uppercase;}
.mod h3{font-size:16px;font-weight:900;color:var(--navy);text-transform:uppercase;}
.mod p{color:var(--muted);font-size:12px;line-height:1.4;}
.pill{display:inline-block;margin-top:auto;font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--navy3);text-transform:uppercase;}
.pill.soon{color:var(--muted);}
.ocr-box{background:var(--paper);border:1.5px dashed var(--border2);border-radius:8px;padding:10px;margin-bottom:10px;}
.ocr-hint{font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--muted);text-transform:uppercase;margin-bottom:8px;}
.ocr-box.over{border-color:var(--navy);background:var(--bg2);box-shadow:inset 0 0 0 1px var(--navy);}
.ocr-box.busy{opacity:.7;pointer-events:none;}
.ocr-note{font-size:12px;color:var(--navy3);margin-top:6px;text-transform:uppercase;}
.ham{display:none;font-size:20px;}
@media(max-width:1024px){
  .sidebar{position:fixed;left:0;top:0;bottom:0;z-index:120;transform:translateX(-105%);}
  .sidebar.open{transform:translateX(0);}
  .ham{display:inline-flex;}
  .settings-grid,.band{grid-template-columns:1fr 1fr;}
}
@media(max-width:640px){
  .form-row,.settings-grid,.band{display:block;}
  .band>div{border-bottom:1px solid rgba(255,248,235,.08);}
}

.theme-row{display:flex;gap:8px;flex-wrap:wrap;}
.theme-opt{flex:1;min-width:140px;text-align:left;background:var(--paper);border:1.5px solid var(--border);border-radius:10px;padding:8px 10px;cursor:pointer;color:var(--text);font-size:11px;font-weight:800;letter-spacing:.04em;}
.theme-opt.on{border-color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy);}
.theme-opt .sw{display:block;height:28px;border-radius:6px;margin-bottom:6px;border:1px solid var(--border);}
.sw-mono{background:linear-gradient(90deg,#111 0 34%,#fff 34% 67%,#cfcfcf 67%);}
.sw-navy{background:linear-gradient(90deg,#071833 0 50%,#fff 50%);}
.sw-beige{background:linear-gradient(90deg,#3a2a1c 0 50%,#e4d3b8 50%);}

.ke-actions{display:flex;gap:8px;margin-left:auto;}
.ke-desk{background:var(--desk);border-radius:var(--radius2);padding:16px 8px 28px;display:flex;justify-content:center;overflow:visible;}
.ke-sheet{width:241.5mm;max-width:100%;background:var(--paper);color:var(--text);box-shadow:0 12px 36px rgba(0,0,0,.18);padding:10mm 8mm;box-sizing:border-box;}
.ke-hd{text-align:center;margin-bottom:8px;}
.ke-co{font-size:9pt;font-weight:700;letter-spacing:.08em;color:var(--muted);}
.ke-hd h2{font-size:13pt;font-weight:900;color:var(--navy);margin:2px 0;letter-spacing:.02em;}
.ke-sub{font-size:10pt;font-weight:800;color:var(--navy3);}
.ke-sheet .ke-tbl{font-size:8.5pt;}
.ke-sheet .ke-tbl th{font-size:7.5pt;padding:4px 3px;white-space:normal;}
.ke-sheet .ke-tbl td{padding:3px 4px;}
.ke-sheet .ke-tbl tr:nth-child(even) td,.ke-sheet .ke-tbl tr:hover td{background:var(--paper);}
.ke-sheet .ke-tbl tr.ke-row td,.ke-sheet .ke-tbl tr.ke-row:hover td{background:var(--ke-wash);}
.ke-sheet .ke-who{font-weight:900;text-align:center;vertical-align:middle;width:78px;line-height:1.25;color:var(--text);}
.ke-sheet .ke-tbl tr.ke-row td.ke-who,.ke-sheet .ke-tbl tr.ke-row:hover td.ke-who{background:var(--ke-head);border-left:4px solid var(--ke-edge);}
.ke-tx-kien{--ke-edge:#b85c38;--ke-wash:#f8ece6;--ke-head:#f3ddd2;--ke-deep:#7a3418;}
.ke-tx-mong{--ke-edge:#5a7a3a;--ke-wash:#eef3e6;--ke-head:#dde8cc;--ke-deep:#31481c;}
.ke-tx-niem{--ke-edge:#8d3d4f;--ke-wash:#f8e8ec;--ke-head:#f0d4db;--ke-deep:#5c2432;}
.ke-tx-hoa{--ke-edge:#6b4a32;--ke-wash:#f4ece6;--ke-head:#e8d9cc;--ke-deep:#3f2918;}
.ke-tx-choi{--ke-edge:#a6842a;--ke-wash:#f8f3e4;--ke-head:#f0e6c4;--ke-deep:#6a5210;}
.ke-tx-vk{--ke-edge:#2f6a52;--ke-wash:#e7f3ee;--ke-head:#d3e8de;--ke-deep:#163d2e;}
.ke-ncc-phatthi{--ke-edge:#2f4ea0;--ke-wash:#e8eef8;--ke-head:#d4e0f4;--ke-deep:#1a2f6e;}
.ke-ncc-toan{--ke-edge:#0f766e;--ke-wash:#e5f4f2;--ke-head:#cce8e4;--ke-deep:#084840;}
.ke-ncc-giap{--ke-edge:#6b7c93;--ke-wash:#eef1f5;--ke-head:#dde3ec;--ke-deep:#3d4858;}
.ke-ncc-manhthang{--ke-edge:#7a4e8a;--ke-wash:#f3eef6;--ke-head:#e6dcee;--ke-deep:#4a2c56;}
.ke-ncc-phucloc{--ke-edge:#1a7a8c;--ke-wash:#e6f4f7;--ke-head:#cfe8ee;--ke-deep:#0c4652;}
.ke-ncc-hoangthem{--ke-edge:#3d78b4;--ke-wash:#e8f2fa;--ke-head:#d4e6f6;--ke-deep:#1e4a78;}
.ke-ncc-huynhtinh{--ke-edge:#3d4a68;--ke-wash:#eceef3;--ke-head:#d9dee8;--ke-deep:#222c40;}
html[data-theme="mono"] .ke-tx-kien{--ke-edge:#222;--ke-wash:#f7f7f7;--ke-head:#ececec;--ke-deep:#222;}
html[data-theme="mono"] .ke-tx-mong{--ke-edge:#333;--ke-wash:#f1f1f1;--ke-head:#e2e2e2;--ke-deep:#333;}
html[data-theme="mono"] .ke-tx-niem{--ke-edge:#444;--ke-wash:#ededed;--ke-head:#dadada;--ke-deep:#444;}
html[data-theme="mono"] .ke-tx-hoa{--ke-edge:#555;--ke-wash:#e8e8e8;--ke-head:#d2d2d2;--ke-deep:#333;}
html[data-theme="mono"] .ke-tx-choi{--ke-edge:#3a3a3a;--ke-wash:#f4f4f4;--ke-head:#e6e6e6;--ke-deep:#3a3a3a;}
html[data-theme="mono"] .ke-tx-vk{--ke-edge:#666;--ke-wash:#e4e4e4;--ke-head:#cccccc;--ke-deep:#222;}
html[data-theme="mono"] .ke-ncc-phatthi{--ke-edge:#222;--ke-wash:#f6f6f6;--ke-head:#eaeaea;--ke-deep:#222;}
html[data-theme="mono"] .ke-ncc-toan{--ke-edge:#333;--ke-wash:#f0f0f0;--ke-head:#e0e0e0;--ke-deep:#333;}
html[data-theme="mono"] .ke-ncc-giap{--ke-edge:#4a4a4a;--ke-wash:#ebebeb;--ke-head:#d8d8d8;--ke-deep:#333;}
html[data-theme="mono"] .ke-ncc-manhthang{--ke-edge:#555;--ke-wash:#e6e6e6;--ke-head:#d0d0d0;--ke-deep:#222;}
html[data-theme="mono"] .ke-ncc-phucloc{--ke-edge:#3a3a3a;--ke-wash:#f3f3f3;--ke-head:#e4e4e4;--ke-deep:#3a3a3a;}
html[data-theme="mono"] .ke-ncc-hoangthem{--ke-edge:#666;--ke-wash:#e3e3e3;--ke-head:#cacaca;--ke-deep:#222;}
html[data-theme="mono"] .ke-ncc-huynhtinh{--ke-edge:#2a2a2a;--ke-wash:#f8f8f8;--ke-head:#eeeeee;--ke-deep:#2a2a2a;}
.ke-cards{display:flex;flex-direction:column;gap:8px;}
.ke-card{border:1.5px solid var(--ke-edge);border-radius:8px;overflow:visible;background:var(--ke-wash);break-inside:avoid;}
.ke-card-name{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--ke-deep);color:#fff;font-weight:900;text-align:left;padding:4px 6px;border-bottom:1px solid var(--ke-deep);letter-spacing:.03em;white-space:nowrap;}
.ke-card-title{min-width:0;overflow:hidden;text-overflow:ellipsis;}
.ke-card-period{display:flex;align-items:baseline;justify-content:flex-end;gap:5px;white-space:nowrap;text-align:right;}
.ke-card-period-label{font-size:6.5pt;letter-spacing:.02em;}
.ke-card-period-value{font-size:9.5pt;font-variant-numeric:tabular-nums;}
.ke-card .ke-grid{width:100%;border-collapse:collapse;font-size:8.5pt;background:var(--ke-wash);}
.ke-card .ke-grid th{font-size:7.5pt;padding:3px 4px;background:var(--ke-head);color:var(--text);border:1px solid rgba(0,0,0,.08);font-weight:700;text-align:center;white-space:normal;}
.ke-card .ke-grid thead th{position:sticky;top:0;z-index:4;}
.ke-card .ke-grid td{padding:3px 4px;border:1px solid rgba(0,0,0,.08);background:transparent;color:var(--text);}
.ke-card .ke-grid tr.ke-sum td{background:var(--ke-deep);color:#fff;border-color:var(--ke-deep);font-weight:900;}
.ke-card .ke-grid .ke-plate{width:78px;min-width:78px;max-width:78px;white-space:nowrap!important;padding-left:2px;padding-right:2px;}
.ke-card .ke-grid .ke-phieu{white-space:nowrap!important;}
.ke-card .ke-grid td.ke-note{white-space:nowrap;font-size:6.5pt;letter-spacing:-0.04em;padding:2px 3px;}
.ke-card .ke-grid tr.ke-sum td.ke-note{white-space:nowrap;font-size:6.5pt;letter-spacing:-0.05em;line-height:1.15;}
.tbl tr.row-paid td,.tbl tr.row-paid:hover td,.ke-card .ke-grid tr.row-paid td{color:#c0392b !important;}
.ke-page-foot{margin-top:10px;font-size:8.5pt;}
.ke-page-foot tr.ke-page-total td,.ke-page-foot tr.ke-page-total:hover td{background:#000!important;color:#fff!important;border-color:#000!important;font-size:10pt;line-height:1.25;padding:4.4px 6px;}
.ke-sheet .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}
.ke-sheet .wrap{text-align:left;}
@media screen and (max-width:900px){
  .ke-sheet{zoom:calc((100vw - 28px) / 241.5mm);}
}
@media print{
  html{zoom:1;}
  .sidebar,.topbar,.filter-bar,.toast-container,.modal-overlay,.print-overlay,.no-print,.tbl-print-bar,.btn-print,.fee-st-pop{display:none!important;}
  .app,.main,.content{display:block!important;height:auto!important;overflow:visible!important;background:#fff!important;}
  .content{padding:0!important;}
  .ke-desk{background:#fff!important;padding:0!important;}
  .ke-sheet{box-shadow:none!important;width:241.5mm!important;max-width:none!important;zoom:1!important;}
  .ke-card{break-inside:avoid;}
}
@page{size:A4 portrait;margin:8mm;}
@page rpt-a4{size:A4 portrait;margin:10mm;}

.fee-checks{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:4px 2px;}
.fee-checks label{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--text);}
.fee-qr{display:block;margin:8px auto;background:#fff;border:1px solid var(--border);}
.fee-meta{font-size:12px;font-weight:700;line-height:1.45;margin-bottom:8px;}

/* Sổ cấp phí to 30%: zoom đặt trên các khối con, không đặt trên chính khung cuộn .content (zoom trên khung cuộn dễ làm lệch tiêu đề bảng dính khi cuộn trên Chrome/Edge) */
#fee-shell .content{max-width:70%;padding:0 calc(12px * 1.3) calc(12px * 1.3);}
#fee-shell .content::before{height:calc(12px * 1.3);}
#fee-shell .content > *{zoom:1.3;}
/* Keep fee filters and search on one desktop row; let search absorb tight width. */
#fee-shell .filter-bar{flex-wrap:nowrap;}
#fee-shell .filter-bar .fee-checks{flex:0 1 auto;flex-wrap:nowrap;min-width:0;}
#fee-shell .filter-bar select{flex:0 1 auto;min-width:0;}
#fee-shell .filter-bar #fee-q{flex:1 1 220px;min-width:0;max-width:none!important;}

.fee-st-pop{position:fixed;z-index:80;background:#fff;border:1px solid var(--border,#ccc);box-shadow:0 8px 24px rgba(0,0,0,.14);min-width:156px;padding:6px;display:flex;flex-direction:column;gap:4px;}
.fee-st-title{font-size:10px;font-weight:800;letter-spacing:.04em;padding:2px 4px 4px;color:#111;}
.fee-st-opt{border:1px solid var(--border,#ccc);background:#fff;color:#111;font-weight:700;font-size:12px;letter-spacing:.03em;padding:7px 8px;cursor:pointer;text-align:left;}
.fee-st-opt.on,.fee-st-opt:hover{background:#111;color:#fff;border-color:#111;}
#fee-shell .fee-st-cell{white-space:nowrap;cursor:pointer;}
#fee-shell tr.fee-row{cursor:pointer;}
.modal-footer.split{justify-content:space-between;align-items:center;}
.modal-footer .fee-edit-acts{display:flex;gap:8px;}

#oil-shell .tbl.tbl-fit{width:max-content;max-width:none;table-layout:auto;}
#oil-shell .tbl.tbl-fit th,#oil-shell .tbl.tbl-fit td{white-space:nowrap;width:auto;}
#oil-shell .card:has(.tbl-fit){width:max-content;max-width:100%;overflow-x:auto;}

#fee-shell .fee-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 8px;}
#fee-shell .fee-kpi{background:var(--card);border:1px solid var(--border2);border-radius:var(--radius);padding:8px 10px;text-align:center;min-width:0;}
#fee-shell .fee-kpi-l{font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--navy);}
#fee-shell .fee-kpi-v{font-size:15px;font-weight:900;margin-top:2px;color:var(--navy);font-variant-numeric:tabular-nums;}
#fee-shell .fee-kpi-v.green{color:var(--green);}
#fee-shell .fee-kpi-v.amber{color:var(--amber);}
#fee-shell .fee-kpi-v.red{color:var(--red);}
#fee-shell .fee-kpi-trip{font-weight:900;color:#b42318;}
#fee-shell .fee-kpi-wait{background:#ead4b0;border:2px solid var(--navy3);box-shadow:inset 0 0 0 1px rgba(90,64,48,.18);}
@media(max-width:640px){
  #fee-shell .fee-kpis{grid-template-columns:1fr 1fr;gap:6px;}
}
@media print{
  #fee-shell .content,#fee-shell .content > *{zoom:1;}
  #fee-shell .content{padding:0 12px 12px;}
  #fee-shell .fee-kpi,#fee-shell .fee-kpi-wait{-webkit-print-color-adjust:exact;print-color-adjust:exact;}
}

#oil-shell .tbl.tbl-a4{width:216mm;max-width:100%;table-layout:fixed;font-size:17px;}
#oil-shell .tbl.tbl-a4 th{font-size:15px;padding:7px 10px;}
#oil-shell .tbl.tbl-a4 td{padding:6px 8px;}
#oil-shell .card:has(.tbl-a4){width:216mm;max-width:100%;overflow-x:auto;}
#oil-shell .card:has(.tbl-a4) .card-header h3{font-size:17px;}
#oil-shell .tbl.tbl-a4 col.c-muc{width:75mm;}
#oil-shell .tbl.tbl-a4 col.c-lit,#oil-shell .tbl.tbl-a4 col.c-dg,#oil-shell .tbl.tbl-a4 col.c-gt{width:38mm;}
#oil-shell .tbl.tbl-a4 col.c-act{width:27mm;}
#oil-shell .tbl.tbl-a4 th:first-child,#oil-shell .tbl.tbl-a4 td:first-child{text-align:left;}
#oil-shell .tbl.tbl-a4 th,#oil-shell .tbl.tbl-a4 td{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

#oil-shell .card.ton-dau .card-header{background:var(--navy);border-bottom-color:var(--navy2);}
#oil-shell .card.ton-dau .card-header h3{color:var(--on);}
#oil-shell .card.ton-dau .tbl.tbl-a4 th{background:var(--navy);border-color:var(--navy2);color:var(--on);}
#oil-shell .card.ton-nhot{border-color:#8aa0b5;}
#oil-shell .card.ton-nhot .card-header{background:#2c4156;border-bottom-color:#1e3042;}
#oil-shell .card.ton-nhot .card-header h3{color:#f3f6f9;}
#oil-shell .card.ton-nhot .tbl.tbl-a4 th{background:#2c4156;border-color:#1e3042;color:#f3f6f9;}
#oil-shell .card.ton-nhot .tbl.tbl-a4 tr:nth-child(even) td{background:#e6eef5;}
#oil-shell .card.ton-dau .tbl.tbl-a4 tr.row-total td,
#oil-shell .card.ton-dau .tbl.tbl-a4 tr.row-total:hover td{background:#1c120b!important;color:#f7f1e6!important;}
#oil-shell .card.ton-nhot .tbl.tbl-a4 tr.row-total td,
#oil-shell .card.ton-nhot .tbl.tbl-a4 tr.row-total:hover td{background:#12202e!important;color:#f4f7fb!important;}

#staff-shell .staff-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:10px 12px 12px;}
#staff-shell .staff-grid h4{margin:0 0 6px;font-size:11px;letter-spacing:.08em;color:var(--navy);}
#staff-shell .staff-row{display:grid;grid-template-columns:148px 1fr;gap:8px;padding:5px 0;border-bottom:1px dashed var(--border);font-size:12px;}
#staff-shell .staff-row span{font-size:10px;font-weight:700;letter-spacing:.06em;color:var(--muted);}
#staff-shell .staff-row b{font-weight:700;color:var(--text);}
#staff-shell .staff-docs{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:10px;}
#staff-shell .staff-doc{background:var(--paper);border:1px solid var(--border);border-radius:var(--radius);padding:8px;text-align:center;}
#staff-shell .staff-doc img{max-width:100%;max-height:260px;object-fit:contain;background:#fff;border:1px solid var(--border);}
#staff-shell .staff-doc .caption{margin-top:6px;font-size:10px;font-weight:700;letter-spacing:.06em;color:var(--navy);}
#staff-shell .staff-doc-actions{display:flex;gap:6px;justify-content:center;margin-top:6px;}
#staff-shell .staff-empty{min-height:120px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:11px;font-weight:700;border:1px dashed var(--border);}
#staff-shell .badge{display:inline-block;padding:1px 6px;border-radius:99px;font-size:10px;font-weight:800;letter-spacing:.04em;}
#staff-shell .badge-no{background:var(--band-red);color:var(--red);}
@media(max-width:860px){
  #staff-shell .staff-grid,#staff-shell .staff-docs{grid-template-columns:1fr;}
}

#oil-shell .oil-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 10px;}
#oil-shell .oil-kpi{background:var(--card);border:1px solid var(--border2);border-radius:14px;padding:12px 10px 10px;text-align:center;min-width:0;}
#oil-shell .oil-kpi-l{font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--navy);}
#oil-shell .oil-kpi-v{font-size:22px;font-weight:900;margin-top:4px;color:var(--navy);font-variant-numeric:tabular-nums;line-height:1.15;}
#oil-shell .oil-kpi-v.green{color:var(--green);}
#oil-shell .oil-kpi-v.amber{color:var(--amber);}
#oil-shell .oil-kpi-v.red{color:var(--red);}
#oil-shell .oil-kpi-u{font-size:13px;font-weight:800;letter-spacing:.04em;margin-left:2px;}
#oil-shell .oil-kpi-wait{background:#fff3c4;border:2px solid var(--navy3);box-shadow:inset 0 0 0 1px rgba(90,64,48,.18);}
@media(max-width:640px){
  #oil-shell .oil-kpis{grid-template-columns:1fr 1fr;}
}

#oil-shell .oil-issue-sheet{display:flex;flex-direction:column;align-items:stretch;width:max-content;max-width:min(100%,1300px);}
#oil-shell .oil-issue-sheet .oil-kpis{width:0;min-width:100%;}
#oil-shell .oil-issue-sheet > .card:has(.tbl-fit){width:max-content;max-width:100%;overflow-x:auto;}
#oil-shell .oil-issue-sheet .tbl.tbl-fit{width:max-content;max-width:none;table-layout:auto;font-size:16px;}
#oil-shell .oil-issue-sheet .tbl.tbl-fit th{font-size:14px;}
#oil-shell .oil-issue-sheet .tbl.tbl-fit th,#oil-shell .oil-issue-sheet .tbl.tbl-fit td,#oil-shell .oil-issue-sheet .tbl.tbl-fit td.wrap{white-space:nowrap;overflow-wrap:normal;}
#oil-shell .oil-issue-sheet tr.st-da td,#oil-shell .oil-issue-sheet tr.st-da:hover td{background:#d5ead0!important;color:#1c3a22!important;}
#oil-shell .oil-issue-sheet tr.st-vua td,#oil-shell .oil-issue-sheet tr.st-vua:hover td{background:#f6e4b4!important;color:#4a3410!important;}
#oil-shell .oil-issue-sheet tr.st-cho td,#oil-shell .oil-issue-sheet tr.st-cho:hover td{background:#fff6b0!important;color:#5c4a12!important;}

#oil-shell .oil-issue-sheet td.lit{font-weight:800;}
#oil-shell .tbl.tbl-a4 tr.row-total td.tot-lab{text-align:right;}

#cont-shell .card{overflow:visible;}
#cont-shell .tbl td.wrap{max-width:240px;}
#cont-shell .fee-checks{margin-left:4px;}

#fee-shell table.tbl.fee-cho{font-size:calc(12px * 1.12 * 1.12);font-weight:800;}
#fee-shell table.tbl.fee-cho th,
#fee-shell table.tbl.fee-cho td{font-weight:800;}
#fee-shell table.tbl.fee-cho th{font-size:calc(11px * 1.12 * 1.12);}
#fee-shell table.tbl.fee-cho th:first-child,
#fee-shell table.tbl.fee-cho td:first-child{text-align:right;font-weight:900;}
#fee-shell table.tbl.fee-cho th:nth-child(2),
#fee-shell table.tbl.fee-cho td:nth-child(2){text-align:right;width:1%;white-space:nowrap;}
#fee-shell table.tbl.fee-cho th:nth-child(3),
#fee-shell table.tbl.fee-cho td:nth-child(3){width:1%;white-space:nowrap;text-align:center;}
#fee-shell table.tbl.fee-cho tr.row-total td{font-weight:800;}

.modal.fee-slip{max-width:430px;}
.fee-slip-body{padding-top:10px;}
.fee-slip-line{display:grid;grid-template-columns:92px 1fr;gap:8px;align-items:baseline;padding:3px 0;font-size:13px;}
.fee-slip-line span{font-size:10px;font-weight:800;letter-spacing:.06em;color:var(--muted);}
.fee-slip-line b{font-weight:800;color:var(--text);word-break:break-word;}
.fee-slip-qr{width:280px;height:auto;image-rendering:pixelated;}
.fee-slip-view{display:flex;justify-content:center;min-height:200px;align-items:center;font-family:Roboto,"Segoe UI",Arial,sans-serif;}
.fee-slip-canvas{display:block;max-width:100%;height:auto!important;border-radius:16px;box-shadow:0 10px 30px rgba(15,23,42,.18),0 2px 6px rgba(15,23,42,.08);}
.fee-slip-loading{font-size:12px;font-weight:700;color:var(--muted);}
.fee-slip-note{min-height:1.2em;margin-top:6px;font-size:11px;font-weight:700;color:var(--muted);text-align:center;}
#fee-shell table.tbl.fee-cho tr.fee-cho-row{cursor:pointer;}
#fee-shell table.tbl.fee-main tr.row-total td,
#fee-shell table.tbl.fee-main tr.row-total:hover td{background:var(--navy)!important;color:var(--on)!important;border-color:var(--navy2)!important;}
#fee-shell table.tbl.fee-cho .fee-cho-entry{box-sizing:border-box;width:100%;min-width:92px;height:2em;padding:2px 5px;border:1px solid #e8c7c3;border-radius:3px;background:#fff;color:#1a1a1a;font:inherit;text-align:left;}
#fee-shell table.tbl.fee-cho .fee-cho-entry:focus{outline:2px solid #b42318;outline-offset:-1px;background:#fff;}
/* Fee-wait summary: red title/total accents, light readable table. */
#fee-shell .card:has(table.tbl.fee-cho){border-color:var(--border);background:var(--card);}
#fee-shell .card:has(table.tbl.fee-cho) .card-header{background:#b42318;border-bottom-color:#8f1d14;color:#fff;}
#fee-shell .card:has(table.tbl.fee-cho) .card-header h3{color:#fff;}
#fee-shell .card:has(table.tbl.fee-cho) .card-header .btn-print{background:transparent;color:#fff;border-color:#fff;}
#fee-shell .card:has(table.tbl.fee-cho) .card-header .btn-print:hover{background:rgba(255,255,255,.14);color:#fff;border-color:#fff;}
#fee-shell table.tbl.fee-cho{background:#fff5f5;color:#1a1a1a;}
#fee-shell table.tbl.fee-cho th{background:#fdecea;color:#1a1a1a;border-color:#e8c7c3;}
#fee-shell table.tbl.fee-cho tbody td{background:#fff5f5!important;color:#1a1a1a!important;border-color:#e8c7c3;}
#fee-shell table.tbl.fee-cho tbody tr:nth-child(even) td{background:#fffafa!important;}
#fee-shell table.tbl.fee-cho tbody tr:hover td{background:#fdecea!important;color:#1a1a1a!important;}
#fee-shell table.tbl.fee-cho tr.row-total td,
#fee-shell table.tbl.fee-cho tr.row-total:hover td{background:#b42318!important;color:#fff!important;border-color:#8f1d14;}
/* The wait-summary header is redundant; keep only driver data rows and the total. */
#fee-shell table.tbl.fee-cho > thead{display:none!important;}
/* The total is a tbody row, so override alternating/hover cell rules explicitly. */
#fee-shell table.tbl.fee-cho > tbody > tr.row-total > td,
#fee-shell table.tbl.fee-cho > tbody > tr.row-total:hover > td{background:#b42318!important;color:#fff!important;border-color:#8f1d14!important;}
#fee-shell table.tbl.fee-cho > tbody > tr.row-total > td *{color:#fff!important;}
#fee-shell table.tbl.fee-cho .btn.btn-outline{background:transparent;color:#b42318;border-color:#b42318;}
#fee-shell table.tbl.fee-cho .btn.btn-outline:hover{background:#fdecea;color:#8f1d14;border-color:#8f1d14;}
#fee-shell .card:has(table.tbl.fee-cho) .card-header,
#fee-shell table.tbl.fee-cho tr.row-total td{
  -webkit-print-color-adjust:exact;
  print-color-adjust:exact;
}

#oil-shell .oil-rep-card{width:222.75mm;max-width:100%;overflow:clip;}
#oil-shell table.oil-rep{width:100%;max-width:100%;table-layout:fixed;font-size:10.5px;}
#oil-shell table.oil-rep th{font-size:9px;}
#oil-shell table.oil-rep col.r-stt{width:9mm;}
#oil-shell table.oil-rep col.r-ma{width:15mm;}
#oil-shell table.oil-rep col.r-bs{width:26mm;}
#oil-shell table.oil-rep col.r-lit{width:20mm;}
#oil-shell table.oil-rep col.r-dg{width:14mm;}
#oil-shell table.oil-rep col.r-gt{width:22mm;}
#oil-shell table.oil-rep col.r-ngay{width:16mm;}
#oil-shell table.oil-rep col.r-gc{width:100.75mm;}
#oil-shell table.oil-rep th,#oil-shell table.oil-rep td,#oil-shell table.oil-rep td.wrap{white-space:nowrap;}
#oil-shell table.oil-rep td.wrap{white-space:normal;overflow-wrap:break-word;}
#oil-shell table.oil-rep th:nth-child(7),#oil-shell table.oil-rep td:nth-child(7){text-align:center;}
#oil-shell .oil-rep-band{width:222.75mm;max-width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;background:transparent;font-size:9px;overflow:visible;}
#oil-shell .oil-rep-band .oil-rep-cell{background:var(--navy);color:var(--on);border:1px solid var(--navy2);border-radius:8px;padding:8px 10px;text-align:left;}
#oil-shell .oil-rep-band .val{font-size:10.5px;font-weight:900;margin-top:2px;color:var(--on);text-align:left;}
#oil-shell .oil-rep-band .val.amber{color:var(--band-amber);}
#oil-shell .oil-rep-band .val.green{color:var(--band-green);}
/* nâng hạ v2: menu trái + chọn khách */
#cont-shell .cont-cust{padding:8px 12px 10px;border-bottom:1px solid var(--chrome-line);}
#cont-shell .cont-cust label{display:block;font-size:10px;font-weight:700;letter-spacing:.16em;color:var(--on-faint);margin-bottom:4px;}
#cont-shell .cont-cust select{width:100%;padding:6px 8px;border-radius:var(--radius);border:1px solid var(--chrome-line);background:var(--chrome-hover);color:var(--on);font-size:12px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;cursor:pointer;}
#cont-shell .cont-cust select:focus{outline:none;border-color:var(--mark);}
#cont-shell .cont-cust option{color:var(--text);background:var(--card);}
#cont-shell .cont-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:8px;}
#cont-shell .cont-hint{font-size:10px;font-weight:700;letter-spacing:.04em;color:var(--muted);}
#cont-shell p.cont-hint{margin:2px 2px 10px;}
#cont-shell .cf-body{padding:10px 12px 12px;}
#cont-shell .cf-grid,.modal .cf-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 10px;}
#cont-shell .cf-grid .cf-wide,.modal .cf-grid .cf-wide{grid-column:span 2;}
#cont-shell .cf-grid .form-group,.modal .cf-grid .form-group{margin-bottom:8px;}
#cont-shell .cf-money,.modal .cf-money{text-align:right;font-variant-numeric:tabular-nums;}
.cf-calc{display:flex;gap:18px;flex-wrap:wrap;align-items:center;padding:7px 10px;margin:2px 0 8px;border:1px dashed var(--border2);border-radius:var(--radius);background:var(--bg);font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--muted);}
.cf-calc b{color:var(--navy);font-size:13px;margin-left:4px;font-variant-numeric:tabular-nums;}
.cf-calc .cf-note{font-size:10px;color:var(--amber);}
#cont-shell .cf-foot{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
#cont-shell .cont-scroll{overflow:auto;max-height:var(--sticky-maxh);}
#cont-shell .cont-n{font-size:10px;font-weight:600;color:var(--muted);}
#cont-shell .tabs{margin-bottom:8px;}
@media (max-width:900px){#cont-shell .cf-grid,.modal .cf-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:560px){#cont-shell .cf-grid,.modal .cf-grid{grid-template-columns:1fr;}#cont-shell .cf-grid .cf-wide,.modal .cf-grid .cf-wide{grid-column:auto;}}
#cont-shell .card-header .cont-hbtn{margin-left:auto;}
#cont-shell .card-header .cont-hbtn ~ .btn-print{margin-left:6px;}

/* CHỜ CẤP (sv-wait) — bảng to lên 25% */
#oil-shell .oil-wait{display:flex;flex-direction:column;align-items:stretch;width:max-content;max-width:100%;}
#oil-shell .oil-wait > .card,#oil-shell .oil-wait > .card:has(.tbl-fit){width:auto;max-width:100%;overflow-x:auto;margin-bottom:10px;}
#oil-shell .oil-wait .card-header{padding:7.5px 12.5px;gap:10px;}
#oil-shell .oil-wait .card-header h3{font-size:15px;}
#oil-shell .oil-wait .tbl.tbl-fit{width:100%;min-width:max-content;table-layout:auto;font-size:15px;}
#oil-shell .oil-wait .tbl.tbl-fit th{font-size:13.75px;padding:6.25px 8.75px;}
#oil-shell .oil-wait .tbl.tbl-fit td{padding:5px 7.5px;}
#oil-shell .oil-wait .tbl.tbl-fit th,#oil-shell .oil-wait .tbl.tbl-fit td,#oil-shell .oil-wait .tbl.tbl-fit td.wrap{white-space:nowrap;overflow-wrap:normal;word-break:normal;}
#oil-shell .oil-wait .empty-state{font-size:15px;padding:27.5px 10px;}

/* ===== UI 2026-10-07: tiêu đề bảng cố định khi cuộn — mọi phân hệ ===== */
:root{--sticky-maxh:calc(100vh / 1.1 - 92px);}
/* sticky bám mép nội dung (trừ padding) của khung cuộn: chuyển padding trên của #content thành khoảng đệm để tiêu đề dính sát mép trên */
.content{padding-top:0;}
.content::before{content:"";display:block;height:12px;}
.tbl > thead > tr > th,.ke-grid > thead > tr > th{position:sticky;top:0;z-index:4;}
/* tiêu đề nhiều dòng (nhóm cột): dính nguyên khối thead */
.tbl > thead:has(> tr + tr),.ke-grid > thead:has(> tr + tr){position:sticky;top:0;z-index:4;}
.tbl > thead:has(> tr + tr) > tr > th,.ke-grid > thead:has(> tr + tr) > tr > th{position:static;}
/* khung cuộn ngang của bảng rộng: cuộn dọc trong khung để tiêu đề vẫn dính */
.card.sum-fit,
#oil-shell .card:has(.tbl-fit),
#oil-shell .card:has(.tbl-a4),
#oil-shell .oil-wait > .card,
#einv-shell div.einv-tblwrap:not(.einv-nhwrap){max-height:var(--sticky-maxh);overflow:auto;}
@media print{
  .tbl thead,.tbl thead th,.ke-grid thead,.ke-grid thead th{position:static!important;}
  .card.sum-fit,#oil-shell .card:has(.tbl-fit),#oil-shell .card:has(.tbl-a4),#oil-shell .oil-wait > .card,
  #einv-shell div.einv-tblwrap,#cont-shell .cont-scroll{max-height:none!important;overflow:visible!important;}
  .cont-pn-ov,.content::before{display:none!important;}
}

/* ===== Nâng hạ · nhập liệu: chip lọc ngày + phiếu nhập ===== */
#cont-shell .cont-chips{display:inline-flex;flex-wrap:wrap;gap:0;border:1.5px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--card);}
#cont-shell .cont-chip{border:none;border-right:1px solid var(--border);background:transparent;color:var(--muted);padding:5px 10px;font-size:11px;font-weight:800;letter-spacing:.04em;cursor:pointer;text-transform:uppercase;}
#cont-shell .cont-chip:last-child{border-right:none;}
#cont-shell .cont-chip:hover{background:var(--bg2);color:var(--text);}
#cont-shell .cont-chip.on{background:var(--navy3);color:var(--on);}
#cont-shell .cont-range{display:inline-flex;align-items:center;gap:4px;}
#cont-shell .cont-range label{font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--muted);}
#cont-shell .cont-range input{padding:4px 6px;}
#cont-shell .cont-range.on input{border-color:var(--navy3);}
#cont-shell .cont-sum{font-size:11px;font-weight:700;letter-spacing:.03em;color:var(--muted);}
#cont-shell .cont-sum b{color:var(--navy);font-variant-numeric:tabular-nums;}
.cont-pn-ov{position:fixed;inset:0;z-index:150;background:var(--overlay);display:flex;justify-content:flex-end;}
.cont-pn{width:min(1100px,100%);height:100%;background:var(--bg);display:flex;flex-direction:column;box-shadow:-12px 0 40px rgba(0,0,0,.25);animation:contPnIn .16s ease-out;}
@keyframes contPnIn{from{transform:translateX(40px);opacity:.4;}to{transform:none;opacity:1;}}
.cont-pn-head{display:flex;align-items:stretch;gap:12px;background:var(--navy);color:var(--on);padding:12px 16px;flex-shrink:0;}
.cont-pn-title{flex:1;min-width:0;}
.cont-pn-kicker{font-size:10px;font-weight:700;letter-spacing:.14em;color:var(--on-dim);}
.cont-pn-title h2{font-size:18px;font-weight:900;letter-spacing:.06em;margin:2px 0;}
.cont-pn-cust{font-size:12px;font-weight:600;color:var(--on-dim);}
.cont-pn-cust b{color:var(--on);font-weight:900;}
.cont-pn-meta{display:flex;gap:10px;align-items:flex-end;background:var(--chrome-hover);border:1px solid var(--chrome-line);border-radius:var(--radius);padding:6px 10px;}
.cont-pn-meta .form-group{margin:0;min-width:150px;}
.cont-pn-meta .form-group label{color:var(--on-dim);}
.cont-pn-no{display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:6px;min-width:70px;}
.cont-pn-no span{font-size:10px;font-weight:700;letter-spacing:.08em;color:var(--on-dim);}
.cont-pn-no b{font-size:15px;font-weight:900;}
.cont-pn-x{background:none;border:none;color:var(--on-dim);font-size:26px;line-height:1;cursor:pointer;align-self:flex-start;padding:0 4px;}
.cont-pn-x:hover{color:var(--on);}
.cont-pn-body{flex:1;min-height:0;overflow:auto;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:12px;padding:12px 16px;align-items:start;}
.cont-pn-grp{border:1px solid var(--border);border-radius:var(--radius2);background:var(--card);padding:6px 12px 4px;margin-bottom:10px;}
.cont-pn-grp legend{font-size:11px;font-weight:900;letter-spacing:.08em;color:var(--navy);padding:0 6px;}
.cont-pn-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 10px;}
.cont-pn-grid .cf-wide{grid-column:span 2;}
.cont-pn-grid .form-group{margin-bottom:8px;}
.cont-pn .cf-money{text-align:right;font-variant-numeric:tabular-nums;font-weight:700;}
.cont-pn-side{position:sticky;top:0;}
.cont-pn-tot{display:block;margin:0 0 8px;padding:10px 12px;background:var(--paper);border:1.5px solid var(--border2);border-style:solid;}
.cont-pn-tot-h{font-size:11px;font-weight:900;letter-spacing:.08em;color:var(--navy);border-bottom:1px dashed var(--border2);padding-bottom:6px;margin-bottom:6px;}
.cont-pn-tot .t-line,.cont-pn-tot .t-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:3px 0;}
.cont-pn-tot .t-line{font-size:11px;color:var(--muted);}
.cont-pn-tot .t-line b{font-size:12px;margin:0;color:var(--text);}
.cont-pn-tot .t-zero{opacity:.55;}
.cont-pn-tot .t-row b{margin:0;}
.cont-pn-tot .t-main{border-top:2px solid var(--navy);margin-top:6px;padding-top:8px;}
.cont-pn-tot .t-main span{font-size:12px;font-weight:900;color:var(--navy);}
.cont-pn-tot .t-main b{font-size:20px;font-weight:900;color:var(--sum);}
.cont-pn-tot .cf-note{display:block;margin-top:6px;}
.cont-pn-tip{font-size:10px;font-weight:700;letter-spacing:.04em;color:var(--muted);padding:0 2px;}
.cont-pn-foot{display:flex;align-items:center;gap:8px;padding:10px 16px;border-top:1px solid var(--border);background:var(--card);flex-shrink:0;}
.cont-pn-foot .btn{padding:8px 16px;font-size:12px;}
.cont-pn-foot .cont-hint{font-size:10px;font-weight:700;letter-spacing:.04em;color:var(--muted);}
@media (max-width:900px){.cont-pn-body{grid-template-columns:1fr;}.cont-pn-side{position:static;}.cont-pn-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:560px){.cont-pn-grid{grid-template-columns:1fr;}.cont-pn-grid .cf-wide{grid-column:auto;}.cont-pn-head{flex-wrap:wrap;}}

/* ===== Nâng hạ · CHI HỘ (sổ riêng, không xuất HĐ) ===== */
#cont-shell .adv-sum{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 22px;padding:8px 12px;margin-bottom:8px;border:1.5px solid var(--border);border-radius:var(--radius);background:var(--card);font-size:11px;font-weight:800;letter-spacing:.05em;color:var(--muted);}
#cont-shell .adv-sum b{color:var(--navy);font-size:15px;font-weight:900;margin-left:5px;font-variant-numeric:tabular-nums;}
#cont-shell .adv-sum .adv-y{color:var(--text);}
#cont-shell .adv-sum .due b,#cont-shell .adv-box .due{color:var(--sum);}
#cont-shell .adv-box{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;padding:7px 12px;margin:0 0 8px;border:1px dashed var(--border2);border-radius:var(--radius);background:var(--bg);font-size:11px;font-weight:800;letter-spacing:.04em;color:var(--muted);}
#cont-shell .adv-box b{color:var(--navy);font-size:13px;margin-left:4px;font-variant-numeric:tabular-nums;}
#cont-shell .adv-box .adv-tot b{font-size:15px;}
#cont-shell .adv-box .btn{margin-left:auto;}
#cont-shell .adv-ref{font-size:9.5px;font-weight:600;color:var(--muted);white-space:nowrap;}
#cont-shell .adv-checks{display:flex;flex-wrap:wrap;gap:4px 16px;padding:4px 0;}
#cont-shell .adv-tbl td.wrap{max-width:200px;}
#cont-shell .adv-tbl td:not(.wrap){white-space:nowrap;}
@media print{#cont-shell .adv-box .btn{display:none!important;}}
/* nâng hạ · loại cont + hành trình */
.cont-pn-grid .cont-seg,.cont-pn-grid .cont-itin,.cont-pn-grid .cont-warn{grid-column:1/-1;}
.cont-seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:8px;}
.cont-seg-sub{grid-template-columns:repeat(3,minmax(0,1fr));}
.cont-seg-col{grid-template-columns:1fr;}
.cont-seg-o{display:flex;flex-direction:column;gap:2px;border:1px solid var(--border);border-radius:var(--radius);background:var(--paper);padding:8px 10px;cursor:pointer;position:relative;}
.cont-seg-o input{position:absolute;opacity:0;pointer-events:none;}
.cont-seg-o b{font-size:12.5px;color:var(--text);}
.cont-seg-o small{font-size:11px;color:var(--muted);text-transform:none;}
.cont-seg-o:hover{border-color:var(--border2);}
.cont-seg-o.on{border-color:var(--navy3);background:var(--navy3);}
.cont-seg-o.on b,.cont-seg-o.on small{color:var(--on);}
.cont-seg-col .cont-seg-o:has(input:checked){border-color:var(--navy3);background:var(--hd);}
.cont-seg-sub .cont-seg-o{padding:6px 10px;}
.cont-itin{display:flex;align-items:flex-start;gap:6px;flex-wrap:wrap;}
.cont-itin-pt{flex:1 1 180px;min-width:0;}
.cont-itin-pt label{display:block;font-size:11px;font-weight:800;color:var(--muted);margin-bottom:3px;letter-spacing:.03em;}
.cont-itin-pt input{width:100%;}
.cont-itin-arr{align-self:center;padding-top:14px;font-weight:900;color:var(--gold);}
.cont-addr{font-size:11px;margin-top:3px;min-height:14px;text-transform:none;}
.cont-addr a{color:var(--accent);font-weight:700;}
.cont-addr-ok{color:var(--muted);}
.cont-addr-miss{color:var(--amber);font-weight:800;font-size:11px;}
.cont-warn{color:var(--red);font-weight:800;font-size:12px;margin-bottom:6px;}
.cont-ht{font-size:12px;}
.cont-ht i{font-style:normal;color:var(--gold);font-weight:900;}
.cont-ht-miss{color:var(--light);}
.cont-kieu{font-weight:800;white-space:nowrap;}
tr.cont-loc-miss td{background:var(--band-amber)!important;}
@media (max-width:700px){.cont-seg{grid-template-columns:1fr;}.cont-itin-arr{display:none;}}

/* CHỜ CẤP (sv-wait) — rộng thêm 30% (JS đặt width = 1.3 × bề rộng nội dung) */
#oil-shell .oil-wait{min-width:0;}
#oil-shell .oil-wait .tbl.tbl-fit td.num{white-space:nowrap;}
@media print{#oil-shell .oil-wait{width:auto!important;max-width:none!important;}}

/* ===== NHẬP DẦU — CÔNG NỢ THEO HÓA ĐƠN (màu trạng thái cố định, không phụ thuộc theme) ===== */
#oil-shell .oil-debt{--d-ok:#1f7a45;--d-ok-bg:#e3f4ea;--d-mp:#a86200;--d-mp-bg:#fff1d6;--d-no:#b3261e;--d-no-bg:#fde7e5;--d-od:#ffffff;--d-od-bg:#c62828;--d-kh:#1d4f91;--d-kh-bg:#e3edfb;max-width:1500px;}
#oil-shell .debt-filters{display:flex;flex-direction:column;gap:8px;margin:0 0 12px;}
#oil-shell .debt-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;}
#oil-shell .debt-chips{display:inline-flex;flex-wrap:wrap;gap:6px;}
#oil-shell .debt-chip{border:1.5px solid var(--border2);background:var(--card);color:var(--text);border-radius:999px;padding:7px 14px;font-size:13px;font-weight:800;letter-spacing:.04em;cursor:pointer;text-transform:uppercase;}
#oil-shell .debt-chip:hover{border-color:var(--navy);}
#oil-shell .debt-chip.on{background:var(--navy);border-color:var(--navy);color:var(--on,#fff);}
#oil-shell .debt-chip.chip-hot{border-color:var(--d-no);color:var(--d-no);}
#oil-shell .debt-chip.chip-hot.on{background:var(--d-od-bg);border-color:var(--d-od-bg);color:#fff;}
#oil-shell .debt-month,#oil-shell .debt-q{font-size:13px;font-weight:700;padding:7px 10px;border-radius:10px;}
#oil-shell .debt-q{min-width:220px;}
#oil-shell .debt-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:0 0 12px;}
#oil-shell .debt-card{background:var(--card);border:1.5px solid var(--border2);border-radius:16px;padding:14px 14px 12px;text-align:center;min-width:0;}
#oil-shell .debt-card-l{font-size:13px;font-weight:900;letter-spacing:.06em;color:var(--muted);}
#oil-shell .debt-card-v{font-size:26px;font-weight:900;margin-top:6px;font-variant-numeric:tabular-nums;line-height:1.15;color:var(--text);}
#oil-shell .debt-card-u{font-size:13px;font-weight:800;letter-spacing:.04em;}
#oil-shell .debt-card-s{font-size:12px;font-weight:700;margin-top:6px;color:var(--muted);letter-spacing:.03em;}
#oil-shell .debt-card.c-ok .debt-card-v{color:var(--d-ok);}
#oil-shell .debt-card.c-no .debt-card-v{color:var(--d-no);}
#oil-shell .debt-card.c-no.hot{background:var(--d-no-bg);border:2.5px solid var(--d-no);}
#oil-shell .debt-card.c-od.hot{background:var(--d-od-bg);border-color:var(--d-od-bg);}
#oil-shell .debt-card.c-od.hot .debt-card-l,#oil-shell .debt-card.c-od.hot .debt-card-v,#oil-shell .debt-card.c-od.hot .debt-card-s{color:#fff;}
#oil-shell .debt-card.c-hh .debt-card-v{color:var(--d-mp);}
#oil-shell .debt-aging{display:grid;grid-template-columns:auto repeat(3,minmax(0,1fr));gap:10px;align-items:stretch;margin:0 0 12px;}
#oil-shell .debt-aging-t{display:flex;align-items:center;font-size:12px;font-weight:900;letter-spacing:.06em;color:var(--muted);padding:0 6px;}
#oil-shell .debt-age{border:1.5px solid var(--border2);border-radius:12px;padding:8px 12px;background:var(--card);display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;}
#oil-shell .debt-age-l{font-size:12px;font-weight:900;letter-spacing:.05em;}
#oil-shell .debt-age-v{font-size:18px;font-weight:900;font-variant-numeric:tabular-nums;}
#oil-shell .debt-age-v span{font-size:11px;}
#oil-shell .debt-age-s{font-size:12px;font-weight:700;color:var(--muted);}
#oil-shell .debt-age.a0.has{background:var(--d-mp-bg);border-color:var(--d-mp);}
#oil-shell .debt-age.a1.has{background:var(--d-no-bg);border-color:var(--d-no);}
#oil-shell .debt-age.a2.has{background:var(--d-od-bg);border-color:var(--d-od-bg);color:#fff;}
#oil-shell .debt-age.a2.has .debt-age-s{color:#fff;}
#oil-shell .debt-card-tbl{width:max-content;max-width:100%;overflow:auto;}
#oil-shell .debt-tbl{width:max-content;font-size:15px;}
#oil-shell .debt-tbl th{font-size:13px;padding:8px 10px;white-space:nowrap;}
#oil-shell .debt-tbl td{padding:7px 10px;white-space:nowrap;font-variant-numeric:tabular-nums;}
#oil-shell .debt-tbl tr.debt-da td{background:var(--d-ok-bg)!important;}
#oil-shell .debt-tbl tr.debt-mp td{background:var(--d-mp-bg)!important;}
#oil-shell .debt-tbl tr.debt-chua td{background:var(--d-no-bg)!important;}
#oil-shell .debt-tbl tr.debt-od td{background:#f9c9c4!important;}
#oil-shell .debt-tbl tr.debt-od td:first-child{box-shadow:inset 5px 0 0 var(--d-od-bg);}
#oil-shell .debt-tbl tr.debt-chua td:first-child{box-shadow:inset 5px 0 0 var(--d-no);}
#oil-shell .debt-tbl tr.debt-mp td:first-child{box-shadow:inset 5px 0 0 var(--d-mp);}
#oil-shell .debt-tbl tr.debt-da td:first-child{box-shadow:inset 5px 0 0 var(--d-ok);}
#oil-shell .debt-tbl td.debt-con{font-weight:900;}
#oil-shell .debt-tbl tr.debt-chua td.debt-con,#oil-shell .debt-tbl tr.debt-od td.debt-con,#oil-shell .debt-tbl tr.debt-mp td.debt-con{color:var(--d-no);}
#oil-shell .debt-badge{display:inline-block;padding:3px 9px;border-radius:999px;font-size:11.5px;font-weight:900;letter-spacing:.04em;white-space:nowrap;}
#oil-shell .debt-badge.b-da{background:var(--d-ok);color:#fff;}
#oil-shell .debt-badge.b-mot_phan{background:var(--d-mp);color:#fff;}
#oil-shell .debt-badge.b-chua{background:var(--d-no-bg);color:var(--d-no);border:1.5px solid var(--d-no);}
#oil-shell .debt-badge.b-od{background:var(--d-od-bg);color:#fff;}
#oil-shell .debt-badge.b-kh{background:var(--d-kh-bg);color:var(--d-kh);border:1.5px solid var(--d-kh);}
#oil-shell .debt-muted{color:var(--muted);font-size:12px;font-weight:700;}
@media (max-width:1100px){#oil-shell .debt-cards{grid-template-columns:repeat(2,minmax(0,1fr));}#oil-shell .debt-aging{grid-template-columns:1fr;}}
@media print{
  @page{size:A4 landscape;margin:8mm;}
  #oil-shell .debt-filters{display:none!important;}
  #oil-shell .debt-card-tbl{width:auto;max-width:none;overflow:visible;}
  #oil-shell .debt-tbl{width:100%;font-size:11px;}
  #oil-shell .debt-tbl th,#oil-shell .debt-tbl td{padding:3px 5px;}
  #oil-shell .debt-tbl tr td{-webkit-print-color-adjust:exact;print-color-adjust:exact;}
}

/* ===== Phân trang danh sách dầu ===== */
#oil-shell tr.pg-hide{display:none;}
#oil-shell .oil-pg{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:6px 0 14px;font-size:13px;font-weight:800;letter-spacing:.03em;}
#oil-shell .oil-pg-info{color:var(--muted);}
#oil-shell .oil-pg-nav{display:inline-flex;align-items:center;gap:4px;}
#oil-shell .oil-pg-nav button{min-width:34px;height:32px;border:1.5px solid var(--border2);background:var(--card);color:var(--text);border-radius:8px;font-weight:900;font-size:15px;cursor:pointer;}
#oil-shell .oil-pg-nav button:hover:not(:disabled){border-color:var(--navy);}
#oil-shell .oil-pg-nav button:disabled{opacity:.35;cursor:default;}
#oil-shell .oil-pg-cur{padding:0 10px;}
#oil-shell .oil-pg-size{font-size:13px;font-weight:800;padding:5px 8px;border-radius:8px;}
@media print{#oil-shell tr.pg-hide{display:table-row!important;}#oil-shell .oil-pg{display:none!important;}}
/* ===== Công nợ: chọn & thanh toán ===== */
#oil-shell .debt-card-tbl .card-header{gap:12px;}
#oil-shell .debt-pay-sel{margin-left:auto;font-size:13px;font-weight:900;}
#oil-shell .debt-pay-sel:disabled{opacity:.45;cursor:default;}
#oil-shell .debt-tbl .debt-chk-col,#oil-shell .debt-tbl td.debt-np{width:1%;}
#oil-shell .debt-tbl input[type=checkbox]{width:18px;height:18px;cursor:pointer;vertical-align:middle;}
#oil-shell .debt-pay-btn{font-size:12px;font-weight:900;white-space:nowrap;}
.debt-pay-form .debt-pay-tbl{width:100%;margin-bottom:12px;font-size:14px;}
.debt-pay-form .debt-pay-tbl td{white-space:nowrap;padding:6px 8px;}
.debt-pay-form .debt-pay-amt{width:150px;text-align:right;font-weight:800;font-size:14px;}
.debt-pay-form .debt-muted{color:var(--muted);font-size:12px;font-weight:700;}

/* Công nợ: HĐ thanh toán trong ngày */
#oil-shell .debt-tbl tr.debt-today td{background:#dff3fb!important;}
#oil-shell .debt-tbl tr.debt-today td:first-child{box-shadow:inset 5px 0 0 #1f8fb8;}
#oil-shell .debt-badge.b-today{background:#1f8fb8;color:#fff;}

/* Công nợ: khung bảng rộng bằng hàng thẻ phía trên, hiện đủ cột */
#oil-shell .oil-debt .debt-card-tbl{width:100%;max-width:100%;overflow-x:auto;}
#oil-shell .oil-debt .debt-tbl{width:100%;min-width:max-content;table-layout:auto;}
#oil-shell .oil-debt .debt-tbl td.debt-np,#oil-shell .oil-debt .debt-tbl th.debt-np{width:1%;}

/* Công nợ: bảng co giãn theo nội dung (không kéo full), trạng thái canh trái */
#oil-shell .oil-debt .debt-card-tbl{width:max-content;max-width:100%;overflow-x:auto;}
#oil-shell .oil-debt .debt-tbl{width:max-content;min-width:0;table-layout:auto;}
#oil-shell .oil-debt .debt-tbl th{padding:8px 14px;}
#oil-shell .oil-debt .debt-tbl td{padding:7px 14px;}
#oil-shell .oil-debt .debt-tbl td.debt-st{text-align:left;}
#oil-shell .oil-debt .debt-tbl td.debt-np,#oil-shell .oil-debt .debt-tbl th.debt-np{padding-left:8px;padding-right:8px;}

/* Lọc nhanh + khoảng ngày (Hóa đơn nhập & Công nợ) */
#oil-shell .oil-nhapf{max-width:none;}
#oil-shell .rng{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px;padding:4px 8px;border:1.5px solid var(--border2);border-radius:12px;background:var(--card);}
#oil-shell .rng.on{border-color:#1f8fb8;box-shadow:0 0 0 2px rgba(31,143,184,.18);}
#oil-shell .rng-l{font-size:12px;font-weight:800;letter-spacing:.04em;}
#oil-shell .rng-box{position:relative;display:inline-flex;align-items:center;}
#oil-shell .rng-txt{width:118px;font-size:13px;font-weight:700;padding:6px 30px 6px 8px;border-radius:8px;}
#oil-shell .rng-pick{position:absolute;right:2px;top:50%;transform:translateY(-50%);width:26px;height:26px;padding:0;border:0;background:transparent;color:transparent;cursor:pointer;}
#oil-shell .rng-pick::-webkit-datetime-edit{display:none;}
#oil-shell .rng-pick::-webkit-calendar-picker-indicator{margin:0;cursor:pointer;opacity:.75;}
/* TT hôm nay: nổi bật hơn dòng thường (tự hết khi qua ngày) */
#oil-shell .debt-tbl tr.debt-today td,#oil-shell table.tbl tr.nhap-today td{background:#bfe7f7!important;font-weight:700;}
#oil-shell .debt-tbl tr.debt-today td:first-child,#oil-shell table.tbl tr.nhap-today td:first-child{box-shadow:inset 6px 0 0 #0b78a3;}
#oil-shell .nhap-badge-today{display:inline-block;background:#0b78a3;color:#fff;border-radius:999px;padding:2px 8px;font-size:11px;font-weight:800;letter-spacing:.03em;white-space:nowrap;vertical-align:middle;}
#oil-shell .debt-badge.b-today{background:#0b78a3;color:#fff;}

/* Hóa đơn nhập: 6 khung tổng hợp trên 1 dòng, rộng đúng bằng bảng */
#oil-shell .oil-debt.nhap-sumwrap{max-width:none;}
#oil-shell .debt-cards.nhap-cards{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:0 0 10px;box-sizing:border-box;max-width:100%;}
#oil-shell .nhap-cards .debt-card{padding:10px 8px;box-sizing:border-box;}
#oil-shell .nhap-cards .debt-card-l{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#oil-shell .nhap-cards .debt-card-v{font-size:21px;margin-top:4px;white-space:nowrap;}
#oil-shell .nhap-cards .debt-card-u{font-size:11px;}
#oil-shell .nhap-cards .debt-card.c-all .debt-card-v{color:var(--d-kh);}
#oil-shell .nhap-cards .debt-card.c-no.hot{background:var(--d-no-bg);border:2.5px solid var(--d-no);}
#oil-shell .nhap-cards .debt-card.c-no.hot .debt-card-l{color:var(--d-no);}
#oil-shell .nhap-cards.nhap-narrow{grid-template-columns:repeat(3,minmax(0,1fr));}
@media (max-width:1100px){#oil-shell .debt-cards.nhap-cards{grid-template-columns:repeat(6,minmax(0,1fr));}#oil-shell .debt-cards.nhap-cards.nhap-narrow{grid-template-columns:repeat(3,minmax(0,1fr));}}
#oil-shell .nhap-cards .debt-card.c-no:not(.hot) .debt-card-v{color:var(--d-ok);}
#oil-shell .nhap-cards.nhap-tight .debt-card{padding:9px 4px;}
#oil-shell .nhap-cards.nhap-tight .debt-card-l{font-size:11px;letter-spacing:.03em;}
#oil-shell .nhap-cards.nhap-tight .debt-card-v{font-size:17px;}
#oil-shell .nhap-cards.nhap-tight .debt-card-u{font-size:10px;}
#oil-shell .nhap-cards.nhap-tight .debt-card-v{font-size:18px;}
#oil-shell .nhap-cards.nhap-tight .debt-card-u{display:block;font-size:10px;margin-top:2px;}
#oil-shell .rng-txt{width:132px;}
/* PT — nút phân tích giá trong cột thao tác (không làm dòng cao/rộng thêm) */
.tbl .btn-icon.pt-btn{font-family:Roboto,"Segoe UI",system-ui,sans-serif;font-size:9px;font-weight:900;letter-spacing:.02em;line-height:11px;padding:1px 3px;margin:0 3px 0 0;border:1px solid currentColor;border-radius:3px;vertical-align:middle;color:#8f8f8f;background:transparent;}
.tbl .btn-icon.pt-btn.pt-none{opacity:.75;}
.tbl .btn-icon.pt-btn.pt-ok{color:#2e7d32;background:#e3f1e1;}
.tbl .btn-icon.pt-btn.pt-warn{color:#a86400;background:#fdf0d5;}
.tbl .btn-icon.pt-btn.pt-bad{color:#c0392b;background:#fbe1dd;}
.tbl .btn-icon.pt-btn.pt-na{color:#56677a;background:#e8edf2;}
.tbl .btn-icon.pt-btn.pt-stale{border-style:dashed;}
.tbl .btn-icon.pt-btn:hover{filter:brightness(.92);}
/* back1 */
.print-overlay.show{align-items:stretch;justify-content:stretch;}
.print-box{width:100vw!important;height:100vh!important;height:100dvh!important;border-radius:0!important;}
.print-header{position:sticky;top:0;z-index:5;min-height:52px;font-family:Roboto,'Segoe UI',sans-serif;text-transform:uppercase;justify-content:flex-start!important;}
.print-header .print-actions{flex:1;}
.print-header .pv-back{font-size:15px;font-weight:900;padding:9px 18px;min-height:40px;letter-spacing:.03em;background:var(--on,#fff)!important;color:var(--navy,#1a2744)!important;border:2px solid var(--on,#fff)!important;box-shadow:0 2px 8px rgba(0,0,0,.25);}
.print-header .pv-back:hover{filter:brightness(.92);}
.print-header .pv-hint{font-size:11px;font-weight:700;opacity:.75;white-space:nowrap;}
@media (max-width:700px){.print-header{flex-wrap:wrap}.print-header .pv-hint{display:none}}
@media print{.print-header{display:none!important}}
.print-header .print-actions .btn{font-size:13px;font-weight:800;padding:7px 14px;min-height:34px;}
.print-header .print-actions .btn-outline,.print-header .print-actions .btn-ghost{color:var(--on,#fff)!important;border:1.5px solid var(--on,#fff)!important;background:transparent!important;opacity:1;}
.print-header .print-actions .btn:disabled{opacity:.55;}
/* fee: ẩn thanh cuộn dọc của khung nội dung (vẫn cuộn được, tiêu đề bảng vẫn dính) + nút lọc trạng thái */
#fee-shell .content{scrollbar-width:none;-ms-overflow-style:none;}
#fee-shell .content::-webkit-scrollbar{width:0;height:0;display:none;}
#fee-shell .filter-bar .fee-checks{display:flex;gap:3px;align-items:center;flex:0 0 auto;padding:0;}
#fee-shell .fee-tg{font:inherit;font-size:10px;font-weight:800;letter-spacing:.02em;padding:4px 7px;border-radius:999px;border:1.5px solid var(--tg,var(--navy));background:#fff;color:var(--tg,var(--navy));cursor:pointer;white-space:nowrap;line-height:1.2;transition:background .12s,color .12s;}
#fee-shell .fee-tg.on{background:var(--tg,var(--navy));color:#fff;}
#fee-shell .fee-tg-DA_CAP{--tg:#2e7d32;}
#fee-shell .fee-tg-VUA_CAP{--tg:#b26a00;}
#fee-shell .fee-tg-CHO_CAP{--tg:#b42318;}
#fee-shell .fee-tg-ALL{--tg:var(--navy);}
@media print{#fee-shell .fee-checks{display:none!important;}}
/* zicon1: one compact Z icon next to IN in TÓM TẮT PHÍ CHỜ CẤP */
.btn-zalo-icon{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;min-width:26px;padding:0;margin:0 0 0 6px;border:0;border-radius:8px;background:#0068ff;color:#fff;font:900 13px/1 Roboto,"Segoe UI",system-ui,sans-serif;letter-spacing:0;cursor:pointer;box-shadow:0 2px 6px rgba(0,104,255,.25);text-transform:none;flex-shrink:0;}
.btn-zalo-icon:hover{background:#0055d4;color:#fff;}
.btn-zalo-icon[disabled]{opacity:.7;cursor:wait;}
#fee-shell .card:has(table.tbl.fee-cho) .card-header .btn-zalo-icon{background:#0068ff;color:#fff;border:0;}
#fee-shell .card:has(table.tbl.fee-cho) .card-header .btn-zalo-icon:hover{background:#0055d4;color:#fff;}
#fee-shell .zs-btn{display:none!important;} /* no generic GỬI ZALO on fee page */
.btn-zalo{background:#0068ff;color:#fff;border:1px solid #0068ff;margin-left:auto;margin-right:6px;font-weight:700}
.btn-zalo:hover{background:#0055d4}
.btn-zalo[disabled]{opacity:.7}
.card-header .btn-zalo + .btn-print{margin-left:0}
.fee-zalo-body{display:flex;flex-direction:column;gap:10px}
.fee-zalo-hint{font-weight:700;color:#b42318;text-transform:none}
.fee-zalo-btns{display:flex;gap:10px;flex-wrap:wrap}
.fee-zalo-big{flex:1 1 220px;background:#0068ff;color:#fff;border:1px solid #0068ff;font-weight:700;font-size:15px;padding:14px 12px}
.fee-zalo-big:hover{background:#0055d4}
.fee-zalo-fb{text-transform:none}
.fee-zalo-fb:empty{display:none}
.fee-zalo-prev{max-height:62vh;overflow:auto;border:1px solid #e5e7eb;border-radius:8px;background:#f3f4f6}
.fee-zalo-prev img{display:block;width:100%;max-width:720px;margin:0 auto}
.fee-zalo-ta{min-height:110px;width:100%;text-transform:none;font-family:inherit}
/* share1 long-press fallback */
.fee-lp-note{font-weight:700;color:#b91c1c;margin:8px 0 6px;text-align:center}
.fee-lp-img{display:block;max-width:100%;height:auto;margin:0 auto 8px;-webkit-touch-callout:default;user-select:auto;border:1px solid #e2e8f0;border-radius:8px}
#fee-qr-note .btn,#fee-zalo-imgfb .btn{margin-top:4px}
#fee-zalo-imgfb{text-align:center}

/* apk1 external image fallback */
.fee-ext{margin:10px 0;text-align:center;text-transform:none}
.fee-ext-btns{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:6px 0}
.fee-ext-alt{background:#fff;border:1px solid #0068ff;color:#0068ff;font-weight:700;padding:12px 10px;text-decoration:none}
.fee-ext-hint{font-size:13px;color:#334155;margin:4px 0}
.fee-ext-url input{width:100%;font-size:12px;text-transform:none}
.fee-ext-wait{color:#64748b;font-size:13px}.fee-ext-err{color:#b91c1c;font-weight:700}

/* ================= PHÂN HỆ DẦU — TÔNG XANH DẦU (PETROL TEAL) + ĐIỂM NHẤN CAM ẤM =================
   Chỉ áp cho #oil-shell (không ảnh hưởng phân hệ khác / cài đặt giao diện mono của các phần khác) */
#oil-shell{
  --navy:#0f4c5c;--navy2:#0a3a46;--navy3:#136779;--navy4:#1d8193;
  --white:#f3faf8;--bg:#e6f0ee;--bg2:#d2e4e0;--card:#ffffff;
  --border:#bcd5cf;--border2:#93bab1;
  --text:#0d2b30;--muted:#47676b;--light:#7d9b9e;
  --red:#b3261e;--green:#1e7a46;--amber:#c0650f;
  --gold:#e8892b;--accent:#e8892b;
  --tt-bg:#d6eedb;--tt-fg:#1e6b34;--cong-bg:#fde2c2;--cong-fg:#8a4508;--band-red:#fff3a6;
  --on:#ffffff;--on-dim:rgba(255,255,255,.8);--on-faint:rgba(255,255,255,.5);
  --chrome-line:rgba(255,255,255,.16);--chrome-hover:rgba(255,255,255,.1);
  --sum:#0b3d47;--sum-bg:#d6ebe7;--stripe:rgba(15,76,92,.05);--hover:rgba(15,76,92,.08);
  --paper:#ffffff;--ok:#1e7a46;--overlay:rgba(6,36,43,.55);
  background:var(--bg);color:var(--text);
}
#oil-shell .sidebar{background:linear-gradient(180deg,#0f4c5c 0%,#0a3a46 100%);}
#oil-shell .sidebar-header{border-bottom:3px solid #e8892b;}
#oil-shell .nav-item.active{background:rgba(232,137,43,.22)!important;box-shadow:inset 4px 0 0 #e8892b;color:#fff!important;}
#oil-shell .nav-group-label{color:#9fd3cb!important;}
#oil-shell .topbar{background:#fff;border-bottom:3px solid #e8892b;}
#oil-shell .topbar .title{color:#0f4c5c;font-size:17px;}
#oil-shell .main,#oil-shell .content{background:var(--bg);}
#oil-shell .btn-primary{background:#e8892b;color:#fff;border-color:#e8892b;}
#oil-shell .btn-primary:hover{background:#cf7418;}
#oil-shell .btn-outline{border-color:#0f4c5c;color:#0f4c5c;}
#oil-shell .tbl th{background:#0f4c5c;border-color:#0a3a46;}
#oil-shell .tbl tr.row-total td,#oil-shell .tbl tr.row-total:hover td{background:#0b3d47!important;color:#fff!important;}
#oil-shell .tab.active{color:#0f4c5c;border-bottom-color:#e8892b;}
#oil-shell select,#oil-shell input[type=text]{border-color:#93bab1;}
/* 4 khung tổng hợp */
#oil-shell .oil-kpi{border:1.5px solid #93bab1;border-radius:16px;box-shadow:0 1px 0 rgba(15,76,92,.06);}
#oil-shell .oil-kpi-l{color:#0f4c5c;font-size:13px;}
#oil-shell .oil-kpi-v{font-size:26px;color:#0f4c5c;}
#oil-shell .oil-kpi-v.green{color:#1e7a46;}
#oil-shell .oil-kpi-v.amber{color:#c0650f;}
#oil-shell .oil-kpi-v.red{color:#8a6a00;}
#oil-shell .oil-kpi-wait{background:#fff3a6;border:2.5px solid #e8892b;box-shadow:none;}
/* màu dòng theo trạng thái — hài hòa với tông mới */
#oil-shell .oil-issue-sheet tr.st-da td,#oil-shell .oil-issue-sheet tr.st-da:hover td{background:#dcefdc!important;color:#123d22!important;}
#oil-shell .oil-issue-sheet tr.st-vua td,#oil-shell .oil-issue-sheet tr.st-vua:hover td{background:#fde2c2!important;color:#5a2d04!important;}
#oil-shell .oil-issue-sheet tr.st-cho td,#oil-shell .oil-issue-sheet tr.st-cho:hover td{background:#fff3a6!important;color:#4d3b00!important;}
#oil-shell .oil-issue-sheet tr.st-da td:first-child{box-shadow:inset 5px 0 0 #1e7a46;}
#oil-shell .oil-issue-sheet tr.st-vua td:first-child{box-shadow:inset 5px 0 0 #d9761a;}
#oil-shell .oil-issue-sheet tr.st-cho td:first-child{box-shadow:inset 5px 0 0 #c9a400;}
#oil-shell .oil-issue-sheet .badge-ok{background:#fff;color:#1e6b34;border:1.5px solid #1e7a46;}
#oil-shell .oil-issue-sheet .badge-kh{background:#fff;color:#a8560c;border:1.5px solid #d9761a;}
#oil-shell .oil-issue-sheet .badge-no{background:#fff;color:#7a5d00;border:1.5px solid #c9a400;}
#oil-shell .oil-issue-sheet .badge{font-size:12px;font-weight:800;padding:3px 10px;border-radius:999px;}
#oil-shell .oil-issue-sheet .tbl.tbl-fit{font-size:17px;}
#oil-shell .oil-issue-sheet .tbl.tbl-fit th{font-size:14px;padding:8px 10px;}
#oil-shell .oil-issue-sheet .tbl.tbl-fit td{padding:7px 10px;}
#oil-shell .oil-issue-sheet > .card{border:1.5px solid #93bab1;border-radius:14px;overflow:hidden;}
/* nút chọn nhiều trạng thái (kiểu Cấp phí, to dễ bấm) */
#oil-shell .oil-tg-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:2px 0 12px;max-width:1300px;}
#oil-shell .oil-tgs{display:flex;flex-wrap:wrap;gap:8px;}
#oil-shell .oil-tg{--tg:#0f4c5c;--tgb:#ffffff;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border-radius:999px;border:2px solid var(--tg);background:#fff;color:var(--tg);font:inherit;font-size:15px;font-weight:900;letter-spacing:.04em;cursor:pointer;user-select:none;transition:background .12s,color .12s,box-shadow .12s;}
#oil-shell .oil-tg:hover{box-shadow:0 0 0 3px rgba(15,76,92,.12);}
#oil-shell .oil-tg.on{background:var(--tg);color:#fff;}
#oil-shell .oil-tg-ck{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:6px;border:2px solid currentColor;font-size:13px;line-height:1;}
#oil-shell .oil-tg-n{display:inline-block;min-width:26px;padding:2px 8px;border-radius:999px;background:rgba(15,76,92,.1);color:inherit;font-size:13px;text-align:center;}
#oil-shell .oil-tg.on .oil-tg-n{background:rgba(255,255,255,.25);}
#oil-shell .oil-tg-DA_CAP{--tg:#1e7a46;}
#oil-shell .oil-tg-VUA_CAP{--tg:#c8650d;}
#oil-shell .oil-tg-CHO_CAP{--tg:#a88400;}
#oil-shell .oil-tg-CHO_CAP.on{background:#fff3a6;color:#4d3b00;border-color:#a88400;}
#oil-shell .oil-tg-ALL{--tg:#0f4c5c;}
#oil-shell .oil-zalo-btn{min-height:44px;padding:8px 20px;border-radius:999px;border:0;background:#0068ff;color:#fff;font:inherit;font-size:15px;font-weight:900;letter-spacing:.05em;cursor:pointer;box-shadow:0 2px 0 rgba(0,0,0,.12);}
#oil-shell .oil-zalo-btn:hover{background:#0056d6;}
#oil-shell .oil-zalo-btn:disabled{opacity:.6;cursor:wait;}
.oil-zalo-body .fee-zalo-btns{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.oil-zalo-body .fee-zalo-prev img{max-width:100%;height:auto;border:1px solid #bcd5cf;border-radius:8px;}
@media (max-width:760px){#oil-shell .oil-tg{font-size:14px;padding:8px 12px;}#oil-shell .oil-zalo-btn{width:100%;}}
@media print{#oil-shell .oil-tg-row{display:none!important;}}
#oil-shell .oil-issue-sheet{min-width:min(100%,960px);}
#oil-shell .oil-issue-sheet .oil-empty{background:#fff;border:1.5px dashed #93bab1;border-radius:14px;padding:22px 16px;font-size:15px;font-weight:800;color:#0f4c5c;text-align:center;}

/* ================= PHÂN HỆ DẦU — VÙNG BẢNG ĐEN / TRẮNG / XÁM (lợt → đậm) =================
   ĐÃ CẤP / ĐÃ TT = xám lợt · VỪA CẤP / TT MỘT PHẦN = xám vừa · CHỜ CẤP / CHƯA TT = xám đậm. Chỉ #oil-shell. */
#oil-shell{--bw-1:#f4f4f4;--bw-2:#dcdcdc;--bw-3:#bdbdbd;--bw-ink:#111111;--bw-edge1:#9e9e9e;--bw-edge2:#5f5f5f;--bw-edge3:#111111;}
#oil-shell .tbl th,#oil-shell .card.ton-dau .tbl.tbl-a4 th,#oil-shell .card.ton-nhot .tbl.tbl-a4 th,#oil-shell .debt-tbl th{background:#000!important;color:#fff!important;border-color:#000!important;}
#oil-shell .tbl tr.row-total td,#oil-shell .tbl tr.row-total:hover td,
#oil-shell .card.ton-dau .tbl.tbl-a4 tr.row-total td,#oil-shell .card.ton-nhot .tbl.tbl-a4 tr.row-total td,
#oil-shell .tbl .row-band td{background:#000!important;color:#fff!important;}
#oil-shell .card.ton-dau .card-header,#oil-shell .card.ton-nhot .card-header{background:#000;border-bottom-color:#000;}
#oil-shell .card.ton-dau .card-header h3,#oil-shell .card.ton-nhot .card-header h3{color:#fff;}
#oil-shell .card.ton-nhot{border-color:#9e9e9e;}
#oil-shell .card.ton-nhot .tbl.tbl-a4 tr:nth-child(even) td{background:#f0f0f0;}
#oil-shell .oil-rep-band .oil-rep-cell{background:#000;border-color:#000;color:#fff;}
#oil-shell .tbl td{color:#111;}
/* dòng theo trạng thái (cấp dầu) */
#oil-shell .oil-issue-sheet tr.st-da td,#oil-shell .oil-issue-sheet tr.st-da:hover td{background:var(--bw-1)!important;color:#111!important;}
#oil-shell .oil-issue-sheet tr.st-vua td,#oil-shell .oil-issue-sheet tr.st-vua:hover td{background:var(--bw-2)!important;color:#111!important;}
#oil-shell .oil-issue-sheet tr.st-cho td,#oil-shell .oil-issue-sheet tr.st-cho:hover td{background:var(--bw-3)!important;color:#000!important;}
#oil-shell .oil-issue-sheet tr.st-da td:first-child{box-shadow:inset 5px 0 0 var(--bw-edge1);}
#oil-shell .oil-issue-sheet tr.st-vua td:first-child{box-shadow:inset 5px 0 0 var(--bw-edge2);}
#oil-shell .oil-issue-sheet tr.st-cho td:first-child{box-shadow:inset 5px 0 0 var(--bw-edge3);}
#oil-shell .oil-issue-sheet > .card{border-color:#9e9e9e;}
/* badge xám/đen */
#oil-shell .badge-ok,#oil-shell .oil-issue-sheet .badge-ok{background:#fff!important;color:#444!important;border:1.5px solid #9e9e9e!important;}
#oil-shell .badge-kh,#oil-shell .oil-issue-sheet .badge-kh{background:#fff!important;color:#222!important;border:1.5px solid #5f5f5f!important;}
#oil-shell .badge-no,#oil-shell .oil-issue-sheet .badge-no{background:#111!important;color:#fff!important;border:1.5px solid #111!important;}
/* 4 khung tổng hợp cấp dầu */
#oil-shell .oil-kpi{border-color:#9e9e9e;background:#fff;}
#oil-shell .oil-kpi-l,#oil-shell .oil-kpi-v,#oil-shell .oil-kpi-v.green,#oil-shell .oil-kpi-v.amber,#oil-shell .oil-kpi-v.red{color:#111!important;}
#oil-shell .oil-kpi-wait{background:var(--bw-3)!important;border:2.5px solid #000!important;}
/* nút trạng thái */
#oil-shell .oil-tg,#oil-shell .oil-tg-DA_CAP,#oil-shell .oil-tg-VUA_CAP,#oil-shell .oil-tg-CHO_CAP,#oil-shell .oil-tg-ALL{--tg:#111;}
#oil-shell .oil-tg-n{background:rgba(0,0,0,.08);}
#oil-shell .oil-tg.oil-tg-DA_CAP.on{background:var(--bw-1);color:#111;border-color:#111;}
#oil-shell .oil-tg.oil-tg-VUA_CAP.on{background:var(--bw-2);color:#111;border-color:#111;}
#oil-shell .oil-tg.oil-tg-CHO_CAP.on{background:var(--bw-3);color:#000;border-color:#000;}
#oil-shell .oil-tg.oil-tg-ALL.on{background:#000;color:#fff;border-color:#000;}
#oil-shell .oil-tg.on .oil-tg-n{background:rgba(0,0,0,.12);}
#oil-shell .oil-tg.oil-tg-ALL.on .oil-tg-n{background:rgba(255,255,255,.25);}
#oil-shell .oil-tg:hover{box-shadow:0 0 0 3px rgba(0,0,0,.12);}
/* Công nợ + Hóa đơn nhập: đã TT lợt · một phần vừa · chưa TT đậm · TT hôm nay viền đen đậm + chữ đậm */
#oil-shell .oil-debt{--d-ok:#444;--d-ok-bg:var(--bw-1);--d-mp:#222;--d-mp-bg:var(--bw-2);--d-no:#000;--d-no-bg:var(--bw-3);--d-od:#fff;--d-od-bg:#000;--d-kh:#222;--d-kh-bg:#fff;}
#oil-shell .debt-tbl tr.debt-da td{background:var(--bw-1)!important;}
#oil-shell .debt-tbl tr.debt-mp td{background:var(--bw-2)!important;}
#oil-shell .debt-tbl tr.debt-chua td,#oil-shell .debt-tbl tr.debt-od td{background:var(--bw-3)!important;color:#000;}
#oil-shell .debt-tbl tr.debt-da td:first-child{box-shadow:inset 5px 0 0 var(--bw-edge1);}
#oil-shell .debt-tbl tr.debt-mp td:first-child{box-shadow:inset 5px 0 0 var(--bw-edge2);}
#oil-shell .debt-tbl tr.debt-chua td:first-child,#oil-shell .debt-tbl tr.debt-od td:first-child{box-shadow:inset 5px 0 0 #000;}
#oil-shell .debt-tbl tr.debt-today td,#oil-shell table.tbl tr.nhap-today td{font-weight:900!important;border-top:2.5px solid #000!important;border-bottom:2.5px solid #000!important;}
#oil-shell .debt-tbl tr.debt-today td:first-child,#oil-shell table.tbl tr.nhap-today td:first-child{border-left:2.5px solid #000!important;box-shadow:inset 6px 0 0 #000;}
#oil-shell .debt-tbl tr.debt-today td:last-child,#oil-shell table.tbl tr.nhap-today td:last-child{border-right:2.5px solid #000!important;}
#oil-shell table.tbl tr.nhap-today td{background:var(--bw-1)!important;}
#oil-shell .debt-tbl tr.debt-today.debt-da td{background:var(--bw-1)!important;}
#oil-shell .debt-badge{border:1.5px solid #111!important;}
#oil-shell .debt-badge.b-da{background:#fff!important;color:#444!important;border-color:#9e9e9e!important;}
#oil-shell .debt-badge.b-mot_phan{background:var(--bw-2)!important;color:#111!important;}
#oil-shell .debt-badge.b-chua{background:#111!important;color:#fff!important;}
#oil-shell .debt-badge.b-od{background:#000!important;color:#fff!important;}
#oil-shell .debt-badge.b-kh{background:#fff!important;color:#111!important;border-style:dashed!important;}
#oil-shell .debt-badge.b-today,#oil-shell .nhap-badge-today{background:#000!important;color:#fff!important;border:1.5px solid #000;}
#oil-shell .debt-tbl tr.debt-chua td.debt-con,#oil-shell .debt-tbl tr.debt-od td.debt-con,#oil-shell .debt-tbl tr.debt-mp td.debt-con{color:#000;font-weight:900;}
/* thẻ Công nợ + 6 khung Hóa đơn nhập */
#oil-shell .debt-card{border-color:#9e9e9e;background:#fff;}
#oil-shell .debt-card .debt-card-v,#oil-shell .debt-card.c-ok .debt-card-v,#oil-shell .debt-card.c-no .debt-card-v,#oil-shell .debt-card.c-hh .debt-card-v,
#oil-shell .nhap-cards .debt-card.c-all .debt-card-v,#oil-shell .nhap-cards .debt-card.c-no:not(.hot) .debt-card-v{color:#111!important;}
#oil-shell .debt-card.c-no.hot,#oil-shell .nhap-cards .debt-card.c-no.hot{background:var(--bw-3)!important;border:2.5px solid #000!important;}
#oil-shell .nhap-cards .debt-card.c-no.hot .debt-card-l{color:#000;}
#oil-shell .debt-card.c-od.hot{background:#000!important;border-color:#000!important;}
#oil-shell .debt-chip.on{background:#000;border-color:#000;color:#fff;}
#oil-shell .debt-chip.chip-hot{border-color:#000;color:#000;}
#oil-shell .debt-chip.chip-hot.on{background:#000;color:#fff;}
#oil-shell .rng.on{border-color:#000;box-shadow:0 0 0 2px rgba(0,0,0,.15);}
#oil-shell .oil-issue-sheet .oil-empty{border-color:#9e9e9e;color:#111;}
/* tồn kho ký gửi — rộng, cân đối */
#oil-shell .card.oil-stock-card{width:auto!important;max-width:960px;margin:12px auto 0;padding:10px 12px;overflow-x:auto}
#oil-shell .tbl.tbl-fit.oil-stock{width:100%!important;table-layout:fixed;font-family:Roboto,Arial,sans-serif;font-size:15px}
#oil-shell .tbl.oil-stock th{font-size:13.5px;padding:9px 14px;letter-spacing:.04em}
#oil-shell .tbl.oil-stock td{padding:8px 14px;font-size:15px}
#oil-shell .tbl.oil-stock th:nth-child(n+2):nth-child(-n+4),#oil-shell .tbl.oil-stock td.num{text-align:right;font-variant-numeric:tabular-nums}
#oil-shell .tbl.oil-stock tr.row-total td,#oil-shell .tbl.oil-stock tr.row-band td{font-size:15.5px;font-weight:800}
#oil-shell .tbl.oil-stock td.empty-state{text-align:center;padding:10px}
#oil-shell .tbl.oil-stock th:first-child{text-align:left}

/* Bộ lọc Công nợ / Hóa đơn nhập: 2 dòng, trải hết chiều ngang */
#oil-shell .oilf2-wrap{max-width:none;}
#oil-shell .oil-debt .oilf2-wrap{max-width:none;}
#oil-shell .oilf2{display:flex;flex-direction:column;gap:8px;margin:0 0 12px;width:100%;box-sizing:border-box;}
#oil-shell .oilf2-r{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0;}
#oil-shell .oilf2 .debt-chips{flex-wrap:wrap;gap:5px;}
#oil-shell .oilf2 .debt-chip{padding:6px 11px;font-size:12.5px;letter-spacing:.03em;white-space:nowrap;}
#oil-shell .oilf2-sp{flex:1 1 0;min-width:0;}
#oil-shell .oilf2-slot{display:none;}
#oil-shell .oilf2 .debt-month{font-size:12.5px;padding:6px 8px;flex:0 0 auto;}
#oil-shell .oilf2 .debt-q{flex:1 1 180px;min-width:140px;width:auto;}
#oil-shell .oilf2 .rng{flex:0 0 auto;padding:3px 6px;gap:5px;}
#oil-shell .oilf2 .rng-l{font-size:11.5px;white-space:nowrap;}
#oil-shell .oilf2 .rng-txt{width:116px;padding:5px 28px 5px 7px;font-size:12.5px;}
#oil-shell .oilf2.oilf2-wide .oilf2-r{flex-wrap:nowrap;}
#oil-shell .oilf2.oilf2-wide .debt-chips{flex-wrap:nowrap;}
#oil-shell .oilf2.oilf2-tight .debt-chip{padding:6px 8px;font-size:11.5px;letter-spacing:.01em;}
#oil-shell .oilf2.oilf2-tight .rng-l{font-size:10.5px;}
#oil-shell .oilf2.oilf2-tight .rng-txt{width:104px;}
#oil-shell .rng .rng-apply,#oil-shell .rng .btn-primary{background:#111!important;border-color:#111!important;color:#fff!important;}
#oil-shell .rng .rng-apply:hover{background:#444!important;}
#oil-shell .rng .btn-outline{border-color:#777;color:#222;}
@media print{#oil-shell .oilf2-wrap{display:none!important;}}
#oil-shell .rng-ls{display:none;}
#oil-shell .oilf2.oilf2-tight .rng-lf{display:none;}
#oil-shell .oilf2.oilf2-tight .rng-ls{display:inline;}
#oil-shell .oilf2.oilf2-tight .oilf2-r{gap:6px;}
#oil-shell .oilf2.oilf2-tight .debt-chips{gap:4px;}
#oil-shell .oilf2.oilf2-tight .debt-chip{padding:6px 8px;font-size:12px;letter-spacing:.01em;}
#oil-shell .oilf2.oilf2-tight .rng{padding:3px 5px;gap:4px;}
#oil-shell .oilf2.oilf2-tight .rng-txt{width:100px;padding-right:26px;}
#oil-shell .oilf2.oilf2-tight .debt-month{max-width:112px;font-size:12px;padding:6px 4px;}
#oil-shell .oilf2.oilf2-tight .debt-q{min-width:110px;}
#oil-shell .oilf2.oilf2-tighter .debt-chip{padding:5px 6px;font-size:11.5px;letter-spacing:0;}
#oil-shell .oilf2.oilf2-tighter .rng-txt{width:94px;font-size:12px;}
#oil-shell .oilf2.oilf2-tighter .rng .btn{padding-left:7px;padding-right:7px;}
#oil-shell .oilf2.oilf2-tighter .debt-month{max-width:100px;}
#oil-shell .oilf2.oilf2-tighter .debt-q{min-width:96px;}
#oil-shell .debt-chip .ls{display:none;}
#oil-shell .oilf2.oilf2-tighter .debt-chip .lf{display:none;}
#oil-shell .oilf2.oilf2-tighter .debt-chip .ls{display:inline;}
#oil-shell .oilf2.oilf2-tight .debt-month,#oil-shell .oilf2.oilf2-tighter .debt-month{max-width:none;width:auto;}
#oil-shell .oilf2 .rng-txt::placeholder{letter-spacing:0;}
#oil-shell .oilf2.oilf2-tight .rng-txt::placeholder{text-transform:none;}
#oil-shell .oilf2.oilf2-tighter .rng-txt{width:96px;padding-left:6px;padding-right:24px;}
/* tồn kho dầu-nhớt: rộng, cân đối, nút IN + ZALO trong header */
#oil-shell .card.ton-dau:has(.tbl-a4),#oil-shell .card.ton-nhot:has(.tbl-a4){width:auto!important;max-width:960px!important;overflow:visible!important;margin:0 auto 14px}
#oil-shell .card.ton-dau .tbl.tbl-a4,#oil-shell .card.ton-nhot .tbl.tbl-a4{width:100%!important;max-width:none!important;table-layout:fixed;font-size:15.5px}
#oil-shell .card.ton-dau .tbl.tbl-a4 col.c-muc,#oil-shell .card.ton-nhot .tbl.tbl-a4 col.c-muc{width:34%}
#oil-shell .card.ton-dau .tbl.tbl-a4 col.c-lit,#oil-shell .card.ton-nhot .tbl.tbl-a4 col.c-lit,#oil-shell .card.ton-dau .tbl.tbl-a4 col.c-dg,#oil-shell .card.ton-nhot .tbl.tbl-a4 col.c-dg{width:17%}
#oil-shell .card.ton-dau .tbl.tbl-a4 col.c-gt,#oil-shell .card.ton-nhot .tbl.tbl-a4 col.c-gt{width:22%}
#oil-shell .card.ton-dau .tbl.tbl-a4 col.c-act,#oil-shell .card.ton-nhot .tbl.tbl-a4 col.c-act{width:10%}
#oil-shell .card.ton-dau .tbl.tbl-a4 td,#oil-shell .card.ton-nhot .tbl.tbl-a4 td{padding:8px 14px}#oil-shell .card.ton-dau .tbl.tbl-a4 th,#oil-shell .card.ton-nhot .tbl.tbl-a4 th{padding:9px 14px;font-size:13.5px}
#oil-shell .card.ton-dau .tbl.tbl-a4 th:nth-child(2),#oil-shell .card.ton-dau .tbl.tbl-a4 th:nth-child(3),#oil-shell .card.ton-dau .tbl.tbl-a4 th:nth-child(4),#oil-shell .card.ton-nhot .tbl.tbl-a4 th:nth-child(2),#oil-shell .card.ton-nhot .tbl.tbl-a4 th:nth-child(3),#oil-shell .card.ton-nhot .tbl.tbl-a4 th:nth-child(4){text-align:right}
#oil-shell .card.ton-dau .card-header,#oil-shell .card.ton-nhot .card-header{display:flex;align-items:center;gap:8px;padding:9px 14px}
#oil-shell .card.ton-dau .card-header h3,#oil-shell .card.ton-nhot .card-header h3{flex:1;margin:0}
#oil-shell .card-header .btn-print{height:30px;padding:0 14px;font-size:12px;font-weight:800;background:#fff;color:#0f1b2d;border-color:#fff}
#oil-shell .card-header .zs-btn{margin-left:0}
.tbl-print-bar{display:flex;justify-content:flex-end;gap:6px}
/* mfit1: SỔ CẤP PHÍ vừa khít màn hình điện thoại (S24 ~412px, app WebView + Chrome). Desktop không đổi. */
@media screen and (max-width:480px){
  html body #fee-shell .content .card.sv-wide{max-height:none!important;overflow:visible!important;}
  html body #fee-shell .content .card.sv-wide>table{width:100%!important;min-width:0!important;}
  html body #fee-shell .content .card{position:static!important;margin:0 0 10px!important;overflow:visible!important;}
  html body #fee-shell .content{overflow-x:hidden!important;max-width:100%!important;padding:0 6px 6px!important;}
  html body #fee-shell .content>*{zoom:1!important;}
  html body #fee-shell .content table.tbl.fee-main{table-layout:fixed!important;width:100%!important;min-width:0!important;max-width:100%!important;}
  #fee-shell table.fee-main col.c-stt{width:6%;} #fee-shell table.fee-main col.c-ngay{width:10%;}
  #fee-shell table.fee-main col.c-tx{width:13%;} #fee-shell table.fee-main col.c-kh{width:14%;}
  #fee-shell table.fee-main col.c-ch{width:13%;} #fee-shell table.fee-main col.c-tien{width:15%;}
  #fee-shell table.fee-main col.c-gc{width:15%;} #fee-shell table.fee-main col.c-tt{width:14%;}
  html body #fee-shell .content table.tbl.fee-main th,html body #fee-shell .content table.tbl.fee-main td{
    font-size:10px!important;padding:3px 2px!important;line-height:1.2!important;letter-spacing:0!important;
    white-space:nowrap!important;overflow:hidden!important;text-overflow:clip!important;word-break:normal!important;width:auto!important;min-width:0!important;max-width:none!important;}
  html body #fee-shell .content table.tbl.fee-main th{font-size:8.5px!important;white-space:normal!important;text-align:center;}
  html body #fee-shell .content table.tbl.fee-main td.wrap{white-space:normal!important;overflow-wrap:anywhere!important;}
  html body #fee-shell .content table.tbl.fee-main td:nth-child(7){word-break:break-all!important;}
  html body #fee-shell .content table.tbl.fee-main td:nth-child(5){font-size:9.5px!important;}
  html body #fee-shell .content table.tbl.fee-main td.num{text-align:right;}
  #fee-shell table.fee-main .fee-yy{display:none;}
  #fee-shell table.fee-main .fee-st-cell .badge{font-size:8px!important;padding:1px 2px!important;letter-spacing:0!important;}
  html body #fee-shell .content table.tbl.fee-main thead th{position:sticky!important;top:-6px!important;z-index:4;}
  html body #fee-shell .content table.tbl.fee-main tr.row-total td{overflow:visible!important;}
  #fee-shell .fee-kpi{padding:6px 4px!important;}
  #fee-shell .fee-kpi-l{font-size:10px!important;}
  #fee-shell .filter-bar .fee-checks{flex:1 1 100%!important;}
  #fee-shell .filter-bar select{flex:1 1 30%!important;font-size:13px!important;}
  #fee-shell .filter-bar #fee-q{flex:1 1 100%!important;max-width:100%!important;}
  html body #fee-shell .content table.tbl.fee-cho{table-layout:auto!important;font-size:13px!important;}
  html body #fee-shell .content table.tbl.fee-cho td{font-size:13px!important;white-space:nowrap!important;}
  #fee-shell table.tbl.fee-cho .fee-cho-entry{min-width:0!important;max-width:120px;}
  .fee-zalo-btns{flex-direction:column;} .fee-zalo-big{flex:0 0 auto;}
}

/* LXH đổ trùng — cảnh báo đỏ, nổi trên bảng đen/trắng */
#oil-shell .tbl tr.lxh-dup td,#oil-shell .oil-issue-sheet tr.lxh-dup td,#oil-shell .oil-issue-sheet tr.lxh-dup:hover td{background:#fde4e2!important;color:#3a0b07!important;}
#oil-shell .tbl tr.lxh-dup td:first-child,#oil-shell .oil-issue-sheet tr.lxh-dup td:first-child{box-shadow:inset 6px 0 0 #c62828!important;}
#oil-shell .tbl tr.lxh-dup td{border-top:1.5px solid #e57373;border-bottom:1.5px solid #e57373;}
.lxh-badge{display:inline-block;margin-left:6px;padding:2px 9px;border-radius:999px;background:#c62828;color:#fff;font-size:12px;font-weight:900;letter-spacing:.02em;white-space:nowrap;vertical-align:middle;font-style:normal;}
#oil-shell .lxh-banner{background:#fff1f0;border:2px solid #c62828;border-left:8px solid #c62828;border-radius:12px;padding:10px 14px;margin:0 0 10px;color:#5a0e09;max-width:1300px;box-sizing:border-box;}
#oil-shell .lxh-banner-h{font-size:15px;font-weight:900;color:#b71c1c;letter-spacing:.03em;margin-bottom:4px;}
#oil-shell .lxh-banner ul{margin:0;padding-left:20px;font-size:14px;font-weight:600;}
#oil-shell .lxh-banner li{margin:2px 0;}
.lxh-form-warn{margin:-4px 0 8px;padding:8px 10px;border:1.5px solid #c62828;border-left:6px solid #c62828;background:#fff1f0;color:#7f1d1d;border-radius:8px;font-size:13px;font-weight:700;}
@media print{#oil-shell .lxh-banner{border-width:1px;}}

/* ===== OIL: đơn hàng theo cột + đối chiếu Cấp phí (ordcols1) ===== */
#oil-shell .tbl-ord{table-layout:auto}
#oil-shell .tbl-ord .ord-th{white-space:normal;line-height:1.15}
#oil-shell .tbl-ord td.ord-td,#oil-shell .tbl-ord td.wrap{white-space:normal;line-height:1.25;vertical-align:middle;min-width:96px;max-width:240px}
#oil-shell .tbl-ord th,#oil-shell .tbl-ord td{padding-left:6px;padding-right:6px}
#oil-shell .ord-chip{display:inline-block;margin:1px 3px 1px 0;padding:1px 6px;border:1px solid #bdbdbd;border-radius:4px;background:#f4f4f4;color:#111;font-size:11.5px;font-weight:600;white-space:nowrap}
#oil-shell .ord-chip small{font-weight:500;color:#555;margin-left:3px}
#oil-shell .ord-chip.ord-plain{background:#fff;border-style:dashed}
#oil-shell .ord-chip.ord-bad{background:#fdecec;border-color:#d32f2f;color:#b71c1c}
#oil-shell .ord-chip.ord-bad i{font-style:normal;font-size:9.5px;font-weight:800;margin-left:4px;padding:0 3px;border-radius:3px;background:#d32f2f;color:#fff}
#oil-shell .ord-chip.ord-bad small{color:#b71c1c}
#oil-shell .fee-banner{display:flex;align-items:center;gap:12px;justify-content:space-between;margin:0 0 10px;padding:9px 12px;border:2px solid #d32f2f;border-radius:8px;background:#fdecec;color:#b71c1c;font-size:13px}
#oil-shell .fee-banner .btn{background:#111;color:#fff;border-color:#111}
#oil-shell .pend-note{padding:8px 14px;font-size:12px;color:#444;border-bottom:1px solid #dcdcdc}
#oil-shell .ord-help,.ord-help{font-size:11.5px;color:#555;margin:2px 0 6px}
.ord-prev{margin-top:4px;min-height:2px}
.ord-prev .ord-chip{display:inline-block;margin:2px 4px 2px 0;padding:2px 6px;border:1px solid #bdbdbd;border-radius:4px;background:#f4f4f4;font-size:11.5px;font-weight:600}
.ord-prev .ord-chip small{font-weight:500;color:#555}
.ord-prev .ord-chip.ord-bad{background:#fdecec;border-color:#d32f2f;color:#b71c1c}
.ord-orig{font-size:11.5px;color:#555;background:#f4f4f4;border:1px dashed #bdbdbd;border-radius:6px;padding:5px 8px;margin:4px 0}
.ord-fg input::placeholder{text-transform:none;color:#999}
@media print{ #oil-shell .ord-chip.ord-bad{background:#fff} #oil-shell .fee-banner{display:none} #oil-shell .tbl-ord .ord-th{min-width:0} #oil-shell .ord-chip{font-size:9.5px;padding:0 3px} }
#oil-shell .oil-issue-sheet:has(.tbl-ord){width:100%;max-width:100%}
#oil-shell .oil-issue-sheet > .card:has(.tbl-ord){width:100%}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord{width:100%;font-size:15px}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord th{font-size:12.5px;padding:7px 6px}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td{padding:6px 6px}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.ord-td,#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.wrap,#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord th.ord-th{white-space:normal}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.ord-td{min-width:110px}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord .lxh-badge{white-space:nowrap}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.ord-td{min-width:84px}
#oil-shell .tbl-ord .ord-chip.ord-bad{white-space:normal}
#oil-shell .tbl-ord .ord-chip.ord-bad i{display:block;width:max-content;margin:1px 0 0 0}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord .lxh-badge{white-space:normal;display:inline-block}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.wrap{min-width:70px;max-width:180px}
/* compact */
  #oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord{font-size:14px}
  #oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord th{font-size:11px;padding:6px 4px}
  #oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td{padding:5px 4px}
  #oil-shell .tbl-ord .ord-chip{font-size:10.5px;padding:1px 4px;white-space:normal}
  #oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.ord-td{min-width:70px}
  #oil-shell .tbl-ord .badge{font-size:10.5px;padding:2px 6px}
/* ===== OIL: bảng đơn hàng gọn, căn giữa (ordcompact1) ===== */
#oil-shell .oil-issue-sheet:has(.tbl-ord){width:max-content;max-width:100%;margin-left:auto;margin-right:auto}
#oil-shell .oil-issue-sheet > .card:has(.tbl-ord){width:max-content;max-width:100%}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord{width:max-content}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord th{padding:6px 5px}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td{padding:4px 5px}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.ord-td{min-width:0;width:auto}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.ord-td:nth-of-type(6){max-width:200px}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.ord-td:nth-of-type(7){max-width:150px}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.ord-td:nth-of-type(8){max-width:110px}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.wrap{min-width:0;max-width:160px}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord th.ord-th{max-width:84px}
#oil-shell .tbl-ord .ord-chip{padding:0 3px;margin:1px 2px 1px 0;white-space:nowrap}
#oil-shell .tbl-ord .ord-chip.ord-bad{white-space:normal}
#oil-shell .tbl-ord .lxh-badge{padding:1px 6px;font-size:10.5px}
#oil-shell .tbl-ord td .btn-icon{padding:2px 3px}
#oil-shell .oil-issue-sheet:has(.tbl-ord) .oil-tg-row{flex-wrap:wrap;gap:6px}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.ord-td:nth-of-type(6){max-width:175px}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.wrap{max-width:118px}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord .lxh-badge{white-space:normal;line-height:1.15}
@media (max-width:1400px){
  #oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.ord-td:nth-of-type(6){max-width:130px}
  #oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.ord-td:nth-of-type(7){max-width:105px}
  #oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.wrap{max-width:96px}
  #oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td:nth-of-type(2){white-space:normal;max-width:70px}
}
#oil-shell .oil-issue-sheet .card:has(.pend-note) .tbl.tbl-fit.tbl-ord{width:100%}
#oil-shell .oil-issue-sheet .card:has(.pend-note) .pend-note{max-width:900px}
#oil-shell #content:has(.oil-issue-sheet .tbl-ord){display:grid;grid-template-columns:minmax(0,max-content);justify-content:center;align-content:start}
#oil-shell #content:has(.oil-issue-sheet .tbl-ord) > *{min-width:0;max-width:100%}
#oil-shell #content:has(.oil-issue-sheet .tbl-ord) > .oil-issue-sheet{width:auto;margin-left:0;margin-right:0}
#oil-shell .oil-issue-sheet .card:has(.pend-note) .tbl.tbl-fit.tbl-ord td.wrap{max-width:340px;min-width:250px}

/* ===== OIL: giao diện cổ điển (navy · ivory · gold) — classic1, chỉ trong #oil-shell ===== */
#oil-shell{--cl-navy:#1f2a44;--cl-navy2:#2c3a5a;--cl-slate:#5a6478;--cl-ivory:#f7f4ec;--cl-paper:#fffdf8;--cl-line:#ddd5c4;--cl-line2:#c9bfa9;--cl-gold:#b08d57;--cl-burg:#7b1e2b;--cl-burg-bg:#faf1f1;
  --bg:var(--cl-ivory);--navy:var(--cl-navy);--text:var(--cl-navy);--muted:var(--cl-slate);background:var(--cl-ivory);color:var(--cl-navy);}
#oil-shell .main,#oil-shell .content{background:var(--cl-ivory)!important;}
#oil-shell .sidebar{background:linear-gradient(180deg,#1f2a44 0%,#18213a 100%)!important;}
#oil-shell .sidebar-header{border-bottom:2px solid var(--cl-gold)!important;}
#oil-shell .nav-group-label{color:#c9b48a!important;letter-spacing:.08em;}
#oil-shell .nav-item.active{background:rgba(176,141,87,.16)!important;box-shadow:inset 3px 0 0 var(--cl-gold)!important;}
#oil-shell .topbar{background:var(--cl-paper)!important;border-bottom:2px solid var(--cl-gold)!important;}
#oil-shell .topbar .title,#oil-shell .card-header h3{color:var(--cl-navy)!important;font-family:Georgia,"Times New Roman",serif;letter-spacing:.02em;}
#oil-shell .btn-primary{background:var(--cl-navy)!important;border-color:var(--cl-navy)!important;color:#fff!important;}
#oil-shell .btn-outline{border-color:var(--cl-navy)!important;color:var(--cl-navy)!important;background:var(--cl-paper)!important;}
#oil-shell select,#oil-shell input[type=text]{border-color:var(--cl-line2)!important;background:var(--cl-paper);color:var(--cl-navy);}
/* thẻ + khung */
#oil-shell .card{background:var(--cl-paper);border:1px solid var(--cl-line)!important;border-radius:6px!important;box-shadow:none!important;}
#oil-shell .card-header{background:var(--cl-paper)!important;border-bottom:1px solid var(--cl-line)!important;}
#oil-shell .oil-kpis{gap:8px!important;}
#oil-shell .oil-kpi{background:var(--cl-paper)!important;border:1px solid var(--cl-line)!important;border-radius:6px!important;padding:6px 8px 5px!important;box-shadow:none!important;}
#oil-shell .oil-kpi-l{font-size:10.5px!important;letter-spacing:.1em;color:var(--cl-slate)!important;}
#oil-shell .oil-kpi-v,#oil-shell .oil-kpi-v.green,#oil-shell .oil-kpi-v.amber,#oil-shell .oil-kpi-v.red{font-size:19px!important;color:var(--cl-navy)!important;font-family:Georgia,"Times New Roman",serif;font-weight:700!important;margin-top:1px!important;}
#oil-shell .oil-kpi-u{font-size:10.5px!important;color:var(--cl-slate);font-family:inherit;}
#oil-shell .oil-kpi-wait{background:#eef1f6!important;border:1px solid #b9c2d3!important;border-top:3px solid var(--cl-navy)!important;}
/* nút trạng thái */
#oil-shell .oil-tg-row{margin-bottom:8px!important;}
#oil-shell .oil-tg{--tg:var(--cl-navy)!important;min-height:30px!important;padding:3px 11px!important;font-size:12.5px!important;font-weight:700!important;border-width:1px!important;border-radius:4px!important;background:var(--cl-paper)!important;color:var(--cl-slate)!important;border-color:var(--cl-line2)!important;gap:6px!important;}
#oil-shell .oil-tg.on{color:var(--cl-navy)!important;border-color:var(--cl-navy)!important;}
#oil-shell .oil-tg.oil-tg-DA_CAP.on{background:var(--cl-paper)!important;}
#oil-shell .oil-tg.oil-tg-VUA_CAP.on{background:#f6efdc!important;}
#oil-shell .oil-tg.oil-tg-CHO_CAP.on{background:#e6eaf2!important;}
#oil-shell .oil-tg.oil-tg-ALL.on{background:var(--cl-navy)!important;color:#fff!important;}
#oil-shell .oil-tg-n{background:rgba(31,42,68,.08)!important;font-size:11px;padding:0 6px;}
#oil-shell .oil-tg.oil-tg-ALL.on .oil-tg-n{background:rgba(255,255,255,.2)!important;}
#oil-shell .oil-tg-ck{width:14px!important;height:14px!important;font-size:10px!important;border-width:1px!important;border-radius:2px!important;}
#oil-shell .oil-tg:hover{box-shadow:0 0 0 2px rgba(176,141,87,.25)!important;}
#oil-shell .oil-zalo-btn{min-height:30px!important;padding:3px 14px!important;font-size:12.5px!important;font-weight:700!important;border-radius:4px!important;background:var(--cl-navy)!important;color:#fff!important;box-shadow:none!important;border-bottom:2px solid var(--cl-gold)!important;}
/* bảng */
#oil-shell .tbl th,#oil-shell .debt-tbl th,#oil-shell .card.ton-dau .tbl.tbl-a4 th,#oil-shell .card.ton-nhot .tbl.tbl-a4 th{background:var(--cl-navy)!important;color:#f3ead8!important;border-color:var(--cl-navy2)!important;border-bottom:2px solid var(--cl-gold)!important;font-weight:700!important;letter-spacing:.05em;}
#oil-shell .tbl td{color:var(--cl-navy)!important;border-color:var(--cl-line)!important;}
#oil-shell .tbl tr.row-total td,#oil-shell .tbl tr.row-total:hover td,#oil-shell .tbl .row-band td,#oil-shell .card.ton-dau .tbl.tbl-a4 tr.row-total td,#oil-shell .card.ton-nhot .tbl.tbl-a4 tr.row-total td{background:var(--cl-navy2)!important;color:#f3ead8!important;}
#oil-shell .card.ton-dau .card-header,#oil-shell .card.ton-nhot .card-header{background:var(--cl-navy)!important;}
#oil-shell .card.ton-dau .card-header h3,#oil-shell .card.ton-nhot .card-header h3{color:#f3ead8!important;}
#oil-shell .oil-rep-band .oil-rep-cell{background:var(--cl-navy)!important;border-color:var(--cl-navy)!important;}
#oil-shell .oil-issue-sheet > .card{border-color:var(--cl-line)!important;}
#oil-shell .oil-issue-sheet tr.st-da td,#oil-shell .oil-issue-sheet tr.st-da:hover td,#oil-shell .oil-wait tr td{background:var(--cl-paper)!important;color:var(--cl-navy)!important;}
#oil-shell .oil-issue-sheet tr.st-vua td,#oil-shell .oil-issue-sheet tr.st-vua:hover td{background:#f6efdc!important;color:#3d3220!important;}
#oil-shell .oil-issue-sheet tr.st-cho td,#oil-shell .oil-issue-sheet tr.st-cho:hover td{background:#e6eaf2!important;color:var(--cl-navy)!important;}
#oil-shell .oil-issue-sheet tr.st-da td:first-child{box-shadow:inset 3px 0 0 #c9bfa9!important;}
#oil-shell .oil-issue-sheet tr.st-vua td:first-child{box-shadow:inset 3px 0 0 var(--cl-gold)!important;}
#oil-shell .oil-issue-sheet tr.st-cho td:first-child{box-shadow:inset 3px 0 0 var(--cl-navy)!important;}
#oil-shell .oil-issue-sheet tr.lxh-dup td{background:var(--cl-burg-bg)!important;}
#oil-shell .oil-issue-sheet tr.lxh-dup td:first-child{box-shadow:inset 3px 0 0 var(--cl-burg)!important;}
#oil-shell .oil-wait tr.row-total td{background:var(--cl-navy2)!important;color:#f3ead8!important;}
/* badge trạng thái */
#oil-shell .badge-ok,#oil-shell .oil-issue-sheet .badge-ok{background:transparent!important;color:var(--cl-slate)!important;border:1px solid #c9bfa9!important;}
#oil-shell .badge-kh,#oil-shell .oil-issue-sheet .badge-kh{background:#f6efdc!important;color:#6b5328!important;border:1px solid var(--cl-gold)!important;}
#oil-shell .badge-no,#oil-shell .oil-issue-sheet .badge-no{background:var(--cl-navy)!important;color:#fff!important;border:1px solid var(--cl-navy)!important;}
#oil-shell .badge{border-radius:3px!important;font-weight:700!important;letter-spacing:.04em;}
/* chip đơn hàng + cảnh báo */
#oil-shell .ord-chip{background:#f4f1ea!important;border:1px solid var(--cl-line)!important;color:var(--cl-navy)!important;border-radius:3px!important;font-weight:600!important;}
#oil-shell .ord-chip.ord-plain{background:transparent!important;border-style:dashed!important;}
#oil-shell .ord-chip.ord-bad{background:var(--cl-burg-bg)!important;border-color:#c08a90!important;color:var(--cl-burg)!important;}
#oil-shell .ord-chip.ord-bad i{background:var(--cl-burg)!important;color:#fff!important;border-radius:2px!important;font-weight:700!important;}
#oil-shell .lxh-badge{background:var(--cl-burg)!important;color:#fff!important;border-radius:3px!important;font-weight:700!important;font-size:10.5px!important;padding:1px 6px!important;}
#oil-shell .fee-banner,#oil-shell .lxh-banner{background:var(--cl-burg-bg)!important;border:1px solid #e2c9cb!important;border-left:3px solid var(--cl-burg)!important;border-radius:4px!important;color:#5a1620!important;padding:6px 10px!important;margin:0 0 8px!important;font-size:12.5px!important;}
#oil-shell .lxh-banner-h{font-size:12.5px!important;font-weight:700!important;color:var(--cl-burg)!important;margin-bottom:2px;}
#oil-shell .lxh-banner ul{margin:2px 0 0 16px!important;font-size:12px!important;line-height:1.45;}
#oil-shell .fee-banner b{color:var(--cl-burg);font-weight:700;}
#oil-shell .fee-banner .btn{background:transparent!important;color:var(--cl-burg)!important;border:1px solid var(--cl-burg)!important;border-radius:3px!important;padding:2px 8px!important;font-size:11px!important;}
#oil-shell .pend-note{color:var(--cl-slate)!important;border-bottom-color:var(--cl-line)!important;font-size:11.5px!important;}
#oil-shell .empty-state.oil-empty{background:var(--cl-paper)!important;border:1px dashed var(--cl-line2)!important;color:var(--cl-slate)!important;}
#oil-shell .lxh-form-warn{background:var(--cl-burg-bg)!important;border:1px solid #e2c9cb!important;border-left:3px solid var(--cl-burg)!important;color:#5a1620!important;border-radius:4px!important;}

/* ===== CẤP PHÍ: cột DẦU (fee-oilcheck add-on) ===== */
#fee-shell table.fee-main th.foc-th{white-space:nowrap;}
#fee-shell table.fee-main td.foc-td{white-space:normal;line-height:1.15;width:1%;text-align:center;}
#fee-shell .foc{display:inline-block;padding:1px 4px;border-radius:3px;font-size:9.5px;font-weight:800;letter-spacing:0;white-space:normal;line-height:1.15;}
#fee-shell .foc b{display:block;white-space:nowrap;}
#fee-shell .foc-ok{background:#e3f1e6;color:#1e6b34;border:1px solid #9ccaa8;}
#fee-shell .foc-no{background:transparent;color:#8a8f99;border:1px dashed #b9bec8;}
#fee-shell .foc-dup{background:#c62828;color:#fff;border:1px solid #c62828;}
#fee-shell .foc-sub{display:block;font-size:8.5px;color:#666;margin-top:1px;}
#fee-shell .foc-dup-l{color:#b71c1c;font-weight:700;}
@media screen and (max-width:480px){#fee-shell table.fee-main th.foc-th,#fee-shell table.fee-main td.foc-td,#fee-shell table.fee-main col.c-oil{display:none!important;}}
#fee-shell table.tbl.fee-main[data-foc] th,#fee-shell table.tbl.fee-main[data-foc] td{padding-left:4px;padding-right:4px;}
#fee-shell table.tbl.fee-main[data-foc] thead th{white-space:normal;line-height:1.15;}
#fee-shell table.tbl.fee-main[data-foc] td.wrap{overflow-wrap:normal;word-break:normal;}
#fee-shell table.tbl.fee-main[data-foc] td.foc-td,#fee-shell table.tbl.fee-main[data-foc] th.foc-th{padding-left:2px;padding-right:2px;}
#fee-shell table.tbl.fee-main[data-foc] tr > :first-child{padding-left:2px;padding-right:2px;}
#fee-shell table.tbl.fee-main[data-foc] .foc{font-size:8.5px;padding:1px 3px;}

/* ===== OIL: chip hộp đồng cỡ, 1 dòng/ô (chips1) ===== */
#oil-shell .oc{display:inline-flex;flex-direction:column;justify-content:center;box-sizing:border-box;width:86px;height:30px;margin:1px 3px 1px 0;padding:0 4px;vertical-align:middle;border:1px solid var(--cl-line2,#c9bfa9);border-radius:3px;background:#f7f4ec;color:var(--cl-navy,#1f2a44);text-align:center;line-height:1.1;overflow:hidden;white-space:nowrap;font-style:normal;}
#oil-shell .oc b{display:block;font-size:10.5px;font-weight:700;letter-spacing:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#oil-shell .oc i{display:block;font-style:normal;font-size:8px;font-weight:600;color:#7a7f8c;letter-spacing:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#oil-shell .oc.oc-plain{background:transparent;border-style:dashed;}
#oil-shell .oc.oc-bad{border:1.5px solid #b3261e;background:#fbf0f0;color:#7b1e2b;}
#oil-shell .oc.oc-bad i{color:#b3261e;font-weight:800;}
#oil-shell .oc-line{white-space:nowrap;}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.ord-td,#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.ord-td:nth-of-type(n){white-space:nowrap!important;max-width:none!important;min-width:0!important;padding:3px 4px!important;}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td.gc-td{min-width:0!important;max-width:110px!important;font-size:12px;}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord th.ord-th{max-width:none!important;white-space:nowrap!important;}
#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td{padding-top:3px;padding-bottom:3px;}
@media (max-width:1400px){#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td:nth-of-type(2){max-width:none;white-space:nowrap;}}
@media (max-width:1400px){
  #oil-shell .oc{width:74px;height:28px;margin-right:2px;padding:0 2px;}
  #oil-shell .oc b{font-size:9.5px;}
  #oil-shell .oc i{font-size:7.5px;}
  #oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord{font-size:12.5px!important;}
  #oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord th,#oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td{padding-left:3px!important;padding-right:3px!important;}
  #oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord td:nth-of-type(2){white-space:normal!important;max-width:60px!important;}
  #oil-shell .oil-issue-sheet .tbl.tbl-fit.tbl-ord th{font-size:10px!important;}
}

/* ===== OIL: nút IN / Z vuông nhỏ, cột dọc ngoài mép phải bảng (zbtn1) ===== */
#oil-shell #content{padding-right:52px;}
#oil-shell .card.has-sidebtns{position:relative;overflow:visible!important;}
#oil-shell .oil-sidebtns{position:absolute;top:0;left:100%;margin-left:6px;display:flex;flex-direction:column;gap:5px;z-index:5;}
#oil-shell .oil-sidebtns > button,#oil-shell .oil-zalo-btn.oil-sq{box-sizing:border-box;width:30px!important;height:30px!important;min-height:0!important;min-width:0!important;padding:0!important;margin:0!important;display:inline-grid!important;place-items:center;border-radius:4px!important;font-size:12px!important;font-weight:800!important;line-height:1!important;letter-spacing:0!important;box-shadow:none!important;}
#oil-shell .oil-sidebtns .btn-print{background:var(--cl-paper,#fffdf8)!important;color:var(--cl-navy,#1f2a44)!important;border:1px solid var(--cl-navy,#1f2a44)!important;font-size:10.5px!important;}
#oil-shell .oil-sidebtns .zs-btn{background:#0068ff!important;color:#fff!important;border:1px solid #0068ff!important;font-size:0!important;gap:0!important;}
#oil-shell .oil-sidebtns .zs-btn .zs-ic{font-size:12px!important;width:auto!important;height:auto!important;background:transparent!important;color:#fff!important;}
#oil-shell .oil-zalo-btn.oil-sq{background:var(--cl-navy,#1f2a44)!important;color:#fff!important;border:1px solid var(--cl-navy,#1f2a44)!important;border-bottom:2px solid var(--cl-gold,#b08d57)!important;font-size:13px!important;}
#oil-shell .oil-sidebtns > button:hover{filter:brightness(1.1);}
@media (max-width:760px){#oil-shell #content{padding-right:12px;}#oil-shell .oil-sidebtns{position:static;flex-direction:row;margin:6px 0 0;}}

/* ===== OIL: khung xanh ô MÃ + TÀI XẾ của chuyến cần xử lý (blueframe1) ===== */
#oil-shell .tbl tr td.al-cell,#oil-shell .oil-issue-sheet tr td.al-cell{position:relative;}
#oil-shell .tbl td.al-cell::after{content:"";position:absolute;inset:1px;border:2px solid #1f5fbf;border-radius:3px;pointer-events:none;}
@media print{#oil-shell .tbl td.al-cell::after{display:none;}}
/* oneline1: badges/pills 1 dòng */
#fee-shell table.fee-main td.foc-td,#fee-shell table.fee-main th.foc-th,#fee-shell table.fee-main td.fee-st-cell{white-space:nowrap!important;line-height:1.2;width:1%;}
#fee-shell table.fee-main .foc{white-space:nowrap!important;font-size:9px;padding:1px 4px;line-height:1.3;}
#fee-shell table.fee-main .foc b{display:inline!important;margin-left:3px;}
#fee-shell table.fee-main .foc-sub{display:inline!important;margin:0 0 0 3px;}
#fee-shell table.fee-main .fee-st-cell .badge,#fee-shell table.fee-main .badge{white-space:nowrap;}
#fee-shell .card-header button,#fee-shell .card-header .btn,#fee-shell .fee-tools button,#fee-shell .filter-bar button{white-space:nowrap;}
#fee-shell table.tbl.fee-main[data-foc] thead th{white-space:nowrap;}
/* nowrap1: bảng cấp phí mọi ô 1 dòng */
@media screen and (min-width:481px){
html body #fee-shell table.tbl.fee-main{table-layout:auto!important;width:auto!important;min-width:100%!important;max-width:none!important;}
html body #fee-shell table.tbl.fee-main col{width:auto!important;}
html body #fee-shell table.tbl.fee-main th,html body #fee-shell table.tbl.fee-main td,html body #fee-shell table.tbl.fee-main td.wrap{white-space:nowrap!important;max-width:none!important;word-break:normal!important;overflow-wrap:normal!important;padding-left:6px!important;padding-right:6px!important;}
html body #fee-shell table.tbl.fee-main td *{white-space:nowrap!important;}
html body #fee-shell .table-wrap:has(table.fee-main),html body #fee-shell .card:has(> table.fee-main){overflow-x:auto!important;}
}
/* fit2: bảng cấp phí vừa khung, hiện đủ 1 dòng */
@media screen and (min-width:481px){
html body #fee-shell .content{max-width:100%!important;}
}
@media screen and (min-width:481px) and (max-width:1199px){html body #fee-shell .content > *{zoom:1!important;}}
@media screen and (min-width:1200px) and (max-width:1499px){html body #fee-shell .content > *{zoom:1.12!important;}}
@media screen and (min-width:481px){
html body #fee-shell .content .card:has(table.fee-main),html body #fee-shell .table-wrap:has(table.fee-main){overflow-x:auto!important;overflow-y:visible;max-width:100%!important;}
html body #fee-shell table.tbl.fee-main{font-size:clamp(10.5px,0.95vw,13px)!important;}
html body #fee-shell table.tbl.fee-main th,html body #fee-shell table.tbl.fee-main td{padding-left:4px!important;padding-right:4px!important;}
html body #fee-shell table.fee-main .foc,html body #fee-shell table.fee-main .badge{white-space:nowrap!important;overflow:visible!important;text-overflow:clip!important;max-width:none!important;font-size:.85em!important;padding:1px 3px!important;letter-spacing:0!important;}
}
/* sticky3: cố định từ tiêu đề bảng trở lên, cột gọn, DẦU canh trái */
@media screen and (min-width:481px){
html body #fee-shell .content:has(.fee-scroll){display:flex!important;flex-direction:column!important;overflow:hidden!important;}
html body #fee-shell .content:has(.fee-scroll) > *{flex:0 0 auto;}
html body #fee-shell .content:has(.fee-scroll)::before{flex:0 0 auto;}
html body #fee-shell .content .card:has(> .fee-scroll){flex:1 1 auto!important;min-height:0!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;margin-bottom:0;}
html body #fee-shell .card > .card-header{flex:0 0 auto;}
html body #fee-shell .fee-scroll{flex:1 1 auto;min-height:0;overflow:auto;}
html body #fee-shell .fee-scroll > .card{margin:10px 0 0;}
html body #fee-shell .content table.tbl.fee-main thead th{position:sticky!important;top:0!important;z-index:4;}
html body #fee-shell table.tbl.fee-main{width:auto!important;min-width:0!important;}
html body #fee-shell table.tbl.fee-main th,html body #fee-shell table.tbl.fee-main td{width:1%;}
html body #fee-shell table.tbl.fee-main th.foc-th,html body #fee-shell table.tbl.fee-main td.foc-td{text-align:left!important;}
}

/* ===== OIL: lít suy ra (~) + chênh lệch tổng chuyến (lit2) ===== */
#oil-shell .oc.oc-der i{font-style:italic;color:#4a5a7a;}
#oil-shell .lit-delta{display:inline-block;margin-left:5px;padding:0 4px;border:1px solid #b08d57;border-radius:3px;background:#fbf5e6;color:#6b5328;font-size:9.5px;font-weight:800;font-style:normal;line-height:1.4;vertical-align:middle;cursor:help;white-space:nowrap;}
@media print{#oil-shell .lit-delta{border:0;background:none;}}
#oil-shell .lit-delta{display:block;width:max-content;margin:1px 0 0 auto;font-size:9px;padding:0 3px;}

/* ===== OIL: màu riêng cho từng nhóm LXH trùng (dupcolor1) ===== */
#oil-shell .oc.oc-dup{border:1.5px solid var(--dc)!important;background:color-mix(in srgb,var(--dc) 7%,#fffdf8)!important;}
#oil-shell .oc.oc-dup b{color:var(--dc)!important;}
#oil-shell .oc.oc-dup i{color:var(--dc)!important;font-weight:700;}
#oil-shell .lxh-banner li[style*="--dc"]{border-left:3px solid var(--dc);padding-left:6px;margin:2px 0;}
#oil-shell .lxh-banner li[style*="--dc"] b{color:var(--dc)!important;}

/* ===== OIL: hộp xử lý chip LXH (res1) — modal toàn cục, chỉ áp .oil-res ===== */
#oil-shell .oc.oc-res{cursor:pointer;}
#oil-shell .oc.oc-ack i{color:#2e6b3a;}
.oil-res{font-size:12.5px;color:#1f2a44;}
.oil-res .res-flags{margin-bottom:6px;}
.oil-res .res-flag{display:inline-block;padding:2px 7px;border:1.5px solid var(--dc,#7b1e2b);color:var(--dc,#7b1e2b);border-radius:3px;font-weight:800;font-size:11px;}
.oil-res .res-flag-nf{--dc:#b42318;}
.oil-res .res-h{margin:10px 0 4px;padding-bottom:2px;border-bottom:1px solid #ddd5c4;font-weight:800;font-size:11.5px;letter-spacing:.3px;color:#2c3a5a;}
.oil-res .res-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px;}
.oil-res .res-card{border:1px solid #c9bfa9;border-top:3px solid var(--dc,#1f2a44);border-radius:4px;padding:6px 8px;background:#fffdf8;}
.oil-res .res-card.me{box-shadow:0 0 0 1px var(--dc,#1f2a44) inset;}
.oil-res .res-ma{font-weight:800;font-size:13.5px;color:var(--dc,#1f2a44);margin-bottom:3px;}
.oil-res .res-card table{width:100%;border-collapse:collapse;}
.oil-res .res-card th{text-align:left;font-weight:600;color:#5a6478;font-size:11px;padding:2px 6px 2px 0;white-space:nowrap;vertical-align:top;width:1%;}
.oil-res .res-card td{padding:2px 0;font-size:12px;}
.oil-res .res-ordl{margin:1px 0;} .oil-res .res-ordl small{display:inline-block;width:34px;color:#7a7f8c;font-size:10px;font-weight:700;}
.oil-res .res-o{display:inline-block;padding:0 4px;margin:1px 2px 1px 0;border:1px solid #ddd5c4;border-radius:3px;background:#f7f4ec;font-size:11px;}
.oil-res .res-o.hit{border-color:var(--dc,#b42318);color:var(--dc,#b42318);font-weight:800;}
.oil-res .res-ok{color:#2e6b3a;font-weight:700;} .oil-res .res-no{color:#b42318;font-weight:700;}
.oil-res .res-trip{padding:6px 8px;border:1px solid #ddd5c4;border-radius:4px;background:#fffdf8;margin-bottom:6px;}
.oil-res .res-cands{width:100%;border-collapse:collapse;font-size:11.5px;}
.oil-res .res-cands th,.oil-res .res-cands td{border:1px solid #ddd5c4;padding:3px 5px;text-align:left;}
.oil-res .res-cands th{background:#f2eee3;font-size:10.5px;}
.oil-res .res-none{color:#7a7f8c;font-style:italic;}
.oil-res .res-edit{display:grid;grid-template-columns:1.2fr 1.2fr 1fr 1.3fr;gap:6px;align-items:end;}
.oil-res .res-edit .form-group{margin:0;}
.oil-res .res-edit-btns{grid-column:1/-1;display:flex;gap:12px;align-items:center;}
.oil-res .res-ack{padding:4px 8px;border-left:3px solid #2e6b3a;background:#eef5ef;color:#2e6b3a;margin:3px 0;font-size:12px;}
@media (max-width:640px){.oil-res .res-edit{grid-template-columns:1fr 1fr;}}

/* ===== OIL: ô MÃ + TÀI XẾ của chuyến cần xử lý = 1 khối xanh liền, bo tròn (pill1) — thay khung xanh ===== */
#oil-shell .tbl td.al-cell::after{display:none!important;}
#oil-shell .tbl tr td.al-cell{position:relative;z-index:0;color:#fff!important;font-weight:800!important;background:transparent!important;}
#oil-shell .tbl tr td.al-cell *{color:#fff!important;}
#oil-shell .tbl tr td.al-cell::before{content:"";position:absolute;top:3px;bottom:3px;left:0;right:0;background:#1f5fbf;z-index:-1;pointer-events:none;}
#oil-shell .tbl tr td.al-cell:has(+ td.al-cell)::before{left:3px;border-radius:6px 0 0 6px;}
#oil-shell .tbl tr td.al-cell + td.al-cell::before{right:3px;border-radius:0 6px 6px 0;}
@media print{#oil-shell .tbl tr td.al-cell{color:inherit!important;}#oil-shell .tbl tr td.al-cell::before{display:none;}}
#oil-shell .tbl tr td.al-cell:has(+ td.al-cell)::before{right:-2px;}

/* ===== oilportal1: TRẠNG THÁI CẤP DẦU + màn hình cổng tài xế ===== */
#fee-shell table.tbl.fee-main th.fop-th,#fee-shell table.tbl.fee-main td.fop-td{white-space:nowrap!important;text-align:left!important;}
.fop{display:inline-block;padding:1px 6px;border-radius:3px;font-size:10.5px;font-weight:800;white-space:nowrap;border:1px solid currentColor;line-height:1.5;}
.fop-CU{color:#6b7a99;}.fop-DA{color:#2f5a38;}.fop-CHO{color:#b42318;background:#fdf0ee;}.fop-CHUA{color:#8a6230;}.fop-TU{color:#555;}
@media screen and (max-width:480px){#fee-shell table.fee-main th.fop-th,#fee-shell table.fee-main td.fop-td,#fee-shell table.fee-main col.c-fop{display:none!important;}}
.fop-nb{display:inline-block;min-width:18px;padding:0 5px;border-radius:9px;background:#b42318;color:#fff;font-size:10.5px;font-weight:800;text-align:center;margin-left:4px;}
#oil-shell tr.fop-pend td{opacity:.5;font-style:italic;background:#f6f4ef!important;}
#oil-shell tr.fop-pend td:last-child{opacity:1;font-style:normal;}
.fop-note{padding:6px 12px;font-size:12px;color:#5a6478;}
.fop-acc{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:10px;padding:10px;}
.fop-acc-card{display:flex;gap:10px;border:1px solid #c9bfa9;border-radius:6px;padding:8px;background:#fffdf8;}
.fop-acc-card.off{opacity:.55;}
.fop-acc-card canvas{width:120px;height:120px;flex:0 0 120px;}
.fop-acc-i{display:flex;flex-direction:column;gap:4px;min-width:0;font-size:12.5px;}.fop-acc-i b{font-size:15px;}.fop-acc-i small{color:#5a6478;}
.fop-link{font-family:monospace;font-size:11.5px;word-break:break-all;text-transform:none;}
.fop-btns{display:flex;flex-wrap:wrap;gap:4px;}
.fop-tbl td,.fop-tbl th{white-space:nowrap;}.fop-tbl td.fop-wr{white-space:normal;min-width:240px;}
.fop-tbl tr.fop-done td{color:#444;}
.fop-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;padding:0 12px;}
.fop-cfg .btn{margin:10px 12px;}
.fop-acc-top{display:flex;gap:12px;padding:10px 12px;align-items:flex-start;}
.fop-acc-top canvas{width:130px;height:130px;flex:0 0 130px;}
td.fop-btns{display:table-cell;}td.fop-btns .btn{margin:1px;}

/* ===================================================================================
   vkstyle1 — GIAO DIỆN CHUẨN VY KHANG (vk.vinhphat.xyz · beige.css + flat.css)
   Áp cho phân hệ CẤP DẦU (#oil-shell) và CẤP PHÍ (#fee-shell). Chỉ màn hình; in giữ nguyên.
   =================================================================================== */
@media screen{
html body #oil-shell,html body #fee-shell{
 --vk-bg:#F5EFE3;--vk-bg2:#FAF6EE;--vk-panel:#FFFDF8;--vk-border:#D9CBB0;--vk-border2:#E8DDC8;
 --vk-dark:#3E2F23;--vk-dark2:#54412F;--vk-text:#2E2A24;--vk-muted:#6E6352;--vk-accent:#8B6B3E;--vk-accent-h:#74582F;--vk-gold:#B08D57;
 --vk-th:#EADFC8;--vk-zebra:#FBF7EE;--vk-hover:#F1E6D0;--vk-sel:#F6E7B8;--vk-blue:#1E6FD9;--vk-ok:#6B7A3A;--vk-danger:#A23B2A;
 --vk-font:"Roboto","Segoe UI",Tahoma,Arial,sans-serif;--vk-r:8px;--vk-shadow:0 1px 3px rgba(62,47,35,.10),0 1px 1px rgba(62,47,35,.06);
 font-family:var(--vk-font)!important;color:var(--vk-text)!important;background:var(--vk-bg)!important;font-size:13.5px;
}
html body #oil-shell *:not(.fa):not([class*="icon"]),html body #fee-shell *:not(.fa):not([class*="icon"]){font-family:var(--vk-font)!important;}
/* --- thanh trên --- */
html body #oil-shell .topbar,html body #fee-shell .topbar{background:var(--vk-dark)!important;color:#F5EFE3!important;border:0!important;border-bottom:2px solid var(--vk-gold)!important;box-shadow:var(--vk-shadow)!important;padding:5px 14px!important;min-height:46px}
html body #oil-shell .topbar .label,html body #fee-shell .topbar .label{color:rgba(245,239,227,.72)!important;font-size:11px!important;letter-spacing:.06em;font-weight:500!important}
html body #oil-shell .topbar .title,html body #fee-shell .topbar .title{color:#fff!important;font-size:18px!important;font-weight:500!important;letter-spacing:.01em!important;line-height:1.25!important}
html body #oil-shell .topbar .title *,html body #fee-shell .topbar .title *,html body #fee-shell .topbar .label *{color:inherit!important}
html body #oil-shell .topbar .btn,html body #fee-shell .topbar .btn{background:transparent!important;color:#F5EFE3!important;border:1px solid rgba(245,239,227,.35)!important;box-shadow:none!important;font-size:13px!important;font-weight:500!important;padding:5px 12px!important;border-radius:6px!important}
html body #oil-shell .topbar .btn:hover,html body #fee-shell .topbar .btn:hover{background:var(--vk-dark2)!important}
html body #oil-shell .topbar .btn-primary,html body #fee-shell .topbar .btn-primary{background:var(--vk-accent)!important;border-color:var(--vk-gold)!important;color:#fff!important}
/* --- sidebar --- */
html body #oil-shell .sidebar,html body #fee-shell .sidebar{background:var(--vk-bg2)!important;color:var(--vk-text)!important;border-right:1px solid var(--vk-border)!important;box-shadow:none!important}
html body #oil-shell .sidebar .sidebar-header,html body #fee-shell .sidebar .sidebar-header{background:var(--vk-dark)!important;border-bottom:2px solid var(--vk-gold)!important;padding:10px 14px!important}
html body #oil-shell .sidebar .sidebar-header *,html body #fee-shell .sidebar .sidebar-header *{color:#F5EFE3!important}
html body #oil-shell .sidebar .sidebar-header h1,html body #fee-shell .sidebar .sidebar-header h1{font-size:17px!important;font-weight:700!important}
html body #oil-shell .sidebar .nav-group-label,html body #fee-shell .sidebar .nav-group-label{color:var(--vk-muted)!important;font-size:11.5px!important;font-weight:600!important;letter-spacing:.06em!important;padding:10px 12px 4px!important}
html body #oil-shell .sidebar .nav-item,html body #fee-shell .sidebar .nav-item{background:var(--vk-panel)!important;color:var(--vk-text)!important;border:1px solid var(--vk-border2)!important;border-left:1px solid var(--vk-border2)!important;border-radius:6px!important;margin:3px 8px!important;width:calc(100% - 16px)!important;padding:6px 10px!important;font-size:12.5px!important;font-weight:600!important;min-height:30px;box-shadow:none!important}
html body #oil-shell .sidebar .nav-item:hover,html body #fee-shell .sidebar .nav-item:hover{background:var(--vk-hover)!important}
html body #oil-shell .sidebar .nav-item.active,html body #fee-shell .sidebar .nav-item.active{background:var(--vk-blue)!important;border-color:#1a5fbf!important;color:#fff!important}
html body #oil-shell .sidebar .nav-item.active *,html body #fee-shell .sidebar .nav-item.active *{color:#fff!important}
html body #oil-shell .sidebar-footer .btn,html body #fee-shell .sidebar-footer .btn{background:var(--vk-panel)!important;color:var(--vk-dark)!important;border:1px solid var(--vk-accent)!important;border-radius:6px!important;font-size:12.5px!important}
/* --- nền + thẻ --- */
html body #oil-shell .main,html body #oil-shell #content,html body #oil-shell .content,html body #fee-shell .main,html body #fee-shell .content{background:var(--vk-bg)!important}
html body #oil-shell .card,html body #fee-shell .card{background:var(--vk-panel)!important;border:1px solid var(--vk-border)!important;border-radius:var(--vk-r)!important;box-shadow:var(--vk-shadow)!important}
html body #oil-shell .card-header,html body #fee-shell .card > .card-header,html body #fee-shell .card:has(table.tbl.fee-cho) .card-header{background:var(--vk-bg2)!important;border-bottom:1px solid var(--vk-border)!important;color:var(--vk-dark)!important}
html body #oil-shell .card-header h3,html body #fee-shell .card-header h3,html body #fee-shell .card:has(table.tbl.fee-cho) .card-header h3{color:var(--vk-dark)!important;font-size:14.5px!important;font-weight:700!important;letter-spacing:.03em!important}
/* --- nút kiểu nổi VK --- */
html body #oil-shell #content .btn,html body #fee-shell .content .btn,html body #fee-shell .card-header .btn{border:1px solid #c9b89a!important;border-radius:7px!important;background:linear-gradient(#fff,#f3eee4)!important;color:var(--vk-dark)!important;box-shadow:0 1px 2px rgba(0,0,0,.15)!important;font-size:12.5px!important;font-weight:600!important;min-height:28px;padding:4px 11px!important;transition:transform .08s,box-shadow .12s}
html body #oil-shell #content .btn:hover,html body #fee-shell .content .btn:hover{border-color:#9c8559!important;box-shadow:0 2px 4px rgba(0,0,0,.2)!important;transform:translateY(-1px)}
html body #oil-shell #content .btn:active,html body #fee-shell .content .btn:active{transform:none;box-shadow:inset 0 1px 3px rgba(0,0,0,.25)!important;background:#ece5d6!important}
html body #oil-shell #content .btn-primary,html body #fee-shell .content .btn-primary{background:linear-gradient(#3b7be0,#1e5fc4)!important;color:#fff!important;border-color:#1a52a8!important}
/* --- ô nhập / lọc --- */
html body #oil-shell input:not([type=checkbox]):not([type=radio]),html body #oil-shell select,html body #fee-shell input:not([type=checkbox]):not([type=radio]),html body #fee-shell select{background:#FFFEFA!important;border:1px solid var(--vk-border)!important;color:var(--vk-text)!important;border-radius:5px!important;font-size:13.5px!important;min-height:31px;padding:3px 8px!important;box-shadow:none!important}
html body #oil-shell input:focus,html body #oil-shell select:focus,html body #fee-shell input:focus,html body #fee-shell select:focus{outline:none!important;border-color:var(--vk-accent)!important;box-shadow:0 0 0 2px rgba(139,107,62,.18)!important}
/* --- lưới dữ liệu --- */
html body #oil-shell #content table.tbl,html body #fee-shell .content table.tbl{background:var(--vk-panel)!important;font-size:13.5px!important;border-color:var(--vk-border)!important}
html body #oil-shell #content table.tbl th,html body #fee-shell .content table.tbl th,html body #fee-shell .content table.tbl.fee-main thead th{background:var(--vk-th)!important;color:var(--vk-dark)!important;font-size:12.5px!important;font-weight:700!important;letter-spacing:.02em!important;border-color:var(--vk-border)!important;padding:6px 7px!important;height:34px}
html body #oil-shell #content table.tbl td,html body #fee-shell .content table.tbl td{font-size:13.5px!important;border-color:var(--vk-border2)!important;color:var(--vk-text);padding:4px 7px!important;height:34px}
html body #oil-shell #content table.tbl tbody tr:nth-child(even):not([class*="st-"]):not(.row-nhot):not(.lxh-dup) td,html body #fee-shell .content table.tbl tbody tr:nth-child(even):not(.row-total) td{background-color:var(--vk-zebra)}
html body #oil-shell #content table.tbl tbody tr:hover td:not(.al-cell),html body #fee-shell .content table.tbl tbody tr:not(.row-total):hover td{background-color:var(--vk-hover)!important}
html body #fee-shell .content table.tbl tr.row-total td,html body #oil-shell #content table.tbl tr.row-total td{background:var(--vk-th)!important;color:var(--vk-dark)!important;font-weight:700!important}
/* --- thẻ tổng --- */
html body #oil-shell .oil-kpi,html body #fee-shell .fee-kpi,html body #fee-shell .fee-kpi-wait{background:var(--vk-panel)!important;border:1px solid var(--vk-border)!important;border-radius:var(--vk-r)!important;box-shadow:var(--vk-shadow)!important}
html body #oil-shell .oil-kpi-l,html body #fee-shell .fee-kpi-l{color:var(--vk-muted)!important;font-size:12px!important;font-weight:600!important}
html body #oil-shell .oil-kpi-v,html body #fee-shell .fee-kpi-v{font-size:20px!important;font-weight:700!important}
html body #oil-shell .oil-kpi-u{font-size:12px!important}
/* --- modal (đang mở trong 2 phân hệ) --- */
body:has(#oil-shell) .modal,body:has(#fee-shell) .modal{background:var(--vk-panel,#FFFDF8)!important;border:1px solid #D9CBB0!important;border-radius:8px!important;font-family:"Roboto","Segoe UI",Tahoma,Arial,sans-serif!important}
body:has(#oil-shell) .modal-header,body:has(#fee-shell) .modal-header{background:#EADFC8!important;border-bottom:1px solid #D9CBB0!important;padding:9px 14px!important}
body:has(#oil-shell) .modal-header h3,body:has(#fee-shell) .modal-header h3,body:has(#oil-shell) .modal-header .close,body:has(#fee-shell) .modal-header .close{color:#3E2F23!important;font-size:16px!important;font-weight:600!important;background:transparent!important;font-family:inherit!important}
body:has(#oil-shell) .modal label,body:has(#fee-shell) .modal label{font-size:12px!important;color:#6E6352!important;font-weight:600!important}
body:has(#oil-shell) .modal input:not([type=checkbox]),body:has(#oil-shell) .modal select,body:has(#fee-shell) .modal input:not([type=checkbox]),body:has(#fee-shell) .modal select{background:#FFFEFA!important;border:1px solid #D9CBB0!important;border-radius:5px!important;font-size:14px!important;min-height:32px}
body:has(#oil-shell) .modal-footer .btn,body:has(#fee-shell) .modal-footer .btn{border-radius:7px!important;font-size:13px!important;min-height:30px}
body:has(#oil-shell) .modal-footer .btn-primary,body:has(#fee-shell) .modal-footer .btn-primary,body:has(#oil-shell) .modal-footer #res-ack,body:has(#oil-shell) .modal-footer #oil-save{background:linear-gradient(#3b7be0,#1e5fc4)!important;color:#fff!important;border:1px solid #1a52a8!important}
body:has(#oil-shell) .modal-overlay,body:has(#fee-shell) .modal-overlay{background:rgba(46,42,36,.45)!important}
}
@media screen{
html body #oil-shell,html body #fee-shell{--sidebar-w:232px}
html body #oil-shell .sidebar,html body #fee-shell .sidebar{width:232px!important;min-width:232px!important}
html body #oil-shell .sidebar-footer,html body #fee-shell .sidebar-footer{border-top:1px solid var(--vk-border)!important;background:var(--vk-bg2)!important}
html body #oil-shell .sidebar-footer button,html body #fee-shell .sidebar-footer button{background:var(--vk-panel)!important;color:var(--vk-dark)!important;border:1px solid var(--vk-accent)!important;border-radius:6px!important;font-size:12.5px!important;font-weight:600!important;min-height:30px}
html body #oil-shell .sidebar-footer button:hover,html body #fee-shell .sidebar-footer button:hover{background:var(--vk-hover)!important}
/* ô đơn hàng: bớt đệm dọc để hàng ~38px */
html body #oil-shell #content table.tbl td.ord-td{padding-top:2px!important;padding-bottom:2px!important}
html body #oil-shell #content table.tbl td{padding-left:6px!important;padding-right:6px!important}
/* bộ lọc cấp phí: tự co theo chữ, không cắt */
html body #fee-shell .filter-bar select{width:auto!important;max-width:none!important}
}
@media screen{
html body #oil-shell #content .btn.btn-ghost,html body #fee-shell .content .btn.btn-ghost{background:transparent!important;border-color:transparent!important;box-shadow:none!important;padding:2px 4px!important;min-height:0;transform:none!important}
html body #oil-shell #content .btn.btn-ghost:hover,html body #fee-shell .content .btn.btn-ghost:hover{background:var(--vk-hover)!important;border-color:var(--vk-border2)!important}
/* chip LXH: chữ dễ đọc */
html body #oil-shell .oc{height:34px!important;width:92px!important;border-radius:5px!important}
html body #oil-shell .oc b{font-size:11.5px!important}
html body #oil-shell .oc i{font-size:9.5px!important}
/* nút trạng thái nhanh + nhãn DẦU bên cấp phí: không chữ siêu nhỏ */
html body #fee-shell .fee-tg{font-size:12px!important;padding:4px 10px!important}
html body #fee-shell .foc{font-size:11px!important;padding:2px 6px!important}
html body #oil-shell .oil-tg{font-size:12.5px!important}
html body #oil-shell .lxh-banner,html body #oil-shell .fee-banner{font-size:13px!important;border-radius:8px!important}
html body #oil-shell .lxh-banner li{font-size:12.5px!important}
}
/* màn 1366: bớt đệm để bảng vừa khung, nút IN/Z không đè */
@media screen and (max-width:1500px){
html body #oil-shell #content table.tbl td,html body #oil-shell #content table.tbl th{padding-left:4px!important;padding-right:4px!important}
html body #oil-shell .oc{width:86px!important}
html body #oil-shell #content table.tbl td{font-size:13px!important}
}
/* vkstyle1: chữ đã đủ lớn → bỏ phóng 1.12 của fit2 ở 1200–1499 để bảng cấp phí vừa khung */
@media screen and (min-width:1200px) and (max-width:1499px){html body #fee-shell .content > *{zoom:1!important;}}
@media screen and (max-width:1500px){
html body #fee-shell .content table.tbl td,html body #fee-shell .content table.tbl th{padding-left:4px!important;padding-right:4px!important}
html body #fee-shell .content table.tbl td{font-size:13px!important}
}
@media screen and (max-width:1500px){html body #fee-shell .content table.tbl.fee-main td.wrap{white-space:normal!important;max-width:170px;overflow-wrap:anywhere}}
@media screen and (max-width:1500px){
html body #fee-shell .content table.tbl.fee-main td.wrap{white-space:nowrap!important;max-width:none;overflow-wrap:normal}
html body #fee-shell .content table.tbl.fee-main td.wrap:nth-child(7){white-space:normal!important;max-width:130px;overflow-wrap:anywhere}
html body #fee-shell table.fee-main td.foc-td{white-space:normal!important}
html body #fee-shell table.fee-main td.foc-td .foc b{display:block!important}
}
@media screen{
html body #oil-shell .oc i{font-size:10px!important}
html body #oil-shell .lit-delta{font-size:10.5px!important}
body:has(#oil-shell) .modal .btn:not(.btn-primary):not(#res-ack):not(#oil-save),body:has(#fee-shell) .modal .btn:not(.btn-primary){border:1px solid #c9b89a!important;border-radius:7px!important;background:linear-gradient(#fff,#f3eee4)!important;color:#3E2F23!important;box-shadow:0 1px 2px rgba(0,0,0,.15)!important;font-size:12.5px!important;min-height:28px;padding:4px 11px!important}
}
/* oilportal5: bảng duyệt dầu tách cột */
.fop-req td,.fop-req th{white-space:nowrap!important;}
.fop-req tr.fop-first td{border-top:2px solid #b9ad94;}
.fop-req tr.fop-odd td{background:#faf7f0;}
.fop-req td.fop-act .btn{margin:1px;}
/* merge1: nhóm menu chung CẤP PHÍ & DẦU — SƠN VINH + TỔNG HỢP THEO CHUYẾN */
html body .nav-merged-main .nav-group-label{color:#8a6a1f!important;border-left:3px solid #b8892b;padding-left:8px!important;font-weight:700!important;}
html body #oil-shell .ov-pills{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px;}
html body #oil-shell .ov-pill{border:1px solid #d6cbb4;background:#fff;border-radius:16px;padding:5px 12px;font-size:13px;cursor:pointer;color:#4a3f2e;}
html body #oil-shell .ov-pill.on{background:#5b4a2e;color:#fff;border-color:#5b4a2e;}
html body #oil-shell .ov-pill.ov-NOFEE b,html body #oil-shell .ov-pill.ov-DUP b{color:#b3261e;}
html body #oil-shell .ov-pill.on b{color:#fff;}
html body #oil-shell .ov-tbl th.ov-gh{text-align:center;border-bottom:1px solid #d6cbb4;}
html body #oil-shell .ov-tbl tr.ov-sub th{font-size:12px;font-weight:600;}
html body #oil-shell .ov-tbl td{white-space:nowrap;font-size:13.5px;}
html body #oil-shell .ov-tbl td.ov-none{color:#a39a88;font-style:italic;text-align:center;}
html body #oil-shell .ov-tbl td.ov-lab b{display:inline-block;min-width:96px;border:1.5px solid var(--dc,#bfb39a);border-radius:5px;padding:2px 7px;text-align:center;}
html body #oil-shell .ov-tbl tr.ov-k-NOFEE td.ov-lab b{border-color:#b3261e;color:#b3261e;}
html body #oil-shell .ov-tt{display:inline-block;border-radius:12px;padding:2px 10px;font-size:12.5px;font-weight:700;}
html body #oil-shell .ov-tt-OK{background:#e5f2e5;color:#256b2c;}
html body #oil-shell .ov-tt-NOOIL{background:#f3eee3;color:#6b5b3e;}
html body #oil-shell .ov-tt-NOFEE{background:#fbe6e4;color:#b3261e;}
html body #oil-shell .ov-tt-DUP{background:#f6e3f1;color:#7a2a6b;}
html body #oil-shell .ov-tt-OTHER{background:#e6eef8;color:#1f5fbf;}
html body #oil-shell .ov-tt-ACK{background:#eef3e8;color:#4c6b2e;}
html body #oil-shell .ov-st{font-size:12px;color:#5c5243;}
html body #oil-shell .ov-st-DA_CAP{color:#256b2c;font-weight:600;}
html body #oil-shell .ov-st-CHO_CAP{color:#a05a00;font-weight:600;}
html body #oil-shell .ov-swap{color:#1f5fbf;cursor:help;}
html body #oil-shell .ov-act{white-space:nowrap;}
html body #oil-shell .ov-act .btn{padding:3px 8px!important;font-size:12px!important;margin-right:3px;}
html body #oil-shell .ov-act .ov-res{border-color:#b3261e!important;color:#b3261e!important;}
html body #oil-shell .ov-tbl th,html body #oil-shell .ov-tbl td{padding:5px 6px!important;}
html body #oil-shell .ov-tbl td.ov-lab b{min-width:84px;padding:1px 5px;}
@media (max-width:1499px){
  html body #oil-shell .ov-tbl th,html body #oil-shell .ov-tbl td{padding:4px 4px!important;font-size:12.5px!important;}
  html body #oil-shell .ov-tbl td.ov-lab b{min-width:76px;}
  html body #oil-shell .ov-tt{padding:2px 6px;font-size:11.5px;}
  html body #oil-shell .ov-act .btn{padding:2px 6px!important;font-size:11.5px!important;margin-right:2px;}
}
html body #oil-shell .ov-tbl td.ov-lab,html body #oil-shell .ov-tbl td.ov-act{width:1%;}
html body #oil-shell .ov-act .btn{min-width:0!important;}
html body #oil-shell table.ov-tbl{width:auto!important;min-width:0!important;margin:0 auto;}
html body #oil-shell #content .ov-tbl td.ov-act .btn{padding:3px 7px!important;font-size:12px!important;min-width:0!important;}
@media (max-width:1499px){ html body #oil-shell #content .ov-tbl th,html body #oil-shell #content .ov-tbl td{font-size:12.5px!important;padding:4px 5px!important;} html body #oil-shell #content .ov-tbl td.ov-act .btn{padding:2px 6px!important;font-size:11.5px!important;} }
@media (max-width:1399px){ html body #oil-shell #content .ov-tbl th,html body #oil-shell #content .ov-tbl td{font-size:12px!important;padding:4px 3px!important;} html body #oil-shell .ov-tbl td.ov-lab b{min-width:0;} html body #oil-shell .ov-tt{padding:2px 5px;font-size:11px;} }
@media (max-width:1399px){ html body #oil-shell #content .ov-tbl tbody tr td:nth-child(5):not(.ov-none),html body #oil-shell #content .ov-tbl tbody tr td:nth-child(10){white-space:normal!important;min-width:52px;} }
/* scrollfix1: màn CẤP DẦU TÀI XẾ (fee-oilportal) cuộn bình thường + gọn; sidebar cuộn riêng */
@media screen and (min-width:481px){
html body #fee-shell .content:has(.fop-scroll){display:block!important;overflow-y:auto!important;overflow-x:auto!important;}
html body #fee-shell .content .card:has(> .fop-scroll){display:block!important;overflow:visible!important;min-height:0!important;margin-bottom:12px;}
html body #fee-shell .fop-scroll{overflow:visible!important;max-height:none!important;}
}
html body #fee-shell .content:not(:has(.fee-scroll)),html body #oil-shell .content{overflow-y:auto!important;}
html body .sidebar .sidebar-nav{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;}
html body #fee-shell .content table.tbl.fop-tbl th,html body #fee-shell .content table.tbl.fop-tbl td{font-size:13px!important;padding:3px 8px!important;line-height:1.3!important;height:34px;}
html body #fee-shell .content table.tbl.fop-tbl th{height:30px;}
html body #fee-shell .content table.tbl.fop-tbl input,html body #fee-shell .content table.tbl.fop-tbl select,html body #fee-shell .content table.tbl.fop-tbl textarea{font-size:13px!important;height:26px!important;min-height:0!important;padding:2px 6px!important;line-height:1.2!important;}
html body #fee-shell .content table.tbl.fop-tbl textarea{height:auto!important;}
html body #fee-shell .content table.tbl.fop-tbl .btn{font-size:12px!important;padding:2px 8px!important;min-height:0!important;}
html body #fee-shell .fop-cfg .fop-note{font-size:12.5px!important;padding:6px 10px!important;}
html body #fee-shell .fop-cfg .card-header h3{font-size:14px!important;}
html body #fee-shell .content:has(.fop-scroll) > *{zoom:1!important;}
html body #fee-shell .content table.tbl.fop-tbl tbody td{height:34px!important;min-height:0!important;}
html body #fee-shell .content table.tbl.fop-tbl thead th{height:30px!important;}
html body #fee-shell .content table.tbl.fop-tbl td .btn,html body #fee-shell .content table.tbl.fop-tbl td input,html body #fee-shell .content table.tbl.fop-tbl td select{margin:0!important;vertical-align:middle!important;}

.fop-req td.fop-diff{background:#fdf0ee!important;color:#b42318;font-weight:800;}.fop-def{display:inline-block;margin-left:4px;padding:0 4px;border:1px solid #b42318;border-radius:3px;font-size:9.5px;}
/* navcolor1: nhóm menu có màu + biểu tượng riêng */
html body .nav-group[class*="ng-"]{--ng:#6b6b6b;--ngl:#f3f3f3;margin:0 6px 10px!important;}
html body .nav-group.ng-fee{--ng:#2e7d32;--ngl:#e8f3e9;}
html body .nav-group.ng-dau{--ng:#c66a00;--ngl:#fbefdf;}
html body .nav-group.ng-nhap{--ng:#1f5fa8;--ngl:#e6eef8;}
html body .nav-group.ng-kg{--ng:#6a3d9a;--ngl:#efe8f6;}
html body .nav-group[class*="ng-"] > .nav-group-label{display:flex!important;align-items:center;gap:6px;background:var(--ng)!important;color:#fff!important;border:0!important;border-left:0!important;border-radius:6px!important;padding:5px 8px!important;margin:0 0 4px!important;font-size:11.5px!important;font-weight:700!important;letter-spacing:.3px;line-height:1.25;}
html body .nav-group[class*="ng-"] .ng-ic{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.22);font-size:12px;flex:0 0 auto;}
html body .nav-group[class*="ng-"] .nav-item{border-left:3px solid var(--ng)!important;border-radius:0 5px 5px 0!important;margin:0 0 3px!important;}
html body .nav-group[class*="ng-"] .nav-item:hover{background:var(--ngl)!important;}
html body .nav-group[class*="ng-"] .nav-item.active{background:var(--ng)!important;color:#fff!important;border-color:var(--ng)!important;}

html body #oil-shell .nav-group[class*="ng-"] .nav-group-label, .nav-group[class*="ng-"] .nav-group-label *,html body #fee-shell .nav-group[class*="ng-"] .nav-group-label, .nav-group[class*="ng-"] .nav-group-label *{color:#fff!important;}
html body #oil-shell .nav-group[class*="ng-"] .nav-group-label,html body #fee-shell .nav-group[class*="ng-"] .nav-group-label{background:var(--ng)!important;}
html body #oil-shell .nav-group[class*="ng-"] .nav-item,html body #fee-shell .nav-group[class*="ng-"] .nav-item{border:1px solid #e3dccd!important;border-left:4px solid var(--ng)!important;border-radius:0 5px 5px 0!important;}
html body #oil-shell .nav-group[class*="ng-"] .nav-item:hover,html body #fee-shell .nav-group[class*="ng-"] .nav-item:hover{background:var(--ngl)!important;}
html body #oil-shell .nav-group[class*="ng-"] .nav-item.active,html body #fee-shell .nav-group[class*="ng-"] .nav-item.active{background:var(--ng)!important;color:#fff!important;border-color:var(--ng)!important;box-shadow:none!important;}
/* sync1: nút xử lý trên cột TRẠNG THÁI CẤP DẦU */
html body #fee-shell td.fop-td .foc-acts{display:inline-flex;gap:3px;margin-left:4px;vertical-align:middle;}
html body #fee-shell td.fop-td .foc-b{font-size:10.5px;font-weight:700;padding:1px 6px;border:1px solid #b9ad94;background:#fff;border-radius:4px;cursor:pointer;color:#4a3f2e;line-height:1.5;}
html body #fee-shell td.fop-td .foc-b:hover{background:#f3eee3;}
html body #fee-shell td.fop-td .foc-b-red{border-color:#b3261e;color:#b3261e;}
html body #fee-shell td.fop-td .foc-ackb{font-size:10.5px;color:#4c6b2e;font-weight:700;}
html body #fee-shell td.fop-td .foc-nooil{background:#eef3e8;color:#4c6b2e;border:1px solid #c9d8bb;}
html body #oil-shell .res-cands .res-use,html body #fee-shell .res-cands .res-use,.res-cands .res-use{font-size:11px!important;padding:2px 6px!important;white-space:nowrap;}
/* chocap1: đã khớp, chuyến dầu còn CHỜ CẤP */
html body #oil-shell .ov-tt-WAIT{background:#fdf0d5;color:#9a5b00;border:1px solid #f0c674;}
html body #oil-shell .ov-pill.ov-WAIT b{color:#9a5b00;}
html body #fee-shell td.fop-td .fop.foc-wait{background:#fdf0d5!important;color:#9a5b00!important;border:1px solid #f0c674!important;}

/* zbtn1: nút Zalo thống nhất toàn app — vuông bo góc, cỡ bằng nút IN, nền #0068FF, chữ Z trắng đậm */
.zs-btn,.btn-zalo-icon,#oil-shell .oil-zalo-btn.oil-sq,#oil-shell .oil-sidebtns > .oil-zalo-btn,#oil-shell .oil-sidebtns > button.zs-btn,#oil-shell button.zs-btn,#fee-shell button.zs-btn,#content button.zs-btn{
  box-sizing:border-box!important;width:30px!important;height:30px!important;min-width:30px!important;min-height:0!important;max-width:30px!important;
  padding:0!important;margin:0!important;border:0!important;border-radius:7px!important;
  background:#0068ff!important;color:#fff!important;font-size:0!important;line-height:30px!important;
  display:inline-flex!important;align-items:center;justify-content:center;overflow:hidden!important;white-space:nowrap;
  box-shadow:0 1px 2px rgba(0,0,0,.18);cursor:pointer;vertical-align:middle;letter-spacing:0!important}
.zs-btn:hover,.btn-zalo-icon:hover,#oil-shell .oil-zalo-btn.oil-sq:hover,#oil-shell .oil-sidebtns > button.zs-btn:hover{background:#0055d4!important}
.zs-btn::before,.btn-zalo-icon::before,#oil-shell .oil-zalo-btn.oil-sq::before,#oil-shell .oil-sidebtns > button.zs-btn::before{content:"Z";font-size:15px;font-weight:900;color:#fff;font-family:Arial,Helvetica,sans-serif}
.zs-btn .zs-ic,#oil-shell .zs-btn .zs-ic{display:none!important}
/* không hiện 2 nút Zalo cạnh nhau */
:has(> .btn-zalo-icon) > .zs-btn,:has(> .oil-zalo-btn) > .zs-btn{display:none!important}
/* cột nút bên phải bảng: IN rồi Z xếp dọc gọn */
.oil-sidebtns{display:flex!important;flex-direction:column!important;gap:6px!important;align-items:center}
.oil-sidebtns > .zs-btn{margin:0!important}
html body #oil-shell #content button.zs-btn,html body #oil-shell #content .oil-sidebtns > button.zs-btn,html body #fee-shell .content button.btn-zalo-icon,html body #oil-shell #content button.oil-zalo-btn.oil-sq{
  width:30px!important;height:30px!important;min-width:30px!important;min-height:0!important;padding:0!important;margin:0!important;border:0!important;border-radius:7px!important;
  background:#0068ff!important;color:#fff!important;font-size:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important}
html body #oil-shell #content button.zs-btn::before,html body #fee-shell .content button.btn-zalo-icon::before,html body #oil-shell #content button.oil-zalo-btn.oil-sq::before{content:"Z";font-size:15px;font-weight:900;color:#fff}
html body #oil-shell #content button.zs-btn .zs-ic{display:none!important}