/* ==== appStyles ==== */
:root{
  --font-ui:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI Variable','Segoe UI',system-ui,sans-serif;
  --font-display:'Be Vietnam Pro','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --nav:#123a6b;--nav2:#0b2748;--nav3:#214f83;--accent:#18a4d8;--accent2:#0f7fb2;
  --bg:#f3f6fa;--card:#fff;--text:#132033;--muted:#667085;--line:#e2e8f0;
  --danger:#c62828;--ok:#16854c;--warn:#b26a00;--purple:#6b5bd2;--shadow:0 10px 30px rgba(26,47,77,.08);
  /* iOS: JS sets px from window.innerHeight; 100dvh alone is wrong before chrome settles */
  --app-height:100dvh;
}
*{box-sizing:border-box}html{font-size:14px;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}html,body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-ui);font-feature-settings:'kern' 1,'liga' 1,'cv02' 1,'cv03' 1;font-variant-numeric:tabular-nums;min-height:100%;line-height:1.45}
button,input,select,textarea{font:inherit;letter-spacing:-.006em}button{font-weight:600}h1,h2,h3,h4,.brand-mark,.brand-xl{font-family:var(--font-display);letter-spacing:-.03em;font-weight:700}table{font-feature-settings:'tnum' 1}strong,b{font-weight:700}.hidden{display:none!important}.small{font-size:12px}.muted{color:var(--muted)}.grow{flex:1}.full{width:100%}.nowrap{white-space:nowrap}
.loading-bar{position:fixed;top:0;left:0;height:3px;width:0;background:var(--accent);z-index:9999;transition:width .25s,opacity .3s;opacity:0}.loading-bar.on{width:72%;opacity:1}.loading-bar.done{width:100%;opacity:0}
#toastRoot{position:fixed;top:max(10px,calc(env(safe-area-inset-top,0px) + 8px));right:max(10px,env(safe-area-inset-right,0px));left:auto;bottom:auto;transform:none;z-index:50050;display:flex;flex-direction:column;align-items:flex-end;gap:6px;width:auto;max-width:min(240px,calc(100vw - 20px));pointer-events:none;padding:0}
.toast-item{pointer-events:auto;width:auto;max-width:100%;box-sizing:border-box;padding:7px 10px;border-radius:9px;color:#fff;font-size:11px;font-weight:700;line-height:1.3;text-align:left;box-shadow:0 6px 18px rgba(0,0,0,.22);opacity:0;transform:translateY(-6px);transition:opacity .15s ease,transform .15s ease;word-break:break-word}
.toast-item.show{opacity:1;transform:translateY(0)}
.toast-item.is-bad{background:#c62828}
.toast-item.is-ok{background:#16854c}

/* Auth — V6.5.529: một nền #123a6b liền, không dải/gradient/body:before giả header */
html.auth-mode,html.auth-mode body{
  background:#123a6b!important;background-color:#123a6b!important;background-image:none!important
}
html.auth-mode .topbar-host{display:none!important}
html.auth-mode .app-stage{padding-top:0!important}
html.platform-ios.auth-mode body:before,
html.platform-ios:not(.auth-mode) body:before{content:none!important;display:none!important}
.auth-screen{
  position:fixed;inset:0;z-index:100;width:100%;
  min-height:100%;min-height:100dvh;min-height:-webkit-fill-available;
  background:#123a6b!important;
  background-color:#123a6b!important;
  background-image:none!important;
  display:grid;place-items:center;padding:24px;box-sizing:border-box;
  filter:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;transform:none!important;
  overflow:auto;-webkit-overflow-scrolling:touch;
  isolation:isolate
}
.auth-screen:before{content:none!important;display:none!important}
.auth-screen.hidden{display:none!important}
.auth-layout{width:min(1050px,100%);display:grid;grid-template-columns:1.2fr .8fr;gap:44px;align-items:center}.auth-hero{color:white;padding:24px}.brand-xl{font-size:30px;font-weight:900;letter-spacing:1.6px}.brand-xl span,.brand-mark span{color:#59d3ff}.auth-hero h1{font-size:42px;line-height:1.12;margin:26px 0 16px;max-width:720px}.auth-hero p{font-size:17px;line-height:1.7;color:#d9e9f8;max-width:680px}.auth-feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px;color:#e7f4ff}.auth-feature-grid>div{background:#ffffff12;border:1px solid #ffffff18;border-radius:12px;padding:12px}.auth-card{background:#fff;border-radius:22px;padding:28px;box-shadow:0 30px 90px #0005}.auth-card h2{margin:20px 0 4px}.auth-card label{display:block;font-size:12px;color:var(--muted);margin:12px 0}.auth-card input{width:100%;margin-top:6px}.auth-msg{margin-top:12px;min-height:18px}.brand-mark{font-weight:900;letter-spacing:.7px;font-size:20px;color:#163c6d}.auth-floating-locale{position:absolute;top:18px;right:22px;z-index:6}.auth-floating-locale .locale-toggle{background:#fff;border:1px solid rgba(255,255,255,.85);box-shadow:0 10px 24px rgba(3,16,38,.16);backdrop-filter:none;-webkit-backdrop-filter:none;filter:none;padding:3px;border-radius:10px}.auth-floating-locale .locale-toggle button{min-width:38px;padding:6px 9px;font-size:11px;font-weight:800;color:#6b7280;border-radius:7px}.auth-floating-locale .locale-toggle button.active{background:#2f7cff;color:#fff;box-shadow:0 5px 12px rgba(47,124,255,.24)}

/* App shell — topbar lives outside .shell (portal) so overflow:hidden cannot clip/fade it on iOS */
.app{display:grid;grid-template-columns:262px 1fr;min-height:var(--app-height,100dvh);height:var(--app-height,100dvh);overflow:hidden}aside#sidebar{position:sticky;top:0;height:var(--app-height,100dvh);background:linear-gradient(180deg,var(--nav),var(--nav2));color:white;padding:14px 12px;display:flex;flex-direction:column;z-index:30;box-shadow:4px 0 18px rgba(12,39,73,.08)}
/* V6.5.475: header FIXED — không cuộn theo trang; safe-area trắng đồng bộ */
.topbar-host{
  position:fixed!important;top:0;right:0;left:0;z-index:100;
  display:flex;flex-direction:column;
  background:#fff;background:var(--card);
  isolation:isolate;
  filter:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  transform:none!important;
  padding-top:env(safe-area-inset-top,0px);
  box-shadow:0 1px 0 var(--line)
}
.topbar-host:before{content:none!important;display:none!important}
html[data-theme="dark"] .topbar-host{background:var(--card)}
@media(min-width:901px){
  .topbar-host{left:262px}
  body.sidebar-compact .topbar-host{left:0}
}
/* Chừa chỗ cho header fixed */
.app-stage{display:flex;flex-direction:column;min-width:0;min-height:0;height:100%;overflow:hidden;padding-top:var(--topbar-height,96px)!important;box-sizing:border-box}
.shell{flex:1 1 auto;min-height:0;overflow:hidden;display:flex;flex-direction:column}
/* Cuộn ở #content — không để scrollbar main đè mép phải header */
.shell>main{flex:1 1 auto;min-height:0;min-width:0;display:flex;flex-direction:column;overflow:hidden!important}
#content.content{
  flex:1 1 auto;min-height:0;min-width:0;
  overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;
  scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:rgba(120,135,155,.35) transparent
}
#content.content::-webkit-scrollbar{width:8px;height:8px}
#content.content::-webkit-scrollbar-thumb{background:rgba(120,135,155,.35);border-radius:999px}
#content.content::-webkit-scrollbar-track{background:transparent}
.sidebar-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 14px 16px 11px}.sidebar-head .brand-mark{color:white}.nav-section{font-size:10px;opacity:.55;letter-spacing:1.3px;margin:14px 10px 6px}nav{display:flex;flex-direction:column;gap:4px;overflow:auto;padding-right:3px}nav::-webkit-scrollbar{width:5px}nav::-webkit-scrollbar-thumb{background:#ffffff25;border-radius:8px}nav button{border:0;color:#dceafa;background:transparent;text-align:left;border-radius:11px;padding:10px 12px;cursor:pointer;font-size:13px;font-weight:600;display:flex;align-items:center;gap:2px;transition:.15s}nav button:hover,nav button.active{background:#ffffff17;color:#fff}nav button.active{box-shadow:inset 3px 0 0 #58d0ff}.ico{display:inline-grid;place-items:center;width:25px;font-size:14px}.ico .tb-ico{display:block;opacity:.82;transition:opacity .15s}nav button:hover .tb-ico,nav button.active .tb-ico{opacity:1}nav button .ico{margin-right:6px}.sidebar-foot{margin-top:auto;border-top:1px solid #ffffff20;padding:13px 7px 0}.profile-line{font-size:12px;margin:0 3px 10px;line-height:1.5}.profile-line b{font-size:13px}
main{min-width:0}.topbar{min-height:78px;background:var(--card);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;padding:10px 18px;position:relative;z-index:40;flex-wrap:wrap;filter:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;transform:none!important}.title-wrap{min-width:150px;flex:0 1 220px}.topbar h2{margin:2px 0 0;font-size:21px;font-weight:700;letter-spacing:-.035em}.eyebrow{font-size:10px;letter-spacing:1.2px;color:#7a8799;text-transform:uppercase}.top-actions{margin-left:auto;display:flex;gap:8px;align-items:center;flex:0 1 auto;min-width:0}.top-actions>*{flex:0 0 auto}.top-actions select{max-width:180px;width:180px}.top-actions #branchFilter{min-width:260px;width:min(340px,36vw);max-width:360px}.content{padding:18px;max-width:1700px;margin:0 auto;width:100%;flex:1 1 auto;min-height:0}
.global-search-wrap{position:relative;display:flex;align-items:center;flex:0 1 220px;max-width:260px;min-width:160px;margin-left:0;width:220px}.global-search-wrap input{width:100%;height:38px;min-height:38px;padding:0 58px 0 36px;line-height:36px;background:#f7f9fc;border-radius:999px}.search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;line-height:1;width:16px;height:16px;color:#7a8799;pointer-events:none;z-index:1}.search-icon svg{width:16px;height:16px;display:block;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.global-search-wrap kbd{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;border:1px solid #d8e0ea;background:#fff;border-radius:6px;padding:2px 6px;line-height:1;height:22px;box-sizing:border-box;color:#8390a2;font-size:10px;pointer-events:none;z-index:1}.search-results{position:absolute;top:46px;left:0;right:0;background:white;border:1px solid var(--line);box-shadow:0 18px 50px #12253c25;border-radius:14px;max-height:430px;overflow:auto;z-index:100}.search-result-group{padding:8px}.search-result-title{font-size:10px;color:#8a96a7;text-transform:uppercase;letter-spacing:1px;padding:6px}.search-result-item{display:flex;gap:10px;align-items:flex-start;padding:10px;border-radius:10px;cursor:pointer}.search-result-item:hover{background:#f4f8fc}.search-result-item b{display:block;font-size:13px}.search-result-item small{color:var(--muted)}

/* Controls */
.row{display:flex;gap:8px;align-items:center}.spacer{flex:1}.wrap{flex-wrap:wrap}.btn{border:1px solid #cdd7e4;background:#fff;color:var(--text);padding:9px 12px;border-radius:10px;cursor:pointer;transition:.15s}.btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(20,50,80,.08)}.btn.primary{background:var(--accent);border-color:var(--accent);color:white;font-weight:700}.btn.primary:hover{background:var(--accent2)}.btn.danger{background:#fff0f0;color:var(--danger);border-color:#ffd0d0}.btn.success{background:#eaf8f0;color:var(--ok);border-color:#cdebd9}.btn.ghost{background:transparent;color:white;border-color:#ffffff35}.btn.compact{padding:9px 11px}.icon-btn{border:0;background:transparent;font-size:21px;cursor:pointer}.mobile-only{display:none}.notify-btn{position:relative;color:#173d70}.notify-count{position:absolute;right:-4px;top:-4px;background:#e53935;color:white;border-radius:999px;font-size:9px;min-width:17px;height:17px;display:grid;place-items:center;padding:0 4px}
input,select,textarea{min-height:40px;border:1px solid #ccd6e2;border-radius:10px;background:#fff;padding:9px 10px;color:var(--text);outline:none}input:focus,select:focus,textarea:focus{border-color:#6cc9eb;box-shadow:0 0 0 3px #1ba3d814}textarea{min-height:96px;resize:vertical}.search{min-width:250px}.search-compact{flex:0 0 auto;width:220px;max-width:min(220px,100%);min-width:160px}.local-search-wrap{position:relative;display:flex;align-items:center;flex:1;min-width:220px}.local-search-wrap input.search{width:100%;min-width:0;padding-left:36px}.local-search-wrap .search-icon{left:12px;color:#7a8799}.filter-bar{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.filter-bar label{font-size:11px;color:var(--muted);display:flex;flex-direction:column;gap:4px}.filter-bar .spacer{flex:1}.chip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:999px;padding:5px 9px;background:#fff;font-size:11px}.chip.active{background:#eaf6fb;border-color:#b8e5f5;color:#0c739f}

/* Cards + data */
.panel,.stat,.metric-card{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.panel{padding:16px;margin-bottom:14px}.panel.soft{background:#f9fbfd;box-shadow:none}.panel h3{margin:0 0 12px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}.stats.six{grid-template-columns:repeat(6,1fr)}.stat{padding:15px;position:relative;overflow:hidden}.stat .label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.35px}.stat .value{font-size:25px;font-weight:900;margin-top:6px;line-height:1.1}.stat .hint{font-size:11px;color:var(--muted);margin-top:6px}.stat .delta{position:absolute;right:12px;top:12px;font-size:10px;border-radius:999px;padding:4px 7px;background:#edf7f1;color:var(--ok)}.stat.warn .value{color:var(--warn)}.stat.danger .value{color:var(--danger)}
.cards2{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.mini-card{border:1px solid var(--line);border-radius:13px;padding:13px;background:#fff}.mini-card h4{margin:0 0 6px}.metric-inline{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px dashed #e7ecf2}.metric-inline:last-child{border-bottom:0}.metric-inline span{color:var(--muted);font-size:12px}.metric-inline b{font-size:13px}.section-title{font-size:13px;font-weight:800;margin:18px 0 9px;color:#2c3b4f}.toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}.toolbar .spacer{flex:1}.page-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.table-wrap,.permission-table-wrap{
  overflow:auto;border:1px solid var(--line);border-radius:12px;max-height:70vh;background:#fff;
  scrollbar-gutter:auto;-webkit-overflow-scrolling:touch;
  scrollbar-width:thin;scrollbar-color:rgba(120,135,155,.28) transparent;
}
.table-wrap::-webkit-scrollbar,.permission-table-wrap::-webkit-scrollbar{height:4px;width:4px}
.table-wrap::-webkit-scrollbar-track,.permission-table-wrap::-webkit-scrollbar-track{background:transparent}
.table-wrap::-webkit-scrollbar-thumb,.permission-table-wrap::-webkit-scrollbar-thumb{
  background:rgba(120,135,155,.28);border-radius:999px;
}
.table-wrap::-webkit-scrollbar-thumb:hover,.permission-table-wrap::-webkit-scrollbar-thumb:hover{background:rgba(120,135,155,.45)}
.table-wrap::-webkit-scrollbar-corner,.permission-table-wrap::-webkit-scrollbar-corner{background:transparent}
.table-wrap > table,.permission-table-wrap > table,.table-wrap table{
  /* Stretch to fill wrap (header bg spans empty right); grow past 100% when columns need scroll */
  width:max(100%,max-content)!important;min-width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0;
}
table{width:100%;border-collapse:separate;border-spacing:0;min-width:900px}
th,td{padding:10px 12px;border-bottom:1px solid #edf1f5;text-align:left;font-size:13px;vertical-align:middle}
.table-wrap th,.table-wrap td,.permission-table-wrap th,.permission-table-wrap td{
  white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis;vertical-align:middle;
  word-break:keep-all!important;overflow-wrap:normal!important;
}
.table-wrap td .table-link,.table-wrap td a,.table-wrap td button.table-link,.table-wrap td b,.table-wrap td span,
.permission-table-wrap td .table-link,.permission-table-wrap td a,.permission-table-wrap td b,.permission-table-wrap td span{
  white-space:nowrap!important;word-break:keep-all!important;overflow-wrap:normal!important;
}
.table-wrap th.is-resizable,.permission-table-wrap th.is-resizable{
  position:sticky!important;top:0!important;z-index:4;padding-right:12px!important
}
.table-wrap .col-resize-handle,.permission-table-wrap .col-resize-handle{
  position:absolute;right:0;top:0;bottom:0;width:7px;cursor:col-resize;user-select:none;z-index:2;
}
.table-wrap .col-resize-handle:hover,.table-wrap .col-resize-handle.is-dragging,
.permission-table-wrap .col-resize-handle:hover,.permission-table-wrap .col-resize-handle.is-dragging{
  background:rgba(47,124,255,.22);
}
th{position:sticky;top:0;background:#f8fafc;color:#556174;z-index:1;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.35px;border-top:0}
.table-wrap thead,.permission-table-wrap thead{background:linear-gradient(180deg,color-mix(in srgb,var(--accent,#12a9df) 6%,#f8fafc),#f8fafc)}
.table-wrap thead th,.permission-table-wrap thead th{background:inherit!important}
thead th{box-shadow:inset 0 1px 0 #f8fafc,inset 0 -1px 0 #edf1f5}
.products-stock-table table{min-width:1280px}.products-stock-table th{white-space:nowrap}tr:hover td{background:#fbfdff}.table-link{border:0;background:transparent;color:#0c75a2;font-weight:700;cursor:pointer;padding:0;text-align:left}.money{font-weight:700}.muted-cell{color:#7a8799}.badge{display:inline-flex;align-items:center;border-radius:999px;padding:5px 8px;background:#edf4ff;font-size:10.5px;white-space:nowrap}.badge.ok{background:#e8f7ef;color:var(--ok)}.badge.warn{background:#fff4df;color:var(--warn)}.badge.bad{background:#ffecec;color:var(--danger)}.badge.info{background:#eaf4fb;color:#0d77a7}.badge.purple{background:#f0edff;color:#5947c8}.pager{display:flex;justify-content:flex-end;gap:6px;margin-top:10px}.pager button{min-width:38px}.empty{text-align:center;padding:38px;color:var(--muted)}
.progress{height:9px;background:#edf1f5;border-radius:8px;overflow:hidden}.progress>div{height:100%;background:linear-gradient(90deg,#18a4d8,#41c2eb);border-radius:8px}.progress.warn>div{background:#e5a53d}.progress.ok>div{background:#32a86b}.kpi-value{font-size:24px;font-weight:900}.chart-wrap{position:relative;height:300px}.chart-wrap.sm{height:240px}.legend-dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:5px}

/* Forms */
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.form-grid.three{grid-template-columns:repeat(3,1fr)}.form-grid label{display:flex;flex-direction:column;gap:5px;font-size:11px;color:#5f6b7d}.span2{grid-column:1/-1}.span3{grid-column:1/-1}.line-item{display:grid;grid-template-columns:2fr .65fr 1fr 40px;gap:7px;margin:7px 0}
/* PC + mobile: card layout — tránh cột cắt Kho/Giá trên modal hẹp */
.issue-line-head{display:none!important}
.line-item.issue-line{
 display:grid;
 grid-template-columns:minmax(0,1fr) minmax(0,1fr) 40px;
 grid-template-areas:
  "vin vin del"
  "name name name"
  "wh cost cost";
 gap:8px;padding:12px;border:1px solid var(--line);border-radius:14px;background:#f8fafc;margin:0;align-items:start;
}
.line-item.issue-line .issue-field-vin{grid-area:vin}
.line-item.issue-line .issue-field-name{grid-area:name}
.line-item.issue-line .issue-field-wh{grid-area:wh}
.line-item.issue-line .issue-field-cost{grid-area:cost}
.line-item.issue-line .issue-line-del{grid-area:del;align-self:start;height:40px}
.issue-field{display:flex;flex-direction:column;gap:4px;min-width:0}
.issue-field-lab{display:block;font-size:11px;font-weight:700;color:#5f6b7d}
.line-item.issue-line .ii_vin,.line-item.issue-line .ii_cost{min-width:0;width:100%;box-sizing:border-box}
.line-item.issue-line .ii_wh,.line-item.issue-line .ii_name{background:#f4f7fb;color:#5f6b7d;white-space:normal;overflow:visible;word-break:break-word;line-height:1.35;min-height:38px;height:auto;padding:8px 10px;border:1px solid var(--line);border-radius:10px;font-size:12px;box-sizing:border-box}
.line-item.issue-line .ii_name{color:var(--text);font-weight:650}
.issue-lines{display:flex;flex-direction:column;gap:8px;max-height:min(42vh,360px);overflow:auto;scrollbar-gutter:auto;padding-right:2px}
.issue-line-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.issue-form-footer{margin-top:12px;justify-content:flex-end;flex-wrap:wrap;gap:8px}.form-section{border:1px solid var(--line);border-radius:14px;padding:14px;margin:10px 0;background:#fafcfe}.form-total{display:flex;justify-content:flex-end;gap:25px;margin-top:12px;font-size:13px}.form-total strong{font-size:17px}

/* Modal / Drawer */
.modal{position:fixed;inset:0;background:#0b1f38a8;display:grid;place-items:center;padding:14px;z-index:220}.modal-card{position:relative;width:min(980px,100%);max-height:94vh;overflow:auto;background:#fff;border-radius:18px;padding:22px;box-shadow:0 35px 100px #0005}.modal-x{position:absolute;right:12px;top:8px;border:0;background:transparent;font-size:27px;cursor:pointer;color:#526175}.drawer-backdrop{position:fixed;inset:0;background:#0b1f3845;z-index:199}
#modal>.modal-card:has(.sv-form-modal){
  width:min(1240px,calc(100vw - 16px))!important;
  max-height:min(96vh,96dvh)!important;
  padding:0!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important
}
#modal>.modal-card:has(.sv-form-modal)>#modalBody{
  flex:1 1 auto!important;min-height:0!important;width:100%!important;
  margin:0!important;padding:0!important;overflow:hidden!important;
  display:flex!important;flex-direction:column!important;box-sizing:border-box!important
}
.sv-form-modal{
  display:flex!important;flex-direction:column!important;
  flex:1 1 auto!important;min-height:0!important;height:100%!important;
  overflow:hidden!important;width:100%!important
}
.sv-form-modal .sv-form-head{
  flex:0 0 auto!important;
  position:relative!important;z-index:12!important;
  margin:0!important;
  padding:calc(14px + env(safe-area-inset-top,0px)) 20px 12px!important;
  background:var(--surface,var(--card,#fff))!important;
  border-bottom:1px solid var(--line)!important;
  box-shadow:0 8px 18px -14px rgba(15,23,42,.35)
}
.sv-form-modal .sv-form-head h2{
  margin:0 36px 0 0!important;font-size:20px!important;line-height:1.25!important;
  overflow-wrap:anywhere!important;white-space:normal!important
}
.sv-form-modal .sv-form-scroll{
  flex:1 1 auto!important;min-height:0!important;
  overflow-y:auto!important;overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;touch-action:pan-y!important;
  padding:14px 20px 8px!important;box-sizing:border-box!important
}
.sv-form-modal .sv-import-bar{
  display:flex;align-items:center;gap:12px;flex-wrap:nowrap;
  padding:10px 12px;margin-bottom:12px;
  background:#f6f9fc;border:1px solid var(--line);border-radius:12px
}
.sv-form-modal .sv-import-bar .sv-import-label{
  flex:0 0 auto;margin:0;font-size:12px;font-weight:600;color:#556174;white-space:nowrap
}
.sv-form-modal .sv-import-bar select{
  flex:1 1 auto;min-width:0;margin:0;min-height:38px;border-radius:10px;border:1px solid #d7dee8;background:#fff
}
.sv-form-modal .sv-import-bar #svImport{flex:0 0 auto;white-space:nowrap}
.sv-form-modal .sv-import-bar #svRefreshStock{flex:0 0 auto;white-space:nowrap}
.sv-form-modal .sv-stock-bad,.sv-part-short .sv-stock-bad{color:#b42318;font-weight:700;background:#fff1f0}
.sv-part-short td:nth-child(6),.sv-part-short td:nth-child(7){outline:1px solid rgba(180,35,24,.25)}
.sv-form-modal .section-title{margin:16px 0 8px;font-size:13px;font-weight:800;letter-spacing:.2px;color:#334155}
.sv-form-modal .form-grid.three{gap:10px 12px}
.sv-form-modal .form-grid label{font-size:12px;font-weight:600;color:#556174}
.sv-form-modal .form-grid .sv-span2{grid-column:span 2}
.sv-form-modal .form-grid input,
.sv-form-modal .form-grid select,
.sv-form-modal .form-grid textarea{
  margin-top:4px;border-radius:10px;border:1px solid #d7dee8;min-height:38px
}
.sv-form-modal .form-grid textarea{min-height:72px;resize:vertical}
.sv-form-modal .form-grid #sv_request{min-height:38px;height:38px;resize:vertical}
.sv-lines-wrap{
  grid-column:1;grid-row:1;min-width:0;min-height:0;
  max-height:min(calc(42vh - 8px),372px);overflow:auto;
  border:0;border-radius:0;background:#f8fafc;
  -webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  scrollbar-width:none!important;-ms-overflow-style:none!important;
  padding:0;box-sizing:border-box
}
.sv-lines-wrap::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}
.sv-form-modal .sv-form-scroll{scrollbar-width:thin;scrollbar-color:#c5ced8 transparent}
.sv-form-modal .sv-form-scroll::-webkit-scrollbar{width:8px;height:8px}
.sv-form-modal .sv-form-scroll::-webkit-scrollbar-thumb{background:#c5ced8;border-radius:999px}
.sv-form-modal .sv-form-scroll::-webkit-scrollbar-button{display:none!important;width:0!important;height:0!important}
/* Khung bảng + gutter thanh cuộn mỏng (không mũi tên Windows) */
.sv-scroll-shell{position:relative;margin:0 0 8px;display:flex;flex-direction:column;gap:8px}
.sv-scroll-frame{
  display:grid;grid-template-columns:minmax(0,1fr) 8px;grid-template-rows:minmax(0,1fr) 8px;
  max-height:min(42vh,380px);width:100%;
  border:1px solid var(--line);border-radius:12px;background:#f8fafc;overflow:hidden
}
.sv-scroll-frame.no-y{grid-template-columns:minmax(0,1fr) 0}
.sv-scroll-frame.no-x{grid-template-rows:minmax(0,1fr) 0}
.sv-scroll-frame.no-x .sv-lines-wrap{max-height:min(42vh,380px)}
.sv-scroll-frame .sv-vbar{
  grid-column:2;grid-row:1;position:relative;z-index:2;
  margin:0 1px 6px;background:transparent;border-radius:999px;pointer-events:none;
  --sv-head:0px
}
.sv-scroll-frame .sv-vbar::before{
  content:"";position:absolute;left:0;right:0;bottom:0;top:var(--sv-head);
  background:#e8eef3;border-radius:999px
}
.sv-scroll-frame .sv-hbar{
  grid-column:1;grid-row:2;position:relative;z-index:2;
  margin:1px 6px;background:#e8eef3;border-radius:999px;pointer-events:none
}
.sv-scroll-frame .sv-scroll-corner{grid-column:2;grid-row:2;background:#f8fafc}
.sv-scroll-frame .sv-hbar-thumb,
.sv-scroll-frame .sv-vbar-thumb{
  position:absolute;left:0;top:0;background:#8f9eae;border-radius:999px;pointer-events:auto;cursor:default
}
.sv-scroll-frame .sv-hbar-thumb{height:6px;min-width:28px;top:1px}
.sv-scroll-frame .sv-vbar-thumb{width:6px;min-height:28px;left:1px}
.sv-scroll-frame .sv-hbar.is-hidden,
.sv-scroll-frame .sv-vbar.is-hidden{visibility:hidden}
/* Tổng tiền cố định dưới bảng, sát phải */
.sv-lines-total{
  position:static;align-self:flex-end;z-index:8;
  display:inline-flex;align-items:center;gap:10px;
  min-height:32px;padding:6px 12px;
  background:#fff;border:1px solid var(--line);border-radius:10px;
  box-shadow:0 4px 14px rgba(15,23,42,.08);pointer-events:none
}
.sv-lines-total span{font-size:11px;font-weight:700;color:#556174;text-transform:uppercase;letter-spacing:.2px}
.sv-lines-total b{font-size:14px;font-weight:800;font-variant-numeric:tabular-nums;color:#102033;letter-spacing:.2px}
.sv-lines{min-width:1580px;width:max-content;border-collapse:separate;border-spacing:0;margin:0}
.sv-lines th,.sv-lines td{padding:6px 8px;font-size:11px;white-space:nowrap;border-bottom:1px solid #edf1f5;vertical-align:middle}
.sv-lines tbody td{background:#fff}
.sv-lines td:first-child,.sv-lines th:first-child{width:42px;min-width:42px;text-align:center;vertical-align:middle;padding-left:12px}
.sv-lines td:last-child,.sv-lines th:last-child{padding-right:14px;width:44px;min-width:44px}
.sv-lines td:last-child .sv-del,.sv-lines td:last-child .btn.compact{display:inline-flex;align-items:center;justify-content:center;min-width:30px;width:30px;height:30px;padding:0;box-sizing:border-box}
.sv-lines input[data-f="note"]{min-width:120px;width:140px}
.sv-lines .sv-stt{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:30px;height:30px;width:100%;
  font-size:12px;font-weight:700;color:#445;line-height:1
}
.sv-lines thead th{position:sticky;top:0;z-index:5;background:#f8fafc;font-size:10px;text-transform:uppercase;letter-spacing:.2px;color:#556174;box-shadow:inset 0 -1px 0 #d7dee8}
.sv-lines input,.sv-lines select{width:100%;min-width:72px;max-width:none;height:30px;padding:4px 8px;font-size:12px;border:1px solid #d7dee8;border-radius:8px;background:#fff;box-sizing:border-box;vertical-align:middle}
.sv-lines input[data-money="1"]{min-width:118px;width:122px;max-width:140px;text-align:right;font-variant-numeric:tabular-nums;letter-spacing:.2px}
.sv-lines input[type="checkbox"]{width:16px;min-width:16px;height:16px;margin:0 auto;display:block}
.sv-lines input[readonly]{background:#f4f7fb;color:#445}
.sv-form-actions{
  flex:0 0 auto!important;margin:0!important;
  padding:12px 20px max(12px,env(safe-area-inset-bottom,0px))!important;
  border-top:1px solid #edf1f5;background:#fff;z-index:12;
  display:flex;gap:8px;justify-content:flex-end;align-items:center
}
.drawer{
 position:fixed;right:0;top:0;bottom:0;left:auto;
 width:min(760px,96vw);height:100vh;height:100dvh;
 background:#fff;z-index:200;
 box-shadow:-20px 0 70px #0d284340;
 display:flex;flex-direction:column;
 overflow:hidden;box-sizing:border-box;
}
.drawer-head{padding:18px 20px;border-bottom:1px solid var(--line);display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex:0 0 auto}
.drawer-head-main{min-width:0;flex:1}
.drawer-head h2{margin:3px 0 0;font-size:20px}
.drawer-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
.drawer-actions:empty{display:none}
.drawer-actions .btn{min-height:34px;padding:6px 12px;font-size:13px}
.drawer-title-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:3px}
.drawer-title-row h2{margin:0}
.drawer-status{display:inline-flex;align-items:center}
.drawer-status.hidden{display:none!important}
.drawer-sub{margin-top:6px;font-size:12.5px;color:var(--muted);font-weight:600;line-height:1.35}
.drawer-sub:not(.hidden){display:block}
.drawer-body{padding:18px 20px;flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:rgba(120,135,155,.28) transparent}
.drawer-body::-webkit-scrollbar{width:4px;height:4px}
.drawer-body::-webkit-scrollbar-track{background:transparent}
.drawer-body::-webkit-scrollbar-thumb{background:rgba(120,135,155,.28);border-radius:999px}.tabs{display:inline-flex;align-items:center;gap:4px;width:100%;box-sizing:border-box;margin:0 0 14px;padding:4px;overflow:auto;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--soft,#eef3f8) 88%,#fff);box-shadow:inset 0 1px 0 rgba(255,255,255,.55)}.tabs button{appearance:none;border:0;background:transparent;flex:0 0 auto;padding:9px 14px;border-radius:9px;white-space:nowrap;cursor:pointer;color:var(--muted);font:600 12.5px/1.2 inherit;letter-spacing:.01em;transition:background .15s ease,color .15s ease,box-shadow .15s ease,transform .12s ease}.tabs button:hover{background:color-mix(in srgb,var(--accent,#12a9df) 10%,#fff);color:#0a6f94}.tabs button:focus-visible{outline:2px solid color-mix(in srgb,var(--accent,#12a9df) 55%,transparent);outline-offset:1px}.tabs button.active{background:linear-gradient(180deg,color-mix(in srgb,var(--accent,#12a9df) 16%,#fff),#fff);color:#0d789f;font-weight:800;box-shadow:0 1px 2px rgba(18,58,107,.08),0 0 0 1px color-mix(in srgb,var(--accent,#12a9df) 28%,var(--line))}.timeline{border-left:2px solid #e4eaf1;margin-left:8px;padding-left:18px}.timeline-item{position:relative;padding:0 0 16px}.timeline-item:before{content:"";position:absolute;left:-24px;top:4px;width:10px;height:10px;border-radius:50%;background:#55bfe5;border:2px solid white;box-shadow:0 0 0 1px #b9dceb}.timeline-item small{color:var(--muted)}

/* Kanban */
.kanban{display:grid;grid-template-columns:repeat(4,minmax(260px,1fr));gap:12px;overflow:auto;padding-bottom:8px}.kanban-col{background:#eef3f8;border-radius:14px;padding:10px;min-height:400px}.kanban-head{display:flex;align-items:center;justify-content:space-between;padding:4px 4px 10px;font-weight:800;font-size:12px}.kanban-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:9px;box-shadow:0 3px 10px rgba(25,52,79,.05);cursor:pointer}.kanban-card:hover{border-color:#b9ddec}.kanban-card h4{margin:0 0 6px;font-size:13px}.kanban-card p{margin:4px 0;font-size:11px;color:var(--muted)}

/* Misc */
.log{background:#0f172a;color:#d7e1ee;padding:13px;border-radius:12px;max-height:340px;overflow:auto;font-size:11px;white-space:pre-wrap}.quick-menu{position:fixed;right:max(74px,calc(74px + env(safe-area-inset-right,0px)));top:max(64px,calc(64px + env(safe-area-inset-top,0px)));background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 18px 50px #102c4a30;z-index:80;padding:7px;min-width:190px}.quick-menu button{display:block;width:100%;text-align:left;border:0;background:transparent;padding:10px;border-radius:9px;cursor:pointer}.quick-menu button:hover{background:#f3f7fb}.info-list{display:grid;grid-template-columns:150px 1fr;gap:7px 12px;font-size:12px}.info-list dt{color:var(--muted)}.info-list dd{margin:0;font-weight:600}.right{text-align:right}.clickable{cursor:pointer}

@media(max-width:1180px){.stats.six{grid-template-columns:repeat(3,1fr)}.global-search-wrap{max-width:240px;width:200px;flex-basis:200px}.cards3{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.app{grid-template-columns:1fr}.mobile-only{display:inline-block}.content{padding:12px}.topbar{padding:8px 10px;flex-wrap:nowrap;align-items:center}.title-wrap{min-width:0;flex:1 1 auto}.topbar .eyebrow,#pageSub{display:none}.global-search-wrap{order:0;flex:1 1 auto;min-width:100px;max-width:none;width:auto;margin:0}.top-actions select{max-width:140px}.top-actions #branchFilter{min-width:200px;width:min(280px,55vw);max-width:300px}.stats,.stats.six{grid-template-columns:1fr 1fr}.cards2,.cards3{grid-template-columns:1fr}.form-grid,.form-grid.three{grid-template-columns:1fr}.span2,.span3{grid-column:auto}.kanban{grid-template-columns:repeat(4,280px)}.auth-layout{grid-template-columns:1fr}.auth-hero{display:none}}
@media(max-width:560px){.stats,.stats.six{grid-template-columns:1fr 1fr}.stat .value{font-size:20px}.search{min-width:100%;width:100%}.search-compact{width:100%;max-width:100%}.topbar h2{font-size:17px}.top-actions{gap:5px}.top-actions select{max-width:118px}.line-item{grid-template-columns:1fr 70px 90px 38px}.modal-card{padding:18px 14px}.drawer{width:100vw}.drawer-body{padding:14px}.info-list{grid-template-columns:110px 1fr}.auth-screen{padding:max(12px,env(safe-area-inset-top,0px)) max(12px,env(safe-area-inset-right,0px)) max(12px,env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px))}.auth-card{padding:22px}.auth-floating-locale{top:max(12px,calc(env(safe-area-inset-top,0px) + 8px));right:max(12px,env(safe-area-inset-right,0px))}.auth-floating-locale .locale-toggle button{min-width:36px;padding:6px 8px}}

/* Brand logo */
.brand-with-logo{display:inline-flex;align-items:center;gap:10px}
.brand-logo{border-radius:4px;object-fit:contain;flex:0 0 auto;box-shadow:0 4px 14px rgba(0,0,0,.12)}
.brand-logo-lg{border-radius:6px}
.brand-with-logo>span{display:inline-flex;align-items:baseline;gap:4px}

/* PWA standalone & multi-device */
html.vk-open #modal>.modal-card,
html.vk-open .drawer{
  max-height:calc(var(--app-height,100dvh) - 8px)!important
}
html.vk-open #modal .form-actions-bar,
html.vk-open .drawer-actions{
  padding-bottom:max(12px,env(safe-area-inset-bottom,0px))
}
/* Cho phép copy VIN / số tiền / nội dung nghiệp vụ trong PWA */
html.pwa-standalone .content,
html.pwa-standalone .drawer-body,
html.pwa-standalone #modal,
html.pwa-standalone #drawer,
html.pwa-standalone input,
html.pwa-standalone textarea,
html.pwa-standalone select,
html.pwa-standalone td,
html.pwa-standalone th,
html.pwa-standalone .table-link,
html.pwa-standalone .money,
html.pwa-standalone .info-list,
html.pwa-standalone pre,
html.pwa-standalone .auth-card{-webkit-user-select:text;user-select:text}
/* Khóa cuộn document — chỉ .shell>main được cuộn; header fixed không bị kéo */
html,body{overflow:hidden!important;height:100%!important;width:100%;overscroll-behavior:none;touch-action:manipulation}
html.platform-ios,html.platform-ios body,
html.pwa-standalone,html.pwa-standalone body{position:fixed;inset:0;overflow:hidden!important}
/* Safe-area: áp dụng luôn khi có notch/Dynamic Island (Safari + PWA) */
/* safe-area top owned by .topbar-host:before — do not re-pad .topbar */
aside#sidebar{padding-top:max(14px,env(safe-area-inset-top,0px));padding-bottom:env(safe-area-inset-bottom,0px)}
.content{padding-bottom:max(18px,env(safe-area-inset-bottom,0px))}
.auth-screen{padding:24px;padding-top:max(24px,calc(env(safe-area-inset-top,0px) + 12px));padding-right:max(24px,env(safe-area-inset-right,0px));padding-bottom:max(24px,env(safe-area-inset-bottom,0px));padding-left:max(24px,env(safe-area-inset-left,0px))}
.auth-floating-locale{top:max(12px,calc(env(safe-area-inset-top,0px) + 10px))!important;right:max(16px,env(safe-area-inset-right,0px))!important}
html.pwa-standalone .pwa-install-fab,html.pwa-standalone .pwa-install-link{display:none!important}
/* Nút Cài app không được đè form/modal */
html.modal-open .pwa-install-fab,
body.modal-open .pwa-install-fab,
html.drawer-open .pwa-install-fab,
body.menu-open .pwa-install-fab{display:none!important}
html.platform-ios input,html.platform-ios select,html.platform-ios textarea{font-size:16px}
html{-webkit-tap-highlight-color:transparent}
body{overscroll-behavior-y:none;-webkit-overflow-scrolling:touch}

/* Tablet — iPad / Android tablet */
@media(min-width:768px) and (max-width:1180px){
 .app{grid-template-columns:228px 1fr}
 .stats,.stats.six,.stats.executive{grid-template-columns:repeat(3,1fr)}
 .quick-actions{grid-template-columns:repeat(2,1fr)}
 .dashboard-grid-main{grid-template-columns:1fr}
 .content{padding:16px 18px 28px}
 .kanban{grid-template-columns:repeat(3,minmax(240px,1fr))}
 .topbar h2{font-size:19px}
 .global-search-wrap{max-width:220px;width:200px}
 .form-grid.three{grid-template-columns:repeat(2,1fr)}
}

/* iPad landscape / small laptop */
@media(min-width:901px) and (max-width:1280px){
 .stats.six{grid-template-columns:repeat(3,1fr)}
 .cards3{grid-template-columns:repeat(2,1fr)}
}

/* ================= V6.5.481 · Cross-device UX (UI UX Pro Max) =================
   Inventory/B2B: flat + clarity; touch 44 iOS / 48 Android; safe-area mọi mobile;
   breakpoints 375 / 768 / 1024 / 1440; không clip góc máy giả. */
:root{
  --touch-min:44px;
  --space-1:8px;
  --space-2:16px;
  --gutter:18px;
  --sat:env(safe-area-inset-top,0px);
  --sab:env(safe-area-inset-bottom,0px);
  --sal:env(safe-area-inset-left,0px);
  --sar:env(safe-area-inset-right,0px)
}
html.platform-android{--touch-min:48px}
html{scroll-padding-top:var(--topbar-height,96px)}

/* Focus rõ (keyboard) — không bỏ outline */
:focus-visible{outline:2px solid color-mix(in srgb,var(--accent,#12a9df) 70%,#0b5f86);outline-offset:2px}
.btn:focus-visible,.icon-btn:focus-visible,nav button:focus-visible{
  outline:2px solid color-mix(in srgb,var(--accent,#12a9df) 70%,#0b5f86);outline-offset:2px
}

/* Chip / badge: không cắt nhãn; collection wrap */
.chip,.badge{max-width:100%;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chip-list,.toolbar,.page-actions,.filter-bar,.top-actions{gap:max(8px,var(--space-1))}
.filter-bar{row-gap:10px}
.toolbar,.page-actions{flex-wrap:wrap}

/* Token dài (VIN, mã) — không phá layout */
.table-wrap td .table-link,
.table-wrap td code,
.table-wrap td .mono,
.table-wrap td[data-col="vin"],
.table-wrap td:first-child b{
  overflow-wrap:anywhere;word-break:break-word;min-inline-size:0
}

/* Touch — iOS 44 / Android 48 / coarse pointer */
@media(pointer:coarse){
  .btn,.icon-btn,.notify-btn,.user-avatar-btn,#menuBtn,#refreshBtn,#themeBtn{
    min-height:var(--touch-min);min-width:var(--touch-min)
  }
  nav button{min-height:var(--touch-min);padding:11px 12px}
  .pager button{min-height:var(--touch-min);min-width:var(--touch-min)}
  .tabs button{min-height:var(--touch-min);padding:12px 14px}
  .top-actions{gap:8px}
  .btn:active,.icon-btn:active,nav button:active{opacity:.86}
  .btn:hover{transform:none;box-shadow:none}
}

/* Phone ≤560 */
@media(max-width:560px){
  .content{padding:10px max(10px,var(--sal)) max(16px,calc(var(--sab) + 8px)) max(10px,var(--sar))}
  .topbar{gap:8px;padding:8px max(10px,var(--sal)) 8px max(10px,var(--sar))}
  .topbar h2{font-size:17px;line-height:1.25}
  .global-search-wrap kbd{display:none}
  .filter-bar label{flex:1 1 calc(50% - 8px);min-width:140px}
  .filter-bar label select,.filter-bar label input,
  .filter-bar .search,.filter-bar .local-search-wrap{width:100%;min-width:0}
  .filter-bar .btn,.page-actions .btn,.toolbar .btn{flex:1 1 auto;min-height:var(--touch-min)}
  .stats,.stats.six{gap:8px}
  .stat{padding:12px}
  .stat .value{font-size:18px}
  .panel{padding:12px;border-radius:14px}
  .table-wrap,.permission-table-wrap{max-height:min(62vh,520px);border-radius:12px;-webkit-overflow-scrolling:touch}
  .pager{justify-content:center;flex-wrap:wrap;gap:8px}
  input,select,textarea{font-size:16px;min-height:var(--touch-min)}
}

/* Tablet 768–1024 (iPad / Android tablet) */
@media(min-width:768px) and (max-width:1024px){
  .content{padding:16px 20px max(24px,calc(var(--sab) + 12px))}
  .filter-bar label{min-width:150px}
  .stats,.stats.six{grid-template-columns:repeat(3,1fr);gap:12px}
  .table-wrap,.permission-table-wrap{max-height:min(68vh,640px)}
  .modal{padding:max(12px,var(--sat)) 16px max(12px,var(--sab))}
}

/* PC lớn ≥1440 — gutter rộng hơn, mật độ ổn */
@media(min-width:1440px){
  .content{padding:22px 28px 32px;max-width:1700px}
  .topbar{padding:12px 22px}
  .stats{gap:14px}
}

/* Phone landscape — tránh header chiếm nửa màn */
@media(max-height:500px) and (orientation:landscape){
  .topbar{min-height:0;padding:6px 10px}
  .topbar h2{font-size:15px}
  .app-stage{padding-top:var(--topbar-height,72px)!important}
  .content{padding-top:8px;padding-bottom:max(10px,var(--sab))}
  .stats{margin-bottom:8px}
}

/* ================= iPhone — full-bleed, KHÔNG clip góc máy giả ================= */
html.platform-ios{
  --sat:env(safe-area-inset-top,0px);
  --sab:env(safe-area-inset-bottom,0px);
  --sal:env(safe-area-inset-left,0px);
  --sar:env(safe-area-inset-right,0px);
  --touch-min:44px
}
html.platform-ios:not(.auth-mode),
html.platform-ios:not(.auth-mode) body{
  background:var(--bg)!important;background-color:var(--bg)!important
}
html.platform-ios.pwa-standalone:not(.auth-mode) body{background:var(--bg)!important}
html.platform-ios.pwa-standalone body:after{content:none!important;display:none!important}
html.platform-ios .topbar-host{
  border-radius:0!important;
  background:var(--card)!important;
  background-color:var(--card)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  filter:none!important;
  transform:none!important;
  padding-top:var(--sat)!important;
  /* Sơn đặc full mép trên — chống glass quanh Dynamic Island khi standalone/Web Clip */
  box-shadow:none!important;
  background-clip:padding-box!important
}
html.platform-ios.pwa-standalone .topbar-host{
  background:#fff!important;
  background-color:#fff!important;
  background-image:linear-gradient(#fff,#fff)!important
}
html[data-theme="dark"].platform-ios.pwa-standalone .topbar-host{
  background:var(--card)!important;
  background-color:var(--card)!important;
  background-image:none!important
}
html.platform-ios .topbar{
  border-radius:0!important;
  padding-left:max(12px,var(--sal))!important;
  padding-right:max(12px,var(--sar))!important
}
html.platform-ios #app,.app{border-radius:0!important}
html.platform-ios .auth-card{border-radius:20px!important}
html.platform-ios .panel,
html.platform-ios .stat,
html.platform-ios .metric-card,
html.platform-ios .mini-card{border-radius:14px!important}
html.platform-ios .modal-card{border-radius:16px!important}
html.platform-ios .content{
  padding-left:max(12px,var(--sal))!important;
  padding-right:max(12px,var(--sar))!important;
  padding-bottom:max(18px,calc(var(--sab) + 10px))!important
}
html.platform-ios .auth-screen{
  padding-left:max(16px,var(--sal))!important;
  padding-right:max(16px,var(--sar))!important;
  padding-top:max(20px,calc(var(--sat) + 10px))!important;
  padding-bottom:max(20px,calc(var(--sab) + 10px))!important;
  border-radius:0!important
}
html.platform-ios .auth-floating-locale{
  top:max(10px,calc(var(--sat) + 8px))!important;
  right:max(12px,var(--sar))!important
}
html.platform-ios input,html.platform-ios select,html.platform-ios textarea{font-size:16px}
@media(max-width:900px){
  html.platform-ios .modal{padding:max(8px,var(--sat)) 10px max(8px,var(--sab))!important}
  html.platform-ios aside#sidebar{border-radius:0!important}
}

/* Android — 48dp touch + safe-area + chrome khớp nền */
html.platform-android{
  --touch-min:48px;
  --sat:env(safe-area-inset-top,0px);
  --sab:env(safe-area-inset-bottom,0px);
  --sal:env(safe-area-inset-left,0px);
  --sar:env(safe-area-inset-right,0px)
}
html.platform-android:not(.auth-mode),
html.platform-android:not(.auth-mode) body{background:#fff!important}
html.platform-android .topbar-host{
  border-radius:0!important;
  background:#fff!important;
  padding-top:var(--sat)!important
}
html.platform-android .topbar{
  padding-left:max(12px,var(--sal))!important;
  padding-right:max(12px,var(--sar))!important
}
html.platform-android .content{
  padding-left:max(12px,var(--sal))!important;
  padding-right:max(12px,var(--sar))!important;
  padding-bottom:max(18px,calc(var(--sab) + 12px))!important
}
html.platform-android .btn,
html.platform-android .icon-btn,
html.platform-android .notify-btn,
html.platform-android .user-avatar-btn,
html.platform-android #menuBtn,
html.platform-android #refreshBtn,
html.platform-android #themeBtn,
html.platform-android nav button,
html.platform-android .pager button,
html.platform-android .tabs button{
  min-height:48px;min-width:48px
}
html.platform-android input,
html.platform-android select,
html.platform-android textarea{font-size:16px;min-height:48px}
html.platform-android .btn:active{opacity:.88}


/* Accent picker CSS kept unused — color only in Cấu hình */
/* ================= V6.5.484 · Apple HIG + color ================= */
html:not(.auth-mode){
  --soft:#e8e8ed;--surface:var(--card);--link:var(--accent2);
  --tint-cyan:color-mix(in srgb,var(--accent) 14%,#fff);
  --tint-blue:color-mix(in srgb,#0071e3 12%,#fff);
  --tint-green:color-mix(in srgb,#34c759 12%,#fff);
  --tint-orange:color-mix(in srgb,#ff9f0a 14%,#fff);
  --tint-red:color-mix(in srgb,#ff3b30 10%,#fff);
  --tint-purple:color-mix(in srgb,#af52de 10%,#fff);
  --hairline:rgba(0,0,0,.08);
  --elev:0 1px 2px rgba(0,0,0,.04),0 8px 24px rgba(18,58,107,.06);
  --sidebar-w:256px
}
html[data-theme="dark"]:not(.auth-mode){
  --tint-cyan:color-mix(in srgb,var(--accent) 22%,#0d1b2a);
  --tint-blue:color-mix(in srgb,#0071e3 20%,#0d1b2a);
  --tint-green:color-mix(in srgb,#34c759 18%,#0d1b2a);
  --tint-orange:color-mix(in srgb,#ff9f0a 18%,#0d1b2a);
  --tint-red:color-mix(in srgb,#ff3b30 16%,#0d1b2a);
  --tint-purple:color-mix(in srgb,#af52de 16%,#0d1b2a);
  --hairline:rgba(255,255,255,.1);
  --elev:0 1px 2px rgba(0,0,0,.35),0 12px 28px rgba(0,0,0,.28)
}
.topbar-host{background:#fff!important;background-color:#fff!important;box-shadow:none!important;border-bottom:1px solid var(--hairline)}
html[data-theme="dark"] .topbar-host{background:var(--card)!important;background-color:var(--card)!important}
.topbar{min-height:52px!important;padding:8px 16px!important;gap:8px!important;background:transparent!important;border-bottom:0!important;box-shadow:none!important}
.topbar h2{font-size:17px!important;font-weight:600!important;letter-spacing:-.022em;color:var(--text);font-family:var(--font-display)}
.eyebrow{font-size:10px;letter-spacing:.1em;color:var(--accent2);font-weight:700;text-transform:uppercase}
.top-actions .global-search-wrap input,.global-search-wrap input{
  height:32px!important;min-height:32px!important;line-height:30px!important;
  background:rgba(0,0,0,.05)!important;border:0!important;border-radius:9px!important;font-size:13px
}
html[data-theme="dark"] .global-search-wrap input{background:rgba(255,255,255,.08)!important}
aside#sidebar{
  width:var(--sidebar-w,240px);padding:12px 10px!important;
  background:
    radial-gradient(120% 80% at 0% 0%,color-mix(in srgb,var(--accent) 28%,transparent),transparent 55%),
    linear-gradient(180deg,#154a7e 0%,var(--nav) 42%,var(--nav2) 100%)!important;
  border-right:1px solid rgba(255,255,255,.08)!important
}
.sidebar-head{padding:8px 8px 14px!important}
.brand-mark span{color:#7ddcff!important}
nav{gap:3px!important}
nav button{
  border-radius:10px!important;padding:9px 11px!important;font-size:13px!important;font-weight:500!important;
  letter-spacing:-.01em;color:#e8f4ff!important;transition:background .15s ease,color .15s ease!important
}
nav button:hover{background:rgba(255,255,255,.12)!important}
nav button.active{
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 75%,#fff),var(--accent))!important;
  color:#fff!important;font-weight:700!important;
  box-shadow:0 6px 16px color-mix(in srgb,var(--accent) 35%,transparent)!important
}
.nav-section{opacity:.5;margin:14px 8px 6px!important;font-size:10px;letter-spacing:.08em;color:#b8d4ea}
.sidebar-foot{border-radius:12px!important;padding:12px!important;margin-top:auto;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.1)!important}
.profile-security{color:#7ddcff!important}
html:not(.auth-mode) .content{
  background:
    radial-gradient(900px 420px at 100% -10%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 60%),
    radial-gradient(700px 380px at -10% 20%,color-mix(in srgb,#0071e3 8%,transparent),transparent 55%),
    var(--bg)
}
.content{padding:20px 22px 36px}
.panel,.stat,.metric-card,.mini-card{border-radius:14px!important;box-shadow:var(--elev)!important;border:1px solid var(--hairline)!important;background:var(--card)}
.panel{padding:16px 18px!important;margin-bottom:14px;overflow:hidden}
.panel.premium{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 5%,#fff),#fff)!important}
html[data-theme="dark"] .panel.premium{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 12%,var(--card)),var(--card))!important}
.stats{gap:12px!important}
.stat{padding:16px!important;position:relative;overflow:hidden;isolation:isolate}
.stat:before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:4px;border-radius:0 4px 4px 0;background:var(--accent);opacity:.9}
.stat:after{content:"";position:absolute;right:-20px;top:-24px;width:88px;height:88px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 18%,transparent),transparent 70%);pointer-events:none;z-index:0}
.stat>*{position:relative;z-index:1}
.stats .stat:nth-child(4n+1){background:linear-gradient(145deg,var(--tint-cyan),var(--card))}
.stats .stat:nth-child(4n+1):before{background:#18a4d8}
.stats .stat:nth-child(4n+2){background:linear-gradient(145deg,var(--tint-blue),var(--card))}
.stats .stat:nth-child(4n+2):before{background:#0071e3}
.stats .stat:nth-child(4n+3){background:linear-gradient(145deg,var(--tint-green),var(--card))}
.stats .stat:nth-child(4n+3):before{background:#34c759}
.stats .stat:nth-child(4n+4){background:linear-gradient(145deg,var(--tint-orange),var(--card))}
.stats .stat:nth-child(4n+4):before{background:#ff9f0a}
.stat .label{font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--muted)}
.stat .value{font-size:26px;font-weight:800;letter-spacing:-.03em;color:var(--text);margin-top:6px;font-family:var(--font-display)}
.stat.warn{background:linear-gradient(145deg,var(--tint-orange),var(--card))!important}
.stat.danger{background:linear-gradient(145deg,var(--tint-red),var(--card))!important}
.stat.warn:before{background:#ff9f0a!important}
.stat.danger:before{background:#ff3b30!important}
.mini-card{background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 6%,#fff),#fff)!important}
.btn{border-radius:10px!important;font-weight:600;letter-spacing:-.01em;transition:background .15s ease,box-shadow .15s ease,opacity .15s ease!important}
.btn:hover{transform:none!important}
.btn.primary{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 88%,#fff),var(--accent))!important;border:0!important;color:#fff!important;box-shadow:0 4px 14px color-mix(in srgb,var(--accent) 32%,transparent)!important}
.btn.primary:hover{background:linear-gradient(180deg,var(--accent),var(--accent2))!important;filter:none}
.btn.success{background:var(--tint-green)!important;border-color:color-mix(in srgb,#34c759 35%,var(--line))!important;color:#0b7a3a!important}
.btn.danger{background:var(--tint-red)!important;border-color:color-mix(in srgb,#ff3b30 30%,var(--line))!important}
input,select,textarea{border-radius:10px!important;border-color:color-mix(in srgb,var(--line) 80%,var(--accent))!important;font-family:var(--font-ui)}
input:focus,select:focus,textarea:focus{border-color:var(--accent)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)!important}
.chip{border-radius:999px;background:#fff;border-color:color-mix(in srgb,var(--line) 70%,var(--accent))}
.chip.active{background:var(--tint-cyan)!important;border-color:color-mix(in srgb,var(--accent) 45%,var(--line))!important;color:var(--accent2)!important;font-weight:700}
.badge.ok{background:var(--tint-green)!important;color:#0b7a3a!important}
.badge.warn{background:var(--tint-orange)!important;color:#9a5b00!important}
.badge.bad{background:var(--tint-red)!important;color:#c62828!important}
.badge.info{background:var(--tint-cyan)!important;color:var(--accent2)!important}
.badge.purple{background:var(--tint-purple)!important;color:#7a2db5!important}
.table-wrap,.permission-table-wrap{border-radius:12px!important;border:1px solid var(--hairline)!important;box-shadow:var(--elev)!important;overflow:auto}
th{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 6%,#f8fafc),#f8fafc)!important;color:#52627a!important}
html[data-theme="dark"] th{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 14%,var(--card2)),var(--card2))!important}
tr:hover td{background:color-mix(in srgb,var(--accent) 5%,transparent)!important}
.table-link{color:var(--accent2)!important}
.modal-card{border-radius:16px!important;box-shadow:var(--shadow-lg)!important;border:1px solid var(--hairline)}
.tabs{background:color-mix(in srgb,var(--accent) 6%,var(--soft))!important;border-radius:12px!important}
.tabs button.active{background:#fff!important;color:var(--accent2)!important;box-shadow:0 1px 3px rgba(0,0,0,.08),0 0 0 1px color-mix(in srgb,var(--accent) 25%,transparent)!important}
.section-title{color:var(--nav);letter-spacing:-.02em;font-family:var(--font-display)}
.auth-card{border-radius:18px!important;box-shadow:0 24px 60px rgba(8,28,52,.28)!important}
@media(min-width:901px){
  .app{grid-template-columns:var(--sidebar-w,240px) 1fr}
  .topbar-host{
    position:relative!important;top:auto!important;left:auto!important;right:auto!important;
    width:100%;overflow:visible!important;flex:0 0 auto;z-index:120!important
  }
  .app-stage{padding-top:0!important}
  body:not(.sidebar-compact) #menuBtn{display:none}
  .topbar{
    flex-wrap:nowrap!important;overflow:visible!important;
    align-items:center!important;min-height:52px!important
  }
  .top-actions{
    flex:1 1 auto;min-width:0;flex-wrap:nowrap!important;overflow:visible;
    justify-content:flex-end
  }
  #userMenuWrap,.user-avatar-btn{position:relative;z-index:121;pointer-events:auto!important;flex:0 0 auto}
  .top-actions #branchFilter{
    min-width:300px!important;width:min(380px,28vw)!important;max-width:420px!important;flex:0 1 360px
  }
  .top-actions .global-search-wrap{
    flex:0 1 200px;min-width:140px;max-width:220px;width:auto
  }
  .top-actions .security-pill{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  /* Stat row + chart: tránh bóp chữ / cắt layout PC */
  .stats.executive.six{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
  .stats.executive .stat{min-width:0;padding:12px 14px}
  .stats.executive .stat .value{font-size:clamp(16px,1.35vw,22px);overflow-wrap:anywhere}
  .stats.executive .stat .hint{font-size:10px;line-height:1.35;margin-top:4px}
  .dashboard-grid-main{grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr);align-items:stretch}
  .attention-panel{display:flex;flex-direction:column;min-height:0}
  .attention-list{flex:1 1 auto;min-height:0}
}
@media(max-width:900px){
  .app{grid-template-columns:1fr!important}
  /* Topbar 2 hàng: title | actions — không cắt chuông/theme/refresh */
  .topbar{
    min-height:0!important;padding:8px 10px!important;
    flex-wrap:wrap!important;align-items:center!important;
    overflow:visible!important;row-gap:8px!important
  }
  .topbar-host{
    position:fixed!important;top:0!important;left:0!important;right:0!important;
    overflow:visible!important;transform:none!important;-webkit-transform:none!important;
    background:var(--card)!important;background-color:var(--card)!important;
    -webkit-backface-visibility:hidden;backface-visibility:hidden;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;filter:none!important
  }
  .topbar h2{font-size:18px!important;max-width:none!important;white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis}
  .title-wrap{flex:1 1 auto!important;min-width:0!important;max-width:calc(100% - 52px)!important}
  .top-actions{
    flex:1 1 100%!important;width:100%!important;min-width:0!important;
    display:flex!important;flex-wrap:nowrap!important;align-items:center!important;
    justify-content:flex-end!important;gap:4px!important;overflow:visible!important
  }
  .top-actions .global-search-wrap{
    flex:1 1 auto!important;min-width:0!important;max-width:none!important;width:auto!important;order:0!important
  }
  .top-actions #refreshBtn,
  .top-actions #themeBtn,
  .top-actions #notifyBtn{
    display:inline-grid!important;place-items:center!important;
    flex:0 0 auto!important;visibility:visible!important;opacity:1!important;
    width:40px!important;height:40px!important;min-width:40px!important;order:10!important
  }
  .top-actions .country-indicator{
    display:inline-flex!important;flex:0 0 auto!important;order:20!important;margin-left:0!important
  }
  .content{padding:12px max(12px,env(safe-area-inset-left,0px)) max(18px,calc(env(safe-area-inset-bottom,0px) + 10px)) max(12px,env(safe-area-inset-right,0px))!important}
  .stat .value{font-size:22px}
  .top-actions .global-search-wrap input,
  .global-search-wrap input{height:38px!important;min-height:38px!important;line-height:36px!important}
  html,body,.app,.app-stage,.shell,.shell>main{
    overflow-x:hidden!important;max-width:100%!important
  }
  #content.content{
    scrollbar-gutter:auto!important;
    overscroll-behavior:none!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch
  }
  .command-hero,.stats,.quick-actions,.dashboard-grid-main,.attention-panel{
    max-width:100%;min-width:0
  }
}
@media(min-width:768px) and (max-width:1180px){
  :root{--sidebar-w:248px}
  .content{padding:16px 18px 28px}
  .stat .value{font-size:22px}
}
@media(min-width:1440px){.content{padding:24px 28px 40px}.stats{gap:14px!important}}
@media(max-width:560px){.stats,.stats.six{grid-template-columns:1fr 1fr!important;gap:8px!important}}
@media(pointer:coarse){
  .top-actions .global-search-wrap input,.global-search-wrap input{min-height:44px!important;height:44px!important}
  nav button{min-height:44px}
}

/* PWA install UI */
.pwa-install-fab{position:fixed;right:16px;bottom:max(16px,env(safe-area-inset-bottom));z-index:9998;display:inline-flex;align-items:center;gap:8px;border:0;border-radius:999px;padding:10px 16px 10px 12px;background:linear-gradient(135deg,#123a6b,#12a9df);color:#fff;font-weight:700;font-size:13px;box-shadow:0 12px 32px rgba(18,58,107,.35);cursor:pointer;animation:pwaFabIn .4s ease}
.pwa-install-fab img{border-radius:8px}
@keyframes pwaFabIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.pwa-install-modal{position:fixed;inset:0;background:#0b1f38a8;z-index:9999;display:grid;place-items:center;padding:16px;opacity:0;pointer-events:none;transition:.2s}
.pwa-install-modal.open{opacity:1;pointer-events:auto}
.pwa-install-card{position:relative;width:min(440px,100%);background:#fff;border-radius:20px;padding:22px;box-shadow:0 30px 80px #0004}
.pwa-install-head{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.pwa-install-head img{border-radius:16px;box-shadow:0 8px 20px rgba(18,58,107,.15)}
.pwa-install-head h3{margin:0 0 4px;font-size:18px}
.pwa-steps{margin:0;padding-left:20px;line-height:1.55;font-size:13px;color:var(--text)}
.pwa-steps li{margin:8px 0}
.pwa-ios-options{display:flex;flex-direction:column;gap:14px}
.pwa-ios-option{padding:12px 14px;border:1px solid #e3ebf3;border-radius:14px;background:#f7fafc}
.pwa-ios-option>b{display:block;margin-bottom:6px;font-size:13px;color:#123a6b}
.pwa-install-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:16px;flex-wrap:wrap}
.pwa-install-link{margin-top:6px;color:#0c75a2;font-weight:600}
@media(max-width:560px){.pwa-install-fab{left:16px;right:16px;justify-content:center}}
.app-update-banner{position:fixed;left:50%;bottom:max(16px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:10050;display:flex;align-items:center;gap:12px;padding:10px 12px 10px 16px;border-radius:12px;background:#123a6b;color:#fff;font-size:13px;font-weight:600;box-shadow:0 12px 32px rgba(18,58,107,.35);max-width:calc(100vw - 32px)}
.app-update-banner .btn{flex:none}
.auth-pwa-hint{margin:0 0 14px}
.auth-pwa-btn{width:100%;background:#eaf6fd;color:#0b5f86;border-color:#b8e5f5;font-weight:700}
@media(min-width:901px){.auth-pwa-hint{display:none!important}}
@media(max-width:760px){
 .issue-line-head{display:none!important}
 .line-item.issue-line{
  grid-template-columns:minmax(0,1fr) 40px;
  grid-template-areas:
   "vin del"
   "name name"
   "wh wh"
   "cost cost";
  gap:8px;
  margin:0;
  padding:12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#f8fafc;
 }
 .line-item.issue-line .issue-field-vin{grid-area:vin}
 .line-item.issue-line .issue-field-name{grid-area:name}
 .line-item.issue-line .issue-field-wh{grid-area:wh}
 .line-item.issue-line .issue-field-cost{grid-area:cost}
 .line-item.issue-line .issue-line-del{grid-area:del;align-self:end;height:40px}
 .line-item.issue-line .issue-field-lab{display:block}
 .issue-lines{max-height:none;overflow:visible;padding-right:0}
 .issue-line-actions .btn{flex:1 1 140px}
 .issue-form-footer{justify-content:flex-end}
 .issue-form-footer .btn{flex:0 0 auto}
}

/* ========================= ATT DealerOS ENTERPRISE V5 ========================= */
:root{
 --nav:#0b2440;--nav2:#071a2d;--nav3:#173e66;--accent:#12a9df;--accent2:#087fac;
 --bg:#f5f5f7;--card:#ffffff;--card2:#fafafa;--text:#1d1d1f;--muted:#6e6e73;--line:#d2d2d7;
 --danger:#d23b3b;--ok:#14915b;--warn:#c77a12;--purple:#6c63d9;--shadow:0 12px 34px rgba(18,42,71,.08);
 --shadow-lg:0 28px 70px rgba(13,37,65,.15);--radius:16px;--radius-lg:22px;
}
html[data-accent="cyan"],html:not([data-accent]){--accent:#18a4d8;--accent2:#0f7fb2}
html[data-accent="blue"]{--accent:#0071e3;--accent2:#0058b0}
html[data-accent="teal"]{--accent:#0a7a6e;--accent2:#086258}
html[data-accent="graphite"]{--accent:#636366;--accent2:#48484a}
html[data-theme="dark"]{--bg:#07111d;--card:#0d1b2a;--card2:#102235;--text:#edf5ff;--muted:#91a4b8;--line:#21384e;--nav:#071725;--nav2:#040d16;--shadow:0 15px 38px rgba(0,0,0,.28);--shadow-lg:0 28px 80px rgba(0,0,0,.42)}
html[data-density="compact"] th,html[data-density="compact"] td{padding:7px 9px;font-size:12px}html[data-density="compact"] .panel{padding:13px}html[data-density="compact"] .stat{padding:13px}
/* V6.5.471/517: solid body bg — không radial dưới status bar (frost iOS) */
html:not(.auth-mode),html:not(.auth-mode) body{background:var(--bg)!important;background-color:var(--bg)!important;background-image:none!important}
/* V6.5.441/517: no blur/filter on topbar; opaque status-bar only — never black-translucent */
.topbar{background:var(--card);box-shadow:0 1px 0 var(--line);filter:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;transform:none!important;isolation:isolate}
aside#sidebar{border-right:1px solid #ffffff0e;filter:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
/* Solid paint under notch — gradient used to frost with iOS status bar */
aside#sidebar:before{
  content:"";position:absolute;left:0;right:0;top:0;z-index:2;pointer-events:none;
  height:env(safe-area-inset-top,0px);background:var(--nav2,#071a2d)
}
.sidebar-head{padding-top:15px}.brand-mark{letter-spacing:1px}.brand-mark span{font-weight:700}.sidebar-foot{background:#ffffff08;border-radius:14px;padding:12px;margin-top:auto;border-top:0}.profile-security{display:inline-block;margin-top:4px;font-size:10px;color:#74d8ff}
nav button{font-weight:520;letter-spacing:.01em}
.content{padding:22px 24px 40px}.panel{border:1px solid var(--line);background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow)}.panel.premium{overflow:hidden}.panel.soft{background:var(--card2)}
.panel-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px}.panel-head h3{margin:0 0 3px}.panel-head p{margin:0;color:var(--muted);font-size:12px}.panel-head>div:first-child{min-width:0}.panel-head .spacer{flex:1}
.btn{border-radius:11px;border-color:var(--line);background:var(--card);color:var(--text);transition:.16s;box-shadow:0 1px 0 #fff1}.btn:hover{transform:translateY(-1px);box-shadow:0 7px 20px rgba(15,44,74,.10)}.btn.primary{background:linear-gradient(135deg,#10a9df,#087ead);border:0;color:#fff;box-shadow:0 8px 20px rgba(18,169,223,.24)}.btn.success{background:#eaf8f1;color:#087a49;border-color:#bdebd3}.btn.danger{background:#fff0f0;color:#b92828;border-color:#ffd1d1}.btn.compact{padding:8px 11px;font-size:12px}
input,select,textarea{background:var(--card);color:var(--text);border-color:var(--line);border-radius:11px;outline:none;transition:.15s}input:focus,select:focus,textarea:focus{border-color:#4abfe9;box-shadow:0 0 0 3px rgba(18,169,223,.12)}
.security-pill{display:inline-flex;align-items:center;gap:5px;border:1px solid #b8e9d3;background:#edf9f3;color:#0c7a49;border-radius:999px;padding:7px 10px;font-size:10px;font-weight:800;letter-spacing:.4px}html[data-theme="dark"] .security-pill{background:#0d3427;border-color:#1c5e46;color:#8de1bd}
.session-warning{position:fixed;right:max(18px,env(safe-area-inset-right,0px));bottom:max(18px,env(safe-area-inset-bottom,0px));z-index:9999;background:#111e2e;color:white;border:1px solid #ffffff18;border-radius:15px;padding:13px 14px;display:flex;gap:18px;align-items:center;box-shadow:var(--shadow-lg)}.session-warning div{display:flex;flex-direction:column}.session-warning span{font-size:11px;color:#afc2d4;margin-top:2px}
.command-hero{position:relative;display:flex;justify-content:space-between;align-items:center;gap:24px;background:linear-gradient(125deg,#0c2947 0,#174f7d 58%,#12a8df 135%);color:white;padding:24px 26px;border-radius:24px;box-shadow:0 22px 48px rgba(13,49,82,.22);overflow:hidden;margin-bottom:16px}.command-hero:after{content:"";position:absolute;width:340px;height:340px;border-radius:50%;right:-120px;top:-170px;border:1px solid #ffffff22;box-shadow:0 0 0 45px #ffffff08,0 0 0 90px #ffffff05}.hero-kicker{font-size:10px;letter-spacing:2px;color:#82ddff;font-weight:800}.command-hero h1{font-size:27px;margin:7px 0 5px}.command-hero h1 span{font-weight:400;color:#d4ecfa;font-size:16px}.command-hero p{margin:0;color:#cce2f2;font-size:13px}.health-ring{--score:80;width:90px;height:90px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#55dfb0 calc(var(--score)*1%),#ffffff25 0);position:relative;z-index:2}.health-ring:before{content:"";position:absolute;inset:7px;border-radius:50%;background:#123754}.health-ring>div{z-index:1;text-align:center}.health-ring b{display:block;font-size:25px}.health-ring span{font-size:10px;color:#b9d5e8}
.stats.executive{margin-bottom:16px}.stats.executive .stat{position:relative;overflow:hidden;border:0;box-shadow:var(--shadow)}.stats.executive .stat:after{content:"";position:absolute;right:-22px;top:-26px;width:75px;height:75px;border-radius:50%;background:linear-gradient(135deg,transparent,rgba(18,169,223,.10))}.stats.executive .stat .value{font-size:24px;letter-spacing:-.6px}
.quick-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:16px}.quick-action{display:grid;grid-template-columns:38px 1fr;grid-template-rows:auto auto;column-gap:10px;text-align:left;border:1px solid var(--line);background:var(--card);padding:13px;border-radius:15px;color:var(--text);cursor:pointer;box-shadow:0 6px 18px rgba(13,45,77,.05)}.quick-action>span{grid-row:1/3;width:38px;height:38px;display:grid;place-items:center;border-radius:11px;background:#e9f7fd;color:#087da9;font-size:18px}.quick-action b{font-size:13px}.quick-action small{color:var(--muted)}.quick-action.primary{background:linear-gradient(135deg,#0f8ebf,#12aadf);color:white;border:0}.quick-action.primary>span{background:#ffffff24;color:white}.quick-action.primary small{color:#dff5ff}
.dashboard-grid-main{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr);gap:14px;margin-bottom:14px}.chart-wrap.tall{height:330px}.attention-panel{max-height:430px}.attention-list{display:flex;flex-direction:column;gap:5px;max-height:330px;overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(120,135,155,.35) transparent}
.attention-list::-webkit-scrollbar{width:6px}
.attention-list::-webkit-scrollbar-thumb{background:rgba(120,135,155,.35);border-radius:999px}
.attention-list::-webkit-scrollbar-track{background:transparent}.attention-item{border:0;background:transparent;color:var(--text);display:grid;grid-template-columns:12px 1fr auto;align-items:center;text-align:left;padding:9px 7px;border-radius:11px;cursor:pointer}.attention-item:hover{background:var(--card2)}.attention-item div{display:flex;flex-direction:column}.attention-item small{font-size:9px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted)}.attention-item b{font-size:12px}.attention-item span:not(.attention-dot){font-size:10px;color:var(--muted)}.attention-item strong{font-size:11px}.attention-dot{width:8px;height:8px;border-radius:50%;background:#8da0b5}.attention-dot.danger{background:#df4b4b;box-shadow:0 0 0 4px #df4b4b16}.attention-dot.warning{background:#d99023}.attention-dot.info{background:#22a9dc}
.risk-badge{display:inline-flex;border-radius:999px;padding:5px 8px;font-size:9px;font-weight:800;letter-spacing:.4px;text-transform:uppercase}.risk-badge.ok{background:#e8f8f0;color:#08784a}.risk-badge.danger{background:#fff0f0;color:#bd2f2f}.risk-badge.warning{background:#fff6e6;color:#a96000}.risk-badge.info{background:#eaf7fd;color:#087ca9}.risk-badge.neutral{background:var(--card2);color:var(--muted);border:1px solid var(--line)}
.rank-row{display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:9px;padding:9px 2px;border-bottom:1px solid var(--line)}.rank-row>span{width:24px;height:24px;border-radius:8px;background:var(--card2);display:grid;place-items:center;font-size:10px;font-weight:800}.rank-row div{display:flex;flex-direction:column}.rank-row b{font-size:12px}.rank-row small{color:var(--muted);font-size:10px}.rank-row strong{font-size:11px}
.empty-state.good{text-align:center;padding:35px 12px;color:var(--muted)}.empty-state.good b{display:block;color:var(--ok);margin-bottom:4px}
.drawer{width:min(860px,94vw);max-width:100vw;background:var(--bg);box-sizing:border-box;overflow:hidden}.drawer-head{background:var(--card);border-bottom-color:var(--line)}.drawer-body{overflow-x:hidden;overflow-y:auto;max-width:100%;min-height:0;box-sizing:border-box;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}.drawer-command{display:flex;gap:8px;align-items:center;padding:12px 0 4px;flex-wrap:wrap}.workflow-panel{margin:14px 0 12px;border:1px solid var(--line);border-radius:14px;background:var(--card);overflow:hidden}.workflow-panel .workflow-bar{margin:0;padding:12px 10px 10px;background:transparent;border:0;border-radius:0}.workflow-bar{display:flex;align-items:flex-start;gap:0;margin:14px 0 10px;padding:12px 10px;background:var(--card);border:1px solid var(--line);border-radius:14px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;touch-action:pan-x pan-y}.workflow-step{position:relative;min-width:105px;flex:1;text-align:center;color:var(--muted);font-size:10px}.workflow-step:before{content:"";height:2px;background:var(--line);position:absolute;left:-50%;right:50%;top:12px}.workflow-step:first-child:before{display:none}.workflow-step span{position:relative;z-index:1;width:26px;height:26px;margin:0 auto 6px;border-radius:50%;display:grid;place-items:center;background:var(--card2);border:2px solid var(--line);font-weight:800}.workflow-step b{display:block;font-weight:600}.workflow-step.done{color:var(--ok)}.workflow-step.done span{background:#e7f8ef;border-color:#56c693}.workflow-step.done:before{background:#56c693}.workflow-step.current{color:#0a84b6}.workflow-step.current span{background:#e4f6fd;border-color:#19a8dd;box-shadow:0 0 0 4px #18a8dd18}.workflow-actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin:8px 0 13px;padding:8px 0;border-bottom:1px solid var(--line)}.workflow-panel .workflow-actions{margin:0;padding:10px 12px;border-top:1px dashed var(--line);border-bottom:0;background:color-mix(in srgb,var(--card2) 70%,var(--card))}.workflow-actions-label{font-size:10px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);margin-right:4px}
.entity-line{display:flex;flex-direction:column;gap:3px;margin:4px 0 12px;padding:10px 14px;background:var(--card);border:1px solid var(--line);border-radius:12px}.entity-line>span{font-size:11px;color:var(--muted);font-weight:600}.entity-line>b{font-size:13px;font-weight:700;line-height:1.4;overflow-wrap:anywhere;word-break:break-word}
/* Drawer tables: full width (tránh lộ nền xám), cuộn ngang khi cột dài */
.drawer-body .table-wrap{width:100%;overflow-x:auto;overflow-y:visible;max-height:none;max-width:100%;scrollbar-gutter:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;touch-action:pan-x pan-y;background:#fff!important}
.drawer-body .table-wrap table{width:100%;min-width:100%;max-width:none}
.drawer-body .table-wrap.drawer-scroll-table table{width:max-content;min-width:100%}
.drawer-body .table-wrap th,
.drawer-body .table-wrap td{white-space:nowrap;vertical-align:middle}
.drawer-body .table-wrap td b{white-space:nowrap;word-break:normal;overflow-wrap:normal}
/* PO chi tiết: 1 ô vừa khung, chỉ cuộn dọc, thanh mỏng */
.drawer-body .table-wrap.po-detail-lines{overflow-x:hidden;overflow-y:auto;max-height:min(46vh,420px);scrollbar-width:thin;scrollbar-color:#c5ced8 transparent;scrollbar-gutter:auto;touch-action:pan-y;overscroll-behavior:contain}
.drawer-body .table-wrap.po-detail-lines::-webkit-scrollbar{width:5px;height:0}
.drawer-body .table-wrap.po-detail-lines::-webkit-scrollbar-track{background:transparent}
.drawer-body .table-wrap.po-detail-lines::-webkit-scrollbar-thumb{background:#c5ced8;border-radius:999px}
.drawer-body .table-wrap.po-detail-lines table{width:100%;min-width:0;max-width:100%;table-layout:fixed}
.drawer-body .table-wrap.po-detail-lines th,
.drawer-body .table-wrap.po-detail-lines td{white-space:normal;word-break:break-word;overflow-wrap:anywhere;font-size:12px;padding:8px 7px;vertical-align:top}
.drawer-body .table-wrap.po-detail-lines th{white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis;vertical-align:middle;font-size:10.5px;letter-spacing:.2px;padding:9px 6px}
.drawer-body .table-wrap.po-detail-lines td b{white-space:normal;word-break:break-word;overflow-wrap:anywhere;font-size:12px;line-height:1.35}
.drawer-body .table-wrap.po-detail-lines th:nth-child(1),.drawer-body .table-wrap.po-detail-lines td:nth-child(1){width:32%}
.drawer-body .table-wrap.po-detail-lines th:nth-child(2),.drawer-body .table-wrap.po-detail-lines td:nth-child(2){width:11%;text-align:right}
.drawer-body .table-wrap.po-detail-lines th:nth-child(3),.drawer-body .table-wrap.po-detail-lines td:nth-child(3),
.drawer-body .table-wrap.po-detail-lines th:nth-child(4),.drawer-body .table-wrap.po-detail-lines td:nth-child(4){width:9%;text-align:right}
.drawer-body .table-wrap.po-detail-lines th:nth-child(5),.drawer-body .table-wrap.po-detail-lines td:nth-child(5),
.drawer-body .table-wrap.po-detail-lines th:nth-child(6),.drawer-body .table-wrap.po-detail-lines td:nth-child(6){width:12%;text-align:right}
.drawer-body .table-wrap.po-detail-lines th:nth-child(7),.drawer-body .table-wrap.po-detail-lines td:nth-child(7){width:14%}
.drawer-body .table-wrap.po-detail-lines td:nth-child(2),
.drawer-body .table-wrap.po-detail-lines td:nth-child(3),
.drawer-body .table-wrap.po-detail-lines td:nth-child(4),
.drawer-body .table-wrap.po-detail-lines td:nth-child(5),
.drawer-body .table-wrap.po-detail-lines td:nth-child(6){white-space:nowrap}
@media(max-width:700px){
 .drawer-body .table-wrap.po-detail-lines{overflow-x:auto;overflow-y:auto;touch-action:pan-x pan-y;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
 .drawer-body .table-wrap.po-detail-lines::-webkit-scrollbar{height:5px}
 .drawer-body .table-wrap.po-detail-lines table{min-width:760px;width:max-content;table-layout:auto}
 .drawer-body .table-wrap.po-detail-lines th,
 .drawer-body .table-wrap.po-detail-lines td{white-space:nowrap;word-break:normal;overflow-wrap:normal;font-size:11.5px;padding:8px 10px;vertical-align:middle}
 .drawer-body .table-wrap.po-detail-lines th:nth-child(1),
 .drawer-body .table-wrap.po-detail-lines td:nth-child(1){min-width:200px;max-width:none;width:auto;white-space:nowrap}
 .drawer-body .table-wrap.po-detail-lines td:nth-child(1) b{white-space:nowrap;word-break:normal;overflow-wrap:normal;font-size:11.5px;font-weight:600}
 .drawer-body .table-wrap.po-detail-lines th:nth-child(7),
 .drawer-body .table-wrap.po-detail-lines td:nth-child(7){white-space:nowrap}
}
.drawer-body:has(.receipt-drawer-detail){display:flex;flex-direction:column;overflow:hidden;padding-bottom:12px;min-height:0}
.receipt-drawer-detail{display:flex;flex-direction:column;min-height:0;flex:1 1 auto;gap:0;overflow:hidden}
.receipt-drawer-meta{flex:0 0 auto;margin-bottom:0}
.receipt-drawer-detail .section-title{flex:0 0 auto;margin:12px 0 8px}
.drawer-body .table-wrap.receipt-detail-lines{
  flex:1 1 auto;min-height:0;max-height:none;width:100%;
  overflow-x:auto!important;overflow-y:auto!important;
  border:1px solid var(--line);border-radius:12px;background:#fff!important;
  scrollbar-width:thin;scrollbar-color:#b8c4ce transparent;
  overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
}
.drawer-body .table-wrap.receipt-detail-lines::-webkit-scrollbar{width:6px;height:6px}
.drawer-body .table-wrap.receipt-detail-lines::-webkit-scrollbar-track{background:transparent}
.drawer-body .table-wrap.receipt-detail-lines::-webkit-scrollbar-thumb{background:#b8c4ce;border-radius:999px}
.drawer-body .table-wrap.receipt-detail-lines::-webkit-scrollbar-corner{background:#fff}
.drawer-body .table-wrap.receipt-detail-lines table{min-width:1080px;width:max-content;border-collapse:collapse;border-spacing:0;background:#fff}
.drawer-body .table-wrap.receipt-detail-lines thead{position:sticky;top:0;z-index:4;background:#f5f8fb}
.drawer-body .table-wrap.receipt-detail-lines thead th{
  position:sticky;top:0;z-index:5;background:#f5f8fb!important;
  box-shadow:inset 0 -1px 0 var(--line);
  white-space:nowrap;vertical-align:middle;padding:9px 8px!important;
  font-size:10px!important;text-transform:uppercase;letter-spacing:.3px;border-bottom:1px solid var(--line)
}
.drawer-body .table-wrap.receipt-detail-lines tbody tr:nth-child(even) td{background:#fbfdff}
.drawer-body .table-wrap.receipt-detail-lines tbody tr:hover td{background:#f3f9ff}
.drawer-body .table-wrap.receipt-detail-lines td{white-space:nowrap;vertical-align:middle;padding:8px!important;background:#fff}
.drawer-body .table-wrap.receipt-detail-lines td:first-child,
.drawer-body .table-wrap.receipt-detail-lines td:first-child b{white-space:nowrap;word-break:normal;overflow-wrap:normal;line-height:1.35}
.drawer-body .tabs{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;touch-action:pan-x pan-y;-webkit-overflow-scrolling:touch}
.vin-reserve-list{display:flex;flex-direction:column;gap:8px}
.vin-reserve-card{display:flex;flex-direction:column;gap:10px;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--card)}
.vin-reserve-card-top{display:flex;gap:10px;align-items:flex-start;justify-content:space-between}
.vin-reserve-card-main{min-width:0;flex:1}
.vin-reserve-card-status{flex:0 0 auto;padding-top:2px}
.vin-reserve-card-main .vin-reserve-link{font-size:13px;font-weight:800;word-break:break-all}
.vin-reserve-meta .vin-reserve-link{font-size:13px;font-weight:800;padding:0;vertical-align:baseline}
.vin-reserve-meta{margin-top:4px;font-size:12px;color:var(--muted);line-height:1.45;overflow-wrap:anywhere}
.vin-reserve-card-actions{flex:0 0 auto}
.vin-reserve-card-actions .btn{width:100%}
.vin-reserve-card-btns{display:flex;flex-direction:column;gap:8px}
.vin-reserve-card-btns .btn{width:100%}
.contract-dd{position:relative;display:inline-flex;width:auto;flex:0 0 auto}
.contract-dd > .btn{width:auto}
.contract-dd-menu{position:absolute;right:0;top:calc(100% + 4px);z-index:40;min-width:220px;width:max-content;max-width:min(320px,90vw);background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 28px rgba(15,44,74,.14);padding:6px;display:flex;flex-direction:column;gap:2px}
.contract-dd-menu.hidden{display:none}
.contract-dd-label{padding:8px 12px 4px;font-size:11px;font-weight:700;color:var(--muted);letter-spacing:.02em;overflow-wrap:anywhere}
.contract-dd-menu button{display:block;width:100%;text-align:left;border:0;background:transparent;color:var(--text);padding:10px 12px;border-radius:9px;cursor:pointer;font-size:13px}
.contract-dd-menu button:hover{background:color-mix(in srgb,var(--accent) 8%,var(--card))}
.contract-gen-modal .contract-gen-head{position:sticky;top:0;z-index:6;background:var(--surface,#fff);padding:0 36px 10px 0;margin:0 0 4px;border-bottom:1px solid var(--line);box-shadow:0 8px 14px -12px rgba(15,23,42,.22)}
.contract-gen-modal .contract-gen-head h2{margin:0 0 4px;font-size:20px;font-weight:700;letter-spacing:-.02em;line-height:1.25}
.contract-gen-modal .contract-gen-head .eyebrow{margin:0}
.contract-gen-modal .data{width:100%;border-collapse:collapse;font-size:12px}
.contract-gen-modal .data th,.contract-gen-modal .data td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
.contract-gen-modal .data code{font-size:11px}
.contract-gen-modal .contract-scan-field{display:flex;flex-direction:column;gap:6px}
.contract-gen-modal .contract-scan-row{display:flex;gap:6px;align-items:stretch}
.contract-gen-modal .contract-scan-row input{flex:1;min-width:0}
.contract-gen-modal .contract-scan-row .contract_qr_btn{min-width:36px;padding:0 8px;height:auto;flex:0 0 auto}
.contract-gen-modal .contract-field-label{display:inline;line-height:1.3;white-space:nowrap}
.contract-gen-modal .required-mark,.contract-gen-modal .req{color:#dc2626;font-weight:900;margin-left:2px}
html[data-theme="dark"] .contract-gen-modal .required-mark,html[data-theme="dark"] .contract-gen-modal .req{color:var(--danger-lite)!important}
.contract-gen-modal .contract-cccd-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:8px 0 4px}
.contract-gen-modal .contract-cccd-slot{border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--card,#fff);min-height:120px}
.contract-gen-modal .contract-cccd-slot img{display:block;width:100%;max-height:220px;object-fit:contain;border-radius:8px;background:#0b1220}
.contract-gen-modal .contract-cccd-label{font-size:12px;font-weight:700;margin-bottom:8px;color:var(--text)}
.contract-gen-modal .contract-cccd-slot.is-empty .empty{font-size:12px;color:var(--muted);padding:18px 8px;text-align:center}
@media(max-width:720px){.contract-gen-modal .contract-cccd-grid{grid-template-columns:1fr}}
.receipt-bulk-preview .table-wrap th,
.receipt-bulk-preview .table-wrap td{white-space:nowrap!important}
.dms-grid td.cell-clamp{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.readiness-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}.readiness{display:flex;gap:9px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:13px;padding:10px}.readiness>span{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:var(--card2);font-weight:900}.readiness div{display:flex;flex-direction:column}.readiness b{font-size:11px}.readiness small{color:var(--muted);font-size:9px}.readiness.ok>span{background:#e7f8ef;color:#087a48}.readiness.warn>span{background:#fff5e4;color:#a65f00}.readiness.bad>span{background:#ffeded;color:#bd3030}.readiness.neutral>span{color:#7f8d9c}
.compact-stats.stats{grid-template-columns:repeat(4,1fr)}.compact-stats.compact-stats-3{grid-template-columns:repeat(3,1fr)}.compact-stats .stat .value{font-size:18px;overflow-wrap:anywhere;word-break:break-word}.audit-timeline{padding:10px 2px}.audit-row{display:grid;grid-template-columns:20px 1fr;gap:9px;min-height:65px}.audit-line{position:relative}.audit-line:before{content:"";position:absolute;left:8px;top:14px;bottom:-10px;width:1px;background:var(--line)}.audit-row:last-child .audit-line:before{display:none}.audit-line span{position:absolute;left:4px;top:8px;width:9px;height:9px;border-radius:50%;background:#16a7da;box-shadow:0 0 0 4px #16a7da18}.audit-row small{display:block;color:var(--muted);font-size:9px}.audit-row b{font-size:12px}.audit-row p{margin:3px 0 0;color:var(--muted);font-size:10px;word-break:break-word}
.perm-yes{color:#1a7f4b;font-weight:800}.perm-no{color:#c5ced8}.permission-table td{text-align:center;font-size:12px}.permission-table td:first-child{text-align:left}.permission-editor{min-width:760px}.permission-table-wrap{max-height:430px;border-radius:13px}.permission-table{min-width:950px;border-collapse:separate;border-spacing:0}.permission-table td:first-child small{display:block;color:var(--muted);font-size:8px}.permission-table td:first-child b{display:block;font-size:11px}.perm-select{min-height:31px;padding:5px 7px;font-size:9px;min-width:105px}.security-note{margin:12px 0;padding:10px 12px;border-radius:11px;background:#eaf7fd;color:#18617e;font-size:11px}.sticky-actions{position:sticky;bottom:0;background:var(--card);padding:14px 0 8px;margin-top:4px;z-index:5;box-shadow:0 -10px 18px -12px rgba(15,23,42,.18)}
.access-denied{min-height:55vh;display:grid;place-items:center;align-content:center;text-align:center;color:var(--muted)}.access-icon{font-size:44px;color:#13a7dc;margin-bottom:8px}.access-denied h2{color:var(--text);margin:0 0 4px}.access-denied p{margin:0}
.quick-menu-title{font-size:9px;letter-spacing:1.2px;color:var(--muted);padding:5px 10px 7px;border-bottom:1px solid var(--line);margin-bottom:4px}
.timeline.compact .timeline-item{padding:7px 0}.timeline-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#16a6d9;margin-right:7px}
@media(max-width:1100px){.dashboard-grid-main{grid-template-columns:1fr}.quick-actions{grid-template-columns:1fr 1fr}.readiness-grid{grid-template-columns:1fr 1fr}.permission-editor{min-width:0}}
@media(max-width:700px){
 .command-hero{padding:18px}.command-hero h1{font-size:20px}.health-ring{width:70px;height:70px}.quick-actions{grid-template-columns:1fr 1fr}.readiness-grid{grid-template-columns:1fr}.security-pill{display:none}.content{padding:12px}
 .drawer{width:100%!important;max-width:100vw!important;left:0;right:0;inset:0;height:100vh!important;height:100dvh!important}
 .drawer-head{padding:12px 14px;padding-top:max(12px,env(safe-area-inset-top))}
 .drawer-body{padding:12px 14px!important;padding-bottom:max(16px,env(safe-area-inset-bottom))!important;overflow-x:hidden!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
 .drawer-command{gap:6px}
 .drawer-command .btn{font-size:12px;padding:8px 10px}
 .workflow-step{min-width:78px;flex:0 0 auto}
 .tabs{gap:3px;margin-left:0;margin-right:0;padding:4px;width:100%}
 .compact-stats.stats,.compact-stats.compact-stats-3{grid-template-columns:1fr!important}
 .compact-stats .stat .value{font-size:16px}
 .vin-reserve-card{flex-direction:column;align-items:stretch}
 .vin-reserve-card-actions .btn{width:100%}
 .stats.executive.six{grid-template-columns:1fr 1fr}
}
.security-feature{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--line)}.security-feature:last-child{border:0}.security-feature>span{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#e9f7fd;color:#087ca9;font-weight:900}.security-feature b{font-size:12px}.security-feature p{margin:3px 0 0;color:var(--muted);font-size:10px;line-height:1.5}.company-card{padding:12px;background:var(--card2);border:1px solid var(--line);border-radius:12px;margin:8px 0}


/* ========================= V5 SMART / ENTERPRISE LAYER ========================= */
.smart-create-btn{position:relative;overflow:hidden;min-width:52px;background:linear-gradient(135deg,var(--nav3),var(--accent))!important;box-shadow:0 7px 18px rgba(24,164,216,.25)}
.smart-create-btn:after{content:"";position:absolute;inset:-60% auto -60% -20%;width:35%;transform:rotate(20deg);background:linear-gradient(90deg,transparent,#fff7,transparent);animation:smartSheen 5s ease-in-out infinite}
@keyframes smartSheen{0%,72%{left:-45%}88%,100%{left:140%}}
.quick-menu{min-width:270px}.quick-menu button{display:flex;align-items:center;gap:9px}.quick-menu button kbd{margin-left:auto;font-size:9px;border:1px solid var(--line);background:var(--bg);padding:2px 5px;border-radius:5px;color:var(--muted)}
.quick-menu-sep{height:1px;background:var(--line);margin:5px 6px}
.smart-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}.smart-head h2{margin:4px 0}.smart-head p{margin:4px 0 0;line-height:1.5}.smart-shortcut{border:1px solid var(--line);background:var(--bg);border-radius:9px;padding:6px 10px;font:700 11px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--muted);white-space:nowrap}
.smart-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.smart-tile{appearance:none;border:1px solid var(--line);background:linear-gradient(150deg,var(--card),color-mix(in srgb,var(--accent) 4%,var(--card)));border-radius:16px;padding:16px;text-align:left;color:var(--text);cursor:pointer;min-height:126px;display:flex;flex-direction:column;align-items:flex-start;transition:.18s;box-shadow:0 5px 16px rgba(25,50,80,.04)}.smart-tile:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 48%,var(--line));box-shadow:0 13px 28px rgba(25,75,115,.11)}.smart-tile>span{font-size:24px;width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:color-mix(in srgb,var(--accent) 13%,var(--card));color:var(--accent2);margin-bottom:12px}.smart-tile b{font-size:14px}.smart-tile small{color:var(--muted);margin-top:6px;line-height:1.45}
.smart-paste{min-height:120px;width:100%;resize:vertical;font-family:inherit;line-height:1.55}.smart-search-row{display:flex;gap:8px;align-items:center;margin:12px 0}.smart-result{min-height:80px;border:1px dashed var(--line);border-radius:14px;padding:12px;background:var(--bg)}.smart-result-row{width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;text-align:left;padding:11px 8px;cursor:pointer;color:var(--text);display:flex;flex-direction:column;gap:3px}.smart-result-row:last-child{border-bottom:0}.smart-result-row:hover{background:color-mix(in srgb,var(--accent) 6%,var(--card));border-radius:9px}.smart-result-row span{font-size:12px;color:var(--muted)}
.command-list{display:grid;gap:6px;margin-top:12px;max-height:55vh;overflow:auto}.command-list button{display:flex;align-items:center;gap:12px;border:1px solid transparent;border-radius:11px;padding:11px;background:transparent;color:var(--text);cursor:pointer;text-align:left}.command-list button:hover{background:var(--bg);border-color:var(--line)}.command-list span{font-size:19px;width:28px;text-align:center}.command-list div{display:flex;flex-direction:column}.command-list small{color:var(--muted);margin-top:2px}
.risk-preview{border:1px solid var(--line);border-radius:11px;padding:10px 12px;margin:12px 0;font-size:12px;line-height:1.45}.risk-preview.ok{background:color-mix(in srgb,var(--ok) 7%,var(--card));border-color:color-mix(in srgb,var(--ok) 25%,var(--line));color:var(--ok)}.risk-preview.warn{background:color-mix(in srgb,var(--warn) 9%,var(--card));border-color:color-mix(in srgb,var(--warn) 30%,var(--line));color:var(--warn)}
.payment-order-info{border:1px solid var(--line);background:var(--bg);padding:11px 13px;border-radius:12px;margin-bottom:14px;line-height:1.55}.bad-text{color:var(--danger)!important;font-weight:700}
.pay-transfer-wrap{display:grid;gap:12px;margin-top:4px}
.pay-transfer-wrap.hidden,.pay-finance-wrap.hidden{display:none!important}
.pay-qr-panel{display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--soft,var(--card2,#f7f9fc))}
.pay-qr-panel.hidden{display:none!important}
.pay-qr-img{width:220px;height:220px;object-fit:contain;border-radius:12px;background:#fff;border:1px solid var(--line)}
.pay-qr-meta{min-width:200px;flex:1;line-height:1.55;padding-top:4px}
.pay-qr-bank{font-weight:800;font-size:15px;color:var(--text);margin-bottom:2px}
.pay-qr-legal{margin-bottom:8px}
.pay-qr-line{font-size:13px;color:var(--text);margin-top:4px}
.pay-qr-line b{font-weight:700}
#modal .pay-form-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding-top:4px;margin-bottom:12px}
#modal .pay-form-head h2{margin:2px 0 0!important;padding:0!important;font-size:18px!important;line-height:1.2!important;letter-spacing:-.02em}
#modal .pay-form-head p.muted{margin:2px 0 0!important;font-size:12px!important}
#modal .pay-over-warn{flex:0 1 auto;max-width:min(220px,48vw);padding:7px 10px;border-radius:9px;background:#c62828;color:#fff;font-size:11px;font-weight:700;line-height:1.3;text-align:left;box-shadow:0 6px 18px rgba(0,0,0,.18)}
#modal .pay-note-field textarea{min-height:40px!important;height:40px;resize:vertical}
html[data-theme="dark"] .pay-qr-img{background:#fff}
.quality-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.quality-chip{border:1px solid var(--line);background:var(--bg);border-radius:13px;padding:13px;display:flex;align-items:center;gap:12px}.quality-chip b{font-size:24px;min-width:38px;color:var(--accent2)}.quality-chip span{font-size:12px;color:var(--muted)}
.profile-security{opacity:.66;font-size:10px}.smart-launch{background:linear-gradient(135deg,var(--nav3),var(--accent))!important;color:#fff!important;border-color:transparent!important}.smart-launch small{color:#eaf8ff!important}
.reservation-box{border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line));background:color-mix(in srgb,var(--accent) 5%,var(--card));border-radius:13px;padding:12px}
[data-theme="dark"] .smart-tile,[data-theme="dark"] .quality-chip,[data-theme="dark"] .payment-order-info,[data-theme="dark"] .smart-result{box-shadow:none}
@media(max-width:980px){.smart-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.smart-grid,.quality-grid{grid-template-columns:1fr}.smart-head{align-items:flex-start}.smart-search-row{align-items:stretch;flex-direction:column}.smart-shortcut{display:none}.quick-menu{left:10px!important;right:10px!important;min-width:0!important;position:fixed!important;bottom:16px!important;top:auto!important}.smart-tile{min-height:104px}.payment-order-info{font-size:12px}}


/* V5.0.2 — Order customer UX */
.customer-field{position:relative}.customer-combobox{position:relative}.customer-search-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;align-items:center}.customer-search-row input{width:100%}.customer-add-btn{white-space:nowrap;height:40px}.customer-results{position:absolute;left:0;right:0;top:47px;z-index:145;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-lg);padding:6px;max-height:390px;overflow:auto}.customer-result-item{width:100%;display:flex;align-items:center;gap:10px;border:0;background:transparent;color:var(--text);padding:10px;border-radius:10px;text-align:left;cursor:pointer}.customer-result-item:hover,.customer-result-item:focus{background:color-mix(in srgb,var(--accent) 8%,var(--card));outline:none}.customer-avatar{width:34px;height:34px;min-width:34px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,#e5f6fd,#d8ecff);color:#0c76a5;font-weight:900;font-size:12px}.customer-result-main{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}.customer-result-main b{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.customer-result-main small{font-size:10.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.customer-pick-action{font-size:11px;font-weight:800;color:var(--accent2)}.customer-result-state,.customer-empty-result{padding:15px 13px;color:var(--muted);font-size:11px}.customer-empty-result{display:flex;flex-direction:column;gap:3px}.customer-empty-result b{color:var(--text);font-size:12px}.customer-selected{min-height:48px;border:1px solid #bfe7f5;background:linear-gradient(135deg,rgba(18,169,223,.08),rgba(18,169,223,.025));border-radius:12px;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;gap:10px}.customer-selected-info{display:flex;align-items:center;gap:9px;min-width:0}.customer-selected-info>div{display:flex;flex-direction:column;gap:2px;min-width:0}.customer-selected-info b{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.customer-selected-info small{font-size:10.5px;color:var(--muted);white-space:normal;overflow:visible;text-overflow:unset;line-height:1.35}.submodal{position:fixed;inset:0;background:rgba(4,19,35,.62);backdrop-filter:blur(3px);display:grid;place-items:center;padding:18px;z-index:190}.submodal-card{position:relative;width:min(760px,100%);max-height:92vh;overflow:auto;background:var(--card);color:var(--text);border:1px solid var(--line);border-radius:20px;padding:22px;box-shadow:0 35px 110px rgba(0,0,0,.42)}.customer-create-popup .smart-head h2{margin:4px 0 5px}.popup-footer{display:flex;align-items:center;gap:8px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}.danger-text{color:var(--danger)}html[data-theme="dark"] .customer-avatar{background:#12344a;color:#7ddcff}html[data-theme="dark"] .customer-selected{background:#0b2b3c;border-color:#18465e}
@media(max-width:700px){.customer-search-row{grid-template-columns:1fr}.customer-add-btn{width:100%}.customer-results{top:88px}.submodal{padding:8px}.submodal-card{padding:18px 14px}.popup-footer{align-items:stretch;flex-wrap:wrap}.popup-footer .spacer{display:none}.popup-footer .btn{flex:1}}
.view-builder-tabs{display:flex;gap:7px;flex-wrap:wrap}.view-preset-bar,.view-builder-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0}.view-builder-tools input{flex:1;min-width:240px}.view-field-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:58vh;overflow:auto;padding:2px}.view-field-row{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--line);background:var(--card);border-radius:12px;padding:9px 10px}.view-field-row:hover{border-color:color-mix(in srgb,var(--accent) 38%,var(--line));background:color-mix(in srgb,var(--accent) 3%,var(--card))}.view-field-check{display:flex;align-items:center;gap:9px;min-width:0;cursor:pointer;flex:1}.view-field-check input{min-height:auto;width:17px;height:17px;flex:0 0 auto}.view-field-check span{display:flex;flex-direction:column;min-width:0}.view-field-check b{font-size:12px}.view-field-check small{font-size:9.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.view-field-order{display:flex;gap:2px}.view-field-order .icon-btn{font-size:15px;color:var(--muted);padding:3px 5px}.order-detail-sections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.order-detail-sections .panel{margin:0}.order-field-group-title{font-size:10px;font-weight:900;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-bottom:8px;padding-bottom:7px;border-bottom:1px solid var(--line)}
@media(max-width:760px){.view-field-list,.order-detail-sections{grid-template-columns:1fr}.view-builder-tools input{min-width:100%}.view-preset-bar .spacer{display:none;width:0}.view-preset-bar .chip{width:100%;justify-content:center}}


/* ===== VIN DMS V6 ===== */
.vin-command-hero{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;padding:20px;border-radius:20px;background:linear-gradient(135deg,rgba(32,59,114,.09),rgba(27,163,216,.06));border:1px solid var(--line);margin-bottom:14px}
.vin-command-hero h2{margin:4px 0 6px;font-size:24px}.vin-command-hero p{margin:0;color:var(--muted)}
.vin-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:12px 0}.vin-search-box{flex:1;min-width:260px;position:relative}.vin-search-box input{width:100%}
.vin-filter-chips{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.vin-chip{border:1px solid var(--line);background:var(--surface);color:var(--text);padding:7px 11px;border-radius:999px;cursor:pointer;font-size:12px;font-weight:700}.vin-chip:hover,.vin-chip.active{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 12%,transparent)}.vin-chip.warn{border-color:#d89b2b}.vin-chip.danger{border-color:#d45656}
.vin-row{cursor:pointer}.vin-row:hover td{background:color-mix(in srgb,var(--accent) 5%,var(--surface))}.vin-code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.02em;font-weight:800}.tiny{font-size:11px;color:var(--muted)}
.quality-score{display:inline-flex;align-items:baseline;gap:2px;font-weight:800}.quality-score.ok{color:#178554}.quality-score.warn{color:#b77400}
.vin-passport{display:grid;grid-template-columns:1fr auto;gap:18px;padding:20px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(140deg,var(--surface),color-mix(in srgb,var(--accent) 5%,var(--surface)));margin-bottom:14px}.vin-passport-main{min-width:0}.vin-passport-eyebrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}.vin-passport-eyebrow .eyebrow{margin:0}.vin-passport-title{font-size:17px;font-weight:800;letter-spacing:.01em;word-break:break-all}.vin-passport-title h2{margin:0;font-size:inherit;font-weight:inherit;letter-spacing:inherit;line-height:1.25}.vin-passport-side{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.vin-location{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px;color:var(--muted)}
.passport-score{display:inline-flex;align-items:baseline;gap:3px}.passport-score b{font-size:20px}.passport-score.large b{font-size:36px}.passport-score span{font-size:12px;color:var(--muted)}.passport-score.ok{color:#178554}.passport-score.warn{color:#b77400}
.vin-actions{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}.vin-alert-strip{padding:10px 12px;border-radius:12px;background:color-mix(in srgb,#d89b2b 12%,var(--surface));border:1px solid color-mix(in srgb,#d89b2b 35%,var(--line));margin-bottom:12px}.vin-tab-body{margin-top:12px}.restricted-block{padding:24px;text-align:center;border:1px dashed var(--line);border-radius:14px;color:var(--muted)}
.vin-timeline{display:flex;flex-direction:column;position:relative;margin-top:10px}.vin-event{display:grid;grid-template-columns:42px 1fr;gap:12px;padding:10px 0;position:relative}.vin-event:not(:last-child):after{content:'';position:absolute;left:20px;top:45px;bottom:-3px;width:1px;background:var(--line)}.vin-event-icon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 10%,var(--surface));border:1px solid var(--line);font-weight:900;z-index:1}.vin-event-main{padding:1px 0}.vin-event-main .meta{display:flex;gap:8px;flex-wrap:wrap;color:var(--muted);font-size:12px;margin-top:3px}.event-amount{font-weight:800;margin-top:4px}.quality-list{display:flex;flex-direction:column;gap:7px;margin-top:10px}.quality-item{padding:9px 10px;border-radius:10px;border:1px solid var(--line)}.quality-item.ok{background:color-mix(in srgb,#178554 7%,var(--surface));border-color:color-mix(in srgb,#178554 25%,var(--line))}.quality-item.warn{background:color-mix(in srgb,#d89b2b 8%,var(--surface));border-color:color-mix(in srgb,#d89b2b 28%,var(--line))}.vin-modal-id{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:900;padding:8px 10px;border-radius:10px;background:var(--soft);margin:7px 0 14px;word-break:break-all}.autocomplete-results{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--surface,#fff)}.autocomplete-results.static{position:relative;left:auto;right:auto;top:auto;max-height:min(280px,42vh);margin:8px 0 16px;box-shadow:none;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.autocomplete-results .empty{text-align:left;padding:16px 12px}.rov-vin-results{display:none;max-height:min(260px,38vh);overflow-y:auto;overscroll-behavior:contain;flex-shrink:0;margin:8px 0}.rov-vin-results.has-hits{display:block}.rov-vin-results[hidden]{display:none!important}.rov-vin-selected{margin:4px 0 8px}.rov-vin-selected[hidden],.rov-vin-selected.is-empty{display:none!important}.vin-availability-hit.is-selected{background:color-mix(in srgb,var(--accent) 12%,var(--surface));box-shadow:inset 3px 0 0 var(--accent)}.bulk-vin-actions .btn{font-size:12px}.vin-reserve-table{border-radius:12px;overflow:auto}.vin-reserve-table table{width:100%!important;min-width:700px!important;max-width:none!important;table-layout:fixed!important}.vin-reserve-table th,.vin-reserve-table td{padding:7px 8px;vertical-align:middle;white-space:nowrap}.vin-reserve-table th:nth-child(1),.vin-reserve-table td:nth-child(1){width:24%;overflow:visible;text-overflow:unset}.vin-reserve-table th:nth-child(2),.vin-reserve-table td:nth-child(2),.vin-reserve-table .vin-engine-no{width:24%;min-width:160px;overflow:visible;text-overflow:unset;white-space:nowrap}.vin-reserve-table th:nth-child(3),.vin-reserve-table td:nth-child(3){width:18%;overflow:hidden;text-overflow:ellipsis}.vin-reserve-table th:nth-child(4),.vin-reserve-table td:nth-child(4){width:12%;overflow:hidden;text-overflow:ellipsis;font-size:11.5px}.vin-reserve-table th:nth-child(5),.vin-reserve-table td:nth-child(5){width:12%;overflow:hidden;text-overflow:ellipsis}.vin-reserve-table th:nth-child(6),.vin-reserve-table td:nth-child(6),.vin-reserve-table .vin-reserve-actions{width:10%;text-align:right;padding-left:4px;padding-right:8px;overflow:visible;text-overflow:unset}.vin-reserve-table .vin-engine-no,.vin-reserve-table .vin-product-type{font-size:12px;font-variant-numeric:tabular-nums}.vin-reserve-table .vin-hold-until{font-size:11.5px;font-variant-numeric:tabular-nums}.vin-reserve-table .vin-reserve-actions .btn{padding:5px 8px;font-size:12px;white-space:nowrap}.vin-reserve-table .vin-reserve-link,.vin-reserve-table .table-link{border-radius:0!important;background:transparent!important;box-shadow:none!important;padding:0;display:inline;white-space:nowrap;vertical-align:middle;text-decoration:underline;text-underline-offset:2px}.vin-reserve-table tr:hover td{background:#fbfdff}.bulk-vin-errors{max-height:240px;overflow:auto;margin-top:10px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--soft,#f7f9fc);font-size:12px;line-height:1.45}.bulk-vin-errors code{font-family:ui-monospace,Consolas,monospace;font-weight:700}.autocomplete-item,.vin-availability-hit{display:flex;flex-direction:column;align-items:flex-start;gap:3px;width:100%;text-align:left!important;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;color:inherit;padding:10px 12px;cursor:pointer;box-sizing:border-box}.autocomplete-item:last-child,.vin-availability-hit:last-child{border-bottom:0}.autocomplete-item .vin-meta,.vin-availability-hit .vin-meta{display:block;width:100%;text-align:left;color:var(--muted);font-size:12px;line-height:1.35;font-weight:500}
@media(max-width:900px){.vin-command-hero{grid-template-columns:1fr}.vin-passport{grid-template-columns:1fr}.vin-passport-side{align-items:flex-start}.vin-toolbar{align-items:stretch}.vin-search-box{min-width:100%}.vin-actions .btn{flex:1 1 auto}}


/* V6.1 Global language + typography */
.locale-toggle{display:inline-flex;align-items:center;padding:3px;background:color-mix(in srgb,var(--nav) 8%,transparent);border:1px solid var(--line);border-radius:11px;gap:2px;box-shadow:0 2px 10px rgba(18,58,107,.04)}
.locale-toggle button{border:0;background:transparent;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.06em;padding:7px 9px;border-radius:8px;cursor:pointer;line-height:1}
.locale-toggle button.active{background:var(--nav);color:#fff;box-shadow:0 3px 10px rgba(18,58,107,.2)}
.auth-locale-wrap{display:flex;justify-content:flex-end;margin-bottom:8px}.auth-locale-wrap .locale-toggle{background:#f4f7fb}
.topbar h2{font-weight:800;letter-spacing:-.035em}.panel h2,.panel h3,.drawer h2,.modal h2{font-weight:750;letter-spacing:-.028em}
.stat .value{letter-spacing:-.035em}.btn{font-weight:600}.eyebrow,.nav-section{font-weight:700}
@media(max-width:900px){.top-actions .locale-toggle{order:-1}.locale-toggle button{padding:6px 8px}}


/* V6.1.3 topbar overflow fix */
.locale-toggle button{display:inline-flex;align-items:center;gap:6px;min-width:68px;justify-content:center;padding:6px 10px}
.locale-toggle .locale-flag{display:inline-flex;align-items:center;justify-content:center;width:20px;height:14px;line-height:1;filter:saturate(1.05);border-radius:2px;overflow:hidden;box-shadow:0 0 0 1px rgba(16,42,67,.08) inset}
.locale-toggle .locale-flag svg{display:block;width:20px;height:14px}
.locale-toggle .locale-code{font-size:10px;font-weight:800;letter-spacing:.055em;line-height:1}
.locale-toggle button.active .locale-flag{filter:saturate(1.15);transform:translateY(-.2px)}
.notify-btn{display:inline-flex;align-items:center;justify-content:center;position:relative}
.notify-btn.topbar-notify{gap:8px;border:1px solid var(--line);background:#fff;color:#173d70;padding:8px 12px;border-radius:12px;font-size:13px;font-weight:700;box-shadow:0 2px 10px rgba(18,58,107,.04)}
.notify-btn.topbar-notify:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(18,58,107,.08)}
.notify-label{font-size:13px;font-weight:700;color:inherit;white-space:nowrap}
.notify-speaker{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round}
.notify-speaker path:first-child{fill:currentColor;stroke:currentColor;fill-opacity:.10}
.notify-bell{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.theme-icon{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block}
#themeBtn{display:inline-grid;place-items:center;width:42px;height:42px;padding:0;border-radius:12px}
#notifyBtn{width:42px;height:42px;padding:0!important;border-radius:12px}
#notifyBtn .notify-label{display:none!important}
.top-actions .country-indicator{order:99;margin-left:2px}

@media(max-width:720px){.locale-toggle button{min-width:48px;gap:4px;padding:6px 7px}.locale-toggle .locale-code{display:none}.notify-btn.topbar-notify{padding:8px 10px}.notify-btn.topbar-notify .notify-label{display:none}}
@media(max-width:1440px){.notify-btn.topbar-notify .notify-label{display:none}.notify-btn.topbar-notify{padding:8px 10px}.top-actions select{max-width:165px;width:165px}.top-actions #branchFilter{min-width:280px;width:min(360px,30vw);max-width:400px}.global-search-wrap{max-width:240px;width:200px;flex-basis:200px}}
@media(max-width:1260px){.top-actions{width:100%;justify-content:flex-end;flex-wrap:wrap}.global-search-wrap{max-width:280px;min-width:160px;width:220px;flex:0 1 220px}.title-wrap{flex:1 1 180px}}
@media(max-width:920px){.topbar{padding:10px 12px}.title-wrap{flex:1 1 auto;min-width:0}.top-actions{justify-content:flex-end}}



/* V6.2 typography + workflow polish */
.process-note{margin:10px 0 14px;padding:11px 13px;border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));background:color-mix(in srgb,var(--accent) 6%,var(--card));border-radius:12px;color:#42526a;font-size:12.5px;line-height:1.55}.process-note b{color:var(--text)}
.workflow-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.workflow-panel .workflow-actions{gap:8px}.workflow-bar{scrollbar-width:thin}.workflow-step b{font-size:11.5px}.panel,.stat,.quick-action{backface-visibility:hidden}.search-results,.autocomplete-results{overscroll-behavior:contain}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* V6.3.4 country indicator + settings-only language control */
.country-indicator{display:inline-flex;align-items:center;gap:6px;border:1px solid color-mix(in srgb,var(--line) 82%,transparent);background:color-mix(in srgb,var(--card) 92%,var(--accent) 8%);border-radius:10px;padding:6px 9px;box-shadow:none;cursor:default;white-space:nowrap;min-height:38px}.country-indicator .country-code{color:#173d70!important;font-size:11px;font-weight:900;letter-spacing:.05em}.country-indicator .country-flag{width:22px;height:15px;border-radius:3px;overflow:hidden;box-shadow:0 0 0 1px rgba(15,45,80,.08)}html[data-theme="dark"] .country-indicator{background:#10243a;border-color:#29445e}html[data-theme="dark"] .country-indicator .country-code{color:#ddecff!important}
.country-flag{display:inline-flex;width:20px;height:14px;border-radius:2px;overflow:hidden;box-shadow:0 0 0 1px rgba(16,42,67,.08) inset}.country-flag svg{display:block;width:20px;height:14px}.country-code{font-size:10px;font-weight:800;letter-spacing:.07em;color:var(--text)}
.lang-region-card{margin-top:0}.lang-region-card h3{margin:0 0 4px}.lang-region-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.lang-region-item{border:1px solid var(--line);border-radius:14px;padding:14px;background:var(--card)}.lang-region-item label{display:block;font-size:11px;font-weight:800;letter-spacing:.03em;color:var(--muted);margin-bottom:8px}.lang-region-item select{width:100%}.country-readonly{display:flex;align-items:center;gap:9px;min-height:40px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--bg);font-weight:700}.country-readonly .country-flag{width:22px;height:15px}.country-readonly .country-flag svg{width:22px;height:15px}.lang-hint{margin-top:10px;font-size:12px;color:var(--muted);line-height:1.5}
@media(max-width:720px){.country-indicator{padding:7px 8px}.country-indicator .country-code{display:none}.lang-region-grid{grid-template-columns:1fr}}


/* V6.3 — program-bound discount + Executive Dashboard */
.order-discount-box{margin:18px 0 10px;padding:15px 16px;border:1px solid var(--line);border-radius:15px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 3%,var(--surface)),var(--surface));display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap}.order-discount-head{min-width:220px}.order-discount-head b{font-size:14px;color:var(--text)}.order-discount-controls{display:grid;grid-template-columns:repeat(4,minmax(155px,1fr));gap:9px;align-items:center;flex:1 1 720px}.order-discount-controls select,.order-discount-controls input{height:43px;min-width:0}.discount-program-info{width:100%;display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap;padding:9px 11px;border-radius:11px;background:color-mix(in srgb,var(--accent) 5%,var(--soft));font-size:12px}.discount-program-info b{color:var(--text)}.discount-program-info span{color:var(--muted)}.order-total-summary{display:flex;justify-content:flex-end;gap:28px;flex-wrap:wrap;align-items:center;padding:16px 0}.order-total-summary span{display:flex;gap:7px;align-items:baseline}.order-total-summary .discount-total-line b{color:#c23b36}.order-total-summary strong{font-size:21px;color:var(--text)}.discount-applied-list{display:flex;flex-direction:column;gap:8px}.discount-applied-item{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:var(--soft)}.discount-applied-item>div{display:flex;flex-direction:column;gap:3px}.discount-applied-item small{color:var(--muted)}.discount-applied-item strong{color:#c23b36}
.exec-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:16px;padding:14px 16px}.exec-toolbar h2{margin:2px 0 0;font-size:19px}.section-kicker{font-size:10px;letter-spacing:.16em;font-weight:800;color:var(--accent);text-transform:uppercase}.exec-month-label{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--muted)}.exec-month-label input{width:155px}.exec-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:14px 0}.exec-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:14px 0}.exec-kpi-card{padding:16px}.exec-kpi-total{font-family:var(--font-display);font-size:18px}.exec-progress,.exec-kpi-bar{height:8px;border-radius:999px;background:var(--soft);overflow:hidden}.exec-progress i,.exec-kpi-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--accent),#46c8c3)}.exec-kpi-total-note{font-size:11px;color:var(--muted);text-align:right;margin-top:5px}.exec-kpi-list{display:flex;flex-direction:column;gap:9px;margin-top:14px}.exec-kpi-row{display:grid;grid-template-columns:minmax(125px,1.2fr) minmax(120px,2fr) 58px 30px;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line)}.exec-kpi-row:first-child{border-top:0}.exec-kpi-row>div:first-child{display:flex;flex-direction:column;gap:2px}.exec-kpi-row small{color:var(--muted);font-size:11px}.exec-kpi-row strong{text-align:right}.exec-kpi-row strong.ok{color:var(--ok)}.exec-kpi-row strong.warn{color:var(--warn)}.exec-kpi-row strong.bad{color:var(--danger)}.mini-icon{border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:8px;width:29px;height:29px;cursor:pointer}.mini-icon:hover{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}.exec-finance-strip{margin-top:14px}.exec-table-panel{margin:14px 0;padding:16px}.exec-table-panel .table-wrap{max-height:520px}.chart-wrap.xs{height:225px}.exec-mini-list{display:flex;flex-direction:column;gap:7px;margin-top:10px}.exec-mini-list>div{display:grid;grid-template-columns:minmax(0,1fr) auto 55px;gap:10px;padding:7px 0;border-top:1px solid var(--line);font-size:11px;align-items:center}.exec-mini-list span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.exec-mini-list small{color:var(--muted);text-align:right}.exec-mini-list b{text-align:right}
@media(max-width:1100px){.order-discount-controls{grid-template-columns:repeat(2,minmax(155px,1fr))}.exec-grid-3{grid-template-columns:1fr 1fr}.exec-grid-3>.panel:last-child{grid-column:1/-1}}
@media(max-width:760px){.order-discount-controls{grid-template-columns:1fr;width:100%}.order-total-summary{justify-content:flex-start;gap:14px 22px}.exec-grid-2,.exec-grid-3{grid-template-columns:1fr}.exec-grid-3>.panel:last-child{grid-column:auto}.exec-toolbar{align-items:flex-start;flex-wrap:wrap}.exec-toolbar .spacer{display:none}.exec-month-label{width:100%}.exec-kpi-row{grid-template-columns:1fr 1fr 55px 30px}}


/* V6.4.0 — price waterfall: gross -> VinFast -> other -> store -> payable */
.line-programs{display:flex;flex-direction:column;gap:10px;margin-top:12px;width:100%}
.line-program-group{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:var(--soft);min-width:0;width:100%}
.line-program-group.vf{background:linear-gradient(135deg,rgba(28,126,214,.045),var(--soft));border-color:rgba(28,126,214,.18)}
.line-program-group.other{background:linear-gradient(135deg,rgba(126,91,199,.04),var(--soft));border-color:rgba(126,91,199,.16)}
.line-program-title{display:grid;grid-template-columns:260px minmax(0,1fr);gap:16px;align-items:center}
.line-program-title>div:first-child{display:flex;flex-direction:column;gap:4px;min-width:0}
.line-program-title b{font-size:13.5px;line-height:1.35;white-space:nowrap}
.line-program-title small{font-size:11px;line-height:1.45;color:var(--muted);max-width:250px}
.line-program-add{display:flex;align-items:center;min-width:0;width:100%}
.line-program-add select{min-width:0;width:100%;height:40px}
.source-badge{display:inline-flex;align-items:center;justify-content:center;padding:3px 7px;border-radius:7px;font-size:9px;font-weight:800;letter-spacing:.06em;vertical-align:middle}.source-badge.vf{background:rgba(28,126,214,.11);color:#1769aa;border:1px solid rgba(28,126,214,.2)}.source-badge.other{background:rgba(126,91,199,.10);color:#6c4fb2;border:1px solid rgba(126,91,199,.18)}.source-badge.store{background:rgba(220,93,50,.10);color:#b04a29;border:1px solid rgba(220,93,50,.18)}.discount-chip-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}.discount-chip{display:inline-flex;align-items:flex-start;flex-wrap:wrap;gap:6px 8px;border:1px solid var(--line);border-radius:12px;padding:7px 9px;background:var(--surface);font-size:10.5px;max-width:100%;width:100%;box-sizing:border-box}.discount-chip>span,.discount-chip .discount-chip-name{flex:1 1 160px;min-width:0;max-width:none;overflow:visible;text-overflow:unset;white-space:normal;line-height:1.4;word-break:break-word}.discount-chip small{font-weight:700;flex:0 0 auto;white-space:nowrap;margin-left:auto;padding-top:1px}.discount-chip button{border:0;background:transparent;color:var(--muted);font-size:15px;line-height:1;cursor:pointer;flex:0 0 auto;padding-top:1px}.discount-chip.vf small,.vf-text,.vf-support-line b{color:#1769aa}.discount-chip.other small,.other-text,.other-support-line b{color:#6c4fb2}.store-text{color:#b04a29}.line-total-row .ol_amount{font-size:12px}.store-discount-box{border-color:rgba(220,93,50,.18);background:linear-gradient(135deg,rgba(220,93,50,.035),var(--surface))}.store-controls{grid-template-columns:minmax(210px,auto) minmax(160px,1fr)}.store-controls.has-reason{grid-template-columns:minmax(210px,auto) minmax(140px,.9fr) auto minmax(200px,1.3fr)}.store-controls #o_discount_mode{min-width:210px}.store-discount-reason-label{white-space:nowrap;font-size:12px;font-weight:700;color:var(--muted)}.discount-source-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:10px 0 14px}.discount-source-card{display:flex;flex-direction:column;gap:3px;border:1px solid var(--line);border-radius:12px;padding:11px;background:var(--soft)}
@media(max-width:860px){.line-program-title{grid-template-columns:1fr;gap:9px}.line-program-title b{white-space:normal}.line-program-title small{max-width:none}.line-program-group{padding:11px}}
.discount-source-card small,.discount-source-card span{color:var(--muted);font-size:10.5px}.discount-source-card strong{font-size:17px}.discount-source-card.store strong{color:#b04a29}.discount-source-card.vinfast strong{color:#1769aa}.discount-source-card.other strong{color:#6c4fb2}.discount-toggle{display:inline-flex;align-items:center;gap:7px;border:0;background:transparent;cursor:pointer;font:inherit}.discount-toggle>span{position:relative;width:38px;height:21px;border-radius:999px;background:#c9d2dd;transition:.18s}.discount-toggle>span:after{content:'';position:absolute;width:17px;height:17px;border-radius:50%;background:#fff;left:2px;top:2px;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:.18s}.discount-toggle.on>span{background:#21a66b}.discount-toggle.on>span:after{transform:translateX(17px)}.discount-toggle b{font-size:11px;color:var(--muted)}.row-muted{opacity:.58}.confirm-card{display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:flex-start}.confirm-icon{width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:23px;font-weight:800}.confirm-icon.warn{background:rgba(229,148,39,.12);color:#c57d1a}.confirm-icon.ok{background:rgba(33,166,107,.12);color:#198754}.confirm-program{padding:11px 12px;border:1px solid var(--line);border-radius:11px;background:var(--soft);display:flex;flex-direction:column;gap:2px;margin:12px 0}.confirm-program small{color:var(--muted)}
@media(max-width:900px){.line-programs{grid-template-columns:1fr}.line-program-title{flex-direction:column}.line-program-add{min-width:0;width:100%}.store-controls{grid-template-columns:1fr}.discount-source-summary{grid-template-columns:1fr}}
.price-waterfall{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:8px!important;align-items:stretch!important;padding:14px 0!important}.price-waterfall>span{display:flex!important;flex-direction:column;align-items:flex-start!important;gap:4px!important;padding:10px 11px;border:1px solid var(--line);border-radius:11px;background:var(--soft);font-size:10.5px;color:var(--muted)}.price-waterfall>span b,.price-waterfall>span strong{font-size:14px;color:var(--text)}.price-waterfall>span:last-child{background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 10%,var(--surface)),var(--surface));border-color:color-mix(in srgb,var(--accent) 28%,var(--line))}.price-waterfall>span:last-child strong{font-size:19px;color:var(--accent)}.price-waterfall .vf-support-line b{color:#1769aa}.price-waterfall .other-support-line b{color:#6c4fb2}.price-waterfall .discount-total-line b{color:#b04a29}



/* V6.4 Dealer Operating System */
.work-hero{display:flex;align-items:center;gap:18px;justify-content:space-between;padding:22px 24px;margin-bottom:16px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(135deg,var(--surface),var(--soft))}.work-hero h1{margin:3px 0 5px;font-size:25px}.work-hero p{margin:0;color:var(--muted)}.work-hero-actions{display:flex;gap:8px;flex-wrap:wrap}.work-stats{grid-template-columns:repeat(6,minmax(115px,1fr))}.work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.work-section{border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow:hidden;min-width:0}.work-section.span2{grid-column:span 2}.work-section-head{display:flex;justify-content:space-between;align-items:flex-start;padding:15px 16px;border-bottom:1px solid var(--line);background:var(--soft)}.work-section-head h3{margin:0 0 3px}.work-section-head p{margin:0;color:var(--muted);font-size:12px}.work-count{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:28px;padding:0 8px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font-weight:800}.work-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line)}.work-row:last-child{border-bottom:0}.work-row.priority-high{background:rgba(221,66,66,.035)}.work-icon{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:var(--soft);font-weight:800}.work-main{min-width:0}.work-main b,.work-main small,.work-main p{display:block}.work-main small{margin-top:3px;color:var(--muted);font-size:11px}.work-main p{margin:4px 0 0;font-size:12px}.work-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.work-empty{padding:24px;text-align:center;color:var(--muted)}
.approval-preview{display:grid;gap:12px}.approval-rule{padding:13px;border:1px solid var(--line);border-radius:13px;background:var(--soft)}.approval-rule span{display:block;margin:5px 0}.approval-rule p{margin:5px 0 0;color:var(--muted)}.approval-price-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.approval-price-grid>div{padding:11px;border:1px solid var(--line);border-radius:12px;background:var(--soft)}.approval-price-grid small,.approval-price-grid b{display:block}.approval-price-grid small{color:var(--muted);font-size:10px}.approval-price-grid b{margin-top:4px}.approval-price-grid .vf b{color:#1769aa}.approval-price-grid .other b{color:#6c4fb2}.approval-price-grid .store b{color:#b04a29}
.scan-box{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;margin:14px 0}.scan-file{cursor:pointer}.scan-result{min-height:120px;border:1px solid var(--line);border-radius:14px;overflow:hidden}.scan-hit{width:100%;display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;text-align:left;align-items:center;padding:12px;border:0;border-bottom:1px solid var(--line);background:var(--surface);color:var(--text);cursor:pointer}.scan-hit:last-child{border-bottom:0}.scan-hit:hover{background:var(--soft)}.scan-hit small,.scan-hit p{display:block;color:var(--muted);margin:2px 0}.scan-hit strong{white-space:nowrap}
.pricing-engine-strip{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:14px 0 8px;padding:10px 12px;border:1px solid rgba(28,126,214,.16);border-radius:12px;background:rgba(28,126,214,.035)}.pricing-engine-strip span{font-size:10px;font-weight:900;letter-spacing:.08em;color:#1769aa}.pricing-engine-strip small{display:block;margin-top:2px;color:var(--muted)}.pricing-engine-strip>b{font-size:10px;padding:4px 8px;border-radius:999px;background:rgba(31,171,103,.1);color:#158052}.vin-availability-hit.disabled{opacity:.55;cursor:not-allowed}
@media(max-width:1100px){.work-stats{grid-template-columns:repeat(3,1fr)}.work-grid{grid-template-columns:1fr}.work-section.span2{grid-column:auto}.approval-price-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.work-hero{align-items:flex-start;flex-direction:column}.work-stats{grid-template-columns:repeat(2,1fr)}.work-row{grid-template-columns:34px minmax(0,1fr)}.work-actions{grid-column:2;justify-content:flex-start}.scan-box{grid-template-columns:1fr}.approval-price-grid{grid-template-columns:1fr}}


/* ================= V6.4.5 — THEME PARITY / LIGHT-DARK FIX ================= */
:root{
  --font-display:'Be Vietnam Pro','Inter','Segoe UI',system-ui,sans-serif;
  --surface:#ffffff;
  --soft:#f7f9fc;
  --surface-2:#f8fafc;
  --input-bg:#ffffff;
  --input-text:#102033;
  --table-head:#f8fafc;
  --table-hover:#f4f8fc;
  --divider:#edf1f5;
  --label:#5f6b7d;
  --link:#0c75a2;
  --overlay:rgba(11,31,56,.64);
  color-scheme:light;
}
html[data-theme="dark"]{
  --surface:#0d1b2a;
  --soft:#102235;
  --surface-2:#11263a;
  --input-bg:#0f2031;
  --input-text:#edf5ff;
  --table-head:#11263a;
  --table-hover:#132a40;
  --divider:#1d3348;
  --label:#aab8c8;
  --link:#65d2ff;
  --overlay:rgba(0,0,0,.62);
  color-scheme:dark;
}

/* App shell + controls */
html,body{background:var(--bg);color:var(--text)}
.topbar{background:var(--card);color:var(--text);filter:none;backdrop-filter:none;-webkit-backdrop-filter:none;transform:none}
.eyebrow,.search-icon{color:var(--muted)}
.global-search-wrap input,
input,select,textarea{
  background:var(--input-bg)!important;
  color:var(--input-text)!important;
  border-color:var(--line)!important;
}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:.88}
option{background:var(--surface);color:var(--text)}
.global-search-wrap kbd{background:var(--soft);border-color:var(--line);color:var(--muted)}
.search-results,.autocomplete-results{background:var(--surface)!important;color:var(--text);border-color:var(--line)}
.search-result-item:hover,.autocomplete-item:hover{background:var(--soft)!important}

/* Buttons */
.btn{background:var(--surface);color:var(--text);border-color:var(--line);box-shadow:none}
.btn:hover{box-shadow:0 5px 18px color-mix(in srgb,var(--text) 8%,transparent)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.danger{background:color-mix(in srgb,var(--danger) 9%,var(--surface));color:var(--danger);border-color:color-mix(in srgb,var(--danger) 24%,var(--line))}
.btn.success{background:color-mix(in srgb,var(--ok) 9%,var(--surface));color:var(--ok);border-color:color-mix(in srgb,var(--ok) 24%,var(--line))}
.icon-btn,.notify-btn{color:var(--text)}
.notify-btn.topbar-notify{background:var(--surface)!important;color:var(--text)!important;border-color:var(--line)!important}

/* Tables — critical fix */
.table-wrap{background:var(--surface)!important;border-color:var(--line)!important;color:var(--text)}
table{color:var(--text)}
th,td{border-bottom-color:var(--divider)!important;color:var(--text)}
th{background:var(--table-head)!important;color:var(--muted)!important}
tr:hover td{background:var(--table-hover)!important}
.table-link{color:var(--link)!important}
.muted-cell{color:var(--muted)!important}
.empty{color:var(--muted)!important}

/* Forms / cards */
.section-title{color:var(--text)!important}
.form-grid label,.filter-bar label{color:var(--label)!important}
.form-section,.line-item,.order-line{background:var(--soft)!important;border-color:var(--line)!important;color:var(--text)}
.panel,.card,.stat{background:var(--card);color:var(--text);border-color:var(--line)}
.panel.soft{background:var(--soft)}

/* Modal / Drawer */
.modal{background:var(--overlay)}
.modal-card,.drawer{background:var(--surface)!important;color:var(--text)!important;border-color:var(--line)}
.modal-x{color:var(--muted)!important}
.drawer-head{border-bottom-color:var(--line)}
.tabs{background:color-mix(in srgb,var(--soft) 92%,var(--surface));border-color:var(--line);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--surface) 40%,transparent)}
.tabs button{color:var(--muted)}
.tabs button:hover{background:color-mix(in srgb,var(--accent) 14%,var(--surface));color:var(--accent)}
.tabs button.active{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 22%,var(--surface)),var(--surface));color:var(--accent);box-shadow:0 1px 2px rgba(0,0,0,.18),0 0 0 1px color-mix(in srgb,var(--accent) 35%,var(--line))}
.timeline{border-left-color:var(--line)}
.timeline-item:before{border-color:var(--surface);box-shadow:0 0 0 1px var(--line)}

/* Kanban / operational cards */
.kanban-col{background:var(--soft)!important;color:var(--text)}
.kanban-card{background:var(--surface)!important;color:var(--text)!important;border-color:var(--line)!important}
.work-item,.approval-rule,.approval-price-grid>div,.scan-result,.scan-hit{background:var(--surface);color:var(--text);border-color:var(--line)}
.scan-hit:hover{background:var(--soft)}

/* Badges remain readable in both themes */
.badge{background:color-mix(in srgb,var(--accent) 10%,var(--surface));color:var(--text)}
.badge.ok{background:color-mix(in srgb,var(--ok) 12%,var(--surface));color:color-mix(in srgb,var(--ok) 86%,var(--text))}
.badge.warn{background:color-mix(in srgb,var(--warn) 13%,var(--surface));color:color-mix(in srgb,var(--warn) 88%,var(--text))}
.badge.bad{background:color-mix(in srgb,var(--danger) 12%,var(--surface));color:color-mix(in srgb,var(--danger) 88%,var(--text))}
.badge.info{background:color-mix(in srgb,var(--accent) 12%,var(--surface));color:var(--link)}
.badge.purple{background:color-mix(in srgb,var(--purple) 12%,var(--surface));color:color-mix(in srgb,var(--purple) 85%,var(--text))}

/* Dark-theme contrast guardrails for legacy hardcoded blocks */
html[data-theme="dark"] .auth-card{color:#102033}
html[data-theme="dark"] .auth-card input{background:#fff!important;color:#102033!important}
html[data-theme="dark"] .auth-card label{color:#667085!important}
html[data-theme="dark"] .progress{background:#1b3145}
html[data-theme="dark"] ::-webkit-scrollbar-thumb{background:#385169}
html[data-theme="dark"] ::-webkit-scrollbar-track{background:#0b1724}



/* ================= V6.4.5 — HARD THEME TABLE RESET ================= */
/* Legacy tables had hard-coded white backgrounds. Force every data table to
   use one coherent palette per theme, including Security Center / Approval Rules. */
html[data-theme="dark"] .table-wrap,
html[data-theme="dark"] .permission-table-wrap{
  background-color:#0d1b2a!important;
  color:#edf5ff!important;
  border-color:#1d3348!important;
}
html[data-theme="dark"] thead{
  background-color:#11263a!important;
  color:#edf5ff!important;
  border-color:#1d3348!important;
}
html[data-theme="dark"] table,
html[data-theme="dark"] tbody,
html[data-theme="dark"] tr,
html[data-theme="dark"] td{
  background-color:#0d1b2a!important;
  color:#edf5ff!important;
  border-color:#1d3348!important;
}
html[data-theme="dark"] th{
  background-color:#11263a!important;
  color:#aab8c8!important;
  border-color:#1d3348!important;
}
html[data-theme="dark"] tbody tr:hover td{background-color:#132a40!important}
html[data-theme="dark"] td .muted,
html[data-theme="dark"] td.muted,
html[data-theme="dark"] td .small.muted,
html[data-theme="dark"] .muted-cell{color:#91a4b8!important}
html[data-theme="dark"] .table-link{color:#65d2ff!important}

html:not([data-theme="dark"]) .table-wrap,
html:not([data-theme="dark"]) .permission-table-wrap{
  background-color:#fff!important;
  color:#132033!important;
  border-color:#edf1f5!important;
}
html:not([data-theme="dark"]) thead{
  background-color:#f8fafc!important;
  color:#132033!important;
  border-color:#edf1f5!important;
}
html:not([data-theme="dark"]) table,
html:not([data-theme="dark"]) tbody,
html:not([data-theme="dark"]) tr,
html:not([data-theme="dark"]) td{
  background-color:#fff!important;
  color:#132033!important;
  border-color:#edf1f5!important;
}
html:not([data-theme="dark"]) th{
  background-color:#f8fafc!important;
  color:#556174!important;
  border-color:#edf1f5!important;
}
html:not([data-theme="dark"]) tbody tr:hover td{background-color:#f4f8fc!important}
html:not([data-theme="dark"]) td .muted,
html:not([data-theme="dark"]) td.muted,
html:not([data-theme="dark"]) td .small.muted,
html:not([data-theme="dark"]) .muted-cell{color:#667085!important}

/* Keep semantic badges/buttons untouched by the table reset. */
html[data-theme="dark"] td .badge,
html:not([data-theme="dark"]) td .badge{background:initial}
.line-programs.single{grid-template-columns:1fr!important}.price-waterfall.clean{grid-template-columns:repeat(5,minmax(0,1fr))}@media(max-width:980px){.price-waterfall.clean{grid-template-columns:repeat(2,minmax(0,1fr))}}
.vehicle-identity{margin-top:12px;padding:12px;border:1px dashed var(--line);border-radius:12px;background:rgba(255,255,255,.45)}
.vehicle-identity-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.vehicle-identity-head b{font-size:12.5px}
.vehicle-id-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.vehicle-id-grid label{display:flex;flex-direction:column;gap:5px;font-size:11px;color:var(--label,#5f6b7d)}
.vehicle-id-grid label.span2{grid-column:1 / -1}
.vehicle-id-row{display:flex;gap:6px;align-items:stretch}
.vehicle-id-row input{flex:1;min-width:0}
.vehicle-id-row .btn.compact{white-space:nowrap;padding:0 10px;font-size:11px}

/* Đối chiếu serial — layout gọn 1 hàng / field */
.serial-verify-modal .serial-verify-head{margin-bottom:12px}
.serial-verify-modal .serial-verify-head h2{margin:0;font-size:20px}
.serial-verify-modal .serial-verify-head p{margin:4px 0 0;color:var(--muted);font-size:12.5px;line-height:1.4}
.deliv-line{border:1px solid var(--line);border-radius:14px;background:#fff;padding:12px 14px;margin:0 0 10px}
.deliv-line-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.deliv-line-head b{font-size:14px}
.deliv-vin{display:inline-block;margin-left:8px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.02em}
.deliv_line_status{font-size:11px;font-weight:800;color:var(--muted);padding:4px 8px;border-radius:999px;background:var(--card2,#f4f7fb)}
.deliv_line_status.ok{color:#0d7a4c;background:#e8f7ef}
.deliv-serial-grid{display:flex;flex-direction:column;gap:6px}
.deliv-serial-head,.deliv-serial-field{
 display:grid;grid-template-columns:88px minmax(120px,1.1fr) minmax(160px,1.4fr) 28px;
 gap:8px;align-items:center;
}
.deliv-serial-head{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;padding:0 2px 2px}
.deliv-field-name{font-size:12.5px;font-weight:700;color:var(--text)}
.deliv-field-name em{font-style:normal;font-weight:600;font-size:10px;color:var(--muted);margin-left:2px}
.deliv-field-expect{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11.5px;font-weight:650;color:#3d4f63;background:#f4f7fb;border:1px solid var(--line);border-radius:8px;padding:7px 9px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.deliv-field-input{display:flex;gap:6px;align-items:stretch;min-width:0}
.deliv-field-input .deliv_scan{flex:1;min-width:0;height:36px;padding:0 10px;font-size:13px}
.deliv-field-input .deliv_qr_btn{min-width:36px;padding:0 8px;height:36px}
.deliv_match{display:grid;place-items:center;font-size:15px;font-weight:800;line-height:1;color:var(--muted)}
.deliv_match.ok{color:#14915b}
.deliv_match.warn{color:#c77a12}
.deliv_match.mute{color:#9aa6b5}
.serial-verify-footer{justify-content:flex-end;gap:8px;margin-top:14px;position:static!important;box-shadow:none!important}
#modal>.modal-card:has(.serial-verify-modal){
  width:min(720px,calc(100vw - 28px))!important;
  max-height:min(92vh,92dvh)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:18px 20px!important;
}
#modal>.modal-card:has(.serial-verify-modal) .serial-verify-modal{display:block;min-height:0}
#modal>.modal-card:has(.serial-verify-modal) .serial-verify-footer.sticky-actions{
  position:static!important;bottom:auto!important;box-shadow:none!important;margin-top:16px;padding-top:12px;
  border-top:1px solid var(--line);background:transparent;
}
.serial-confirm-ask{margin:0 0 14px;font-size:15px;font-weight:650;line-height:1.45;color:var(--text)}
#modal>.modal-card:has(.serial-confirm-modal){width:min(520px,calc(100vw - 28px))!important;padding:18px 20px!important;max-height:min(90vh,90dvh)!important;overflow-y:auto!important}
@media(max-width:720px){
 .deliv-serial-head{display:none}
 .deliv-serial-field{
  grid-template-columns:1fr 36px;
  grid-template-areas:"name status" "expect expect" "input input";
  gap:6px;padding:10px;border:1px solid var(--line);border-radius:12px;background:#f8fafc;
 }
 .deliv-field-name{grid-area:name}
 .deliv_match{grid-area:status;justify-self:end}
 .deliv-field-expect{grid-area:expect}
 .deliv-field-input{grid-area:input}
 .deliv-line-head{align-items:flex-start;flex-direction:column}
 .serial-verify-footer{justify-content:stretch}
 .serial-verify-footer .btn{flex:1}
}
.ol_frame_wrap{position:relative}
.ol_frame{font-family:ui-monospace,Consolas,monospace;letter-spacing:.04em;font-weight:700}
.ol_from_stock,.vehicle-id-grid input[readonly]{background:rgba(15,23,42,.04);color:var(--text,#0f172a);cursor:default}
.ol_stock_badge{display:inline-block;margin-left:6px;font-size:10px;font-weight:800;letter-spacing:.02em;vertical-align:middle}
.ol_stock_badge.hit{color:#158052}
.ol_stock_badge.miss{color:#9a6b16}
.ol_stock_badge.hint{color:#667085;font-weight:600}
.ol_frame.in-stock{border-color:#21a66b;box-shadow:0 0 0 2px rgba(33,166,107,.12)}
.ol_frame.not-in-stock{border-color:#d8b15a}
.ol_stock_suggest{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:40;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 36px rgba(18,40,70,.14);overflow:hidden;max-height:280px;overflow-y:auto}
.ol_stock_suggest_head{padding:8px 12px;font-size:11px;font-weight:800;color:#158052;background:rgba(33,166,107,.08);border-bottom:1px solid var(--line)}
.ol_stock_suggest_item{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;text-align:left;border:0;border-bottom:1px solid #edf1f5;background:#fff;color:#0f172a;padding:10px 12px;cursor:pointer}
.ol_stock_suggest_item:hover{background:#f4faf7}
.ol_stock_suggest_item .vin-main{display:block;width:100%;font-family:ui-monospace,Consolas,monospace;letter-spacing:.04em;font-size:13.5px;font-weight:800;color:#0f172a!important;line-height:1.35;word-break:break-all}
.ol_stock_suggest_item .vin-meta{display:block;width:100%;color:#64748b;font-size:11px;line-height:1.35}
.ol_stock_suggest_item .stock-pill{font-size:10px;font-weight:800;color:#158052;background:rgba(33,166,107,.1);border-radius:999px;padding:2px 7px}
@media(max-width:760px){.vehicle-id-grid{grid-template-columns:1fr}}
html.dark .vehicle-identity{background:rgba(255,255,255,.03)}
html.dark .ol_from_stock,html.dark .vehicle-id-grid input[readonly]{background:rgba(255,255,255,.06);color:#e2e8f0}
html.dark .ol_stock_suggest{background:#1a2332;border-color:#2a3648}
html.dark .ol_stock_suggest_item{background:#1a2332;border-bottom-color:#2a3648;color:#e2e8f0}
html.dark .ol_stock_suggest_item:hover{background:#223044}
html.dark .ol_stock_suggest_item .vin-main{color:#f8fafc!important}
.ol_stock_hint{display:none!important;margin:0;padding:0;height:0;overflow:hidden;position:absolute;width:1px;clip:rect(0,0,0,0)}
.form-section.order-line .ol-qty-field .ol_stock_hint{display:none!important}
.form-section.order-line .ol_battery_wrap{margin:0!important}
.form-section.order-line .ol_battery_wrap select{width:100%;margin:0}
.order-preorder-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:8px 0 4px;padding:8px 10px;border:1px dashed rgba(180,83,9,.35);border-radius:10px;background:rgba(180,83,9,.06)}
/* LOCKED: ẩn mặc định; chỉ hiện khi hết tồn (JS bỏ .hidden) */
.order-preorder-row.hidden{display:none!important}
.order-preorder-check{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:#9a3412;cursor:pointer;margin:0}
.order-preorder-check input{width:16px;height:16px;accent-color:#c2410c}
.status-stack{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.status-stack .badge-preorder{font-size:9px;padding:2px 6px;line-height:1.2;font-weight:700}
.status-inline{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px}
.status-inline .badge-preorder{font-size:10px;padding:3px 7px}
.ol_qty.stock-over{border-color:#d97706!important;box-shadow:0 0 0 2px rgba(217,119,6,.18)}
.ol_vin_note{margin:8px 0 0;font-size:11.5px}

.vin-availability-hit .vin-main,.autocomplete-item .vin-main{display:block;width:100%;text-align:left;font-weight:700;letter-spacing:.01em;color:inherit!important;word-break:break-word;line-height:1.35}.vin-availability-hit .vin-main b,.autocomplete-item .vin-main b{font-family:ui-monospace,Consolas,monospace;font-weight:800;letter-spacing:.03em;word-break:break-all}

/* Auth login UX improvements */
.password-field{position:relative;display:block}
.password-field input{width:100%;min-width:0;padding-right:92px}
#authPassword::-ms-reveal,#authPassword::-ms-clear{display:none}
#authPassword::-webkit-credentials-auto-fill-button,#authPassword::-webkit-strong-password-auto-fill-button{visibility:hidden;pointer-events:none;position:absolute}
.pass-tools{position:absolute;right:6px;top:50%;transform:translateY(-50%);display:flex;flex-direction:row;align-items:center;gap:2px;z-index:2}
.pass-tool{width:40px;height:40px;min-width:40px;min-height:40px;padding:0;border:0;border-radius:10px;background:transparent;color:#475569;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:0;-webkit-tap-highlight-color:transparent}
.pass-tool:hover,.pass-tool.active{color:#0f4c81;background:rgba(15,76,129,.08)}
.pass-tool svg{width:22px;height:22px;display:block;pointer-events:none}
@media(max-width:900px){.password-field input{padding-right:52px}.pass-tool{width:44px;height:44px;min-width:44px;min-height:44px}.pass-tool svg{width:24px;height:24px}}
.auth-vk{margin-top:8px;background:#fff;border:1px solid #d7deea;border-radius:14px;padding:8px 8px 10px;box-shadow:0 10px 28px rgba(15,23,42,.12);user-select:none}
.auth-vk.hidden{display:none!important}
.auth-vk-row{display:flex;gap:4px;margin:4px 0;justify-content:center}
.auth-vk-key{flex:1 1 0;min-width:0;height:32px;border:1px solid #c5d0e0;border-bottom-width:2px;border-radius:5px;background:linear-gradient(#fff,#eef3f9);color:#1d4ed8;font:700 12px/1 system-ui,Segoe UI,sans-serif;cursor:pointer;padding:0 2px}
.auth-vk-key:hover{filter:brightness(.98)}
.auth-vk-key:active{transform:translateY(1px);border-bottom-width:1px}
.auth-vk-key.wide{flex:1.45 1 0;font-size:10px;letter-spacing:.02em;color:#2563eb}
.auth-vk-key.space{flex:8 1 0;height:34px;background:linear-gradient(#f3f5f8,#e5eaf1);border-color:#c9d2de;color:transparent}
.auth-vk-key.shift-on,.auth-vk-key.active{background:linear-gradient(#dbeafe,#bfdbfe);border-color:#93c5fd}
@media(max-width:900px){.pass-tool.vk-only,.auth-vk{display:none!important}.password-field input{padding-right:52px!important}}
.auth-options{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0 14px;min-height:22px;flex-wrap:wrap}
.auth-forgot{appearance:none;background:none;border:0;padding:0;margin:0;font:inherit;font-size:13px;font-weight:600;color:var(--accent,#21a9e1);cursor:pointer;text-decoration:none;line-height:1.2}
.auth-forgot:hover{text-decoration:underline}
.remember-check{display:inline-flex;align-items:center;gap:9px;font-size:13px;line-height:1.2;color:var(--muted,#64748b);font-weight:600;cursor:pointer;margin:0!important}
.remember-check input[type="checkbox"]{-webkit-appearance:auto!important;appearance:auto!important;display:inline-block!important;width:16px!important;height:16px!important;min-width:16px!important;max-width:16px!important;min-height:16px!important;max-height:16px!important;padding:0!important;margin:0!important;border:0!important;border-radius:3px!important;background:transparent!important;box-shadow:none!important;accent-color:var(--accent,#21a9e1)}
.auth-card .hidden-auth-name{display:none!important}
.auth-card .auth-msg{min-height:20px}
.auth-card .auth-msg.auth-msg-ok{color:#0f7b4a;font-weight:600;line-height:1.5;white-space:normal}
.auth-card .auth-msg.auth-msg-ok a{color:#0b5cab;font-weight:700;text-decoration:underline;word-break:break-all}
.auth-boot-splash{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:22px 8px 18px;min-height:0;text-align:center}
.auth-boot-splash.hidden{display:none!important}
/* Khi đang tải: không hiện nút cài app, card gọn — tránh khoảng trắng + UI chồng */
#authScreen:has(#authBootSplash:not(.hidden)) #authPwaHint{display:none!important}
body:has(#authScreen:not(.hidden)) .pwa-install-fab{display:none!important}
#authScreen:has(#authBootSplash:not(.hidden)) .auth-card{
  padding:18px 16px!important;min-height:0!important
}
#authScreen:has(#authBootSplash:not(.hidden)) .auth-card .brand-mark{margin-bottom:4px}
@media(max-width:900px){
  #authScreen:has(#authBootSplash:not(.hidden)) .auth-card{
    width:min(100%,360px);margin:0 auto
  }
}
.auth-boot-spinner{
  --boot-size:52px;
  width:var(--boot-size);height:var(--boot-size);position:relative;flex:0 0 auto
}
.auth-boot-spinner i{
  position:absolute;left:50%;top:50%;
  width:5px;height:14px;margin:-26px 0 0 -2.5px;
  border-radius:999px;
  transform-origin:50% 26px;
  background:#2bb8d6;
  opacity:.22;
  animation:authBootBar 1s linear infinite
}
.auth-boot-spinner i:nth-child(1){transform:rotate(0deg);animation-delay:-.916s;background:#2fe0c0}
.auth-boot-spinner i:nth-child(2){transform:rotate(30deg);animation-delay:-.833s;background:#2ad4c8}
.auth-boot-spinner i:nth-child(3){transform:rotate(60deg);animation-delay:-.75s;background:#25c7d4}
.auth-boot-spinner i:nth-child(4){transform:rotate(90deg);animation-delay:-.666s;background:#22b6e0}
.auth-boot-spinner i:nth-child(5){transform:rotate(120deg);animation-delay:-.583s;background:#1fa5ea}
.auth-boot-spinner i:nth-child(6){transform:rotate(150deg);animation-delay:-.5s;background:#2496f0}
.auth-boot-spinner i:nth-child(7){transform:rotate(180deg);animation-delay:-.416s;background:#2b86f2}
.auth-boot-spinner i:nth-child(8){transform:rotate(210deg);animation-delay:-.333s;background:#3478ee}
.auth-boot-spinner i:nth-child(9){transform:rotate(240deg);animation-delay:-.25s;background:#3d6ae8}
.auth-boot-spinner i:nth-child(10){transform:rotate(270deg);animation-delay:-.166s;background:#3a75ec}
.auth-boot-spinner i:nth-child(11){transform:rotate(300deg);animation-delay:-.083s;background:#2f9ae8}
.auth-boot-spinner i:nth-child(12){transform:rotate(330deg);animation-delay:0s;background:#2ac4d6}
@keyframes authBootBar{0%{opacity:1}100%{opacity:.15}}
.auth-boot-splash p{margin:0;font-size:14px;color:#5b6b7c;font-weight:600;letter-spacing:.02em}
@media(max-width:640px){.auth-options{margin-top:8px}}
.auth-hero-minimal{display:flex;flex-direction:column;justify-content:center;min-height:420px}
.auth-hero-minimal h1{font-size:46px;line-height:1.08;max-width:720px;margin:0 0 18px;letter-spacing:-.035em}
.auth-hero-minimal .auth-tagline{font-size:18px;color:#dbeafe;margin:0;letter-spacing:.01em}
.auth-hero-minimal .auth-tagline span{opacity:.55;margin:0 7px}
.auth-card h2{margin-top:26px;margin-bottom:14px}

.auth-hero-minimal .auth-headline{font-size:40px;line-height:1.11;max-width:720px;margin:26px 0 18px;letter-spacing:-.04em}
.auth-hero-minimal .auth-headline>span{display:block;white-space:nowrap}
@media(min-width:901px) and (max-width:1120px){.auth-hero-minimal .auth-headline{font-size:35px}.auth-hero-minimal .brand-xl{font-size:27px}.auth-hero-minimal .auth-tagline{font-size:16px}}
@media(max-width:900px){.auth-hero-minimal{display:none}}



/* V6.5.7 — Restore larger desktop login card */
@media(min-width:901px){
  #authScreen .auth-layout{
    width:min(1180px,calc(100% - 72px));
    grid-template-columns:minmax(0,1.08fr) minmax(470px,.92fr);
    gap:62px;
  }
  #authScreen .auth-card{
    width:100%;
    max-width:520px;
    justify-self:end;
    padding:36px 38px 34px;
    border-radius:24px;
    box-shadow:0 34px 96px rgba(0,0,0,.34);
  }
  #authScreen .auth-card .brand-mark{font-size:22px}
  #authScreen .auth-card h2{font-size:29px;margin-top:30px;margin-bottom:18px}
  #authScreen .auth-card label{font-size:13.5px;margin:14px 0}
  #authScreen .auth-card input:not([type="checkbox"]){height:54px;padding:0 15px;font-size:14px;border-radius:14px}
  #authScreen .password-field{position:relative;display:block}
  #authScreen .password-field input{padding-right:96px}
  #authScreen .pass-tool{width:42px;height:42px;min-width:42px;min-height:42px}
  #authScreen .pass-tool svg{width:24px;height:24px}
  #authScreen .auth-options{margin:12px 0 16px;min-height:24px}
  #authScreen .remember-check{font-size:13.5px}
  #authScreen #btnLogin,#authScreen #btnSignup{min-height:52px;font-size:14px;border-radius:14px}
  #authScreen .auth-msg{margin-top:14px;min-height:20px}
}
@media(min-width:901px) and (max-width:1180px){
  #authScreen .auth-layout{width:min(1080px,calc(100% - 40px));grid-template-columns:minmax(0,1fr) minmax(440px,.9fr);gap:42px}
  #authScreen .auth-card{max-width:490px;padding:32px 34px 30px}
  #authScreen .auth-powered{margin-top:18px;padding-top:14px;border-top:1px solid rgba(148,163,184,.20);text-align:center;font-size:11.5px;font-weight:600;letter-spacing:.01em;color:#94a3b8}
  #authScreen .auth-powered strong{font-weight:700;color:#64748b}

}


/* V6.5.10 — Powered by footer polish */
#authScreen .auth-powered{
  position:relative;
  display:block;
  width:100%;
  margin:26px auto 0!important;
  padding:20px 0 0!important;
  border-top:0!important;
  text-align:center!important;
  font-size:12px!important;
  line-height:1.35;
  font-weight:500!important;
  letter-spacing:.015em!important;
  color:rgba(71,85,105,.52)!important;
  user-select:none;
}
#authScreen .auth-powered::before{
  content:"";
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:150px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(100,116,139,.20),transparent);
}
#authScreen .auth-powered strong{
  color:rgba(51,65,85,.68)!important;
  font-weight:650!important;
}
@media(max-width:640px){
  #authScreen .auth-powered{margin-top:20px!important;padding-top:16px!important;font-size:11.5px!important}
  #authScreen .auth-powered::before{width:120px}
}


/* V6.5.12 — Create Order layout
   LOCKED 2026-09-03 — form —on h—ng b—n xe OK PC+phone; kh—ng s?a .order-create-* / .order-form-actions tr? khi user m? kh—a */
.order-create-head{margin-bottom:14px}.order-create-head h2{margin:0;font-size:22px}
.order-meta-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px 14px;align-items:start}
.order-meta-grid>label{margin:0}.order-meta-branch{grid-column:span 4}.order-meta-customer{grid-column:span 8}.order-meta-quarter{grid-column:span 3}.order-meta-full{grid-column:1/-1}
.order-addr-block{grid-column:1/-1;display:flex;flex-direction:column;gap:6px;min-width:0}
.order-addr-head{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;flex-wrap:nowrap;width:100%;min-width:0}
.order-addr-label{font-size:12px;font-weight:600;color:var(--muted);line-height:1.2;flex:0 0 auto}
.order-addr-perm-check{display:inline-flex;flex-direction:row;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--text);cursor:pointer;margin:0;white-space:nowrap;flex:0 0 auto;user-select:none}
.order-addr-perm-check input[type="checkbox"]{width:16px;height:16px;accent-color:#0f766e;flex:0 0 16px;margin:0;padding:0}
.product-update-meta{line-height:1.35;white-space:nowrap}.product-update-meta b{font-size:12px;font-weight:700}
.product-form-modal{width:100%;max-width:100%;box-sizing:border-box;overflow:hidden}
.product-form-grid{width:100%;max-width:100%;box-sizing:border-box;grid-template-columns:repeat(3,minmax(0,1fr))!important}
.product-form-grid>label{min-width:0;max-width:100%}
.product-form-grid>label.p-name-field{grid-column:span 2;min-width:0}
.product-form-grid input,.product-form-grid select,.product-form-grid textarea{width:100%;max-width:100%;min-width:0;box-sizing:border-box}
/* Form sản phẩm: tiêu đề cố định ngoài vùng cuộn (không dùng sticky — iOS hay fail) */
#modal>.modal-card:has(.product-form-modal){
  width:min(860px,calc(100vw - 28px))!important;padding:0!important;
  overflow:hidden!important;display:flex!important;flex-direction:column!important;
  max-height:min(92vh,92dvh)!important
}
#modal>.modal-card:has(.product-form-modal)>#modalBody{
  flex:1 1 auto!important;min-height:0!important;width:100%!important;
  margin:0!important;padding:0!important;overflow:hidden!important;
  display:flex!important;flex-direction:column!important;box-sizing:border-box!important
}
#modal>.modal-card:has(.product-form-modal) .product-form-modal{
  display:flex!important;flex-direction:column!important;
  flex:1 1 auto!important;min-height:0!important;height:100%!important;
  overflow:hidden!important;width:100%!important
}
#modal>.modal-card:has(.product-form-modal) .product-form-head{
  flex:0 0 auto!important;position:relative!important;top:auto!important;z-index:12!important;
  margin:0!important;
  padding:calc(14px + env(safe-area-inset-top,0px)) 20px 12px!important;
  background:var(--surface,var(--card,#fff))!important;
  border-bottom:1px solid var(--line)!important;
  box-shadow:0 8px 18px -14px rgba(15,23,42,.35)
}
#modal>.modal-card:has(.product-form-modal) .product-form-head h2{
  margin:0!important;font-size:20px!important;line-height:1.25!important;
  overflow-wrap:anywhere!important;white-space:normal!important
}
#modal>.modal-card:has(.product-form-modal) .product-form-scroll{
  flex:1 1 auto!important;min-height:0!important;
  overflow-y:auto!important;overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;touch-action:pan-y!important;
  padding:12px 20px max(16px,env(safe-area-inset-bottom,0px))!important;
  box-sizing:border-box!important
}
#modal>.modal-card:has(.product-form-modal) .form-actions-bar,
#modal>.modal-card:has(.product-form-modal) .toolbar.form-actions-bar{
  position:static!important;margin-top:16px!important;
  box-shadow:none!important;background:transparent!important
}
.order-meta-grid textarea{min-height:72px;resize:vertical}.order-meta-customer .customer-search-row{grid-template-columns:minmax(0,1fr) auto}
.order-adjustments-grid{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:12px;align-items:stretch;margin-top:14px}.order-adjustments-grid .order-discount-box{margin:0}.order-fee-box{border:1px solid var(--line);border-radius:14px;background:var(--card);padding:14px 16px;display:flex;align-items:center}.order-fee-box label{width:100%;margin:0}.order-fee-box label>span{display:block;font-weight:700;margin-bottom:8px}.order-fee-box input{width:100%}
@media(max-width:900px){.order-meta-branch,.order-meta-customer{grid-column:1/-1}.order-meta-quarter{grid-column:span 6}.order-adjustments-grid{grid-template-columns:1fr}}
@media(max-width:560px){.order-meta-quarter{grid-column:1/-1}}


/* V6.5.13 — Quick Customer compact commercial layout
   LOCKED 2026-09-03 — form kh—ch OK PC+phone; kh—ng s?a .quick-customer-* / CCCD g?n form n—y tr? khi user m? kh—a. */
.modal-card.quick-customer-card{width:min(940px,calc(100vw - 28px));padding:0;overflow:hidden;border-radius:22px}
.quick-customer-modal{padding:26px 28px 22px}
.quick-customer-header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:0;padding-right:28px}
.quick-customer-header h2{margin:0;font-size:22px;line-height:1.15;letter-spacing:-.035em}
.quick-customer-header p{margin:3px 0 0;color:var(--muted);font-size:12px;line-height:1.35}
.quick-customer-paste{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:10px;padding:12px 12px 10px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--accent) 3%,var(--surface));margin-bottom:12px}
.quick-customer-paste label{margin:0 0 2px;font-size:12px;font-weight:700;color:var(--muted);line-height:1.2}
.quick-customer-paste textarea{width:100%;height:58px;min-height:58px;resize:none;margin-top:8px;border-radius:10px;line-height:1.4}
.quick-customer-paste .btn{height:34px;white-space:nowrap;padding:0 12px;font-size:12px;line-height:1.2}
.quick-customer-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;align-items:stretch;margin-top:2px}
.quick-customer-actions .btn{min-width:0;width:100%;height:34px;padding:0 10px;font-size:12px;line-height:1.2;white-space:nowrap}
#qc_upload_docs{grid-column:1/-1;display:inline-flex;align-items:center;justify-content:center;gap:8px}
#qc_upload_docs .qc-upload-ico,.cust-id-upload .qc-upload-ico{flex:0 0 auto;display:block;border-radius:5px;box-shadow:0 1px 2px rgba(18,58,107,.12)}
#qc_upload_docs.has-docs{border-color:#8ec8e8;background:#eaf6fb;color:#0c739f;font-weight:700}
.cust-id-upload{display:inline-flex;align-items:center;gap:8px}
.cust-id-docs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 8px;align-items:start}
.cust-id-doc{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;overflow:hidden;text-align:left;min-height:0}
.cust-id-doc:hover{border-color:#8ec8e8;box-shadow:0 4px 14px rgba(18,58,107,.08)}
.cust-id-doc img{width:100%;display:block;background:#eef3f8}
.cust-id-doc.is-card img{aspect-ratio:1.586;height:auto;object-fit:contain}
.cust-id-doc.is-vneid img{aspect-ratio:3/4;max-height:168px;height:auto;object-fit:contain;object-position:top center}
.cust-id-doc span{display:block;padding:8px 10px;font-size:12px;font-weight:700;color:#334155}
.cust-id-doc-viewer{width:min(720px,96vw);max-width:720px}
.cust-id-doc-full{display:block;width:100%;max-height:72vh;object-fit:contain;border-radius:12px;background:#0b1f38}
html[data-theme="dark"] .cust-id-doc{background:var(--surface)}
@media(max-width:760px){.cust-id-docs{grid-template-columns:1fr}.cust-id-doc.is-vneid img{max-height:220px}}
.cust-id-docs-empty{margin:0 0 8px;padding:12px;border:1px dashed var(--line);border-radius:12px;color:var(--muted);font-size:13px;line-height:1.4;background:color-mix(in srgb,var(--accent) 3%,var(--surface));display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 12px;text-align:center}
.cust-id-docs-empty .cust-id-upload{margin:0;flex:0 0 auto}
.cust-id-docs-head{display:flex;align-items:center;gap:8px}
.cust-id-docs-head .cust-id-refresh{margin-left:auto;display:inline-flex;align-items:center;gap:6px;width:auto;min-height:34px;padding:6px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:12px;font-weight:700;line-height:1.2;color:#1e4b7a;white-space:nowrap}
.cust-id-docs-head .cust-id-refresh .cust-id-refresh-ico{flex:0 0 auto;display:block}
.cust-id-docs-head .cust-id-refresh:hover{border-color:#8ec8e8;background:#eaf6fb;color:#0c739f}
html[data-theme="dark"] .cust-id-docs-head .cust-id-refresh{background:var(--surface);color:var(--text)}
@media(max-width:760px){.cust-id-docs-head{flex-wrap:wrap}.cust-id-docs-head .cust-id-refresh{margin-left:0;width:100%;justify-content:center}}
.cust-id-doc.is-loading .cust-id-doc-ph,.cust-id-doc .cust-id-doc-ph{display:block;width:100%;aspect-ratio:1.586;background:linear-gradient(90deg,#e8eef5 25%,#f5f8fb 50%,#e8eef5 75%);background-size:200% 100%;animation:custIdShimmer 1.1s ease-in-out infinite}
.cust-id-doc.is-vneid.is-loading .cust-id-doc-ph,.cust-id-doc.is-vneid .cust-id-doc-ph{aspect-ratio:3/4}
.cust-id-doc.is-loading img{opacity:0}
.cust-id-doc.is-missing{opacity:.72}
.cust-id-doc.is-missing .cust-id-doc-ph{animation:none;background:#f1f5f9}
.cust-id-doc.is-missing::after{content:'Không tải được ảnh';display:block;padding:6px 10px 10px;font-size:11px;font-weight:600;color:#b91c1c}
@keyframes custIdShimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.qc-id-photos-panel{width:min(520px,100%);max-width:520px}
.qc-id-photos{margin:0;padding:0;border:0;background:transparent}
.qc-id-photos-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:start}
.qc-id-photo-slot{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:112px;padding:10px 8px;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;text-align:center;overflow:hidden}
.qc-id-photo-slot.is-card{aspect-ratio:1.586;min-height:0;padding:0}
.qc-id-photo-slot.is-vneid{aspect-ratio:3/4;min-height:0;padding:0}
.qc-id-photo-slot:hover{border-color:#8ec8e8;box-shadow:0 4px 14px rgba(18,58,107,.08)}
.qc-id-photo-slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#eef3f8}
.qc-id-photo-plus{font-size:22px;line-height:1;color:var(--accent);font-weight:700}
.qc-id-photo-caption{font-size:11px;font-weight:700;color:#334155;z-index:1}
.qc-id-photo-slot small{font-size:10px;color:var(--muted);z-index:1}
.qc-id-photo-slot:has(img) .qc-id-photo-caption{position:absolute;left:0;right:0;bottom:0;padding:5px 6px;background:linear-gradient(transparent,#0b1f38cc);color:#fff;font-size:10px}
.qc-id-photo-clear{position:absolute;top:6px;right:6px;z-index:2;width:26px;height:26px;border:0;border-radius:999px;background:#fff;color:#c62828;font-size:16px;line-height:1;cursor:pointer;box-shadow:0 2px 8px #0003}
.qc-photo-pick-actions{display:grid;gap:8px;margin-top:14px}
html[data-theme="dark"] .qc-id-photo-slot{background:var(--surface)}
@media(max-width:760px){
  .qc-id-photos-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
  .cccd-scanner-card.qc-id-photos-panel,
  .qc-photo-overlay .qc-id-photos-panel{
    width:min(360px,calc(100vw - 32px))!important;
    max-width:min(360px,calc(100vw - 32px))!important;
    max-height:none!important;
    padding:12px 12px calc(12px + env(safe-area-inset-bottom,0px))!important;
    border-radius:16px!important;
    margin:auto!important;
  }
  .qc-id-photos-panel .cccd-scanner-head{margin-bottom:8px!important}
  .qc-id-photos-panel .cccd-scanner-head h3{font-size:16px!important;margin:0!important}
  .qc-id-photo-slot{min-height:70px!important;border-radius:10px!important}
  .qc-id-photo-slot.is-card{aspect-ratio:1.586!important;max-height:86px!important}
  .qc-id-photo-slot.is-vneid{aspect-ratio:3/4!important;max-height:86px!important}
  .qc-id-photo-plus{font-size:18px!important}
  .qc-id-photo-caption{font-size:10px!important;line-height:1.2!important;padding:0 4px!important}
  .qc-id-photo-slot:has(img) .qc-id-photo-caption{padding:3px 4px!important;font-size:9px!important}
  .qc-id-photos-panel .qc-photo-pick-actions{margin-top:10px!important;gap:6px!important}
  .qc-id-photos-panel .qc-photo-pick-actions .btn{min-height:38px!important;font-size:13px!important}
}
.quick-customer-form{display:grid;grid-template-columns:1.4fr .9fr .9fr;gap:13px 14px}
.quick-customer-form label{margin:0;font-size:12px;color:var(--muted);font-weight:600}
.quick-customer-form input,.quick-customer-form select{width:100%;height:46px;margin-top:6px}
.quick-customer-form .qc-name{grid-column:span 2}
.quick-customer-form .qc-address{grid-column:1 / -1}
.quick-customer-form .qc-branch{grid-column:span 2}
.quick-customer-footer{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:16px;padding:12px 0 4px;border-top:1px solid var(--line);background:transparent}
.quick-customer-footer .btn{min-height:34px;height:34px;padding:6px 14px;font-size:13px;border-radius:9px}
.quick-customer-footer #qc_save_order{min-width:154px}
.quick-customer-footer #qc_save{order:10}
.quick-customer-footer #qc_save_order{order:15}
.quick-customer-footer .btn:not(.primary):not(#qc_save){order:20}
html[data-theme="dark"] .quick-customer-paste{background:color-mix(in srgb,var(--accent) 5%,var(--surface))}
@media(max-width:760px){.quick-customer-modal{padding:22px 16px 16px}.quick-customer-paste{grid-template-columns:1fr}.quick-customer-paste .btn{width:100%}.quick-customer-form{grid-template-columns:1fr 1fr}.quick-customer-form .qc-name,.quick-customer-form .qc-branch{grid-column:1 / -1}.quick-customer-form .qc-address{grid-column:1 / -1}.quick-customer-footer{flex-wrap:wrap;justify-content:flex-end}.quick-customer-footer .btn{flex:0 0 auto}}
@media(max-width:520px){.quick-customer-form{grid-template-columns:1fr}.quick-customer-form>*{grid-column:1!important}.quick-customer-footer{justify-content:flex-end;flex-direction:row;flex-wrap:wrap}.quick-customer-footer .btn{width:auto;flex:0 0 auto;min-height:44px}}


/* V6.5.14 Quick Customer parser + rounded scroll fix */
.modal-card.quick-customer-card{overflow:hidden!important;border-radius:24px!important;max-height:none!important;padding:0!important}
.quick-customer-card .quick-customer-modal{display:flex;flex-direction:column;max-height:none;overflow:hidden;padding:0;box-sizing:border-box;border-radius:inherit}
.quick-customer-header{flex:0 0 auto;position:sticky;top:0;z-index:3;background:var(--surface);padding:12px 24px 8px;margin-bottom:0!important;border-bottom:1px solid var(--line)}
.quick-customer-scroll{flex:0 0 auto;overflow:visible;overflow-x:hidden;padding:10px 24px 14px;scrollbar-width:none;-ms-overflow-style:none}
.quick-customer-scroll::-webkit-scrollbar{display:none;width:0;height:0}
#modal>.modal-card.quick-customer-card{overflow:hidden!important;scrollbar-gutter:auto!important;max-height:96vh!important}
#modal>.modal-card.quick-customer-card>#modalBody{overflow:visible!important;max-height:none!important;margin:0!important;padding:0!important}
@media(max-width:760px){.quick-customer-header{padding:10px 16px 6px}.quick-customer-scroll{padding:8px 16px 12px;overflow-y:auto;overflow-x:hidden;flex:1 1 auto;min-height:0;max-height:none}}

/* V6.5.15 — Structured Vietnamese address */
.quick-customer-form .qc-address-detail{grid-column:1 / -1}
.quick-customer-address-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:13px 14px;grid-column:1 / -1}
.quick-customer-address-grid label{margin:0}
.quick-customer-address-grid input{width:100%;height:46px;margin-top:6px}
.quick-customer-address-note{grid-column:1 / -1;font-size:11px;color:var(--muted);margin-top:-2px}
@media(max-width:760px){.quick-customer-address-grid{grid-template-columns:1fr 1fr}.quick-customer-address-grid .qc-address-detail{grid-column:1 / -1}}
@media(max-width:520px){.quick-customer-address-grid{grid-template-columns:1fr}.quick-customer-address-grid>*{grid-column:1!important}}


/* V6.5.16 — address combo + CCCD scanner */
.quick-customer-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;align-items:stretch}
.quick-customer-actions .btn{height:34px;white-space:nowrap;padding:0 10px;min-width:0;width:100%;font-size:12px;line-height:1.2}
#qc_upload_docs{grid-column:1/-1;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.quick-customer-form .qc-company{grid-column:1 / 2}
.admin-combo{position:relative;margin-top:6px}
.admin-combo input{margin-top:0!important;padding-right:42px}
.admin-combo-toggle{position:absolute;right:5px;top:5px;width:36px;height:36px;border:0;border-left:1px solid var(--line);background:transparent;color:var(--muted);font-size:17px;cursor:pointer;border-radius:0 9px 9px 0}
.admin-combo-toggle:hover{color:var(--text);background:color-mix(in srgb,var(--accent) 6%,transparent)}
.admin-combo-menu{position:absolute;z-index:235;left:0;right:0;top:50px;max-height:250px;overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 45px rgba(5,24,45,.18);padding:5px}
.admin-combo-menu.hidden{display:none}
.admin-combo-item{display:block;width:100%;border:0;background:transparent;color:var(--text);text-align:left;padding:9px 10px;border-radius:8px;cursor:pointer;font-size:12.5px}
.admin-combo-item:hover,.admin-combo-item:focus{background:color-mix(in srgb,var(--accent) 8%,var(--card));outline:none}
.admin-combo-empty{padding:11px;color:var(--muted);font-size:12px}
.cccd-scanner-overlay{position:fixed;inset:0;z-index:40000!important;background:rgba(4,19,35,.68);backdrop-filter:blur(4px);display:grid;place-items:center;padding:16px}
.cccd-scanner-card{width:min(620px,100%);max-height:92vh;overflow:auto;background:var(--card);color:var(--text);border:1px solid var(--line);border-radius:20px;box-shadow:0 32px 100px rgba(0,0,0,.4);padding:20px}
.cccd-scanner-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}
.cccd-scanner-head h3{margin:0;font-size:20px}.cccd-scanner-head p{margin:4px 0 0;color:var(--muted);font-size:12px}
.cccd-video-wrap{border:1px solid var(--line);border-radius:15px;background:#081627;min-height:210px;display:grid;place-items:center;overflow:hidden;position:relative}
.cccd-video-wrap video{width:100%;height:100%;object-fit:cover;display:none}.cccd-video-wrap{aspect-ratio:1/1;max-height:46vh;min-height:0}
.cccd-camera-hint{padding:24px;text-align:center;color:#dbe7f3;font-size:12px;line-height:1.55}
.cccd-scanner-actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.cccd-scanner-actions .btn{flex:1 1 130px}
.cccd-manual{margin-top:12px}.cccd-manual textarea{width:100%;min-height:80px;margin-top:6px}
.cccd-status{min-height:20px;margin-top:9px;color:var(--muted);font-size:12px}.cccd-frame{position:absolute;top:19%;left:19%;width:62%;height:62%;border:2px solid rgba(24,164,216,.95);border-radius:12px;box-shadow:0 0 0 100vmax rgba(4,19,35,.34);pointer-events:none}.cccd-cam-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:10px}.cccd-cam-tools .cccd-zoom{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);flex:1;min-width:160px}.cccd-cam-tools .cccd-zoom input{flex:1}
.cccd-status.ok{color:var(--success,#168458)}.cccd-status.bad{color:var(--danger,#c73b3b)}
.qc-card-cam-card{width:min(520px,100%);max-width:520px}
.qc-card-cam-wrap{position:relative;width:100%;aspect-ratio:3/4;max-height:min(62vh,560px);border:1px solid var(--line);border-radius:15px;background:#081627;overflow:hidden}
.qc-card-cam-wrap video{width:100%;height:100%;object-fit:cover;display:block;background:#000}
.qc-card-guide{position:absolute;left:7%;right:7%;top:50%;transform:translateY(-50%);aspect-ratio:1.586;border:2.5px solid rgba(24,164,216,.98);border-radius:12px;box-shadow:0 0 0 100vmax rgba(4,19,35,.48);pointer-events:none}
.qc-card-guide::after{content:'Can CCCD v?a khung';position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);white-space:nowrap;font-size:11px;font-weight:700;color:#fff;background:rgba(4,19,35,.72);padding:4px 10px;border-radius:999px}
@media(max-width:760px){.qc-card-cam-wrap{max-height:min(58dvh,520px)}.qc-card-guide{left:5%;right:5%}}
@media(max-width:760px){.quick-customer-actions{width:100%}.quick-customer-actions .btn{flex:1}.cccd-scanner-card{padding:16px}.admin-combo-menu{max-height:210px}}


/* V6.5.18 — VinFast-style address lookup */
.quick-customer-form.v518{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:10px 12px}
.quick-customer-form.v518>label{min-width:0}
.quick-customer-form.v518 .qc-name{grid-column:span 3}.quick-customer-form.v518 .qc-type{grid-column:span 2}.quick-customer-form.v518 .qc-phone{grid-column:span 3}.quick-customer-form.v518 .qc-email{grid-column:span 4}
.quick-customer-form.v518>label.qc-type-hidden{display:none!important}
.quick-customer-form.v518 .qc-identity{grid-column:span 4}.quick-customer-form.v518 .qc-identity-old{grid-column:span 4}.quick-customer-form.v518 .qc-gender{grid-column:span 4}.quick-customer-form.v518 .qc-birth{grid-column:span 6}.quick-customer-form.v518 .qc-issue{grid-column:span 6}
.quick-customer-form.v518 .qc-company{grid-column:1/-1}.quick-customer-form.v518 .qc-tax,.quick-customer-form.v518 .qc-founded{grid-column:span 6}
.quick-customer-form.v518 .qc-address-line,.quick-customer-form.v518 .qc-address-detail{grid-column:1/-1}
.quick-customer-form.v518 .qc-ward-field,.quick-customer-form.v518 .qc-province-field{grid-column:span 6}
.quick-customer-form.v518 .qc-branch{grid-column:span 8}.quick-customer-form.v518 .qc-source{grid-column:span 4}
.quick-customer-form.v518 input,.quick-customer-form.v518 select{height:40px;margin-top:4px}
.date-vn{position:relative;display:block;width:100%;margin-top:6px}
label>.date-vn{margin-top:0}
.date-vn .date-vn-text{width:100%;padding-right:40px!important;box-sizing:border-box}
.date-vn .date-vn-native{position:absolute;left:0;bottom:0;width:1px;height:1px;opacity:0;pointer-events:none;border:0;padding:0;margin:0}
.date-vn .date-vn-pick{position:absolute;right:2px;top:50%;transform:translateY(-50%);width:34px;height:34px;border:0;border-radius:8px;cursor:pointer;background:transparent center/18px 18px no-repeat;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M8 3v4M16 3v4M3 11h18'/%3E%3C/svg%3E")}
.date-vn .date-vn-pick:hover{background-color:rgba(0,0,0,.06)}
.quick-customer-form.v518 .date-vn{margin-top:0}
.quick-customer-form.v518 .date-vn .date-vn-text{height:40px}
.quick-customer-form.v518 .date-vn .date-vn-pick{width:34px;height:34px;right:3px}
#modal>.modal-card:has(.customer-form-head) .date-vn .date-vn-text{min-height:34px!important;height:34px;padding:6px 36px 6px 9px!important}
#modal>.modal-card:has(.customer-form-head) .date-vn .date-vn-pick{width:30px;height:30px}
.admin-search{
  position:relative;margin-top:4px;display:flex;align-items:stretch;
  border:1px solid var(--line);border-radius:10px;background:var(--card);
  overflow:visible;min-height:40px;box-sizing:border-box
}
.admin-search input{
  margin-top:0!important;padding-right:12px!important;flex:1 1 auto;min-width:0;
  height:40px!important;min-height:40px!important;border:0!important;border-radius:0!important;
  box-shadow:none!important;background:transparent!important;outline:none
}
.admin-search input:focus{box-shadow:none!important;border:0!important}
.admin-search:focus-within{border-color:#4abfe9;box-shadow:0 0 0 3px rgba(18,169,223,.12)}
.admin-search-button{
  position:static;flex:0 0 40px;width:40px;height:40px;min-width:40px;min-height:40px;
  border:0;border-left:1px solid var(--line);border-radius:0;background:transparent;color:var(--muted);
  display:grid;place-items:center;cursor:pointer;padding:0;margin:0
}
.admin-search-button:hover{color:var(--accent);background:color-mix(in srgb,var(--accent) 6%,transparent)}
.admin-search-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.admin-search-menu{position:absolute;z-index:238;left:0;right:0;top:calc(100% + 4px);max-height:270px;overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:13px;box-shadow:0 20px 48px rgba(5,24,45,.19);padding:5px}
.admin-search-menu.hidden{display:none}.admin-search-item{width:100%;border:0;background:transparent;color:var(--text);text-align:left;padding:9px 11px;border-radius:9px;cursor:pointer;display:flex;flex-direction:column;gap:2px}
.admin-search-item:hover,.admin-search-item:focus{background:color-mix(in srgb,var(--accent) 8%,var(--card));outline:none}.admin-search-item span{font-size:12.5px;font-weight:650}.admin-search-item small{font-size:10.5px;color:var(--muted);font-weight:500}
.admin-search-empty{padding:12px;color:var(--muted);font-size:11.5px}.qc-admin-status{grid-column:1/-1;min-height:0;margin-top:-5px;color:var(--muted);font-size:11px}.qc-admin-status:empty{display:none}.qc-admin-status.ok{color:var(--success,#168458)}
@media(max-width:760px){.quick-customer-form.v518 .qc-name,.quick-customer-form.v518 .qc-phone,.quick-customer-form.v518 .qc-email,.quick-customer-form.v518 .qc-identity,.quick-customer-form.v518 .qc-company,.quick-customer-form.v518 .qc-tax,.quick-customer-form.v518 .qc-ward-field,.quick-customer-form.v518 .qc-province-field,.quick-customer-form.v518 .qc-branch,.quick-customer-form.v518 .qc-source{grid-column:1/-1}.quick-customer-form.v518 .qc-identity-old,.quick-customer-form.v518 .qc-gender,.quick-customer-form.v518 .qc-birth,.quick-customer-form.v518 .qc-issue,.quick-customer-form.v518 .qc-address-detail{grid-column:1/-1}}


.po-lines-wrap{overflow:auto;border:1px solid var(--line);border-radius:12px;background:#fff;margin:0 20px 0;min-height:0}
.po-lines-table{width:100%;border-collapse:separate;border-spacing:0;min-width:820px;table-layout:fixed}
.po-lines-table thead th{
  position:sticky;top:0;z-index:2;
  background:#fff!important;color:#556174;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;
  padding:8px 8px;border-bottom:1px solid var(--line);text-align:left
}
.po-lines-table tbody tr.po-line,
.po-lines-table tbody tr.line-item{
  display:table-row!important;grid-template-columns:none!important;gap:0!important;margin:0!important;background:transparent!important
}
.po-lines-table td{padding:6px 8px;border-bottom:1px solid #edf1f5;vertical-align:middle}
.po-lines-table .col-ma{width:170px}.po-lines-table .col-sp{width:auto}.po-lines-table .col-qty{width:92px}.po-lines-table .col-gia{width:132px}.po-lines-table .col-x{width:44px}
.po-lines-table .poi_code{
  width:100%;min-width:0;min-height:36px;height:36px;padding:6px 8px;font-size:12px;border-radius:8px;box-sizing:border-box;
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-weight:650;color:#1f3b5c;
  letter-spacing:-.01em
}
.po-lines-table select.poi_product{
  width:100%;min-width:0;min-height:36px;height:36px;padding:6px 8px;font-size:13px;border-radius:8px;box-sizing:border-box
}
.po-lines-table .poi_qty,.po-lines-table .poi_price{
  width:100%;min-width:0;min-height:36px;height:36px;padding:6px 8px;font-size:13px;border-radius:8px;box-sizing:border-box
}
.po-lines-table .poi_price{font-variant-numeric:tabular-nums;padding-right:6px}
.po-lines-table .poi_del{min-width:34px;height:34px;padding:0 8px}
#modal>.modal-card:has(.po-form-head){
  padding:0!important;overflow:hidden!important;display:flex!important;flex-direction:column!important;
  width:min(1040px,96vw)!important;max-width:96vw!important;
  max-height:min(94vh,94dvh)!important;
}
#modal>.modal-card:has(.po-form-head)>#modalBody{
  width:100%!important;max-height:none!important;overflow:hidden!important;
  margin:0!important;padding:0!important;box-sizing:border-box!important;
  display:flex!important;flex-direction:column!important;flex:1 1 auto!important;min-height:0!important;
}
#modal>.modal-card:has(.po-form-head) .po-form-modal{
  display:flex;flex-direction:column;min-height:0;flex:1 1 auto;max-height:min(94vh,94dvh);overflow:hidden;
}
#modal>.modal-card:has(.po-form-head) .po-form-head{
  flex:0 0 auto;margin:0!important;padding:14px 20px 12px!important;
  background:var(--surface,var(--card,#fff))!important;
  border-bottom:1px solid var(--line)!important;
}
#modal>.modal-card:has(.po-form-head) .po-form-head h2{
  margin:0!important;font-size:20px!important;line-height:1.25!important;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#modal>.modal-card:has(.po-form-head) .po-form-meta{
  flex:0 0 auto;padding:12px 20px 8px;box-sizing:border-box;
  background:var(--surface,var(--card,#fff));
}
#modal>.modal-card:has(.po-form-head) .po-form-meta .section-title{margin:10px 0 8px}
#modal>.modal-card:has(.po-form-head) .po-lines-wrap{
  flex:1 1 auto;min-height:140px;overflow:auto;-webkit-overflow-scrolling:touch;
  margin:0 20px 4px;scrollbar-gutter:stable;
}
#modal>.modal-card:has(.po-form-head) #po_note{min-height:48px!important;max-height:64px!important;resize:vertical}
#modal>.modal-card:has(.po-form-head) .date-vn{display:block;width:100%}
#modal>.modal-card:has(.po-form-head) .date-vn .date-vn-text{
  min-height:36px!important;height:36px;padding:6px 40px 6px 9px!important;box-sizing:border-box
}
#modal>.modal-card:has(.po-form-head) .date-vn .date-vn-pick{width:32px;height:32px}
#modal>.modal-card:has(.po-form-head) .po-form-footer{
  flex:0 0 auto;position:static!important;margin:0!important;padding:10px 20px!important;
  border-top:1px solid var(--line);background:var(--surface,var(--card,#fff));
  box-shadow:none;gap:8px;display:flex;align-items:center;justify-content:flex-end;
}
#modal>.modal-card:has(.po-form-head) .po-form-footer .btn{
  min-height:34px!important;height:34px!important;padding:6px 14px!important;
  font-size:13px!important;line-height:1.2!important;border-radius:9px!important;
}
@media(max-width:640px){
  #modal>.modal-card:has(.po-form-head){width:100%!important;max-width:none!important;max-height:none!important;border-radius:0!important}
  #modal>.modal-card:has(.po-form-head) .po-form-head{padding:12px 14px 10px!important;padding-top:calc(12px + env(safe-area-inset-top,0px))!important}
  #modal>.modal-card:has(.po-form-head) .po-form-head h2{font-size:18px!important;white-space:normal!important}
  #modal>.modal-card:has(.po-form-head) .po-form-meta{padding:10px 14px 6px}
  #modal>.modal-card:has(.po-form-head) .po-lines-wrap{margin:0 14px 4px}
  #modal>.modal-card:has(.po-form-head) .po-form-footer{padding:8px 14px!important}
  .po-lines-table .col-ma{width:132px}
}

/* ==== v643-clean-ui ==== */
/* V6.4.5 Clean UI — remove decorative helper copy, retain operational warnings/validation */
#pageGroup,#pageSub{display:none!important}
.title-wrap{min-width:190px;flex:0 1 auto;max-width:none;display:flex;align-items:center}
.title-wrap #pageTitle{white-space:nowrap}
.topbar{min-height:64px;padding-top:8px;padding-bottom:8px}
.topbar h2{margin:0!important;font-size:22px;line-height:1.15}

/* Generic card/section helper subtitles that repeat the heading */
.panel-head p,
.smart-head p.muted,
.work-hero>div>p,
.work-section-head p,
.command-hero>div>p,
.vin-command-hero>div>p{display:none!important}

/* Decorative eyebrow/kicker labels inside overview heroes */
.command-hero .hero-kicker,
.vin-command-hero .hero-kicker,
.work-hero .eyebrow{display:none!important}

/* Tighten spacing after helper copy is removed */
.panel-head h3{margin-bottom:0!important}
.smart-head h2{margin-bottom:0!important}
.work-hero h1{margin:0!important}
.work-section-head h3{margin-bottom:0!important}
.command-hero h1,.vin-command-hero h1{margin-top:0!important;margin-bottom:0!important}

/* Keep critical operational copy visible */
.security-note,.alert,.warning,.error,.danger-text,.validation-message,
.order-discount-box .muted.small,.line-program-title small,
.payment-order-info,.vin-alert-strip{display:revert!important}
.payment-order-info.hidden{display:none!important}

@media(max-width:920px){.title-wrap{flex:1 1 auto;min-width:0}.topbar{min-height:58px}}

/* ==== v6522-mobile-quick-customer-fix ==== */
/* LOCKED 2026-09-03 — mobile quick customer; do not edit unless user unlocks */
@media(max-width:760px){
  .modal{place-items:stretch center!important;padding:0!important;align-items:stretch!important}
  #modal.modal:not(.hidden){place-items:stretch center!important;padding:0!important}
  .modal-card.quick-customer-card,
  #modal>.modal-card.quick-customer-card,
  #modal>.modal-card:has(.quick-customer-modal){
    width:100vw!important;max-width:100vw!important;
    height:100dvh!important;max-height:100dvh!important;
    margin:0!important;border-radius:0!important;
    display:flex!important;flex-direction:column!important;
    overflow:hidden!important
  }
  .quick-customer-card .quick-customer-modal,
  #modal>.modal-card:has(.quick-customer-modal) .quick-customer-modal{
    display:flex!important;flex-direction:column!important;
    flex:1 1 auto!important;min-height:0!important;height:100%!important;
    max-height:100%!important;padding:0!important;overflow:hidden!important
  }
  .quick-customer-header{
    flex:0 0 auto!important;
    padding:12px 14px 8px!important;
    padding-top:max(12px,env(safe-area-inset-top,0px))!important
  }
  .quick-customer-scroll{
    flex:1 1 auto!important;min-height:0!important;
    overflow-y:auto!important;overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    padding:8px 14px 0!important;
    max-height:none!important;
    overscroll-behavior-y:contain!important;
    scrollbar-width:none!important;-ms-overflow-style:none!important
  }
  .quick-customer-scroll::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}
  .quick-customer-header h2{font-size:22px!important;line-height:1.12!important}
  .quick-customer-header p{font-size:12px!important;line-height:1.35!important}
  .quick-customer-paste{
    display:block!important;width:100%!important;padding:12px!important;box-sizing:border-box!important;
    position:relative!important;z-index:5!important;
    background:color-mix(in srgb,var(--accent) 3%,var(--surface))!important;
    margin-bottom:12px!important
  }
  .quick-customer-paste label,.quick-customer-paste textarea{display:block!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important}
  .quick-customer-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;gap:6px!important;margin-top:8px!important;position:relative!important;z-index:5!important}
  .quick-customer-actions .btn{width:100%!important;min-width:0!important;min-height:36px!important;height:auto!important;white-space:normal!important;padding:8px 8px!important;font-size:12px!important;line-height:1.25!important}
  #qc_upload_docs{grid-column:1/-1!important}
  .quick-customer-form.v518{
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important;max-width:100%!important;gap:13px!important;
    position:relative!important;z-index:1!important
  }
  .quick-customer-form.v518>*{grid-column:1/-1!important;min-width:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important}
  .quick-customer-form.v518>label{display:block!important}
  .quick-customer-form.v518>label.qc-type-hidden{display:none!important}
  .quick-customer-form.v518 input,.quick-customer-form.v518 select,.quick-customer-form.v518 textarea{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
  .quick-customer-form.v518 .admin-search{display:flex!important;width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
  .quick-customer-form.v518 .admin-search input{display:block!important;width:auto!important;flex:1 1 auto!important}
  /* Nút cuối nội dung cuộn — không chừa khoảng trống phía dưới */
  .quick-customer-footer{
    display:flex!important;
    flex-wrap:wrap!important;
    justify-content:flex-end!important;
    align-items:center!important;
    gap:8px!important;
    margin:16px 0 0!important;
    padding:12px 0 max(10px,env(safe-area-inset-bottom,0px))!important;
    border-top:1px solid var(--line)!important;
    background:transparent!important;
    box-shadow:none!important;
    position:static!important
  }
  .quick-customer-footer .btn,.quick-customer-footer #qc_save_order{
    width:auto!important;min-width:0!important;flex:0 0 auto!important;min-height:44px!important
  }
  .quick-customer-footer>#qc_save{order:10!important}
  .quick-customer-footer>#qc_save_order{order:15!important}
  .quick-customer-footer>.btn:not(.primary):not(#qc_save){order:20!important}
  .quick-customer-modal > .ios-form-end-spacer,
  .quick-customer-scroll > .ios-form-end-spacer{display:none!important;height:0!important;min-height:0!important;max-height:0!important}
  .cccd-scanner-overlay{
    place-items:start center!important;padding:8px!important;
    padding-top:max(8px,env(safe-area-inset-top))!important;
    padding-bottom:max(8px,env(safe-area-inset-bottom))!important;
    z-index:40000!important;pointer-events:auto!important
  }
  .cccd-scanner-card{width:100%!important;max-width:100%!important;max-height:calc(100vh - 16px)!important;max-height:calc(100dvh - 16px)!important;padding:16px 14px calc(16px + env(safe-area-inset-bottom))!important;border-radius:18px!important;box-sizing:border-box!important}
  .cccd-scanner-card.qc-id-photos-panel{
    width:min(360px,calc(100vw - 32px))!important;
    max-width:min(360px,calc(100vw - 32px))!important;
    max-height:none!important;
    padding:12px!important;
    border-radius:16px!important;
    align-self:center!important;
    margin-top:12vh!important
  }
  .qc-photo-overlay{place-items:center!important;padding:16px!important}
  .cccd-video-wrap{min-height:190px!important}
  .cccd-scanner-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cccd-scanner-actions.v6524{grid-template-columns:1fr!important}
  .cccd-scanner-actions .btn{width:100%!important;min-width:0!important;white-space:normal!important;padding:10px 8px!important}
  .cccd-manual,.cccd-manual textarea{width:100%!important;max-width:100%!important;box-sizing:border-box!important}
}
@media(max-width:390px){
  .quick-customer-actions,.cccd-scanner-actions{grid-template-columns:1fr!important}
  .quick-customer-header h2{font-size:24px!important}
}

/* ==== block ==== */
/* Modal cố định viewport — khóa cuộn trang nền; chỉ cuộn trong thẻ form.
   Quan trọng: không dùng display:!important khi có .hidden (sẽ đè mất display:none). */
html.modal-open,html.modal-open body{overflow:hidden!important;overscroll-behavior:none!important}
body.modal-open{position:fixed!important;left:0;right:0;width:100%;overflow:hidden!important}
body.modal-open .app{overflow:hidden!important;overscroll-behavior:none!important}
html.drawer-open,html.drawer-open body{overflow:hidden!important;overscroll-behavior:none!important}
body.drawer-open{position:fixed!important;left:0;right:0;width:100%;overflow:hidden!important}
body.drawer-open .app{overflow:hidden!important;overscroll-behavior:none!important;pointer-events:none}
body.drawer-open #drawer,body.drawer-open #drawerBackdrop{pointer-events:auto}
#modal.modal:not(.hidden){position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;height:100dvh!important;max-height:100dvh!important;overflow:hidden!important;overscroll-behavior:none!important;z-index:220!important;display:grid!important;place-items:center;padding:14px;box-sizing:border-box;touch-action:none}
#modal.modal.hidden{display:none!important}
#modal.modal .modal-card{touch-action:pan-y;overscroll-behavior:contain;max-height:min(94vh,94dvh)!important}
#modal.modal #modalBody{touch-action:pan-y;overscroll-behavior:contain}

/* ==== block ==== */
.order-meta-grid>label{display:flex!important;flex-direction:column!important;gap:5px!important;min-width:0}
.order-meta-grid .order-meta-full{grid-column:1/-1!important;width:100%!important}
.order-meta-grid .order-meta-full input:not([type="checkbox"]),.order-meta-grid .order-meta-full textarea{width:100%!important;box-sizing:border-box!important}
.order-meta-grid .order-addr-block{grid-column:1/-1!important;width:100%!important;display:flex!important;flex-direction:column!important;gap:6px!important}
.order-meta-grid .order-addr-head{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;width:100%!important}
.order-meta-grid .order-addr-perm-check{display:inline-flex!important;flex-direction:row!important;align-items:center!important;gap:8px!important;white-space:nowrap!important;flex:0 0 auto!important;margin:0!important;width:auto!important;max-width:none!important}
.order-meta-grid .order-addr-block>#o_addr{width:100%!important;box-sizing:border-box!important}
.order-meta-grid .order-addr-perm-check input[type="checkbox"],
.order-meta-grid .order-addr-block input[type="checkbox"]{width:16px!important;height:16px!important;max-width:16px!important;flex:0 0 16px!important;margin:0!important}
.order-meta-grid #o_note{min-height:52px!important;max-height:88px!important;resize:vertical!important}
.modal{overscroll-behavior:contain!important}.modal-card{overscroll-behavior:contain!important}

/* ==== block ==== */
html,body{overflow-x:hidden}
.order-create-head{justify-content:flex-start!important;text-align:left!important;padding:18px 20px!important}
.order-create-head h2{white-space:normal;overflow-wrap:anywhere;text-align:left!important}
.order-create-head ~ .section-title{text-align:left!important;margin-left:12px!important}
.risk-preview{font-size:12px!important;line-height:1.35!important;white-space:normal!important;overflow-wrap:anywhere!important}
.modal>.modal-card{max-height:min(94vh,94dvh)!important;box-sizing:border-box!important}
#modal>.modal-card{border-radius:22px!important}
#modal>.modal-card>#modalBody{width:100%!important;max-height:none!important;overflow:visible!important;margin:0!important;padding:0!important;box-sizing:border-box!important}
#modal>.modal-card.modal-standard-card{padding:20px 22px 22px!important;overflow-y:auto!important;overflow-x:hidden!important;scrollbar-gutter:stable!important}
#modal>.modal-card>.modal-x{right:16px!important;top:12px!important;z-index:4}
#modal>.modal-card::-webkit-scrollbar{width:10px}
#modal>.modal-card::-webkit-scrollbar-track{margin:18px 0}
#modal>.modal-card::-webkit-scrollbar-button{display:none;width:0;height:0}
#modal>.modal-card:has(.order-create-head){padding:20px!important}
/* ✕ đóng: float + sticky ở góc phải — tiêu đề form tự chừa chỗ, không đè nút trên head */
#modal>.modal-card>.modal-x:not(#_){
  display:grid!important;place-items:center;position:sticky!important;top:14px!important;right:auto!important;
  float:right;margin:calc(14px - var(--mx-pt,20px)) calc(14px - var(--mx-pr,22px)) 0 10px;width:34px;height:34px;padding:0 0 2px;border-radius:50%;
  background:color-mix(in srgb,var(--muted,#64748b) 9%,var(--card,#fff));box-shadow:none;
  color:color-mix(in srgb,var(--muted,#64748b) 80%,transparent)!important;font-size:21px;line-height:1;z-index:40;cursor:pointer;
  transition:background .15s,color .15s
}
#modal>.modal-card>.modal-x:not(#_):hover{color:var(--text,#132033)!important;background:color-mix(in srgb,var(--muted,#64748b) 18%,var(--card,#fff))}
#modal>.modal-card.modal-x-abs>.modal-x:not(#_){
  position:absolute!important;float:none;margin:0;
  top:calc(env(safe-area-inset-top,0px) + 14px)!important;right:calc(env(safe-area-inset-right,0px) + 14px - var(--mx-sb,0px))!important
}
#modal>.modal-card.modal-x-abs>#modalBody>:is([class*="-head"],[class*="-header"]),
#modal>.modal-card.modal-x-abs>#modalBody>*>:is([class*="-head"],[class*="-header"]):first-child{padding-right:60px!important}
#modal>.modal-card.modal-x-abs:has(.order-create-head)>.modal-x:not(#_){top:calc(env(safe-area-inset-top,0px) + 18px)!important}
@media(pointer:coarse){#modal>.modal-card>.modal-x:not(#_){width:44px;height:44px;font-size:26px}}
@media(pointer:coarse){#modal>.modal-card.modal-x-abs>#modalBody>:is([class*="-head"],[class*="-header"]),#modal>.modal-card.modal-x-abs>#modalBody>*>:is([class*="-head"],[class*="-header"]):first-child{padding-right:70px!important}}
#modal>.modal-card,#modal>.modal-card>#modalBody{scrollbar-width:none!important}
#modal>.modal-card::-webkit-scrollbar,#modal>.modal-card>#modalBody::-webkit-scrollbar{display:none!important}
.quick-customer-footer>.btn:first-child{order:10!important;margin:0!important}
.quick-customer-footer>#qc_save{order:10!important}
.quick-customer-footer>#qc_save_order{order:15!important}
.quick-customer-footer>.btn:not(.primary):not(#qc_save){order:20!important}
.quick-customer-form .qc-branch{display:none!important}
/* Đơn hàng (PC): giới hạn chiều cao + cuộn trong body + footer luôn thấy
   LOCKED 2026-09-03 — không sửa block :has(.order-create-head) trừ khi user mở khóa */
#modal>.modal-card:has(.order-create-head){
  padding:0!important;overflow:hidden!important;
  display:flex!important;flex-direction:column!important;
  width:min(980px,calc(100vw - 28px))!important;
  max-height:min(92vh,92dvh)!important;
}
#modal>.modal-card:has(.order-create-head)>#modalBody{
  width:100%!important;flex:1 1 auto!important;min-height:0!important;
  max-height:none!important;height:auto!important;
  overflow-y:auto!important;overflow-x:hidden!important;
  margin:0!important;padding:0 20px 0!important;
  box-sizing:border-box!important;scrollbar-gutter:auto!important;
  scrollbar-width:none!important;-ms-overflow-style:none!important;
  -webkit-overflow-scrolling:touch!important;touch-action:pan-y!important
}
#modal>.modal-card:has(.order-create-head) .order-create-head{
  position:sticky!important;top:0!important;z-index:12!important;
  display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;
  margin:0 -20px 10px!important;padding:18px 20px 12px!important;
  background:var(--surface,var(--card,#fff))!important;
  border-bottom:1px solid var(--line)!important;
  box-shadow:0 8px 18px -14px rgba(15,23,42,.35);
  border-radius:22px 22px 0 0!important;
}
#modal>.modal-card:has(.order-create-head) .order-create-head h2{margin:0!important;font-size:20px!important}
/* Ẩn scrollbar hệ thống (có mũi tên) — dùng rail mỏng tùy chỉnh */
#modal>.modal-card:has(.order-create-head)>#modalBody::-webkit-scrollbar,
#modal>.modal-card:has(.order-create-head)>#modalBody::-webkit-scrollbar-button,
#modal>.modal-card:has(.order-create-head)>#modalBody::-webkit-scrollbar-track,
#modal>.modal-card:has(.order-create-head)>#modalBody::-webkit-scrollbar-thumb{
  display:none!important;width:0!important;height:0!important;background:transparent!important
}
#modal.modal:not(.hidden):has(.order-create-head){
  padding:22px 14px!important;place-items:center!important
}
#modal>.modal-card:has(.order-create-head)>.order-scroll-rail,
.order-scroll-rail{
  position:absolute!important;z-index:15!important;right:6px!important;
  top:56px!important;bottom:56px!important;width:3px!important;pointer-events:none!important
}
#modal>.modal-card:has(.order-create-head) .order-scroll-thumb,
.order-scroll-thumb{
  position:absolute!important;left:0!important;top:0!important;
  width:3px!important;min-height:36px!important;border-radius:999px!important;
  background:rgba(90,105,125,.45)!important;opacity:0;transition:opacity .15s
}
#modal>.modal-card:has(.order-create-head) .order-scroll-rail.is-scrollable .order-scroll-thumb,
.order-scroll-rail.is-scrollable .order-scroll-thumb{opacity:1!important}
#modal>.modal-card:has(.order-create-head) .order-meta-grid textarea,
#modal>.modal-card:has(.order-create-head) #o_note{
  min-height:52px!important;max-height:88px!important;height:56px!important;resize:vertical!important
}
#modal>.modal-card:has(.order-create-head) .order-form-actions{
  position:static!important;bottom:auto!important;z-index:auto!important;
  display:flex!important;justify-content:flex-end!important;align-items:center!important;flex-wrap:nowrap!important;gap:8px!important;
  margin:16px 0 0!important;padding:12px 0 16px!important;
  background:transparent!important;
  border-top:1px solid var(--line)!important;
  box-shadow:none!important;
}
#modal>.modal-card:has(.order-create-head) .ios-form-end-spacer{display:none!important;height:0!important;min-height:0!important}
/* Xuất kho: ti—u d? c? d?nh (flex) + footer cu?i cu?n */
#modal>.modal-card:has(.issue-form-head){
  padding:0!important;overflow:hidden!important;scrollbar-gutter:auto!important;
  width:min(720px,calc(100vw - 28px))!important;
  max-height:min(92vh,92dvh)!important;
  display:flex!important;flex-direction:column!important;
}
#modal>.modal-card:has(.issue-form-head)>#modalBody{
  width:100%!important;flex:1 1 auto!important;min-height:0!important;
  max-height:none!important;overflow:hidden!important;
  margin:0!important;padding:0!important;box-sizing:border-box!important;
  display:flex!important;flex-direction:column!important;
}
#modal>.modal-card:has(.issue-form-head) .issue-form-modal{
  display:flex!important;flex-direction:column!important;
  flex:1 1 auto!important;min-height:0!important;height:100%!important;overflow:hidden!important
}
#modal>.modal-card:has(.issue-form-head) .issue-form-head{
  flex:0 0 auto!important;position:relative!important;top:auto!important;z-index:12!important;
  margin:0!important;padding:calc(14px + env(safe-area-inset-top,0px)) 20px 12px!important;
  background:var(--surface,var(--card,#fff))!important;
  border-bottom:1px solid var(--line)!important;
  box-shadow:0 8px 18px -14px rgba(15,23,42,.35);
}
#modal>.modal-card:has(.issue-form-head) .issue-form-head h2{margin:0!important;font-size:20px!important}
#modal>.modal-card:has(.issue-form-head) .issue-form-scroll{
  flex:1 1 auto!important;min-height:0!important;
  overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important;
  padding:12px 20px max(16px,env(safe-area-inset-bottom,0px))!important;box-sizing:border-box!important
}
#modal>.modal-card:has(.issue-form-head) #i_note{min-height:52px!important;max-height:72px!important;resize:vertical}
#modal>.modal-card:has(.issue-form-head) .issue-form-footer{
  position:static!important;z-index:auto!important;
  margin:16px 0 0!important;padding:12px 0 8px!important;
  background:transparent!important;
  border-top:1px solid var(--line)!important;
  box-shadow:none!important;
  justify-content:flex-end!important
}
#modal>.modal-card:has(.issue-form-head) .form-grid{
  grid-template-columns:1fr 1fr!important;
}
#modal>.modal-card:has(.issue-form-head) .form-grid .span2{grid-column:1/-1!important}
#modal>.modal-card:has(.issue-form-head) .issue-lines{max-height:min(36vh,280px)}
@media(max-width:760px){
  #modal.modal:not(.hidden):has(.issue-form-head){padding:0!important;place-items:stretch!important}
  #modal>.modal-card:has(.issue-form-head){
    width:100%!important;max-width:100%!important;
    height:100%!important;max-height:none!important;
    border-radius:0!important;
  }
  #modal>.modal-card:has(.issue-form-head)>#modalBody{
    padding:0!important;overflow:hidden!important;
    max-height:none!important;
    overscroll-behavior-y:contain!important
  }
  #modal>.modal-card:has(.issue-form-head) .issue-form-head{
    margin:0!important;
    padding:calc(12px + env(safe-area-inset-top,0px)) 14px 10px!important;
  }
  #modal>.modal-card:has(.issue-form-head) .issue-form-scroll{
    padding:10px 14px max(18px,env(safe-area-inset-bottom,0px))!important
  }
  #modal>.modal-card:has(.issue-form-head) .issue-form-footer{
    position:static!important;
    margin:16px 0 0!important;
    padding:12px 0 4px!important;
    box-shadow:none!important;background:transparent!important
  }
  #modal>.modal-card:has(.issue-form-head) .form-grid{grid-template-columns:1fr!important}
}


/* Nh?p kho: flex layout — footer g?n, mobile ok */
#modal>.modal-card:has(.receipt-form-head){
  padding:0!important;overflow:hidden!important;display:flex!important;flex-direction:column!important;
  width:min(1180px,96vw)!important;max-width:96vw!important;
  max-height:min(94vh,94dvh)!important;
}
#modal>.modal-card:has(.receipt-form-head)>#modalBody{
  width:100%!important;max-height:none!important;overflow:hidden!important;overflow-x:hidden!important;
  margin:0!important;padding:0!important;box-sizing:border-box!important;
  display:flex!important;flex-direction:column!important;flex:1 1 auto!important;min-height:0!important;
}
#modal>.modal-card:has(.receipt-form-head) .receipt-form-modal{
  display:flex;flex-direction:column;min-height:0;flex:1 1 auto;max-height:min(94vh,94dvh);
}
#modal>.modal-card:has(.receipt-form-head) .receipt-form-head{
  position:relative!important;top:auto!important;z-index:12!important;flex:0 0 auto;
  margin:0!important;padding:calc(14px + env(safe-area-inset-top,0px)) 20px 12px!important;
  background:var(--surface,var(--card,#fff))!important;
  border-bottom:1px solid var(--line)!important;
  box-shadow:0 8px 18px -14px rgba(15,23,42,.35);
}
#modal>.modal-card:has(.receipt-form-head) .receipt-form-head h2{margin:0!important;font-size:20px!important}
#modal>.modal-card:has(.receipt-form-head) .receipt-form-head p{margin:4px 0 0!important}
#modal>.modal-card:has(.receipt-form-head) .receipt-form-scroll{
  flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;
  padding:12px 20px max(16px,env(safe-area-inset-bottom,0px));box-sizing:border-box;
}
.receipt-bulk-bar{margin:8px 0 10px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}#rRemainHint{flex:1;min-width:180px}
.receipt-bulk-preview{margin:0 0 10px}
#modal>.modal-card:has(.receipt-form-head) #r_note{min-height:38px!important;max-height:52px!important;resize:vertical}
#modal>.modal-card:has(.receipt-form-head) .date-vn{display:block;width:100%}
#modal>.modal-card:has(.receipt-form-head) .date-vn .date-vn-text{
  min-height:36px!important;height:36px;padding:6px 40px 6px 9px!important;box-sizing:border-box
}
#modal>.modal-card:has(.receipt-form-head) .date-vn .date-vn-pick{width:32px;height:32px}
.receipt-line .btn.danger{margin-top:10px!important}
.receipt-bulk-card{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--card2,#f5f8fb);margin-bottom:8px}
.receipt-bulk-table-wrap{max-height:min(52vh,480px);overflow:auto;border:1px solid var(--line);border-radius:12px;background:#fff}
.receipt-meta-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important;margin-bottom:8px}
.receipt-vin-wrap{max-height:min(48vh,420px);overflow:auto;border:1px solid var(--line);border-radius:12px;background:#fff;margin-bottom:4px;scrollbar-gutter:auto!important}
.receipt-vin-table{width:100%;border-collapse:separate;border-spacing:0;min-width:1120px;table-layout:fixed}
.receipt-vin-table thead th{
  position:sticky;top:0;z-index:2;
  background:#fff!important;color:#556174!important;
  font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;
  padding:8px 6px;border-bottom:1px solid var(--line)!important;white-space:nowrap;
  box-shadow:none!important;
}
.receipt-vin-table td{padding:4px 5px;border-bottom:1px solid #edf1f5;vertical-align:middle;background:#fff}
.receipt-vin-table .col-stt{width:36px;text-align:center}
.receipt-vin-table .col-sp{width:22%}
.receipt-vin-table .col-vin{width:14%}
.receipt-vin-table .col-gia{width:110px}
.receipt-vin-table .col-ct{width:170px;min-width:170px}
.receipt-vin-table thead th.col-ct{white-space:normal;line-height:1.25;padding:6px 4px}
.receipt-vin-table .col-x{width:40px}
.receipt-vin-table select,.receipt-vin-table input{width:100%;min-width:0;min-height:34px;height:34px;padding:4px 7px;font-size:12px;border-radius:8px;box-sizing:border-box;background:#fff}
.receipt-vin-table .ri_del{min-width:32px;padding:0 8px;height:32px}
.receipt-vin-table tbody tr:hover td{background:#f8fbff}
#modal>.modal-card:has(.receipt-form-head) .receipt-form-footer{
  position:static!important;bottom:auto!important;flex:none!important;
  margin:16px 0 0!important;min-height:0!important;
  padding:12px 0 4px!important;
  border-top:1px solid var(--line)!important;
  box-shadow:none!important;
  background:transparent!important;
  display:flex!important;justify-content:flex-end!important;align-items:center!important;gap:8px!important;
}
#modal>.modal-card:has(.receipt-form-head) .receipt-form-footer .btn{min-height:34px!important;height:34px!important;padding:6px 14px!important;font-size:13px!important;border-radius:9px!important}
@media(max-width:900px){
  .receipt-meta-grid{grid-template-columns:1fr 1fr!important}
  #modal>.modal-card:has(.receipt-form-head){width:100%!important;max-width:none!important;max-height:none!important;height:100%!important;border-radius:0!important}
  #modal>.modal-card:has(.receipt-form-head) .receipt-form-modal{max-height:none;height:100%}
  #modal>.modal-card:has(.receipt-form-head) .receipt-form-head{padding:calc(12px + env(safe-area-inset-top,0px)) 14px 10px!important}
  #modal>.modal-card:has(.receipt-form-head) .receipt-form-head h2{font-size:18px!important}
  #modal>.modal-card:has(.receipt-form-head) .receipt-form-scroll{padding:10px 14px max(18px,env(safe-area-inset-bottom,0px))}
  .receipt-bulk-bar{gap:6px;margin:6px 0 8px}
  .receipt-bulk-bar .btn,#rBulkFile{flex:1 1 auto}
  #rRemainHint{flex:1 1 100%;min-width:0;order:9;font-size:11px;line-height:1.35}
  .receipt-vin-wrap{max-height:min(38vh,280px)}
  #modal>.modal-card:has(.receipt-form-head) .receipt-form-footer{
    padding:12px 0 4px!important;gap:6px!important;
  }
  #modal>.modal-card:has(.receipt-form-head) .receipt-form-footer .btn{flex:0 0 auto!important;min-height:34px!important;height:34px!important;width:auto!important;padding:6px 14px!important;font-size:13px!important;border-radius:9px!important}
}
@media(max-width:560px){
  .receipt-meta-grid{grid-template-columns:1fr!important;gap:8px!important}
}

/* —i?u chuy?n: ti—u d? c? d?nh + footer cu?i cu?n */
#modal>.modal-card:has(.transfer-form-head){
  padding:0!important;overflow:hidden!important;
  display:flex!important;flex-direction:column!important;
  width:min(720px,calc(100vw - 28px))!important;
  max-height:min(92vh,92dvh)!important
}
#modal>.modal-card:has(.transfer-form-head)>#modalBody{
  flex:1 1 auto!important;min-height:0!important;overflow:hidden!important;
  margin:0!important;padding:0!important;
  display:flex!important;flex-direction:column!important
}
#modal>.modal-card:has(.transfer-form-head) .transfer-form-modal{
  display:flex!important;flex-direction:column!important;
  flex:1 1 auto!important;min-height:0!important;height:100%!important;overflow:hidden!important
}
#modal>.modal-card:has(.transfer-form-head) .transfer-form-head{
  flex:0 0 auto!important;position:relative!important;
  margin:0!important;padding:calc(14px + env(safe-area-inset-top,0px)) 20px 12px!important;
  background:var(--surface,var(--card,#fff))!important;
  border-bottom:1px solid var(--line)!important;
  box-shadow:0 8px 18px -14px rgba(15,23,42,.35)
}
#modal>.modal-card:has(.transfer-form-head) .transfer-form-head h2{margin:0!important;font-size:20px!important}
#modal>.modal-card:has(.transfer-form-head) .transfer-form-scroll{
  flex:1 1 auto!important;min-height:0!important;
  overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important;
  padding:12px 20px max(16px,env(safe-area-inset-bottom,0px))!important;box-sizing:border-box!important
}
#modal>.modal-card:has(.transfer-form-head) .transfer-form-footer{
  position:static!important;margin-top:16px!important;padding:12px 0 4px!important;
  border-top:1px solid var(--line)!important;background:transparent!important;box-shadow:none!important
}
#modal>.modal-card:has(.transfer-form-head) #transferLines .line-item{
  display:grid!important;grid-template-columns:minmax(0,1.4fr) 48px minmax(0,1fr) 40px!important;
  gap:8px!important;align-items:center!important;margin:0 0 8px!important
}
@media(max-width:760px){
  #modal>.modal-card:has(.transfer-form-head){
    width:100%!important;max-width:none!important;height:100%!important;max-height:none!important;border-radius:0!important
  }
  #modal>.modal-card:has(.transfer-form-head) .transfer-form-head{
    padding:calc(12px + env(safe-area-inset-top,0px)) 14px 10px!important
  }
  #modal>.modal-card:has(.transfer-form-head) .transfer-form-scroll{
    padding:10px 14px max(18px,env(safe-area-inset-bottom,0px))!important
  }
  #modal>.modal-card:has(.transfer-form-head) .form-grid,
  #modal>.modal-card:has(.transfer-form-head) .form-grid.three,
  #modal>.modal-card:has(.transfer-form-head) .form-grid.four{
    grid-template-columns:1fr!important
  }
  #modal>.modal-card:has(.transfer-form-head) #transferLines .line-item{
    grid-template-columns:1fr!important
  }
}

/* Customer edit modal: compact scrollable body, sticky actions
   LOCKED 2026-09-03 — form khách OK; không sửa .customer-form-* trừ khi user mở khóa */
#modal>.modal-card:has(.customer-form-head){padding:0!important;overflow:hidden!important;width:min(720px,100%)!important;max-height:min(90vh,90dvh)!important}
#modal>.modal-card:has(.customer-form-head)>#modalBody{width:100%!important;max-height:min(90vh,90dvh)!important;overflow:hidden!important;margin:0!important;padding:0!important;display:flex!important;flex-direction:column!important}
#modal>.modal-card:has(.customer-form-head) .customer-form-modal{display:flex;flex-direction:column;min-height:0;max-height:min(90vh,90dvh);flex:1 1 auto}
#modal>.modal-card:has(.customer-form-head) .customer-form-head{
  flex:0 0 auto;position:sticky!important;top:0!important;z-index:12!important;
  margin:0!important;padding:14px 20px 12px!important;
  background:var(--surface,var(--card,#fff))!important;
  border-bottom:1px solid var(--line)!important;
  box-shadow:0 8px 18px -14px rgba(15,23,42,.35);
}
#modal>.modal-card:has(.customer-form-head) .customer-form-head h2{margin:0!important;font-size:18px!important}
#modal>.modal-card:has(.customer-form-head) .customer-form-grid{gap:8px!important;padding:12px 20px 8px;overflow-y:auto;flex:1 1 auto;min-height:0;align-content:start}
#modal>.modal-card:has(.customer-form-head) .customer-form-grid label{gap:3px!important;font-size:11px}
#modal>.modal-card:has(.customer-form-head) .customer-form-grid input,
#modal>.modal-card:has(.customer-form-head) .customer-form-grid select{min-height:34px!important;height:34px;padding:6px 9px!important}
#modal>.modal-card:has(.customer-form-head) #c_company{height:auto!important;min-height:34px!important;white-space:normal;overflow-wrap:anywhere}
#modal>.modal-card:has(.customer-form-head) .customer-form-grid label.c-biz.span2{grid-column:1/-1}
#modal>.modal-card:has(.customer-form-head) #c_note{min-height:40px!important;max-height:56px!important;height:44px!important;resize:vertical;padding:6px 9px!important}
#modal>.modal-card:has(.customer-form-head) .customer-form-actions{
  flex:0 0 auto;margin:0!important;padding:10px 20px 14px;gap:8px;
  border-top:1px solid var(--line);background:transparent;
  position:static;justify-content:flex-end
}
@media(max-width:560px){
  #modal>.modal-card:has(.customer-form-head){width:calc(100vw - 16px)!important;max-height:calc(100dvh - 16px)!important}
  #modal>.modal-card:has(.customer-form-head) .customer-form-grid{grid-template-columns:1fr!important}
}

/* ===== Dense DMS one-page list workspace (all modules) ===== */
/* Topbar is portaled outside .shell — height uses --app-height (px), not cold-start 100dvh alone */
.shell:has(.dms-workspace),.shell:has(.orders-workspace){overflow:hidden;min-height:0;flex:1 1 auto}
main:has(.dms-workspace),main:has(.orders-workspace){
  display:flex;flex-direction:column;flex:1 1 auto;min-height:0;height:100%;max-height:100%;overflow:hidden
}
#content:has(.dms-workspace),#content:has(.orders-workspace){
  padding:6px 10px 6px!important;
  display:flex!important;
  flex-direction:column!important;
  flex:1 1 auto!important;
  min-height:0!important;
  height:100%!important;
  max-height:100%!important;
  max-width:none!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  margin:0!important;
  width:100%!important;
  scrollbar-gutter:auto!important
}
.dms-workspace,.orders-workspace{
  flex:1 1 auto;min-height:0;height:100%;max-height:100%;
  display:flex;flex-direction:column;gap:4px
}
.dms-kpi,.orders-kpi{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;
  align-items:stretch;background:var(--card);border:1px solid var(--line);
  border-radius:10px;padding:0;flex:0 0 auto
}
.dms-kpi-item,.orders-kpi-item{
  min-width:0;padding:6px 10px;border-right:1px solid var(--line);
  display:flex;flex-direction:column;gap:1px;flex:unset
}
.dms-kpi-item:last-child,.orders-kpi-item:last-child{border-right:0}
.dms-kpi-item span,.orders-kpi-item span{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-weight:700;line-height:1.2}
.dms-kpi-item b,.orders-kpi-item b{font-size:14px;font-weight:800;line-height:1.15;letter-spacing:-.02em}
.dms-kpi-item.is-warn b,.orders-kpi-item.is-warn b,.dms-kpi-item.warn b{color:var(--warn,#b45309)}
.dms-kpi-item.is-danger b,.dms-kpi-item.danger b{color:var(--danger,#bd3030)}
.dms-kpi-item.muted b,.orders-kpi-item.muted b{color:var(--muted);font-weight:700}
.dms-panel,.orders-panel{
  flex:1 1 auto;min-height:0;height:auto;max-height:100%;
  display:flex;flex-direction:column;margin:0!important;padding:6px 8px!important;border-radius:10px!important
}
.dms-command,.orders-command{display:flex;flex-wrap:wrap;align-items:flex-end;gap:6px;margin:0 0 6px;flex:0 0 auto}
.dms-cmd-filters{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;flex:1 1 100%;min-width:0}
.dms-cmd-filters .dms-cmd-field{min-width:0;width:100%}
.dms-cmd-filters .date-vn{margin-top:0;width:100%}
.dms-cmd-filters .date-vn-text{width:100%;min-height:32px;height:32px;padding:4px 36px 4px 8px;font-size:12px;border-radius:8px;box-sizing:border-box}
.dms-cmd-filters .date-vn-pick{width:30px;height:30px;right:1px}
/* Legacy aliases — keep other screens that still use dates/row wrappers */
.dms-cmd-dates,.dms-cmd-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;flex:1 1 100%;min-width:0}
.dms-cmd-dates .dms-cmd-field,.dms-cmd-row .dms-cmd-field{min-width:0;width:100%}
.dms-cmd-dates .date-vn{margin-top:0;width:100%}
.dms-cmd-dates .date-vn-text{width:100%;min-height:32px;height:32px;padding:4px 36px 4px 8px;font-size:12px;border-radius:8px;box-sizing:border-box}
.dms-cmd-dates .date-vn-pick{width:30px;height:30px;right:1px}
.dms-cmd-search-wide{flex:1 1 100%!important;min-width:0!important;width:100%!important;max-width:none!important}
.dms-cmd-actions{display:flex;flex-wrap:wrap;align-items:center;gap:6px;width:100%;flex:1 1 100%;min-width:0}
.dms-cmd-actions .dms-cmd-search-compact{flex:1 1 160px;min-width:140px;max-width:280px;width:auto}
.dms-cmd-actions .btn.compact{flex:0 0 auto}
.dms-cmd-branch{flex:1 1 100%;min-width:0;width:100%}
.mobile-branch-filter{display:none!important}
@media(min-width:901px){
  .dms-cmd-filters{grid-template-columns:repeat(4,minmax(0,1fr));flex:1 1 100%;width:100%;min-width:0}
  .dms-cmd-dates{flex:0 1 340px;width:auto;min-width:300px}
  .dms-cmd-actions{flex-wrap:nowrap}
  .dms-cmd-actions .dms-cmd-search-compact{flex:1 1 180px;max-width:240px}
}
.dms-cmd-field,.orders-cmd-field{display:flex;flex-direction:column;gap:2px;margin:0;font-size:11px;min-width:0}
.dms-cmd-field>span,.orders-cmd-field>span{color:var(--muted);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.dms-cmd-field input,.dms-cmd-field select,.orders-cmd-field input,.orders-cmd-field select{min-height:32px;height:32px;padding:4px 8px;font-size:12px;border-radius:8px}
.dms-cmd-field.grow,.orders-cmd-field.grow{flex:1 1 140px;min-width:120px}
.dms-cmd-search,.orders-cmd-search{position:relative;flex:1 1 180px;min-width:160px}
.dms-cmd-search .search-icon,.orders-cmd-search .search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:14px;height:14px;color:var(--muted);pointer-events:none}
.dms-cmd-search .search-icon svg,.orders-cmd-search .search-icon svg{width:14px;height:14px;display:block;stroke:currentColor;fill:none;stroke-width:2}
.dms-cmd-search input,.orders-cmd-search input{width:100%;min-height:32px;height:32px;padding:4px 10px 4px 30px;font-size:12px;border-radius:8px;box-sizing:border-box}
/* Only shrink padding when no icon (input is sole child). Old :not([style*=padding-left]) overrode icon fields. */
.dms-cmd-search input:only-child,.orders-cmd-search input:only-child{padding-left:10px}
.dms-cmd-search:has(.search-icon) input,.orders-cmd-search:has(.search-icon) input{padding-left:30px}
.dms-command .btn.compact,.orders-command .btn.compact{min-height:32px;height:32px;padding:0 10px;font-size:12px;border-radius:8px;white-space:nowrap}
.dms-panel .table-wrap.dms-grid,.dms-panel .table-wrap.orders-grid,.orders-panel .table-wrap.orders-grid,.orders-panel .table-wrap.dms-grid{
  flex:1!important;min-height:0!important;max-height:none!important;
  border-radius:8px!important;margin:0!important;
  overflow-x:auto!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  touch-action:pan-x pan-y;
  scrollbar-width:thin;
  scrollbar-color:rgba(120,135,155,.35) transparent;
}
.dms-panel .table-wrap.dms-grid::-webkit-scrollbar,
.orders-panel .table-wrap.orders-grid::-webkit-scrollbar{height:6px;width:6px}
.dms-panel .table-wrap.dms-grid::-webkit-scrollbar-track,
.orders-panel .table-wrap.orders-grid::-webkit-scrollbar-track{background:transparent}
.dms-panel .table-wrap.dms-grid::-webkit-scrollbar-thumb,
.orders-panel .table-wrap.orders-grid::-webkit-scrollbar-thumb{
  background:rgba(120,135,155,.35);border-radius:999px
}
.orders-panel .table-wrap.orders-grid{
  overflow-x:auto!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:rgba(120,135,155,.28) transparent;
}
.orders-panel .table-wrap.orders-grid::-webkit-scrollbar{height:4px;width:4px}
.orders-panel .table-wrap.orders-grid::-webkit-scrollbar-track{background:transparent}
.orders-panel .table-wrap.orders-grid::-webkit-scrollbar-thumb{
  background:rgba(120,135,155,.28);
  border-radius:999px;
}
.orders-panel .table-wrap.orders-grid::-webkit-scrollbar-thumb:hover{background:rgba(120,135,155,.45)}
.dms-panel .table-wrap.dms-grid table,.orders-panel .table-wrap.orders-grid table{min-width:100%;width:max(100%,max-content)!important}
.orders-panel .table-wrap.orders-grid table{
  width:max(100%,max-content)!important;
  min-width:100%;
  table-layout:fixed;
}
.dms-panel .table-wrap.dms-grid th,.dms-panel .table-wrap.dms-grid td,
.orders-panel .table-wrap.orders-grid th,.orders-panel .table-wrap.orders-grid td{padding:6px 8px!important;font-size:12px!important;line-height:1.25}
.orders-panel .table-wrap.orders-grid th,
.orders-panel .table-wrap.orders-grid td{
  white-space:nowrap!important;
  overflow:hidden;
  text-overflow:ellipsis;
  vertical-align:middle;
  word-break:keep-all!important;
  overflow-wrap:normal!important;
}
.orders-panel .table-wrap.orders-grid td .table-link,
.orders-panel .table-wrap.orders-grid td a,
.orders-panel .table-wrap.orders-grid td button.table-link,
.orders-panel .table-wrap.orders-grid td b,
.orders-panel .table-wrap.orders-grid td span{
  white-space:nowrap!important;
  word-break:keep-all!important;
  overflow-wrap:normal!important;
}
.orders-panel .table-wrap.orders-grid th.is-resizable{
  position:sticky!important;top:0!important;z-index:5;padding-right:12px!important
}
.orders-panel .table-wrap.orders-grid .col-resize-handle{
  position:absolute;right:0;top:0;bottom:0;width:7px;cursor:col-resize;user-select:none;z-index:2;
}
.orders-panel .table-wrap.orders-grid .col-resize-handle:hover,
.orders-panel .table-wrap.orders-grid .col-resize-handle.is-dragging{background:rgba(47,124,255,.22)}
.dms-panel .table-wrap.dms-grid th,.orders-panel .table-wrap.orders-grid th{font-size:10px!important;padding:7px 8px!important;background:linear-gradient(180deg,color-mix(in srgb,var(--accent,#12a9df) 6%,#f8fafc),#f8fafc)!important;position:sticky!important;top:0!important;z-index:5}
.dms-panel .table-wrap.dms-grid .badge,.orders-panel .table-wrap.orders-grid .badge{padding:2px 7px;font-size:10px}
.dms-footer,.orders-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding-top:6px;flex:0 0 auto}
.dms-footer .pager,.orders-footer .pager{margin:0;gap:4px}
.dms-footer .pager .btn,.orders-footer .pager .btn{min-height:28px;padding:4px 8px;font-size:12px}
.dms-workspace .kanban{flex:1;min-height:0;max-height:none;margin:0}
.dms-workspace .vin-filter-chips{flex:0 0 auto;margin:0;padding:0;gap:4px;flex-wrap:wrap;display:flex}
.dms-workspace .vin-filter-chips .vin-chip{padding:4px 8px;font-size:11px}
@media(max-width:900px){
  .app:has(.dms-workspace),.app:has(.orders-workspace){height:var(--app-height,100dvh)!important;overflow:hidden!important;background:var(--bg,#f3f6fa)!important}
  .app-stage:has(.dms-workspace),.app-stage:has(.orders-workspace),
  .shell:has(.dms-workspace),.shell:has(.orders-workspace){min-height:0!important;flex:1 1 auto!important;overflow:hidden!important}
  main:has(.dms-workspace),main:has(.orders-workspace){height:100%!important;max-height:100%!important;min-height:0!important;flex:1 1 auto!important}
  #content:has(.dms-workspace),#content:has(.orders-workspace){
    padding:4px 6px 0!important;
    overflow:hidden!important;
    flex:1 1 auto!important;min-height:0!important;height:100%!important;max-height:100%!important
  }
  .dms-workspace,.orders-workspace{flex:1 1 auto!important;min-height:0!important;height:100%!important;max-height:100%!important;gap:4px!important}
  .dms-kpi,.orders-kpi{grid-template-columns:repeat(2,minmax(0,1fr))!important;border-radius:8px}
  .dms-kpi-item,.orders-kpi-item{padding:5px 8px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
  .dms-kpi-item:nth-child(2n),.orders-kpi-item:nth-child(2n){border-right:0}
  .dms-kpi-item:nth-last-child(-n+2),.orders-kpi-item:nth-last-child(-n+2){border-bottom:0}
  .dms-kpi-item b,.orders-kpi-item b{font-size:13px}
  .dms-panel,.orders-panel{
    border-radius:8px 8px 0 0!important;
    margin-bottom:0!important;padding:4px 6px!important;
    padding-bottom:max(4px,env(safe-area-inset-bottom,0px))!important;
    flex:1 1 auto!important;min-height:0!important
  }
  .dms-command,.orders-command{gap:4px;margin:0 0 4px}
  .dms-panel .table-wrap.dms-grid,.orders-panel .table-wrap.orders-grid{
    flex:1 1 auto!important;min-height:0!important;max-height:none!important;height:auto!important
  }
  .dms-footer,.orders-footer{padding-top:4px}
}
.order-scroll-rail{position:absolute;z-index:15;right:6px;top:56px;bottom:56px;width:3px;pointer-events:none}
.order-scroll-thumb{position:absolute;left:0;top:0;width:3px;min-height:36px;border-radius:999px;background:rgba(90,105,125,.45);transition:opacity .15s;opacity:0}
.order-scroll-rail.is-scrollable .order-scroll-thumb{opacity:1}
.quick-customer-form .required-mark{color:#dc2626;font-weight:900;margin-left:3px}
.quick-customer-form input.is-invalid,.quick-customer-form select.is-invalid{border-color:#dc2626!important;box-shadow:0 0 0 3px rgba(220,38,38,.1)!important}
.qc-create-warning{display:none!important}

/* ==== v6546-dark-contrast ==== */
/* ================= V6.5.46 · DARK MODE CONTRAST FIX =================
   Đo bằng máy trên 119 phần tử ở nền tối: 46 chỗ không đạt WCAG AA.
   Nặng nhất là #quickMenu (Smart Create) chữ trắng trên nền trắng - tỷ lệ 1.00,
   tức là hoàn toàn không nhìn thấy. Nguyên nhân: các khối CSS cũ ghi cứng
   background:#fff nên nền không đổi theo theme, trong khi màu chữ lấy từ
   var(--text) nên lại đổi sang màu sáng.
   Cách sửa: mọi mặt phẳng ghi cứng màu sáng đều được ánh xạ về biến theme,
   và các màu nhấn tối (xanh/tím/cam) được làm sáng lên cho đủ tương phản. */
html[data-theme="dark"]{
  --vf:#7fb8e8;--oth:#b6a4ee;--stor:#f0a17c;
  --ok-lite:#5fd6a0;--warn-lite:#f0b45c;--danger-lite:#ff8a8a;--info-lite:#6fd0f5;
}

/* Menu Smart Create + các mặt phẳng còn ghi cứng #fff */
html[data-theme="dark"] .quick-menu{background:var(--card)!important;border-color:var(--line)!important;color:var(--text);box-shadow:0 18px 50px rgba(0,0,0,.55)}
html[data-theme="dark"] .quick-menu button{color:var(--text)}
html[data-theme="dark"] .quick-menu button:hover{background:var(--soft)!important}
html[data-theme="dark"] .quick-menu button kbd{background:var(--soft);border-color:var(--line);color:var(--muted)}
html[data-theme="dark"] .quick-menu-title{color:var(--muted)}
html[data-theme="dark"] .mini-card{background:var(--soft)!important;border-color:var(--line)!important;color:var(--text)}
html[data-theme="dark"] .chip{background:var(--soft)!important;border-color:var(--line)!important;color:var(--text)}
html[data-theme="dark"] .chip.active{background:color-mix(in srgb,var(--accent) 20%,var(--card))!important;border-color:color-mix(in srgb,var(--accent) 45%,var(--line))!important;color:var(--info-lite)!important}
html[data-theme="dark"] .auth-locale-wrap .locale-toggle{background:var(--soft)}
html[data-theme="dark"] .discount-toggle>span:after{background:#e8f1fb}

/* Nút: nền tối cần màu nhấn đậm hơn để chữ trắng đọc được */
html[data-theme="dark"] .btn.primary{background:var(--accent2);border-color:var(--accent2);color:#fff}
html[data-theme="dark"] .btn.primary:hover{background:color-mix(in srgb,var(--accent2) 84%,#000)}
html[data-theme="dark"] .btn.danger{color:var(--danger-lite)!important;background:color-mix(in srgb,var(--danger) 15%,var(--card))!important;border-color:color-mix(in srgb,var(--danger) 34%,var(--line))!important}
html[data-theme="dark"] .btn.success{color:var(--ok-lite)!important;background:color-mix(in srgb,var(--ok) 15%,var(--card))!important;border-color:color-mix(in srgb,var(--ok) 34%,var(--line))!important}

/* Nhãn trạng thái: nền sáng ghi cứng -> nền tối trong suốt, chữ sáng */
html[data-theme="dark"] .risk-badge.ok,html[data-theme="dark"] .readiness.ok>span,html[data-theme="dark"] .workflow-step.done span{background:color-mix(in srgb,var(--ok) 16%,var(--card))!important;color:var(--ok-lite)!important;border-color:color-mix(in srgb,var(--ok) 34%,var(--line))!important}
html[data-theme="dark"] .risk-badge.warning,html[data-theme="dark"] .readiness.warn>span{background:color-mix(in srgb,var(--warn) 16%,var(--card))!important;color:var(--warn-lite)!important;border-color:color-mix(in srgb,var(--warn) 34%,var(--line))!important}
html[data-theme="dark"] .risk-badge.danger,html[data-theme="dark"] .readiness.bad>span{background:color-mix(in srgb,var(--danger) 16%,var(--card))!important;color:var(--danger-lite)!important;border-color:color-mix(in srgb,var(--danger) 34%,var(--line))!important}
html[data-theme="dark"] .risk-badge.info,html[data-theme="dark"] .security-note,html[data-theme="dark"] .security-feature>span,html[data-theme="dark"] .quick-action>span,html[data-theme="dark"] .workflow-step.current span{background:color-mix(in srgb,var(--accent) 16%,var(--card))!important;color:var(--info-lite)!important;border-color:color-mix(in srgb,var(--accent) 34%,var(--line))!important}
html[data-theme="dark"] .workflow-step.current{color:var(--info-lite)!important}
html[data-theme="dark"] .workflow-step.done{color:var(--ok-lite)!important}
html[data-theme="dark"] .stat .delta{background:color-mix(in srgb,var(--ok) 16%,var(--card))!important;color:var(--ok-lite)!important}
html[data-theme="dark"] .stat .delta.down{background:color-mix(in srgb,var(--danger) 16%,var(--card))!important;color:var(--danger-lite)!important}
html[data-theme="dark"] .quality-score.ok,html[data-theme="dark"] .passport-score.ok,html[data-theme="dark"] .confirm-icon.ok{color:var(--ok-lite)!important}
html[data-theme="dark"] .quick-customer-form .required-mark{color:var(--danger-lite)!important}
html[data-theme="dark"] .qc-create-warning{background:color-mix(in srgb,var(--danger) 14%,var(--card))!important;border-color:color-mix(in srgb,var(--danger) 32%,var(--line))!important;color:var(--danger-lite)!important}

/* Nguồn chiết khấu VinFast / Khác / Đại lý: 3 màu này tối quá trên nền tối */
html[data-theme="dark"] .source-badge.vf,html[data-theme="dark"] .vf-text,
html[data-theme="dark"] .discount-chip.vf small,html[data-theme="dark"] .vf-support-line b,
html[data-theme="dark"] .price-waterfall .vf-support-line b,
html[data-theme="dark"] .approval-price-grid .vf b,
html[data-theme="dark"] .discount-source-card.vinfast strong,
html[data-theme="dark"] .pricing-engine-strip span{color:var(--vf)!important}
html[data-theme="dark"] .source-badge.other,html[data-theme="dark"] .other-text,
html[data-theme="dark"] .discount-chip.other small,html[data-theme="dark"] .other-support-line b,
html[data-theme="dark"] .price-waterfall .other-support-line b,
html[data-theme="dark"] .approval-price-grid .other b,
html[data-theme="dark"] .discount-source-card.other strong{color:var(--oth)!important}
html[data-theme="dark"] .source-badge.store,html[data-theme="dark"] .store-text,
html[data-theme="dark"] .price-waterfall .discount-total-line b,
html[data-theme="dark"] .order-total-summary .discount-total-line b,
html[data-theme="dark"] .discount-applied-item strong,
html[data-theme="dark"] .approval-price-grid .store b,
html[data-theme="dark"] .discount-source-card.store strong{color:var(--stor)!important}
html[data-theme="dark"] .source-badge.vf{background:color-mix(in srgb,#1769aa 22%,var(--card))!important}
html[data-theme="dark"] .source-badge.other{background:color-mix(in srgb,#6c4fb2 22%,var(--card))!important}
html[data-theme="dark"] .source-badge.store{background:color-mix(in srgb,#b04a29 22%,var(--card))!important}
html[data-theme="dark"] .pricing-engine-strip>b{color:var(--ok-lite)!important}

/* Chữ phụ ghi cứng màu tối */
html[data-theme="dark"] .process-note{color:var(--muted)!important}
html[data-theme="dark"] .brand-mark{color:#eaf3ff}
html[data-theme="dark"] .pricing-engine-strip{background:color-mix(in srgb,var(--accent) 8%,var(--card));border-color:color-mix(in srgb,var(--accent) 26%,var(--line))}
html[data-theme="dark"] .pricing-engine-strip>b{background:color-mix(in srgb,var(--ok) 18%,var(--card));color:var(--ok-lite)!important}

/* ==== v6546-sticky-fix ==== */
/* V6.5.490: topbar fixed — không ép sticky/overflow-y:auto (gây mờ + cuộn sai trên iOS) */
@supports (overflow-x:clip){
  html,body{overflow-x:clip}
}
@supports not (overflow-x:clip){
  html,body{overflow-x:hidden}
}
html{scroll-behavior:auto}
.topbar{position:relative!important;top:auto!important;z-index:40;border-bottom:0!important;box-shadow:none!important}
/* Mobile/iOS: fixed topbar. PC: topbar trong flow — scrollbar chỉ thuộc #content, không đè header */
.topbar-host{position:fixed!important;top:0!important;z-index:100!important;transform:none!important}
@media(min-width:901px){
  .topbar-host{
    position:relative!important;top:auto!important;left:auto!important;right:auto!important;
    width:100%;flex:0 0 auto;z-index:120!important;overflow:visible!important
  }
  .app-stage{padding-top:0!important}
  body:not(.sidebar-compact) aside#sidebar{
    position:sticky!important;top:0;height:var(--app-height,100dvh);align-self:start
  }
}
@media(max-width:900px){
  aside#sidebar{position:fixed!important;height:var(--app-height,100dvh)!important}
  /* Menu mở: scrim ổn định, không filter/transition thừa gây lòe */
  body.menu-open::before{
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;filter:none!important;
    transition:none!important
  }
  body.menu-open .topbar-host,
  body.menu-open .topbar,
  body.menu-open .app-stage,
  body.menu-open .shell,
  body.menu-open #content{
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;filter:none!important;
    transform:none!important
  }
}

/* --- Mobile: topbar gọn — giữ chuông / theme / refresh, ẩn nút to --- */
@media(max-width:640px){
  .top-actions #branchFilter,
  .top-actions #quickCreate,
  .top-actions #userMenuWrap,
  .top-actions .security-pill{display:none!important}
  .top-actions .country-indicator{
    display:inline-flex!important;order:20!important;margin-left:0!important;
    flex:0 0 auto!important;padding:6px 8px!important;min-height:36px
  }
  .top-actions .country-indicator .country-code{display:none}
  .top-actions #refreshBtn,
  .top-actions #themeBtn,
  .top-actions #notifyBtn,
  .top-actions .icon-btn,
  .top-actions .notify-btn{
    display:inline-grid!important;place-items:center!important;
    flex:0 0 auto!important;visibility:visible!important;opacity:1!important
  }
  .top-actions .global-search-wrap{
    flex:1 1 auto!important;min-width:0!important;max-width:none!important;width:auto!important;order:0!important
  }
  .top-actions .global-search-wrap input{
    padding:0 12px 0 36px!important;font-size:14px!important;
    text-overflow:ellipsis
  }
  .top-actions .global-search-wrap kbd{display:none!important}
  .topbar{padding-top:8px!important;padding-bottom:8px!important;row-gap:8px!important;min-height:0!important}
  .topbar .title-wrap .eyebrow{display:none!important}
  .topbar .title-wrap h1,.topbar .title-wrap #pageTitle{font-size:19px!important;line-height:1.2!important}
  .topbar .title-wrap #pageSub{display:none!important}
  .mobile-branch-filter{display:flex!important}
  .auth-floating-locale{
    top:max(12px,calc(env(safe-area-inset-top,0px) + 8px))!important;
    right:max(12px,env(safe-area-inset-right,0px))!important;
    z-index:5
  }
}
.sidebar-logout-btn{
  width:100%;border:1px solid #ffffff30;background:#ffffff14;color:#fff;
  min-height:42px;border-radius:10px;font-weight:700;cursor:pointer;margin-top:10px
}
.sidebar-logout-btn:hover{background:#ffffff22}
.sidebar-profile-btn{
  width:100%;display:flex;align-items:center;gap:12px;
  border:0;background:transparent;color:#fff;
  border-radius:12px;padding:4px 2px;cursor:pointer;text-align:left
}
.sidebar-profile-btn:hover{background:#ffffff12}
.sidebar-account-avatar{
  position:relative;width:44px;height:44px;min-width:44px;border-radius:999px;
  display:grid;place-items:center;overflow:hidden;
  border:1.5px solid #9aa8bd;background:#fff;color:#374151;font-weight:700
}
.sidebar-account-initials{font-size:14px;letter-spacing:.02em;line-height:1}
.sidebar-account-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.sidebar-account-photo.hidden{display:none}
.sidebar-account-avatar.has-photo .sidebar-account-initials{display:none}
.sidebar-profile-text{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.sidebar-profile-text b{font-size:13px;font-weight:800;color:#fff;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sidebar-profile-text .profile-security{margin-top:0;font-size:11px;color:#74d8ff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
/* PC: tài khoản + đăng xuất đã có góc phải topbar — ẩn chân menu trái */
@media(min-width:901px){
  .sidebar-foot.mobile-sidebar-account{display:none!important}
}
#closeMenu{display:none!important}

/* Topbar dính thì nền phải đục, nếu không nội dung cuộn phía dưới sẽ lòi qua.
   Nền cũ là color-mix(...96%,transparent) nên bị lộ chữ khi cuộn. */
.topbar{background:var(--card)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html[data-theme="dark"] .topbar{background:var(--card)!important;border-bottom:1px solid var(--line)}

/* ================= V6.5.50 · SIDEBAR TRÁI GỌN + TÌM KIẾM TOPBAR ================= */
.sidebar-head{gap:8px;align-items:center;position:relative;z-index:3;flex-shrink:0;min-width:0}
.sidebar-head .brand-with-logo{
  flex:1 1 auto;min-width:0;margin-right:0;
  display:flex;align-items:center;gap:8px;
  opacity:1;visibility:visible;color:#fff;
  font-size:18px;letter-spacing:.2px;font-weight:800;line-height:1.15
}
.sidebar-head .brand-with-logo>span{
  flex:0 1 auto;min-width:0;
  overflow:visible;text-overflow:clip;white-space:nowrap;
  opacity:1;visibility:visible;color:inherit
}
.sidebar-head .brand-logo{flex:0 0 auto;display:block;opacity:1;visibility:visible;width:30px;height:30px}
.sidebar-collapse-btn{
  color:#dceafa;font-size:16px;line-height:1;
  flex:0 0 auto;margin-left:0;
  padding:4px 6px;min-width:32px;min-height:32px;
  border-radius:8px;display:inline-grid;place-items:center
}
.sidebar-collapse-btn:hover{background:#ffffff18;color:#fff}
.sidebar-pin-btn{display:none;color:#dceafa;font-size:14px;line-height:1;padding:4px 8px;border-radius:8px;flex:0 0 auto;min-width:36px;min-height:36px;place-items:center}
.sidebar-pin-btn:hover{background:#ffffff18;color:#fff}
#menuBtn{display:none;color:#173d70;font-size:20px;padding:4px 8px;border-radius:10px;border:1px solid var(--line);background:var(--card)}
#menuBtn:hover{background:var(--soft,#f4f7fb)}
.sidebar-peek{display:none!important}
.top-actions .global-search-wrap{order:0;margin-right:2px;flex:0 1 220px;max-width:260px;width:220px;min-width:160px;display:flex;align-items:center}
.top-actions .global-search-wrap input{height:38px;min-height:38px;padding:0 58px 0 36px;line-height:36px}
.top-actions .global-search-wrap .search-icon,
.top-actions .global-search-wrap kbd{top:50%;transform:translateY(-50%);margin:0}
.top-actions .global-search-wrap .search-icon{opacity:1;visibility:visible;color:#6b7a8f}
.top-actions #refreshBtn{order:0}
.products-stock-table table{min-width:1100px}
.products-stock-table th,.products-stock-table td{padding:8px 9px;font-size:12px}
html[data-density="compact"] .products-stock-table th,html[data-density="compact"] .products-stock-table td{padding:6px 7px;font-size:11.5px}
.content{max-width:min(1700px,100%);margin-left:auto;margin-right:auto}

/* Desktop: sidebar thu gọn → ẩn hẳn, nội dung full width (chỗ cho bảng) */
@media(min-width:901px){
  body.sidebar-compact .app{grid-template-columns:1fr}
  body.sidebar-compact aside#sidebar{
    position:fixed!important;left:-290px;width:272px;height:100vh;height:100dvh;
    transition:left .2s ease;box-shadow:12px 0 40px rgba(8,28,52,.28);z-index:55;
    transform:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;filter:none!important
  }
  body.sidebar-compact.menu-open aside#sidebar{left:0;z-index:140!important}
  body.sidebar-compact #menuBtn{display:inline-grid;place-items:center}
  body:not(.sidebar-compact) #menuBtn{display:none}
  body.sidebar-compact .sidebar-collapse-btn{display:none}
  body:not(.sidebar-compact) .sidebar-collapse-btn{display:inline-grid}
  body.sidebar-compact .sidebar-pin-btn{display:inline-grid}
  body:not(.sidebar-compact) .sidebar-pin-btn{display:none}
  /* PC: scrim đục, không blur — tránh mờ khi mở menu thu gọn */
  body.sidebar-compact.menu-open::before{
    content:"";position:fixed;inset:0;left:272px;background:rgba(8,22,40,.45);z-index:130;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;filter:none!important
  }
  body:not(.sidebar-compact) aside#sidebar{
    position:sticky!important;left:auto!important;transform:none!important;
    width:var(--sidebar-w,240px)!important;height:var(--app-height,100dvh)!important;
    z-index:30!important;box-shadow:none!important
  }
}
@media(max-width:900px){
  .sidebar-collapse-btn{display:none!important}
  .sidebar-pin-btn{display:none!important}
  /* Menu thu gọn: hiện 📌 cạnh logo ATT để ghim lại */
  body.sidebar-compact.menu-open .sidebar-pin-btn{display:inline-grid!important;place-items:center}
  #menuBtn{display:inline-grid!important}
  .mobile-only{display:inline-grid!important;place-items:center}
  /* Mobile drawer: left (không transform) + nền đục khi mở — tránh frost iOS */
  aside#sidebar{
    --drawer-w:min(86vw,300px);
    position:fixed!important;
    top:0!important;
    width:var(--drawer-w)!important;
    height:var(--app-height,100dvh)!important;
    z-index:120!important;
    left:calc(-1 * var(--drawer-w) - 24px)!important;
    transform:none!important;
    transition:left .22s ease!important;
    padding-top:max(10px,env(safe-area-inset-top,0px))!important;
    padding-bottom:max(12px,env(safe-area-inset-bottom,0px))!important;
    box-shadow:none!important;
    overflow:hidden;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;filter:none!important;
  }
  body.menu-open aside#sidebar{
    left:0!important;
    transform:none!important;
    z-index:140!important;
    background:linear-gradient(180deg,#0b2440 0%,var(--nav) 45%,var(--nav2) 100%)!important;
  }
  body.menu-open aside#sidebar:before{
    background:#0b2440!important;
    height:max(env(safe-area-inset-top,0px),var(--sat,0px))!important;
  }
  /* Scrim chỉ phủ bên phải menu */
  body.menu-open::before{
    content:"";
    position:fixed;
    top:0;right:0;bottom:0;
    left:var(--drawer-w,min(86vw,300px));
    background:rgba(8,22,40,.72);
    opacity:1;
    z-index:130;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    filter:none!important;
    pointer-events:auto;
  }
  body.menu-open .topbar-host,
  body.menu-open .topbar{
    background:var(--card)!important;
    background-color:var(--card)!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    filter:none!important;
    transform:none!important;
    opacity:1!important;
  }
  body.menu-open .topbar-host{z-index:100!important}
  html.platform-ios body.menu-open::before,
  html.platform-ios body.menu-open .topbar-host,
  html.platform-ios body.menu-open .topbar,
  html.platform-ios body.menu-open aside#sidebar{
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    filter:none!important;
  }
  .sidebar-head{padding:10px 8px 12px!important;flex-shrink:0}
  .sidebar-head .brand-with-logo{min-width:0;flex:1}
  .sidebar-head #closeMenu{display:none!important}
  .global-search-wrap kbd{display:none!important}
}

/* Mobile topbar: giữ chuông/theme — chỉ ẩn nút to; tài khoản ở sidebar */
@media(max-width:640px){
  .top-actions #branchFilter,
  .top-actions #quickCreate,
  .top-actions #userMenuWrap,
  .top-actions .security-pill{display:none!important}
  .top-actions #refreshBtn,
  .top-actions #themeBtn,
  .top-actions #notifyBtn{display:inline-grid!important;visibility:visible!important;opacity:1!important}

  /* Mobile card-table: hết chữ chồng / cắt cột (≤640px) */
  .table-wrap.rt-wrap,
  .permission-table-wrap.rt-wrap{
    overflow-x:visible!important;overflow-y:visible!important;max-height:none!important;
    border:0!important;box-shadow:none!important;background:transparent!important
  }
  table.rt-cards{
    min-width:0!important;width:100%!important;table-layout:auto!important;
    border-collapse:separate!important;border-spacing:0!important
  }
  table.rt-cards thead{display:none!important}
  table.rt-cards,table.rt-cards tbody,table.rt-cards tr,table.rt-cards td{display:block;width:100%}
  table.rt-cards colgroup{display:none!important}
  table.rt-cards tr{
    margin:0 0 10px;padding:10px 12px;
    border:1px solid var(--line,#e5e7eb);border-radius:12px;
    background:var(--card,#fff);box-shadow:0 1px 2px rgba(15,23,42,.04)
  }
  table.rt-cards tr:hover{background:color-mix(in srgb,var(--accent,#12a9df) 5%,var(--card,#fff))}
  table.rt-cards td{
    display:flex;justify-content:space-between;align-items:flex-start;gap:12px;
    padding:5px 0!important;border:0!important;text-align:right;
    white-space:normal!important;overflow:visible!important;text-overflow:clip!important;
    max-width:none!important;min-width:0!important;width:auto!important;
    position:static!important;font-size:14px;line-height:1.35
  }
  table.rt-cards td::before{
    content:attr(data-label);flex:0 0 auto;max-width:42%;
    text-align:left;font-size:12px;font-weight:600;color:var(--muted,#6b7280);
    text-transform:none;letter-spacing:0;opacity:.85
  }
  table.rt-cards td:empty,
  table.rt-cards td[data-empty="1"]{display:none!important}
  table.rt-cards td:first-child{
    display:block;text-align:left;font-size:15px;font-weight:700;
    padding-bottom:8px!important;margin-bottom:4px;
    border-bottom:1px dashed color-mix(in srgb,var(--line,#e5e7eb) 80%,transparent)!important
  }
  table.rt-cards td:first-child::before{display:none!important}
  table.rt-cards td:first-child *,
  table.rt-cards td .table-link,
  table.rt-cards td a,
  table.rt-cards td button.table-link,
  table.rt-cards td b,
  table.rt-cards td span{
    white-space:normal!important;overflow:visible!important;text-overflow:clip!important;word-break:break-word
  }
  table.rt-cards td .badge{white-space:nowrap!important;display:inline-flex}
  table.rt-cards .col-resize-handle{display:none!important}
  table.rt-cards td > :not(script){min-width:0;text-align:right}
  table.rt-cards td:first-child > :not(script){text-align:left}
}

/* ================= V6.5.51 · Top-right avatar + profile popover ================= */
nav#nav{flex:1;min-height:0}
.user-menu-wrap{position:relative;order:100;margin-left:2px;z-index:121;flex:0 0 auto}
.user-avatar-btn{display:inline-grid;place-items:center;width:40px;height:40px;padding:0;border:0;background:transparent;cursor:pointer;border-radius:999px;pointer-events:auto;position:relative;z-index:122}
.user-avatar-btn:hover .user-avatar-circle,.user-avatar-btn[aria-expanded="true"] .user-avatar-circle{border-color:#5a6b80;box-shadow:0 0 0 3px rgba(18,58,107,.10)}
.user-avatar-circle,.user-popover-avatar{display:grid;place-items:center;border-radius:999px;border:1.5px solid #6b7280;background:#fff;color:#374151;font-weight:600;letter-spacing:.02em;line-height:1;user-select:none;pointer-events:none}
.user-avatar-circle{width:36px;height:36px;font-size:12px}
.user-popover{position:fixed;top:auto;right:12px;width:min(340px,92vw);background:#fff;border:1px solid #e5e7eb;border-radius:4px;box-shadow:0 8px 28px rgba(15,23,42,.16);z-index:220;overflow:hidden;color:#1f2937}
.user-popover-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px 8px;border-bottom:1px solid #f0f2f5}
.user-popover-org{font-size:12px;color:#4b5563;font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-popover-logout{border:0;background:transparent;color:#4b5563;font-size:12px;font-weight:500;cursor:pointer;padding:2px 0;white-space:nowrap}
.user-popover-logout:hover{color:#111827;text-decoration:underline}
.user-popover-body{display:flex;align-items:flex-start;gap:14px;padding:16px 14px 18px}
.user-popover-avatar{width:72px;height:72px;min-width:72px;font-size:26px;font-weight:500;color:#4b5563}
.user-popover-meta{min-width:0;flex:1;padding-top:2px}
.user-popover-name{font-size:16px;font-weight:700;color:#1a1a1a;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:210px}
.user-popover-sub{margin-top:4px;font-size:12px;color:#6b7280;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:210px}
.user-popover-account{display:inline-block;margin-top:10px;border:0;background:transparent;padding:0;color:#2563eb;font-size:13px;font-weight:500;text-decoration:underline;cursor:pointer}
.user-popover-account:hover,.user-popover-account:focus{color:#1d4ed8;outline:2px solid #9ca3af;outline-offset:2px}
.user-popover-account+.user-popover-account{margin-top:8px;display:block}
.help-layout{display:grid;grid-template-columns:minmax(200px,240px) minmax(0,1fr);gap:16px;align-items:start}
.help-toc{position:sticky;top:12px;padding:14px 12px!important}
.help-toc-head{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 10px}
.help-toc-nav{display:flex;flex-direction:column;gap:4px}
.help-toc-link{display:block;padding:7px 10px;border-radius:10px;color:var(--text,#0f172a);text-decoration:none;font-size:13px;font-weight:600;line-height:1.35}
.help-toc-link:hover{background:rgba(33,169,225,.10);color:#0b6e99}
.help-toc-foot{margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}
.help-body{padding:8px 18px 22px!important}
.help-section{padding:18px 0;border-bottom:1px solid var(--line)}
.help-section:last-child{border-bottom:0}
.help-section h3{margin:0 0 12px;font-size:18px;letter-spacing:-.02em}
.help-section h4{margin:16px 0 8px;font-size:14px;color:#334155}
.help-list{margin:0;padding-left:18px;line-height:1.55}
.help-list li{margin:6px 0}
.help-note{margin:12px 0 0;padding:10px 12px;border-radius:12px;background:rgba(33,169,225,.08);border:1px solid rgba(33,169,225,.18);font-size:13px;line-height:1.45}
.help-flow{margin:10px 0;padding:12px 14px;border-radius:12px;background:#f1f5f9;border:1px dashed #cbd5e1;font-size:13px;font-weight:600;line-height:1.5;overflow-x:auto}
.help-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:8px 0}
.help-table-wrap .help-table{margin:0}
.help-steps{margin:6px 0;padding-left:22px;line-height:1.55}
.help-steps li{margin:6px 0;padding-left:4px}
.help-steps li::marker{font-weight:800;color:var(--accent)}
.help-warn{margin:12px 0 0;padding:10px 12px;border-radius:12px;background:rgba(229,165,61,.12);border:1px solid rgba(229,165,61,.35);font-size:13px;line-height:1.45}
.help-tip{margin:12px 0 0;padding:10px 12px;border-radius:12px;background:rgba(22,133,76,.08);border:1px solid rgba(22,133,76,.22);font-size:13px;line-height:1.45}
.help-search{width:100%;margin:0 0 10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--card,#fff);color:var(--text)}
.help-empty{padding:24px 0;text-align:center}
.help-section code{font-family:ui-monospace,Consolas,monospace;font-size:12px;padding:1px 4px;border-radius:4px;background:var(--soft,#f1f5f9)}
.help-table{width:100%;border-collapse:collapse;font-size:13px;margin:8px 0}
.help-table th,.help-table td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
.help-table th{background:var(--soft,#f8fafc);font-weight:700;white-space:nowrap}
.help-section kbd{display:inline-block;padding:1px 6px;border:1px solid #cbd5e1;border-bottom-width:2px;border-radius:6px;background:#fff;font-size:11px;font-family:ui-monospace,Consolas,monospace}
@media(max-width:900px){
 .help-layout{grid-template-columns:1fr}
 .help-toc{position:static}
 .help-toc-nav{display:grid;grid-template-columns:1fr 1fr;gap:4px;max-height:232px;overflow-y:auto;overscroll-behavior:contain}
 .help-body{padding:4px 12px 18px!important}
}
@media(max-width:480px){.help-toc-nav{grid-template-columns:1fr}}
html[data-theme="dark"] .help-section h4{color:#cbd5e1}
html[data-theme="dark"] .help-flow{background:#0f172a;border-color:#334155}
html[data-theme="dark"] .help-section kbd{background:#1e293b;border-color:#475569;color:#e2e8f0}
html[data-theme="dark"] .help-toc-link:hover{background:rgba(33,169,225,.16);color:#7dd3fc}
html[data-theme="dark"] .user-avatar-circle,html[data-theme="dark"] .user-popover-avatar{background:var(--card);border-color:#9aa4b2;color:var(--text)}
html[data-theme="dark"] .user-popover{background:var(--card);border-color:var(--line);color:var(--text);box-shadow:0 12px 36px rgba(0,0,0,.45)}
html[data-theme="dark"] .user-popover-head{border-bottom-color:var(--line)}
html[data-theme="dark"] .user-popover-org,html[data-theme="dark"] .user-popover-logout,html[data-theme="dark"] .user-popover-sub{color:var(--muted)}
html[data-theme="dark"] .user-popover-name{color:var(--text)}
html[data-theme="dark"] .user-popover-account{color:#60a5fa}

/* ==== block ==== */
/* v6.5.79 · Ghép VIN multi-select list */
#modal>.modal-card:has(.reserve-vin-modal){overflow:hidden!important;max-height:min(94vh,100%)!important;padding:0!important}
#modal>.modal-card:has(.reserve-vin-modal) .reserve-vin-modal{display:flex;flex-direction:column;max-height:min(94vh,100%);overflow:hidden}
#modal>.modal-card:has(.reserve-vin-modal) .reserve-vin-header{flex:0 0 auto;position:sticky;top:0;z-index:3;background:var(--surface);padding:14px 20px 10px;border-bottom:1px solid var(--line)}
#modal>.modal-card:has(.reserve-vin-modal) .reserve-vin-header h2{margin:0;font-size:22px;line-height:1.15;letter-spacing:-.02em}
#modal>.modal-card:has(.reserve-vin-modal) .reserve-vin-sub{margin:4px 0 0;line-height:1.45}
#modal>.modal-card:has(.reserve-vin-modal) .reserve-vin-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;padding:12px 20px 16px}
#modal>.modal-card:has(.reserve-vin-modal) .rov-vin-results:not(.has-hits),
#modal>.modal-card:has(.reserve-vin-modal) .rov-vin-results[hidden]{display:none!important;min-height:0!important;max-height:0!important;margin:0!important;padding:0!important;border:0!important}
#modal>.modal-card:has(.reserve-vin-modal) .rov-vin-results.has-hits{max-height:min(220px,32vh)!important;margin:8px 0!important;overflow-y:auto!important}
#modal>.modal-card:has(.reserve-vin-modal) .rov-vin-empty{padding:10px 12px;line-height:1.45}
#modal>.modal-card:has(.reserve-vin-modal) .reserve-vin-actions{position:static!important;box-shadow:none!important;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);display:flex;gap:8px;flex-wrap:wrap}
#modal>.modal-card:has(.reserve-vin-modal) .rov-vin-selected{margin:8px 0 0;padding:8px 10px}
#modal>.modal-card:has(.reserve-vin-modal) .rov-vin-selected .rov-sel-head{font-size:13px;margin-bottom:6px;color:var(--muted)}
#modal>.modal-card:has(.reserve-vin-modal) .rov-vin-selected .rov-sel-list{display:flex;flex-direction:column;gap:4px;max-height:min(160px,24vh);overflow-y:auto}
#modal>.modal-card:has(.reserve-vin-modal) .rov-vin-selected .rov-sel-row{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding:4px 0;border-top:1px solid var(--line)}
#modal>.modal-card:has(.reserve-vin-modal) .rov-vin-selected .rov-sel-row:first-child{border-top:0;padding-top:0}
#modal>.modal-card:has(.reserve-vin-modal) .rov-vin-selected .rov-sel-body{min-width:0;flex:1}
#modal>.modal-card:has(.reserve-vin-modal) .rov-vin-selected .vin-main{font-weight:700;font-size:13px;line-height:1.35}
#modal>.modal-card:has(.reserve-vin-modal) .rov-vin-selected .vin-meta{color:var(--muted);font-size:11px;margin-top:1px}
#modal>.modal-card:has(.reserve-vin-modal) .rov-vin-selected .rov-sel-rm{flex-shrink:0;padding:2px 8px;font-size:12px}
@media(max-width:760px){
#modal>.modal-card:has(.reserve-vin-modal) .reserve-vin-header{padding:12px 16px 8px}
#modal>.modal-card:has(.reserve-vin-modal) .reserve-vin-scroll{padding:10px 16px 14px}
}
/* v6.5.248 · Kết quả ghép VIN hàng loạt */
#modal>.modal-card:has(.bulk-vin-result-modal){overflow:hidden!important;max-height:min(90vh,100%)!important;padding:0!important;width:min(560px,calc(100vw - 28px))!important}
#modal>.modal-card:has(.bulk-vin-result-modal) .bulk-vin-result-modal{display:flex;flex-direction:column;max-height:min(90vh,100%);overflow:hidden}
#modal>.modal-card:has(.bulk-vin-result-modal) .bulk-vin-result-header{flex:0 0 auto;position:sticky;top:0;z-index:3;background:var(--surface);padding:14px 20px 10px;border-bottom:1px solid var(--line)}
#modal>.modal-card:has(.bulk-vin-result-modal) .bulk-vin-result-header h2{margin:0;font-size:22px;line-height:1.15}
#modal>.modal-card:has(.bulk-vin-result-modal) .bulk-vin-result-sub{margin:4px 0 0;line-height:1.45}
#modal>.modal-card:has(.bulk-vin-result-modal) .bulk-vin-result-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;padding:12px 20px 16px}
#modal>.modal-card:has(.bulk-vin-result-modal) .bulk-vin-errors{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
#modal>.modal-card:has(.bulk-vin-result-modal) .bulk-vin-err-row{display:flex;flex-direction:column;gap:4px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--danger,#dc2626) 4%,var(--surface))}
#modal>.modal-card:has(.bulk-vin-result-modal) .bulk-vin-err-row code{font-size:13px;font-weight:800;word-break:break-all}
#modal>.modal-card:has(.bulk-vin-result-modal) .bulk-vin-err-row span{font-size:12px;color:var(--muted);line-height:1.45}
#modal>.modal-card:has(.bulk-vin-result-modal) .bulk-vin-result-actions{position:static!important;box-shadow:none!important;margin-top:4px;padding-top:12px;border-top:1px solid var(--line)}
@media(max-width:760px){
#modal>.modal-card:has(.bulk-vin-result-modal) .bulk-vin-result-header{padding:12px 16px 8px}
#modal>.modal-card:has(.bulk-vin-result-modal) .bulk-vin-result-scroll{padding:10px 16px 14px}
}
/* v6.5.271 · Modal xác nhận bật/tắt chương trình chiết khấu */
#modal>.modal-card:has(.confirm-discount-modal),
#modal>.modal-card:has(.confirm-order-delete-modal){width:min(520px,calc(100vw - 28px))!important;max-height:min(90vh,90dvh)!important;padding:20px 22px!important;overflow-y:auto!important}
.confirm-discount-modal,.confirm-order-delete-modal{display:flex;flex-direction:column;gap:0;min-width:0}
.confirm-order-delete-modal .confirm-program{margin:0 0 8px}
.confirm-order-delete-hint{margin:0 0 2px;line-height:1.45}
.confirm-order-delete-modal b.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px;letter-spacing:0;word-break:break-all}
.confirm-discount-head{display:flex;gap:14px;align-items:flex-start;margin-bottom:12px}
.confirm-discount-head h2{margin:4px 0 8px;font-size:20px;line-height:1.25;letter-spacing:-.02em}
.confirm-discount-head p{margin:0;font-size:13px;line-height:1.55;color:var(--muted)}
.confirm-discount-modal .confirm-program{margin:0 0 4px}
.confirm-reason-field{display:flex;flex-direction:column;gap:7px;margin-top:14px}
.confirm-reason-field label{display:block!important;font-size:12px;font-weight:700;color:var(--muted);margin:0!important}
.confirm-reason-field textarea{width:100%;min-height:88px;max-height:160px;resize:vertical;box-sizing:border-box;margin:0!important}
.confirm-discount-actions{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.confirm-discount-actions .btn{min-height:34px;height:34px;padding:6px 14px;font-size:13px;border-radius:9px}
.btn.danger.solid{background:var(--danger,#c62828);border-color:var(--danger,#c62828);color:#fff;font-weight:700}
.btn.danger.solid:hover{background:#b52222;border-color:#b52222;color:#fff}
/* v6.5.249 · Modal form chuẩn — tránh tràn/cắt chữ */
.modal-standard{min-width:0}
.modal-standard>h2:first-child,.modal-standard>.smart-head h2{margin:0 0 12px!important;font-size:22px!important;line-height:1.2!important;letter-spacing:-.02em;word-break:break-word}
.modal-standard .form-grid{margin-bottom:4px}
.modal-standard .form-grid label{min-width:0}
.modal-standard .form-grid input,.modal-standard .form-grid select,.modal-standard .form-grid textarea{width:100%!important;min-width:0!important;box-sizing:border-box!important}
.modal-standard .form-grid select{text-overflow:ellipsis}
.modal-standard .date-vn{width:100%}
.modal-standard .date-vn .date-vn-text{width:100%;box-sizing:border-box}
.modal-standard .toolbar,.modal-standard .sticky-actions{margin-top:10px!important;margin-bottom:0!important;padding:8px 0 4px!important;gap:8px!important;flex-wrap:wrap}
.modal-standard .toolbar .btn,.modal-standard .sticky-actions .btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:34px!important;height:34px!important;padding:6px 14px!important;font-size:13px!important;line-height:1.2!important;border-radius:9px!important;white-space:nowrap}
#modal>.modal-card.modal-standard-card .btn:hover{transform:none!important}
@media(max-width:760px){#modal>.modal-card.modal-standard-card{padding:16px 16px 18px!important}}

/* ===== Form actions: Lưu rồi Đóng ngoài cùng phải (mọi thiết bị) ===== */
#modal .order-form-actions,
#modal .customer-form-actions,
#modal .issue-form-footer,
#modal .receipt-form-footer,
#modal .transfer-form-footer,
#modal .po-form-footer,
#modal .quick-customer-footer,
#modal .popup-footer,
#modal .reserve-vin-actions,
#modal .serial-verify-footer,
#modal .bulk-vin-result-actions,
#modal .toolbar.sticky-actions,
#modal .modal-standard > .toolbar:last-of-type,
#modal .modal-standard .toolbar:has(> .btn.primary),
#modal .toolbar.form-actions-bar,
#modal .toolbar:has(> .btn.primary):has(button[onclick*="closeModal"]),
#modal .form-actions-bar,
#modal .sv-form-actions{
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  width:100%!important;
  box-sizing:border-box!important;
  margin-left:0!important;margin-right:0!important;
}
/* Chuẩn kích thước nút footer = Đặt hàng (vừa vặn) */
#modal .order-form-actions > .btn,
#modal .customer-form-actions > .btn,
#modal .issue-form-footer > .btn,
#modal .receipt-form-footer > .btn,
#modal .transfer-form-footer > .btn,
#modal .po-form-footer > .btn,
#modal .quick-customer-footer > .btn,
#modal .popup-footer > .btn,
#modal .reserve-vin-actions > .btn,
#modal .serial-verify-footer > .btn,
#modal .bulk-vin-result-actions > .btn,
#modal .toolbar.sticky-actions > .btn,
#modal .modal-standard .toolbar > .btn,
#modal .modal-standard .sticky-actions > .btn,
#modal .toolbar.form-actions-bar > .btn,
#modal .form-actions-bar > .btn,
#modal .sv-form-actions > .btn,
#modal>.modal-card:has(.order-create-head) .order-form-actions > .btn,
#modal>.modal-card:has(.po-form-head) .po-form-footer .btn,
#modal>.modal-card:has(.product-form-modal) .form-actions-bar .btn,
#modal>.modal-card:has(.receipt-form-head) .receipt-form-footer .btn,
#modal>.modal-card:has(.issue-form-head) .issue-form-footer .btn,
#modal>.modal-card:has(.transfer-form-head) .transfer-form-footer .btn,
#modal>.modal-card:has(.customer-form-head) .customer-form-actions .btn,
#modal .confirm-discount-actions .btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:34px!important;
  height:34px!important;
  padding:6px 14px!important;
  font-size:13px!important;
  line-height:1.2!important;
  border-radius:9px!important;
  white-space:nowrap!important;
  box-sizing:border-box!important;
  flex:0 0 auto!important;
  width:auto!important
}
#modal .order-form-actions > #draftState,
#modal .order-form-actions > .muted,
#modal .popup-footer > .muted,
#modal .popup-footer > .muted.small{
  order:0!important;margin-right:auto!important;flex:0 1 auto!important;min-width:0!important
}
#modal .order-form-actions > .spacer,
#modal .popup-footer > .spacer,
#modal .toolbar.sticky-actions > .spacer,
#modal .modal-standard .toolbar > .spacer{display:none!important}
/* Thứ tự: nút phụ → Lưu/primary → Đóng (ngoài cùng phải) */
#modal .order-form-actions > .btn:not(.primary):not([onclick*="closeModal"]),
#modal .customer-form-actions > .btn:not(.primary):not([onclick*="closeModal"]),
#modal .issue-form-footer > .btn:not(.primary):not([onclick*="closeModal"]),
#modal .receipt-form-footer > .btn:not(.primary):not([onclick*="closeModal"]),
#modal .po-form-footer > .btn:not(.primary):not([onclick*="closeModal"]),
#modal .quick-customer-footer > .btn:not(.primary):not([onclick*="closeModal"]),
#modal .popup-footer > .btn:not(.primary):not([onclick*="closeModal"]),
#modal .reserve-vin-actions > .btn:not(.primary):not([onclick*="closeModal"]),
#modal .toolbar.sticky-actions > .btn:not(.primary):not([onclick*="closeModal"]),
#modal .modal-standard .toolbar > .btn:not(.primary):not([onclick*="closeModal"]),
#modal .toolbar:has(> .btn.primary) > .btn:not(.primary):not([onclick*="closeModal"]),
#modal .form-actions-bar > .btn:not(.primary):not([onclick*="closeModal"]){order:10!important}
#modal .quick-customer-footer > #qc_save{order:10!important}
#modal .quick-customer-footer > #qc_save_order{order:20!important}
#modal .order-form-actions > .btn.primary,
#modal .customer-form-actions > .btn.primary,
#modal .issue-form-footer > .btn.primary,
#modal .receipt-form-footer > .btn.primary,
#modal .po-form-footer > .btn.primary,
#modal .quick-customer-footer > .btn.primary,
#modal .popup-footer > .btn.primary,
#modal .reserve-vin-actions > .btn.primary,
#modal .toolbar.sticky-actions > .btn.primary,
#modal .modal-standard .toolbar > .btn.primary,
#modal .toolbar:has(> .btn.primary) > .btn.primary,
#modal .form-actions-bar > .btn.primary{order:20!important;flex:0 0 auto!important}
#modal button.btn[onclick*="closeModal"]:not(.primary),
#modal .btn.btn-close-form,
#modal .order-form-actions > button.btn[onclick*="closeModal"],
#modal .customer-form-actions > button.btn[onclick*="closeModal"],
#modal .issue-form-footer > button.btn[onclick*="closeModal"],
#modal .receipt-form-footer > button.btn[onclick*="closeModal"],
#modal .po-form-footer > button.btn[onclick*="closeModal"],
#modal .quick-customer-footer > button.btn[onclick*="closeModal"],
#modal .popup-footer > button.btn[onclick*="closeModal"],
#modal .reserve-vin-actions > button.btn[onclick*="closeModal"],
#modal .toolbar.sticky-actions > button.btn[onclick*="closeModal"],
#modal .modal-standard .toolbar > button.btn[onclick*="closeModal"],
#modal .toolbar:has(> .btn.primary) > button.btn[onclick*="closeModal"],
#modal .form-actions-bar > button.btn[onclick*="closeModal"]{
  order:99!important;
  flex:0 0 auto!important;
  background:#fff5f5!important;
  color:#c62828!important;
  border-color:#f0b4b4!important;
  margin-left:4px!important
}
#modal button.btn[onclick*="closeModal"]:not(.primary):hover,
#modal .btn.btn-close-form:hover{
  background:#ffe8e8!important;border-color:#e89a9a!important;color:#b71c1c!important
}
/* PC đơn hàng: nút 1 hàng, Đóng ngoài cùng phải */
#modal>.modal-card:has(.order-create-head) .order-form-actions{
  flex-wrap:nowrap!important;
  position:static!important;
  box-shadow:none!important;
  margin:16px 0 0!important;
  padding:12px 0 16px!important;
  background:transparent!important;
  border-top:1px solid var(--line)!important
}
#modal>.modal-card:has(.order-create-head) .order-form-actions > .btn{
  flex:0 0 auto!important;white-space:nowrap!important
}
#modal>.modal-card:has(.order-create-head) .order-form-actions > .btn.primary{order:20!important}
#modal>.modal-card:has(.order-create-head) .order-form-actions > button.btn[onclick*="closeModal"]{order:99!important}
/* Grid dòng xe: 1 hàng — Tên dòng xe | Loại PIN | Số lượng | Đơn giá | Ghi chú */
.form-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:11px!important;align-items:start!important}
.form-grid.four > label{min-width:0!important}
.form-grid.four.ol-line-top{
  grid-template-columns:minmax(0,2.2fr) minmax(110px,.85fr) minmax(72px,.55fr) minmax(110px,.9fr) minmax(120px,1fr)!important;
  align-items:end!important
}
.form-grid.four.ol-line-top > label.ol-product-field{grid-column:auto!important}
.form-grid.four.ol-line-top > label{gap:5px!important;font-size:11px!important;font-weight:600!important;color:var(--label,#5f6b7d)!important}
.form-grid.four.ol-line-top .ol_product_search,
.form-grid.four.ol-line-top .ol_battery,
.form-grid.four.ol-line-top .ol_qty,
.form-grid.four.ol-line-top .ol_price,
.form-grid.four.ol-line-top .ol_note{margin-top:0!important}
.ol-product-combo{position:relative;margin-top:0}
.ol-product-combo .ol_product_search{width:100%!important;box-sizing:border-box!important;display:block!important;height:40px!important;min-height:40px!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;position:relative!important;z-index:2!important}
#modal .ol-product-combo select.ol_product,
#modal select.ol_product,
.ol-product-combo select.ol_product{
  position:absolute!important;width:0!important;height:0!important;min-height:0!important;max-height:0!important;
  opacity:0!important;visibility:hidden!important;pointer-events:none!important;
  left:0!important;top:0!important;margin:0!important;padding:0!important;border:0!important;
  appearance:none!important;-webkit-appearance:none!important;background:none!important;overflow:hidden!important
}
.ol_product_results{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:220;max-height:280px;overflow:auto;background:var(--card,#fff);border:1px solid var(--line);border-radius:12px;box-shadow:0 16px 40px rgba(15,23,42,.16);padding:5px}
.ol_product_results.hidden{display:none!important}
.ol-product-item{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:2px;border:0;background:transparent;color:var(--text);text-align:left;padding:9px 11px;border-radius:9px;cursor:pointer}
.ol-product-item:hover,.ol-product-item:focus{background:color-mix(in srgb,var(--accent) 8%,var(--card,#fff));outline:none}
.ol-product-item span{font-size:12.5px;font-weight:650;line-height:1.3}
.ol-product-item small{font-size:10.5px;color:var(--muted);font-weight:500}
.ol-product-empty{padding:12px;color:var(--muted);font-size:12px}
.form-section.order-line{position:relative!important;z-index:1!important;overflow:visible!important;margin:10px 0!important}
.form-section.order-line:focus-within{z-index:30!important}
.form-section.order-line .ol_battery_wrap{margin:0!important;display:flex!important}
.form-section.order-line .ol_battery_wrap select{width:100%;margin:0}
.form-section.order-line .ol_battery:disabled{opacity:.55;cursor:not-allowed;background:var(--soft,#f3f6fa)}
/* Pre-Order: chỉ hiện khi hết tồn (JS thêm/bỏ .hidden) — không ép display:flex đè .hidden */
#modal .order-preorder-row{
  position:relative!important;z-index:2!important;
  clear:both!important;
  margin:12px 0 8px!important;padding:10px 12px!important;
  width:100%!important;box-sizing:border-box!important
}
#modal .order-preorder-row:not(.hidden){display:flex!important}
#modal .order-preorder-row.hidden{display:none!important}
#modal #addOrderLine{position:relative!important;z-index:2!important;margin:4px 0 8px!important}
@media(max-width:900px){
  .form-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .form-grid.four.ol-line-top{grid-template-columns:minmax(0,1.5fr) minmax(100px,.8fr) minmax(70px,.5fr) minmax(100px,.85fr) minmax(100px,.9fr)!important}
  .form-grid.four > label.ol-product-field{grid-column:auto!important}
}
@media(max-width:560px){
  .form-grid.four{grid-template-columns:1fr!important}
  .form-grid.four.ol-line-top{grid-template-columns:1fr 1fr!important}
  .form-grid.four.ol-line-top > label.ol-product-field{grid-column:1/-1!important}
}
/* Select: bỏ mũi tên kép hệ thống — chỉ 1 chevron */
#modal select{
  -webkit-appearance:none!important;appearance:none!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b7a8f' d='M1.4 1.4L6 6l4.6-4.6L12 2.8 6 8.8 0 2.8z'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;
  background-position:right 12px center!important;
  background-size:12px 8px!important;
  padding-right:32px!important
}
/* Modal scrollbar mảnh, không mũi tên */
#modal .modal-card,
#modal #modalBody{
  scrollbar-width:thin!important;
  scrollbar-color:#c5ced8 transparent!important
}
#modal .modal-card::-webkit-scrollbar,
#modal #modalBody::-webkit-scrollbar{width:4px!important;height:4px!important}
#modal .modal-card::-webkit-scrollbar-button,
#modal #modalBody::-webkit-scrollbar-button{display:none!important;width:0!important;height:0!important}
#modal .modal-card::-webkit-scrollbar-thumb,
#modal #modalBody::-webkit-scrollbar-thumb{background:#c5ced8;border-radius:999px}
#modal .modal-card::-webkit-scrollbar-track,
#modal #modalBody::-webkit-scrollbar-track{background:transparent}
/* Footer form: không sticky đè nội dung — nằm cuối cuộn */
#modal>.modal-card:has(.issue-form-head) .issue-form-footer,
#modal>.modal-card:has(.receipt-form-head) .receipt-form-footer,
#modal>.modal-card:has(.transfer-form-head) .transfer-form-footer,
#modal>.modal-card:has(.customer-form-head) .customer-form-actions,
#modal .toolbar.sticky-actions{
  position:static!important;
  box-shadow:none!important;
  margin-left:0!important;margin-right:0!important
}
#modal .ios-form-end-spacer{display:none!important;height:0!important;min-height:0!important;max-height:0!important}
.sticky-actions{position:static!important;box-shadow:none!important}
/* Không ép flex/min-height lên #modalBody — sẽ làm form đơn hàng trắng + CCCD chìm */
#modal>.modal-card:has(.quick-customer-modal)>#modalBody,
#modal>.modal-card.quick-customer-card>#modalBody{
  display:block!important
}
#modal .quick-customer-footer{
  margin-top:16px!important
}
#modal .quick-customer-paste,
#modal .quick-customer-actions{
  position:relative!important;z-index:2!important
}
#modal .quick-customer-form{
  position:relative!important;z-index:1!important
}

/* ==== ios-modal-scroll-fix ==== */
/* iPhone: đè mọi rule cũ — form full màn, không cắt nút, không đè giờ */
html.modal-open .dms-footer,
html.modal-open .orders-footer,
html.modal-open .pwa-install-fab{display:none!important}
html.modal-open .app{pointer-events:none!important}
@media(max-width:760px){
  .order-scroll-rail{display:none!important}
  /* Dark mode: không ép #fff — nền theo --surface (form khách/đơn không lệch ô tối trên nền trắng) */
  html.modal-open,html.modal-open body{background:var(--surface,#fff)!important}
  #modal.modal:not(.hidden),
  #modal.modal{
    inset:0!important;top:0!important;right:0!important;bottom:0!important;left:0!important;
    width:100%!important;height:100%!important;
    max-height:none!important;min-height:0!important;
    padding:0!important;margin:0!important;
    place-items:stretch!important;align-items:stretch!important;justify-items:stretch!important;
    background:var(--surface,#fff)!important;border-radius:0!important;
    touch-action:pan-y!important;z-index:10050!important
  }
  #modal .modal-card,
  #modal.modal .modal-card,
  .modal>.modal-card,
  #modal>.modal-card,
  #modal.modal:not(.hidden)>.modal-card,
  #modal>.modal-card:has(.order-create-head),
  #modal>.modal-card:has(.quick-customer-modal),
  #modal>.modal-card:has(.issue-form-head),
  #modal>.modal-card:has(.receipt-form-head),
  #modal>.modal-card:has(.transfer-form-head),
  #modal>.modal-card:has(.customer-form-head),
  #modal>.modal-card:has(.po-form-head){
    border-radius:0!important;
    width:100%!important;max-width:none!important;
    height:100%!important;max-height:none!important;min-height:0!important;
    margin:0!important;padding:0!important;
    box-shadow:none!important;
    display:flex!important;flex-direction:column!important;
    overflow:hidden!important;
    background:var(--surface,#fff)!important
  }
  #modal .modal-card #modalBody,
  #modal.modal .modal-card>#modalBody,
  #modal>.modal-card>#modalBody,
  #modal>.modal-card:has(.order-create-head)>#modalBody,
  #modal>.modal-card:has(.issue-form-head)>#modalBody,
  #modal>.modal-card:has(.receipt-form-head)>#modalBody,
  #modal>.modal-card:has(.transfer-form-head)>#modalBody,
  #modal>.modal-card:has(.customer-form-head)>#modalBody,
  #modal>.modal-card:has(.po-form-head)>#modalBody{
    flex:1 1 auto!important;min-height:0!important;
    max-height:none!important;height:auto!important;width:100%!important;
    overflow-y:auto!important;overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;touch-action:pan-y!important;
    /* Chừa chỗ home indicator — vừa đủ, không kéo thừa */
    padding-bottom:max(24px,env(safe-area-inset-bottom,0px))!important;
    box-sizing:border-box!important
  }
  #modal>.modal-card:has(.order-create-head) .order-create-head,
  #modal>.modal-card:has(.quick-customer-modal) .quick-customer-header,
  #modal>.modal-card:has(.issue-form-head) .issue-form-head,
  #modal>.modal-card:has(.receipt-form-head) .receipt-form-head,
  #modal>.modal-card:has(.transfer-form-head) .transfer-form-head,
  #modal>.modal-card:has(.customer-form-head) .customer-form-head,
  #modal>.modal-card:has(.po-form-head) .po-form-head{
    padding-top:calc(12px + env(safe-area-inset-top,0px))!important;
    padding-left:16px!important;padding-right:16px!important;padding-bottom:10px!important
  }
  #modal:has(.quick-customer-modal)>.modal-card>#modalBody,
  #modal>.modal-card:has(.quick-customer-modal)>#modalBody{
    display:flex!important;flex-direction:column!important;
    overflow:hidden!important;padding-bottom:0!important
  }
  #modal .quick-customer-modal{
    display:flex!important;flex-direction:column!important;
    flex:1 1 auto!important;min-height:0!important;height:100%!important;overflow:hidden!important
  }
  #modal .quick-customer-header{flex:0 0 auto!important}
  #modal .quick-customer-scroll{
    flex:1 1 auto!important;min-height:0!important;
    overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;overscroll-behavior-y:contain!important;
    padding:8px 14px 0!important
  }
  #modal .quick-customer-footer{
    position:static!important;flex:none!important;
    margin:16px 0 0!important;
    padding:12px 0 max(10px,env(safe-area-inset-bottom,0px))!important;
    box-shadow:none!important;
    background:transparent!important;
    border-top:1px solid var(--line)!important;
    justify-content:flex-end!important
  }
  #modal .quick-customer-footer .btn{
    min-height:44px!important;flex:0 0 auto!important;width:auto!important
  }
  #modal .quick-customer-modal > .ios-form-end-spacer,
  #modal .quick-customer-scroll > .ios-form-end-spacer{display:none!important;height:0!important;min-height:0!important;max-height:0!important}
  /* Khoảng cuối form: chỉ chừa home indicator */
  .ios-form-end-spacer{
    display:block!important;
    width:100%!important;
    height:max(12px,env(safe-area-inset-bottom,0px))!important;
    min-height:12px!important;
    max-height:48px!important;
    flex:0 0 auto!important;
    pointer-events:none!important
  }
  /* Đơn hàng mobile: full màn + footer cuộn theo (không sticky đè tổng) */
  #modal.modal:not(.hidden):has(.order-create-head),
  #modal.modal:has(.order-create-head){
    padding:0!important;margin:0!important;
    place-items:stretch!important;align-items:stretch!important;justify-items:stretch!important
  }
  #modal>.modal-card:has(.order-create-head){
    border-radius:0!important;width:100%!important;max-width:none!important;
    height:100%!important;max-height:none!important
  }
  #modal>.modal-card:has(.order-create-head)>#modalBody{
    padding:0 16px 0!important;scrollbar-gutter:auto!important;scrollbar-width:none!important
  }
  #modal>.modal-card:has(.order-create-head)>#modalBody::-webkit-scrollbar{display:none!important;width:0!important}
  #modal>.modal-card:has(.order-create-head) .order-create-head{
    margin:0 -16px 10px!important;
    border-radius:0!important;
    padding-top:calc(12px + env(safe-area-inset-top,0px))!important;
    padding-left:16px!important;padding-right:16px!important;padding-bottom:10px!important
  }
  #modal>.modal-card:has(.order-create-head) .order-form-actions{
    position:static!important;z-index:auto!important;
    display:flex!important;flex-wrap:wrap!important;align-items:center!important;justify-content:flex-end!important;
    gap:10px!important;margin:16px 0 0!important;
    padding:14px 0 max(18px,env(safe-area-inset-bottom,0px))!important;
    background:transparent!important;border-top:1px solid var(--line)!important;
    box-shadow:none!important
  }
  #modal>.modal-card:has(.order-create-head) .order-form-actions .spacer{display:none!important}
  #modal>.modal-card:has(.order-create-head) .order-form-actions #draftState{
    flex:1 1 100%!important;width:100%!important;order:0!important;margin:0 0 4px!important
  }
  #modal>.modal-card:has(.order-create-head) .order-form-actions .btn.primary{
    flex:0 0 auto!important;order:20!important;min-height:34px!important;height:34px!important
  }
  #modal>.modal-card:has(.order-create-head) .order-form-actions .btn:not(.primary):not([onclick*="closeModal"]){
    flex:0 0 auto!important;order:10!important;min-height:34px!important;height:34px!important
  }
  #modal>.modal-card:has(.order-create-head) .order-form-actions button.btn[onclick*="closeModal"]{
    flex:0 0 auto!important;order:99!important;min-height:34px!important;height:34px!important;margin-left:4px!important
  }
  /* Mobile: footer form — Đóng sát phải; form ngắn ghim nút sát đáy màn */
  #modal .sticky-actions,
  #modal .customer-form-actions,
  #modal .issue-form-footer,
  #modal .receipt-form-footer,
  #modal .transfer-form-footer,
  #modal .po-form-footer,
  #modal .popup-footer,
  #modal .reserve-vin-actions,
  #modal .toolbar.sticky-actions{
    position:static!important;
    box-shadow:none!important;
    justify-content:flex-end!important;
    margin-top:16px!important;
    padding:12px 0 max(10px,env(safe-area-inset-bottom,0px))!important;
    background:transparent!important
  }
  #modal .ios-form-end-spacer{display:none!important;height:0!important;min-height:0!important;max-height:0!important}
  #modal .quick-customer-footer{
    position:static!important;flex:none!important;
    justify-content:flex-end!important;margin-top:16px!important;
    padding:12px 0 max(10px,env(safe-area-inset-bottom,0px))!important;
    box-shadow:none!important;
    background:transparent!important;
    border-top:1px solid var(--line)!important
  }
  #modal .customer-form-actions .btn,
  #modal .issue-form-footer .btn,
  #modal .receipt-form-footer .btn,
  #modal .po-form-footer .btn,
  #modal .transfer-form-footer .btn,
  #modal .quick-customer-footer .btn,
  #modal .sv-form-actions .btn,
  #modal .modal-standard .toolbar .btn,
  #modal .toolbar.sticky-actions .btn,
  #modal .form-actions-bar .btn{
    flex:0 0 auto!important;min-height:34px!important;height:34px!important;width:auto!important;
    padding:6px 14px!important;font-size:13px!important;border-radius:9px!important
  }
  #modal>.modal-card:has(.order-create-head) .ios-form-end-spacer{
    display:none!important;height:0!important;min-height:0!important
  }
  #modal>.modal-card:has(.order-create-head) .price-waterfall,
  #modal>.modal-card:has(.order-create-head) .order-total-summary{
    margin-bottom:4px!important;padding-bottom:8px!important
  }

  /* ===== Form chuẩn / chiết khấu: tiêu đề sticky + nút cuối cuộn ===== */
  #modal>.modal-card.modal-standard-card{
    padding:0!important
  }
  #modal>.modal-card.modal-standard-card>#modalBody{
    display:block!important;
    padding:0 16px 0!important;
    padding-bottom:max(18px,env(safe-area-inset-bottom,0px))!important;
    overscroll-behavior-y:contain!important;
    box-sizing:border-box!important;
    overflow-y:auto!important;-webkit-overflow-scrolling:touch!important
  }
  #modal .modal-standard{
    display:block!important;
    min-height:0!important;
    height:auto!important;
    width:100%!important;
    box-sizing:border-box!important
  }
  #modal .modal-standard > h2:first-child,
  #modal .modal-standard > .smart-head{
    position:sticky!important;top:0!important;z-index:12!important;
    margin:0 -16px 12px!important;
    padding:calc(12px + env(safe-area-inset-top,0px)) 16px 10px!important;
    background:var(--surface,#fff)!important;
    border-bottom:1px solid var(--line)!important;
    box-shadow:0 8px 18px -14px rgba(15,23,42,.35)!important
  }
  #modal .modal-standard > .form-grid{
    display:grid!important
  }
  #modal .modal-standard > .toolbar.form-actions-bar,
  #modal .modal-standard > .toolbar:last-of-type,
  #modal .modal-standard > .toolbar:has(> .btn.primary){
    position:static!important;bottom:auto!important;z-index:auto!important;
    margin-top:16px!important;margin-bottom:0!important;
    display:flex!important;justify-content:flex-end!important;align-items:center!important;flex-wrap:wrap!important;gap:8px!important;
    padding:12px 0 4px!important;
    background:transparent!important;
    border-top:1px solid var(--line)!important;
    box-shadow:none!important
  }
  /* Form sản phẩm mobile: head cố định (flex), cuộn trong .product-form-scroll */
  #modal>.modal-card:has(.product-form-modal){
    padding:0!important;overflow:hidden!important;
    display:flex!important;flex-direction:column!important;
    width:100%!important;max-width:none!important;height:100%!important;max-height:none!important
  }
  #modal>.modal-card:has(.product-form-modal)>#modalBody{
    display:flex!important;flex-direction:column!important;
    overflow:hidden!important;padding:0!important;flex:1 1 auto!important;min-height:0!important
  }
  #modal .product-form-modal{
    display:flex!important;flex-direction:column!important;
    flex:1 1 auto!important;min-height:0!important;height:100%!important;overflow:hidden!important
  }
  #modal .product-form-modal > .product-form-head,
  #modal .product-form-modal > .smart-head.product-form-head{
    flex:0 0 auto!important;position:relative!important;top:auto!important;
    margin:0!important;
    padding:calc(14px + env(safe-area-inset-top,0px)) 16px 12px!important;
    background:var(--surface,#fff)!important;
    border-bottom:1px solid var(--line)!important;
    box-shadow:0 8px 18px -14px rgba(15,23,42,.35)!important
  }
  #modal .product-form-modal > .product-form-head h2{
    margin:0!important;font-size:18px!important;line-height:1.25!important;
    overflow-wrap:anywhere!important;white-space:normal!important
  }
  #modal .product-form-scroll{
    flex:1 1 auto!important;min-height:0!important;
    overflow-y:auto!important;overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    padding:12px 16px max(18px,env(safe-area-inset-bottom,0px))!important
  }
  #modal .product-form-modal > .form-actions-bar,
  #modal .product-form-modal > .toolbar.form-actions-bar,
  #modal .product-form-scroll > .form-actions-bar,
  #modal .product-form-scroll > .toolbar.form-actions-bar{
    position:static!important;margin-top:16px!important;
    box-shadow:none!important;background:transparent!important
  }
  #modal .product-form-grid{
    grid-template-columns:1fr!important;gap:12px!important
  }
  #modal .product-form-grid > label,
  #modal .product-form-grid > label.p-name-field,
  #modal .product-form-grid > label.span3{
    grid-column:1/-1!important;width:100%!important
  }
  #modal .modal-standard .form-grid,
  #modal .modal-standard .form-grid.three,
  #modal .modal-standard .form-grid.four{
    grid-template-columns:1fr!important
  }
  #modal .modal-standard .form-grid > label,
  #modal .modal-standard .form-grid .span2,
  #modal .modal-standard .form-grid .span3{
    grid-column:1/-1!important
  }
  /* Khách hàng (mobile): cuộn cả form — nút Lưu/Đóng ở cuối, tiêu đề sticky */
  #modal>.modal-card:has(.customer-form-head)>#modalBody{
    overflow-y:auto!important;overflow-x:hidden!important;
    display:block!important;max-height:none!important
  }
  #modal>.modal-card:has(.customer-form-head) .customer-form-modal{
    display:block!important;max-height:none!important;height:auto!important;min-height:0!important
  }
  #modal>.modal-card:has(.customer-form-head) .customer-form-head{
    position:sticky!important;top:0!important;z-index:12!important
  }
  #modal>.modal-card:has(.customer-form-head) .customer-form-grid{
    overflow:visible!important;flex:none!important;max-height:none!important;min-height:0!important
  }
  #modal>.modal-card:has(.customer-form-head) .customer-form-actions{
    position:static!important;flex:none!important;margin-top:12px!important
  }
  /* PO mobile: cuộn cả form (meta + dòng + Đóng), tiêu đề sticky — tránh kẹt không kéo được */
  #modal>.modal-card:has(.po-form-head)>#modalBody{
    overflow-y:auto!important;overflow-x:hidden!important;
    display:block!important;-webkit-overflow-scrolling:touch!important;
    padding-bottom:max(18px,env(safe-area-inset-bottom,0px))!important
  }
  #modal>.modal-card:has(.po-form-head) .po-form-modal{
    display:block!important;overflow:visible!important;
    max-height:none!important;height:auto!important;min-height:0!important;flex:none!important
  }
  #modal>.modal-card:has(.po-form-head) .po-form-head{
    position:sticky!important;top:0!important;z-index:14!important;
    padding-top:calc(12px + env(safe-area-inset-top,0px))!important
  }
  #modal>.modal-card:has(.po-form-head) .po-form-meta{
    flex:none!important;overflow:visible!important
  }
  #modal>.modal-card:has(.po-form-head) .po-lines-wrap{
    flex:none!important;min-height:180px!important;max-height:min(42vh,320px)!important;
    overflow:auto!important;margin:0 14px 8px!important
  }
  #modal>.modal-card:has(.po-form-head) .po-form-footer{
    position:static!important;flex:none!important;
    margin:8px 0 0!important;padding:12px 14px 8px!important
  }
  #modal .modal-standard > .discount-form-head{
    position:sticky!important;top:0!important;z-index:14!important;
    margin:0 -16px 12px!important;
    padding:calc(12px + env(safe-area-inset-top,0px)) 16px 10px!important;
    background:var(--surface,#fff)!important;
    border-bottom:1px solid var(--line)!important;
    box-shadow:0 8px 18px -14px rgba(15,23,42,.35)!important
  }
  #modal .modal-standard > .discount-form-head h2{
    margin:0!important;font-size:18px!important;line-height:1.25!important;
    overflow-wrap:anywhere!important;white-space:normal!important
  }
}

/* ==== mobile-form-safe-fix ==== */
/* Bổ sung: mọi modal full-screen trên phone chừa giờ + home */
@media(max-width:760px){
  #modal>.modal-card>#modalBody{
    padding-left:16px!important;padding-right:16px!important;
    padding-top:max(14px,calc(10px + env(safe-area-inset-top,0px)))!important
  }
  /* Form có head sticky riêng — không cộng thêm padding-top body */
  #modal>.modal-card:has(.order-create-head)>#modalBody,
  #modal>.modal-card:has(.quick-customer-modal)>#modalBody,
  #modal>.modal-card:has(.issue-form-head)>#modalBody,
  #modal>.modal-card:has(.receipt-form-head)>#modalBody,
  #modal>.modal-card:has(.transfer-form-head)>#modalBody,
  #modal>.modal-card:has(.customer-form-head)>#modalBody,
  #modal>.modal-card:has(.po-form-head)>#modalBody,
  #modal>.modal-card.modal-standard-card>#modalBody,
  #modal>.modal-card:has(.product-form-modal)>#modalBody{
    padding-top:0!important
  }
}

/* ==== form-sticky-title-scroll-footer ==== */
/* PC+phone: tiêu đề form cố định; footer Lưu/Đóng nằm cuối nội dung (không sticky đáy) —
   Loại trừ layout đã khóa riêng (.order-create-head / .quick-customer-*) khỏi rule phá cấu trúc. */
/* Form sản phẩm: head cố định (flex) + cuộn .product-form-scroll — đè mọi rule sticky cũ */
#modal>.modal-card:has(.product-form-modal){
  padding:0!important;overflow:hidden!important;
  display:flex!important;flex-direction:column!important;
  width:min(860px,calc(100vw - 28px))!important;
  max-height:min(92vh,92dvh)!important
}
#modal>.modal-card:has(.product-form-modal)>#modalBody{
  flex:1 1 auto!important;min-height:0!important;
  overflow:hidden!important;display:flex!important;flex-direction:column!important;
  margin:0!important;padding:0!important;box-sizing:border-box!important
}
#modal>.modal-card:has(.product-form-modal) .product-form-modal{
  display:flex!important;flex-direction:column!important;
  flex:1 1 auto!important;min-height:0!important;height:100%!important;overflow:hidden!important
}
#modal>.modal-card:has(.product-form-modal) .product-form-modal > .smart-head,
#modal>.modal-card:has(.product-form-modal) .product-form-head{
  flex:0 0 auto!important;position:relative!important;top:auto!important;z-index:12!important;
  margin:0!important;
  padding:calc(14px + env(safe-area-inset-top,0px)) 20px 12px!important;
  background:var(--surface,var(--card,#fff))!important;
  border-bottom:1px solid var(--line)!important;
  box-shadow:0 8px 18px -14px rgba(15,23,42,.35)
}
#modal>.modal-card:has(.product-form-modal) .product-form-modal > .smart-head h2,
#modal>.modal-card:has(.product-form-modal) .product-form-head h2{margin:0!important;font-size:20px!important;line-height:1.25!important}
#modal>.modal-card:has(.product-form-modal) .product-form-scroll{
  flex:1 1 auto!important;min-height:0!important;
  overflow-y:auto!important;overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  padding:12px 20px max(16px,env(safe-area-inset-bottom,0px))!important;
  box-sizing:border-box!important
}
#modal>.modal-card:has(.product-form-modal) .form-actions-bar,
#modal>.modal-card:has(.product-form-modal) .toolbar.form-actions-bar{
  position:static!important;margin-top:16px!important;
  box-shadow:none!important;background:transparent!important
}
#modal>.modal-card.modal-standard-card{
  padding:0!important;overflow:hidden!important;
  display:flex!important;flex-direction:column!important;
  max-height:min(92vh,92dvh)!important
}
#modal>.modal-card.modal-standard-card>#modalBody{
  flex:1 1 auto!important;min-height:0!important;
  overflow-y:auto!important;overflow-x:hidden!important;
  margin:0!important;padding:0 20px 16px!important;
  box-sizing:border-box!important;-webkit-overflow-scrolling:touch!important
}
#modal>.modal-card.modal-standard-card .modal-standard > h2:first-child,
#modal>.modal-card.modal-standard-card .modal-standard > .smart-head,
#modal>.modal-card.modal-standard-card .discount-form-head{
  position:sticky!important;top:0!important;z-index:12!important;
  margin:0 -20px 12px!important;
  padding:calc(14px + env(safe-area-inset-top,0px)) 20px 12px!important;
  background:var(--surface,var(--card,#fff))!important;
  border-bottom:1px solid var(--line)!important;
  box-shadow:0 8px 18px -14px rgba(15,23,42,.35)
}
#modal>.modal-card.modal-standard-card .modal-standard > h2:first-child{font-size:20px!important;margin-bottom:0!important}
#modal>.modal-card.modal-standard-card .discount-form-head h2{margin:0!important;font-size:20px!important;line-height:1.25!important}
#modal>.modal-card.modal-standard-card .form-actions-bar,
#modal>.modal-card.modal-standard-card .toolbar.form-actions-bar,
#modal>.modal-card.modal-standard-card .toolbar.sticky-actions,
#modal>.modal-card.modal-standard-card .modal-standard > .toolbar:last-of-type{
  position:static!important;box-shadow:none!important;background:transparent!important
}
/* Desktop customer: footer cuối cuộn (không ghim riêng ngoài scroll grid) */
@media(min-width:761px){
  #modal>.modal-card:has(.customer-form-head)>#modalBody{
    overflow-y:auto!important;overflow-x:hidden!important;
    display:block!important;max-height:min(90vh,90dvh)!important
  }
  #modal>.modal-card:has(.customer-form-head) .customer-form-modal{
    display:block!important;max-height:none!important;height:auto!important
  }
  #modal>.modal-card:has(.customer-form-head) .customer-form-head{
    position:sticky!important;top:0!important;z-index:12!important
  }
  #modal>.modal-card:has(.customer-form-head) .customer-form-grid{
    overflow:visible!important;flex:none!important;max-height:none!important
  }
  #modal>.modal-card:has(.customer-form-head) .customer-form-actions{
    position:static!important
  }
}

/* ==== inv-units-grid-css ==== */
/* Inventory units grid: header 1 dòng; tên dòng xe 1 dòng; mã SP hàng dưới */
.dms-grid.inv-units-grid th{white-space:nowrap!important}
.dms-grid.inv-units-grid td.inv-product-cell{
  max-width:none;min-width:220px;white-space:nowrap;line-height:1.35;vertical-align:middle
}
.dms-grid.inv-units-grid td.inv-product-cell b{
  display:block;white-space:nowrap!important;overflow:visible;word-break:normal;overflow-wrap:normal;font-weight:700
}
.dms-grid.inv-units-grid td.inv-product-cell .muted{
  display:block;margin-top:2px;white-space:nowrap
}

/* ==== hide-pwa-fab-logged-in ==== */
/* Ẩn nút Tải ứng dụng khi đã vào app (đã đăng nhập) */
body:has(#app:not(.hidden)) .pwa-install-fab{display:none!important}

/* ==== vin-overview-layout-css ==== */
/* VIN 360 drawer: full-bleed trên mobile (tránh lệch 96vw), desktop giữ max 980 */
.drawer:has(.vin-passport),
.drawer:has(.vin-tab-body){
  width:min(980px,100vw)!important;
  max-width:100vw!important;
}
@media (max-width:700px){
  .drawer:has(.vin-passport),
  .drawer:has(.vin-tab-body){
    width:100%!important;
    max-width:100vw!important;
    left:0!important;right:0!important;inset:0!important;
  }
}
.drawer-body:has(.vin-passport),
.drawer-body:has(.vin-tab-body){
  overflow-x:hidden!important;
  max-width:100%;
  box-sizing:border-box;
}
.drawer-body:has(.vin-tab-body) .vin-passport,
.drawer-body:has(.vin-tab-body) .vin-actions,
.drawer-body:has(.vin-tab-body) .vin-tab-body,
.drawer-body:has(.vin-tab-body) .panel{
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}
.drawer-body:has(.vin-tab-body) .cards2,
.drawer-body:has(.vin-tab-body) .vin-overview-cards{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}
.drawer-body:has(.vin-tab-body) .cards2 > *,
.drawer-body:has(.vin-tab-body) .vin-overview-cards > *{
  min-width:0!important;
  max-width:100%;
  overflow:hidden;
  box-sizing:border-box;
}
.drawer-body:has(.vin-tab-body) .info-list{
  display:grid!important;
  grid-template-columns:minmax(112px,36%) minmax(0,1fr)!important;
  gap:8px 10px!important;
  font-size:12px!important;
  align-items:start;
  width:100%;
  max-width:100%;
}
.drawer-body:has(.vin-tab-body) .info-list dt,
.drawer-body:has(.vin-tab-body) .info-list dd{
  font-size:12px!important;
  line-height:1.45;
  min-width:0;
}
.drawer-body:has(.vin-tab-body) .info-list dd{
  overflow-wrap:anywhere;
  word-break:break-word;
}
.drawer-body:has(.vin-tab-body) .tabs{
  display:flex!important;
  width:100%;
  box-sizing:border-box;
}
.drawer-body:has(.vin-tab-body) .badge:empty{display:none!important}
@media (max-width:900px){
  .drawer-body:has(.vin-tab-body) .cards2,
  .drawer-body:has(.vin-tab-body) .vin-overview-cards{
    grid-template-columns:1fr!important;
  }
}
@media (max-width:700px){
  .drawer-body:has(.vin-tab-body) .info-list{
    grid-template-columns:minmax(100px,32%) minmax(0,1fr)!important;
  }
  .drawer-body:has(.vin-tab-body) .tabs button{
    padding-left:12px;padding-right:12px;
  }
}

/* ==== drawer-scroll-lock-fix ==== */
/* Drawer open: KHÔNG position:fixed + top:-scrollY (gây mảng trắng cạnh sidebar khi đã scroll) */
html.drawer-open,html.drawer-open body{
  overflow:hidden!important;
  overscroll-behavior:none!important;
  height:100%!important;
}
body.drawer-open{
  position:static!important;
  top:auto!important;
  left:auto!important;
  right:auto!important;
  width:auto!important;
  overflow:hidden!important;
  overscroll-behavior:none!important;
}
body.drawer-open .app{
  overflow:hidden!important;
  overscroll-behavior:none!important;
  pointer-events:none;
}
body.drawer-open #drawer,
body.drawer-open #drawerBackdrop{pointer-events:auto}
body.drawer-open aside#sidebar{
  /* Giữ menu tối / không lộ nền trắng phía sau khi khóa cuộn */
  background:linear-gradient(180deg,var(--nav),var(--nav2))!important;
}

/* ==== v499-device-ux ==== */
/* ATT DealerOS · Device UX polish (PC / iPad / phone / iPhone latest)
   Skill: touch≥44 iOS / ≥48 Android · safe-area · no flicker · no AI-glass · brand cyan */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .smart-create-btn:after{animation:none!important}
}
/* Press feedback — không dịch layout (tránh lòe) */
@media (hover:hover) and (pointer:fine){
  .btn:hover{transform:translateY(-1px)}
}
@media (pointer:coarse){
  .btn:hover,.smart-tile:hover,.quick-action:hover,.tabs button:hover{transform:none!important;box-shadow:none}
  .btn:active,.icon-btn:active,.notify-btn:active,.user-avatar-btn:active,
  .quick-action:active,.smart-tile:active,nav button:active,.attention-item:active{
    opacity:.82;transform:none!important
  }
  .btn.primary{background:var(--accent)!important;box-shadow:none!important}
  .smart-create-btn,.smart-launch,.quick-action.primary{
    background:var(--accent)!important;box-shadow:none!important
  }
  .smart-create-btn:after{display:none!important}
}
/* iOS / iPhone — chrome đục, touch 44, không backdrop */
html.platform-ios .btn,
html.platform-ios .icon-btn,
html.platform-ios .notify-btn,
html.platform-ios .user-avatar-btn,
html.platform-ios #menuBtn,
html.platform-ios #refreshBtn,
html.platform-ios #themeBtn,
html.platform-ios #notifyBtn,
html.platform-ios .pager button,
html.platform-ios .tabs button,
html.platform-ios .vin-chip,
html.platform-ios .quick-action,
html.platform-ios .attention-item{
  min-height:44px;min-width:44px
}
html.platform-ios .topbar-host,
html.platform-ios .topbar,
html.platform-ios .modal-card,
html.platform-ios .drawer,
html.platform-ios aside#sidebar{
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;filter:none!important
}
html.platform-ios .modal{
  padding:max(8px,var(--sat,env(safe-area-inset-top,0px))) 10px max(8px,var(--sab,env(safe-area-inset-bottom,0px)))!important
}
html.platform-ios .drawer{
  padding-bottom:env(safe-area-inset-bottom,0px)
}
html.platform-ios .toast-item{border-radius:12px}
/* Tablet / iPad */
@media (min-width:768px) and (max-width:1180px){
  .content{padding:16px 20px max(24px,env(safe-area-inset-bottom,0px))!important}
  .stats.executive.six{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px}
  .quick-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .dashboard-grid-main{grid-template-columns:1fr!important}
  .cards3{grid-template-columns:1fr 1fr!important}
  .command-hero{padding:18px 20px;border-radius:18px;gap:16px}
  .health-ring{width:72px;height:72px;flex:0 0 auto}
  .table-wrap{max-height:min(62vh,560px)}
}
/* Phone */
@media (max-width:900px){
  .stats.executive.six{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .stats.executive .stat{padding:12px!important}
  .stats.executive .stat .value{font-size:20px!important;letter-spacing:-.4px}
  .stats.executive .stat .hint{font-size:10px;line-height:1.35;margin-top:4px}
  .quick-actions{grid-template-columns:1fr 1fr!important;gap:8px!important}
  .quick-action{min-height:72px;padding:12px;border-radius:14px;grid-template-columns:36px 1fr}
  .quick-action>span{width:36px;height:36px;font-size:16px}
  .command-hero{
    flex-direction:row;align-items:center;padding:16px;border-radius:16px;
    box-shadow:0 8px 24px rgba(13,49,82,.14)!important
  }
  .command-hero:after{display:none!important}
  .command-hero h1{font-size:18px!important;margin:4px 0}
  .command-hero p{font-size:12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .health-ring{width:64px;height:64px}
  .dashboard-grid-main{grid-template-columns:1fr!important;gap:12px}
  .cards3,.cards2{grid-template-columns:1fr!important}
  .chart-wrap.tall{height:240px}
  .chart-wrap.sm{height:200px}
  .attention-panel{max-height:none}
  .attention-list{max-height:280px}
  .page-actions,.toolbar,.filter-bar{gap:8px}
  .page-actions .btn,.toolbar .btn{min-height:44px}
  .modal-card{width:100%!important;max-height:min(94dvh,940px);border-radius:16px 16px 0 0!important;padding:16px 14px max(16px,env(safe-area-inset-bottom,0px))!important}
  .drawer{width:100vw!important;max-width:100vw!important}
  .form-grid,.form-grid.three{grid-template-columns:1fr!important}
  .table-wrap{border-radius:12px;-webkit-overflow-scrolling:touch;overflow-x:auto!important;overflow-y:auto!important;touch-action:pan-x pan-y;overscroll-behavior-x:contain}
  /* Gợi ý kéo ngang bảng (Khách hàng / Đơn…) */
  .dms-panel .table-wrap.dms-grid,
  .orders-panel .table-wrap.orders-grid{
    position:relative;
    overflow-x:auto!important;
    touch-action:pan-x pan-y!important;
    -webkit-overflow-scrolling:touch!important
  }
  /* absolute overlay — NOT sticky+float (float height:100% doubles scrollHeight and yeets sticky thead) */
  .dms-panel .table-wrap.dms-grid::after,
  .orders-panel .table-wrap.orders-grid::after{
    content:"";pointer-events:none;position:absolute;float:none;inset:0 0 0 auto;
    width:28px;height:auto;min-height:0;margin:0;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.92));
    z-index:3
  }
  html[data-theme="dark"] .dms-panel .table-wrap.dms-grid::after,
  html[data-theme="dark"] .orders-panel .table-wrap.orders-grid::after{
    background:linear-gradient(90deg,transparent,rgba(13,27,42,.92))
  }
  /* Topbar: luôn hiện chuông / theme / refresh */
  .top-actions #refreshBtn,
  .top-actions #themeBtn,
  .top-actions #notifyBtn{
    display:inline-grid!important;visibility:visible!important;opacity:1!important;
    place-items:center;flex:0 0 auto!important;width:44px!important;height:44px!important;min-width:44px!important
  }
  .topbar,.topbar-host{overflow:visible!important}
}
@media (max-width:560px){
  .stats.executive.six{grid-template-columns:1fr 1fr!important}
  .quick-actions{grid-template-columns:1fr!important}
  .command-hero{flex-wrap:wrap}
  .health-ring{margin-left:auto}
}
/* PC dense but calm — không glow */
@media (min-width:1181px){
  .btn.primary{box-shadow:0 4px 12px rgba(18,169,223,.18)}
  .quick-actions{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-bottom:12px}
  .stats.executive.six{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:12px}
  .stats.executive .stat{padding:12px 14px}
  .command-hero{padding:18px 22px;margin-bottom:12px;border-radius:18px;gap:16px}
  .command-hero h1{font-size:22px;margin:4px 0}
  .command-hero p{font-size:12.5px;max-width:52ch}
  .dashboard-grid-main{grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr);gap:12px;margin-bottom:12px}
  .cards3,.cards2{gap:12px}
  .panel{padding:12px 14px;margin-bottom:12px}
  .chart-wrap.tall{height:300px}
  .content:not(:has(.dms-workspace)):not(:has(.orders-workspace)){padding:14px 18px 20px!important}
}
/* Focus visible — bàn phím / a11y */
.btn:focus-visible,.icon-btn:focus-visible,.notify-btn:focus-visible,
.user-avatar-btn:focus-visible,nav button:focus-visible,.quick-action:focus-visible{
  outline:2px solid color-mix(in srgb,var(--accent) 55%,transparent);
  outline-offset:2px
}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
/* iOS: input < 16px sẽ bị Safari zoom khi focus — :not(#_) nâng specificity lên trên mọi rule !important dạng class */
html.platform-ios :is(input:not([type=checkbox]):not([type=radio]),select,textarea):not(#_){font-size:16px!important}
/* Card mobile (≤640px): rule bảng list (max-content + nowrap) không được áp lên table.rt-cards */
@media(max-width:640px){
  .dms-panel .table-wrap.dms-grid table.rt-cards,
  .orders-panel .table-wrap.orders-grid table.rt-cards{width:100%!important;min-width:0!important}
  .dms-panel .table-wrap.dms-grid table.rt-cards td,
  .orders-panel .table-wrap.orders-grid table.rt-cards td,
  .dms-panel .table-wrap.dms-grid table.rt-cards td :not(.badge),
  .orders-panel .table-wrap.orders-grid table.rt-cards td :not(.badge){white-space:normal!important;overflow-wrap:anywhere}
  .dms-panel .table-wrap.dms-grid:has(table.rt-cards)::after,
  .orders-panel .table-wrap.orders-grid:has(table.rt-cards)::after{display:none!important}
}
/* Cảm ứng: nút thao tác chính trong form & phân trang tối thiểu 44px */
@media(pointer:coarse){
  :is(.modal,.drawer) :is(.toolbar,.sticky-actions,.form-actions-bar) .btn:not(#_),
  .pager .btn:not(#_),.dms-cmd .btn:not(#_){min-height:44px!important}
}
/* iPad dọc / tablet nhỏ (641–900px): 2 cột thay vì bố cục điện thoại 1 cột */
@media(min-width:641px) and (max-width:900px){
  html body .form-grid,html body .form-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  html body .form-grid>.span2,html body .form-grid>.span3{grid-column:1/-1!important}
  html body .cards2{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  html body .stats.executive.six{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  html body .quick-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  html body .drawer{width:min(720px,100vw)!important;max-width:100vw!important}
  html body .content{padding:14px 16px max(20px,env(safe-area-inset-bottom,0px))!important}
}
@media(min-width:761px) and (max-width:900px){
  html body .modal-card.modal-standard-card{width:min(780px,calc(100vw - 32px))!important;border-radius:16px!important}
}
/* Header 901–1366px (iPad ngang, laptop): không để avatar/chuông bị đẩy ra ngoài */
@media(min-width:901px) and (max-width:1366px){
  .top-actions #branchFilter:not(#_){min-width:160px!important;width:clamp(160px,18vw,260px)!important;max-width:260px!important;flex:0 1 220px}
  .top-actions .global-search-wrap:not(#_){min-width:120px!important}
  #securityPill,.top-actions .country-indicator{display:none!important}
}

/* ==== ai-assistant ==== */
.ai-fab{position:fixed;right:max(18px,env(safe-area-inset-right,0px));bottom:max(18px,calc(env(safe-area-inset-bottom,0px) + 12px));z-index:190;width:52px;height:52px;border-radius:50%;border:0;cursor:grab;background:linear-gradient(135deg,var(--accent),var(--purple));color:#fff;font-size:22px;display:grid;place-items:center;box-shadow:0 6px 16px rgba(18,42,71,.2);opacity:.5;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;transition:opacity .2s ease,transform .15s ease,left .18s ease,top .18s ease}
.ai-fab:hover,.ai-fab:focus-visible,.ai-fab.dragging,.ai-fab[aria-expanded="true"]{opacity:1}
.ai-fab.dragging{cursor:grabbing;transition:opacity .2s ease;transform:scale(1.08);box-shadow:0 12px 28px rgba(18,42,71,.3)}
.ai-fab:active:not(.dragging){transform:scale(.94)}
.ai-fab:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.ai-panel{position:fixed;right:max(18px,env(safe-area-inset-right,0px));bottom:calc(max(18px,calc(env(safe-area-inset-bottom,0px) + 12px)) + 64px);z-index:210;width:min(420px,calc(100vw - 36px));height:min(640px,calc(100dvh - 120px));background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-lg);overflow:hidden;display:flex}
.ai-panel.hidden{display:none}
body:has(.ai-page) .ai-fab,body:has(.ai-page) .ai-panel{display:none!important}
.ai-shell{display:flex;flex-direction:column;width:100%;height:100%;min-height:0;background:var(--card);color:var(--text)}
.ai-shell.page{border:1px solid var(--line);border-radius:18px;overflow:hidden;height:calc(100dvh - 150px);min-height:420px;max-width:980px;margin:0 auto}
.ai-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 10px 10px 14px;border-bottom:1px solid var(--line);background:var(--card2)}
.ai-head-title{display:flex;align-items:center;gap:10px;min-width:0}
.ai-head-title small{display:block;color:var(--muted);font-size:11px}
.ai-head-ico{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--accent),var(--purple));flex:0 0 auto}
.ai-head-btns{display:flex;gap:4px}
.ai-head-btns .icon-btn{width:36px;height:36px;border-radius:10px;border:0;background:transparent;color:var(--muted);font-size:18px;cursor:pointer}
.ai-head-btns .icon-btn:hover{background:color-mix(in srgb,var(--accent) 10%,transparent);color:var(--text)}
.ai-body{flex:1;min-height:0;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.ai-msg{display:flex}
.ai-msg.me{justify-content:flex-end}
.ai-bubble{max-width:88%;padding:9px 12px;border-radius:14px;font-size:13.5px;line-height:1.5;overflow-wrap:anywhere;background:var(--card2);border:1px solid var(--line)}
.ai-msg.me .ai-bubble{background:var(--accent);border-color:var(--accent);color:#fff;border-bottom-right-radius:4px}
.ai-msg.bot .ai-bubble{border-bottom-left-radius:4px}
.ai-msg.err .ai-bubble{border-color:color-mix(in srgb,var(--danger) 45%,var(--line));color:var(--danger)}
.ai-msg.notice .ai-bubble{border-color:color-mix(in srgb,var(--warn) 50%,var(--line));background:color-mix(in srgb,var(--warn) 8%,var(--card));color:var(--warn);font-weight:600}
.ai-cfg-panel .panel-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.ai-cfg-panel .panel-head p{margin:4px 0 0}
.ai-cfg-control{display:flex;align-items:center;gap:10px}
.ai-switch{position:relative;width:52px;height:30px;border-radius:999px;border:0;cursor:pointer;background:var(--line);transition:background .2s ease;flex:0 0 auto;padding:0}
.ai-switch.on{background:var(--ok)}
.ai-switch-knob{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .2s ease}
.ai-switch.on .ai-switch-knob{transform:translateX(22px)}
.ai-switch:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ai-switch[data-busy="1"]{opacity:.6;cursor:progress}
.ai-switch-label{min-width:70px}
.ai-bubble p{margin:0 0 6px}.ai-bubble p:last-child{margin-bottom:0}
.ai-bubble ul,.ai-bubble ol{margin:4px 0 6px;padding-left:20px}
.ai-bubble h4{margin:8px 0 4px;font-size:13.5px}
.ai-bubble code{font-size:12px;padding:1px 5px;border-radius:5px;background:color-mix(in srgb,var(--accent) 10%,transparent)}
.ai-table-wrap{overflow-x:auto;margin:6px 0;border:1px solid var(--line);border-radius:10px}
.ai-table{border-collapse:collapse;width:100%;font-size:12.5px}
.ai-table th,.ai-table td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
.ai-table th{background:var(--card);font-weight:600}
.ai-table tr:last-child td{border-bottom:0}
.ai-action{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:8px;padding:10px;border-radius:12px;background:var(--card);border:1px solid var(--line)}
.ai-action.write{border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}
.ai-act-main{min-width:0;flex:1 1 180px}
.ai-act-sum{font-size:12.5px;margin-top:2px}
.ai-act-note{font-size:11.5px;color:var(--warn);margin-top:4px}
.ai-act-btns{display:flex;gap:6px;align-items:center}
.ai-act-state{font-size:12px;color:var(--muted)}
.ai-welcome{margin:auto 0;text-align:center;padding:10px 4px}
.ai-welcome h3{margin:8px 0 6px;font-size:16px}
.ai-welcome p{font-size:13px;line-height:1.5;margin:0 auto 12px;max-width:52ch}
.ai-welcome-ico{width:48px;height:48px;margin:0 auto;border-radius:14px;display:grid;place-items:center;font-size:22px;color:#fff;background:linear-gradient(135deg,var(--accent),var(--purple))}
.ai-warn{color:var(--warn)!important;font-weight:600}
.ai-salute{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;border-bottom:1px dashed color-mix(in srgb,var(--accent) 60%,transparent)}
.ai-salute:hover{color:var(--accent)}
.ai-salute:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.ai-chips{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.ai-chip{border:1px solid var(--line);background:var(--card2);color:var(--text);border-radius:999px;padding:7px 12px;font-size:12.5px;cursor:pointer;min-height:36px}
.ai-chip:hover{border-color:var(--accent);color:var(--accent)}
.ai-typing{display:flex;gap:4px;align-items:center;min-height:20px}
.ai-typing span{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:aiDot 1s infinite ease-in-out}
.ai-typing span:nth-child(2){animation-delay:.15s}.ai-typing span:nth-child(3){animation-delay:.3s}
@keyframes aiDot{0%,80%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.ai-compose{display:flex;gap:8px;align-items:flex-end;padding:10px;border-top:1px solid var(--line)}
.ai-compose textarea{flex:1;resize:none;min-height:40px;max-height:140px;padding:9px 12px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--text);font:inherit;font-size:14px;line-height:1.4}
.ai-compose .btn{min-width:44px;min-height:40px;padding:0 12px}
.ai-foot{font-size:10.5px;text-align:center;padding:0 10px 8px}
@media (max-width:900px){
  .ai-fab{width:48px;height:48px;font-size:20px;bottom:max(14px,calc(env(safe-area-inset-bottom,0px) + 10px));right:max(14px,env(safe-area-inset-right,0px))}
  .ai-panel{inset:0;right:0;bottom:0;width:100vw;height:100dvh;border-radius:0;border:0;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);box-sizing:border-box}
  .ai-shell.page{height:calc(100dvh - 130px);border-radius:14px}
  .ai-bubble{max-width:92%}
}
body.drawer-open .ai-fab,body:has(.modal:not(.hidden)) .ai-fab{display:none}
/* .app bị pointer-events:none khi drawer mở — khung chat nằm trong #app vẫn phải bấm được */
body.drawer-open .ai-panel{pointer-events:auto}
#modal>.modal-card:has(#kpiTargetEdit){width:min(420px,calc(100vw - 32px))!important;max-width:420px!important}
#modal .modal-standard>h2:first-child:has(+.kpi-edit-branch){margin-bottom:4px!important}
.kpi-edit-branch{margin:0 0 12px}
#modal .modal-standard .form-grid:has(#kpiTargetEdit){grid-template-columns:1fr!important}
.orders-grid td[data-col=vins],.orders-grid td[data-col=product_names]{vertical-align:top!important;padding-top:9px!important}
.order-products>div{overflow:hidden;text-overflow:ellipsis}
.orders-grid .mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11.5px;letter-spacing:.2px}
.vin-list summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:6px;user-select:none;color:var(--primary,#2563eb);font-weight:600}
.vin-list summary:hover .vin-open,.vin-list summary:hover .vin-close{text-decoration:underline}
.vin-list .vin-close,.vin-list[open] .vin-open{display:none}
.vin-list[open] .vin-close{display:inline}
.vin-list summary::-webkit-details-marker{display:none}
.vin-list summary::after{content:"";width:5px;height:5px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(45deg) translateY(-2px);opacity:.55;transition:transform .15s}
.vin-list[open] summary::after{transform:rotate(-135deg) translateY(-1px)}
.vin-list summary .badge{padding:1px 6px;font-size:10.5px}
.vin-list ol{margin:6px 0 2px;padding:6px 4px 0 0;list-style:none;counter-reset:vin;border-top:1px dashed rgba(120,135,155,.35);display:grid;gap:4px;max-height:240px;overflow-y:auto;scrollbar-width:thin}
.vin-list li{counter-increment:vin;display:grid;grid-template-columns:2.6em minmax(0,1fr);column-gap:4px;align-items:baseline}
.vin-list li::before{content:counter(vin) ".";grid-row:span 2;text-align:right;color:var(--muted,#64748b);font-size:11px;font-variant-numeric:tabular-nums}
.vin-list li>.table-link{justify-self:start}
.prod-list li::before{grid-row:auto}
.prod-list .prod-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vin-list li small{display:block;font-size:10.5px;line-height:1.2;overflow:hidden;text-overflow:ellipsis}