:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:#142237;background:#eef5fa;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top left,#ddf1ff,transparent 34rem),#f4f8fb}button,input,select{font:inherit}.shell{width:min(1160px,100%);margin:auto;padding:18px 14px 40px}.header,.page-head,.toolbar,.quick,.debt-hero,.month-panel{display:flex;align-items:center;justify-content:space-between;gap:14px}.header{padding:6px 2px 18px}.brand{display:flex;align-items:center;gap:12px}.brand small,.view small,.dialog-head small{color:#0878ef;font-size:11px;font-weight:800;letter-spacing:.12em}.brand h1{margin:2px 0 0;font-size:22px}.logo{display:grid;width:46px;height:46px;place-items:center;border-radius:15px;background:#0878ef;font-size:24px;box-shadow:0 8px 18px #0878ef38}.tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;padding:5px;border:1px solid #d8e4ee;border-radius:16px;background:#fff;box-shadow:0 8px 24px #3341550b}.tab{border:0;border-radius:11px;background:transparent;padding:11px 6px;color:#64748b;font-size:13px;font-weight:700;cursor:pointer}.tab.active{background:#eaf5ff;color:#0878ef}.view{display:none;margin-top:18px}.view.active{display:block}.toolbar,.quick,.month-panel{padding:15px 17px;border:1px solid #dbe7ef;border-radius:18px;background:#fff}.toolbar strong{display:block;margin-top:4px;text-transform:capitalize}.toolbar input,.month-panel input{max-width:170px}.summary-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:12px 0}.summary{position:relative;overflow:hidden;min-height:128px;padding:15px;border:1px solid #dce7ee;border-radius:20px;background:#fff;box-shadow:0 7px 20px #3341550a}.summary>span{float:right;font-size:24px}.summary small{display:block;margin-top:14px}.summary strong{display:block;margin-top:8px;font-size:18px}.summary p{margin:4px 0 0;color:#6b7c8f;font-size:11px}.summary.blue{background:linear-gradient(145deg,#edf8ff,#fff)}.summary.green{background:linear-gradient(145deg,#ecfbf5,#fff)}.summary.amber{background:linear-gradient(145deg,#fff8e7,#fff)}.summary.red{background:linear-gradient(145deg,#fff0f1,#fff)}.quick{margin-bottom:22px}.quick h2,.page-head h2,.section-head h2{margin:3px 0 0;font-size:19px}.quick>div:last-child{display:flex;gap:8px}.btn{min-height:42px;border:1px solid transparent;border-radius:12px;padding:0 15px;font-weight:750;cursor:pointer}.btn.primary{background:#0878ef;color:#fff}.btn.green{background:#079669;color:#fff}.btn.secondary{border-color:#cee0ec;background:#fff;color:#31506c}.section-head{display:flex;align-items:end;justify-content:space-between;margin:18px 2px 10px}.pill{border-radius:999px;background:#e8f4fe;padding:5px 9px;color:#0872dd;font-size:11px;font-weight:800}.page-head{margin-bottom:14px;padding:8px 2px}.entry-list{display:grid;gap:9px}.entry,.customer-card,.debtor{border:1px solid #dce6ed;border-radius:18px;background:#fff;box-shadow:0 7px 20px #3341550a}.entry{padding:14px}.entry-top,.entry-values,.customer-top,.customer-stat,.debtor{display:flex;align-items:center;justify-content:space-between;gap:10px}.entry h3,.customer-card h3{margin:0;font-size:15px}.entry-badge{margin-left:7px;border-radius:999px;background:#eaf5ff;padding:4px 7px;color:#0878ef;font-size:9px;font-weight:800}.entry-badge.payment{background:#eaf9f3;color:#07865f}.entry-date,.muted{color:#718196;font-size:12px}.entry-values{margin-top:13px}.entry-values div{min-width:0}.entry-values small{color:#8190a0;letter-spacing:0}.entry-values strong{display:block;margin-top:2px;font-size:13px}.delete,.edit{border:0;border-radius:9px;background:#f5f8fa;padding:8px;color:#61758a;cursor:pointer}.delete:hover{background:#fff0f0;color:#d9353e}.empty{padding:48px 18px;border:1px dashed #bfd9ea;border-radius:20px;background:#fff;text-align:center;color:#6b7c8f}.debt-hero{margin-bottom:14px;padding:20px;border:1px solid #ffd4d6;border-radius:22px;background:linear-gradient(135deg,#fff1f2,#fff)}.debt-hero small{color:#c9363f}.debt-hero strong{display:block;margin-top:8px;font-size:28px;color:#c9232e}.debt-hero p{margin:3px 0;color:#64748b;font-size:13px}.card-grid{display:grid;gap:10px}.debtor{padding:14px}.debtor strong{color:#d12530}.month-panel{margin-bottom:13px;background:linear-gradient(135deg,#ecf8ff,#fff)}.month-panel strong{display:block;margin-top:5px}.customer-card{padding:14px}.avatar{display:grid;width:40px;height:40px;place-items:center;border-radius:13px;background:#ddf2ff;color:#0878ef;font-weight:900}.customer-top>div:first-child{display:flex;align-items:center;min-width:0;gap:10px}.customer-stat{margin-top:12px;padding:9px 10px;border-radius:11px;background:#edf8ff;color:#42627e;font-size:11px}.customer-stat strong{color:#0878ef}.customer-card .debt-row{display:flex;justify-content:space-between;margin-top:10px;font-size:12px}.positive{color:#079669}.negative{color:#d12530}footer{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin-top:30px}footer a,footer button{border:1px solid #cbdce8;border-radius:999px;background:#fff;padding:8px 12px;color:#39617f;text-decoration:none;font-size:12px;cursor:pointer}dialog{width:min(520px,calc(100% - 22px));max-height:92vh;overflow:auto;border:0;border-radius:24px;padding:0;box-shadow:0 28px 80px #0f172a45}dialog::backdrop{background:#0f223a77;backdrop-filter:blur(2px)}dialog form{display:grid;gap:15px;padding:20px}.dialog-head{display:flex;align-items:start;justify-content:space-between;border-bottom:1px solid #e8eef2;padding-bottom:14px}.dialog-head h2{margin:3px 0 0}.icon-btn{width:36px;height:36px;border:0;border-radius:11px;background:#f1f5f8;color:#5f7182;font-size:23px;cursor:pointer}label{display:grid;gap:7px;color:#26394f;font-size:13px;font-weight:750}input,select{width:100%;height:47px;border:1px solid #cbdce7;border-radius:13px;background:#fff;padding:0 12px;color:#142237;outline:none}input:focus,select:focus{border-color:#39a1f2;box-shadow:0 0 0 3px #dff1ff}.two{display:grid;grid-template-columns:1fr 1fr;gap:11px}.product-pack{padding:12px;border:1px solid #cceef1;border-radius:17px;background:#f0fbfc}.total{display:flex;align-items:center;justify-content:space-between;padding:15px;border:1px solid #bae0fb;border-radius:17px;background:#eff9ff}.total strong{display:block;margin-top:4px;font-size:24px}.total>div:last-child{text-align:right;color:#0878ef;font-size:12px}.chips{float:right;display:flex;gap:5px}.chips button{border:1px solid #cce0eb;border-radius:999px;background:#f8fbfd;padding:5px 8px;color:#50708a;font-size:11px}.debt-preview{display:flex;justify-content:space-between;margin:0;color:#64748b;font-size:12px}.dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;border-top:1px solid #e8eef2;padding-top:15px}#toast{position:fixed;z-index:10;right:16px;bottom:18px;max-width:320px;transform:translateY(80px);opacity:0;border-radius:13px;background:#10263d;padding:12px 15px;color:#fff;font-size:13px;transition:.25s}#toast.show{transform:none;opacity:1}#toast.error{background:#b91c2a}@media(min-width:760px){.shell{padding:26px}.summary-grid{grid-template-columns:repeat(4,1fr)}.card-grid{grid-template-columns:repeat(2,1fr)}.entry-values{justify-content:flex-end;gap:34px}.entry-values .products{margin-right:auto}.brand h1{font-size:26px}}@media(max-width:560px){.header .secondary{font-size:0}.header .secondary::after{content:"＋";font-size:20px}.quick{align-items:flex-start;flex-direction:column}.quick>div:last-child{display:grid;width:100%;grid-template-columns:1fr 1fr}.entry-values{display:grid;grid-template-columns:repeat(3,1fr)}.entry-values .products{grid-column:1/-1}.debt-hero{align-items:flex-start;flex-direction:column}.debt-hero .btn{width:100%}.month-panel{align-items:flex-start;flex-direction:column}.month-panel input{max-width:none}}

/* Phiên bản 2.0: báo cáo, tính lương và phân quyền */
.is-hidden{display:none!important}.tabs{display:flex;overflow-x:auto;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tab{flex:1 0 auto;min-width:90px}.account-box{display:flex;align-items:center;gap:8px}.account-button{display:grid;min-height:42px;border:1px solid #cfe0eb;border-radius:13px;background:#fff;padding:6px 11px;color:#24425d;text-align:left;cursor:pointer}.account-button span{max-width:125px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:800}.account-button small{color:#718196;font-size:9px}.entry-people{display:block;margin-top:5px;color:#52708b;font-size:11px}.helper-note{margin:-6px 1px 0;color:#6b7c8f;font-size:11px}.full{width:100%}.check-row{display:flex;align-items:center;gap:9px}.check-row input{width:19px;height:19px}.form-section{margin:3px 0 -5px;color:#143552;font-size:14px}.settings-warning{margin:0;border-radius:12px;background:#fff7df;padding:10px;color:#795d12;font-size:11px}.finance-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.finance-card{min-height:130px;border:1px solid #dce7ee;border-radius:20px;background:#fff;padding:16px;box-shadow:0 7px 20px #3341550a}.finance-card small{display:block}.finance-card strong{display:block;margin-top:9px;font-size:22px}.finance-card p{margin:5px 0 0;color:#6b7c8f;font-size:11px}.finance-card.revenue{background:linear-gradient(145deg,#edf8ff,#fff)}.finance-card.cost{background:linear-gradient(145deg,#fff8e7,#fff)}.finance-card.salary{background:linear-gradient(145deg,#f5efff,#fff)}.finance-card.profit{background:linear-gradient(145deg,#eafbf4,#fff)}.finance-card.profit strong{color:#07865f}.report-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:11px 0;padding:13px;border:1px solid #dce7ee;border-radius:18px;background:#fff}.report-strip div{padding:5px 10px;border-right:1px solid #e4edf2}.report-strip div:last-child{border:0}.report-strip small{display:block;color:#718196;font-size:9px;letter-spacing:.08em}.report-strip strong{display:block;margin-top:4px;font-size:14px}.report-columns{display:grid;gap:14px}.payroll-card,.daily-card,.person-card{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #dce6ed;border-radius:16px;background:#fff;padding:13px;box-shadow:0 6px 18px #33415508}.payroll-card p,.daily-card p,.person-card p{margin:3px 0 0;color:#718196;font-size:11px}.payroll-card>div:last-child,.daily-card>div:last-child{text-align:right}.payroll-card>div:last-child>strong,.daily-card>div:last-child>strong{display:block;color:#0878ef}.payroll-card small,.daily-card small{color:#718196;font-size:10px}.team-actions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:7px}.person-card>div:last-child{display:flex;align-items:center;gap:7px}.person-card.inactive{opacity:.55}.status,.role-badge{border-radius:999px;padding:5px 8px;font-size:9px;font-weight:800}.status.on{background:#e8faf2;color:#07865f}.status.off{background:#f1f4f6;color:#6b7c8f}.role-badge.admin{background:#f3eaff;color:#7236b3}.role-badge.manager{background:#eaf5ff;color:#0878ef}.role-badge.staff{background:#eaf9f3;color:#07865f}.permission-guide{margin-top:18px;border:1px solid #dce7ee;border-radius:18px;background:#fff;padding:15px}.permission-guide h3{margin:0 0 8px;font-size:14px}.permission-guide p{margin:5px 0;color:#63768a;font-size:11px}.login-page{display:grid;min-height:100vh;place-items:center;padding:18px}.login-card{width:min(420px,100%);border:1px solid #d6e6f0;border-radius:26px;background:#fff;padding:24px;box-shadow:0 25px 70px #244c6a24}.login-brand{display:flex;align-items:center;gap:12px}.login-brand small{color:#0878ef;font-size:10px;font-weight:900;letter-spacing:.12em}.login-brand h1{margin:2px 0 0;font-size:19px}.login-copy{margin:28px 0 18px}.login-copy h2{margin:0}.login-copy p{margin:6px 0 0;color:#6b7c8f;font-size:12px;line-height:1.5}.login-card form{display:grid;gap:14px}.login-error{min-height:18px;margin:0;color:#c9232e;font-size:12px}.login-local{display:block;margin-top:12px;color:#718196;text-align:center}.btn:disabled{cursor:wait;opacity:.65}

@media(min-width:820px){.finance-grid{grid-template-columns:repeat(4,1fr)}.report-columns{grid-template-columns:1fr 1fr}.account-button span{max-width:200px}}
@media(max-width:560px){.brand h1{font-size:19px}.account-box .customer-add{display:none}.account-button{max-width:105px}.account-button span{max-width:84px}.page-head{align-items:flex-start}.page-head>input{max-width:150px}.finance-card{min-height:116px;padding:13px}.finance-card strong{font-size:18px}.report-strip{grid-template-columns:1fr}.report-strip div{border-right:0;border-bottom:1px solid #e4edf2}.report-strip div:last-child{border-bottom:0}.daily-card{align-items:flex-start;flex-direction:column}.daily-card>div:last-child{text-align:left}.team-actions{display:grid;grid-template-columns:1fr 1fr}.team-actions .btn{padding:0 8px;font-size:11px}}

/* Phiên bản 3.3: chế độ giao hàng dành cho nhân viên */
.staff-tab-label{display:none}.staff-settlement{margin:12px 0 14px;border:1px solid #cfe7f5;border-radius:20px;background:linear-gradient(145deg,#f0f9ff,#fff);padding:15px}.staff-money-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.staff-money-grid article{min-height:105px;border:1px solid #dce8ef;border-radius:16px;background:#fff;padding:13px}.staff-money-grid small{display:block;color:#6b7c8f;font-size:9px;font-weight:850;letter-spacing:.07em}.staff-money-grid strong{display:block;margin-top:8px;color:#12395a;font-size:19px}.staff-money-grid p{margin:5px 0 0;color:#75869a;font-size:10px;line-height:1.35}.staff-link-warning{margin:0 0 11px;border-radius:12px;background:#fff2dc;padding:10px;color:#8a6113;font-size:11px;line-height:1.45}.customer-actions{display:flex;gap:7px;margin-top:9px}.customer-action{display:inline-flex;align-items:center;justify-content:center;min-height:34px;border:1px solid #cfe0eb;border-radius:10px;background:#f8fbfd;padding:0 11px;color:#25618d;text-decoration:none;font-size:11px;font-weight:800}.staff-mode .admin-tab-label{display:none}.staff-mode .staff-tab-label{display:inline}.staff-mode .tabs{position:sticky;z-index:6;top:0;background:#f3f8fc;padding:7px 0}.staff-mode .tabs .tab{min-width:82px}.staff-mode #overview .toolbar small{font-size:0}.staff-mode #overview .toolbar small::after{content:"ĐƠN CỦA TÔI";font-size:10px}.staff-mode #overview .section-head small{letter-spacing:.08em}

@media(max-width:560px){.staff-money-grid{grid-template-columns:1fr 1fr}.staff-money-grid article{min-height:96px;padding:11px}.staff-money-grid strong{font-size:16px}.staff-mode .tabs{margin-left:-14px;margin-right:-14px;padding-left:10px;padding-right:10px}.staff-mode .tabs .tab{min-width:76px;padding-left:10px;padding-right:10px}.customer-actions .customer-action{flex:1}}

.staff-mode .staff-hide{display:none!important}

.admin-handover{margin:12px 0 14px;border:1px solid #cfe7f5;border-radius:20px;background:linear-gradient(145deg,#f7fbff,#fff);padding:15px}.admin-handover .section-head{margin:0 0 8px}.admin-handover .section-head>strong{color:#0878ef;font-size:20px}.admin-handover-list{display:grid;gap:7px}.admin-handover-row{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid #e3edf4;padding:10px 0}.admin-handover-row:first-child{border-top:0}.admin-handover-row>div{display:grid;gap:3px}.admin-handover-row small{color:#718196;font-size:10px}.admin-handover-row>strong{text-align:right;font-size:13px}@media(max-width:560px){.admin-handover .section-head{align-items:flex-start}.admin-handover-row{align-items:flex-start}.admin-handover-row>strong{max-width:42%}}

.pack-toggle{border:1px solid #d8e7ef;border-radius:13px;background:#f8fbfd;padding:11px 12px;cursor:pointer}.pack-toggle span{font-weight:800}.pack-fields{display:grid;gap:12px}.damaged-bottle-field{border:1px solid #ffd6d6;border-radius:14px;background:#fff7f7;padding:11px 12px}.field-hint-inline{color:#8a5d63;font-size:10px;font-weight:600}.damage-deduction{color:#c8323d;font-weight:800}

/* Phiên bản 3.4.0: tách vỏ đầu kỳ khách mượn và vỏ khách đã cọc */
.deposit-toggle{border:1px solid #bee8d8;border-radius:13px;background:#f2fcf8;padding:11px 12px;cursor:pointer;color:#176b52}.deposit-toggle span{font-weight:800}.system-panel{display:grid;gap:10px;border:1px solid #dbe7ef;border-radius:18px;background:#fff;padding:14px}.system-panel+.system-panel{margin-top:12px}.system-panel .section-head{margin:0}.system-panel h3{margin:3px 0 0;font-size:15px}


/* 3.4.0 - nhập vỏ có từ trước */
.legacy-bottle-box{margin:12px 0;padding:14px;border:1px solid #d9e6f2;border-radius:16px;background:#f7fbff}
.legacy-bottle-box>small{display:block;margin-bottom:10px;color:#0878e8;font-weight:800;letter-spacing:.12em}
.legacy-bottle-box .helper-note{margin:8px 0 0;color:#718096;font-size:.86rem;line-height:1.45}
.customer-opening-bottles strong{font-size:.92rem}


/* v3.4.0 — giao diện gọn và ưu tiên thao tác hằng ngày */
.compact-details{margin-top:12px;border:1px solid #dbe7ef;border-radius:16px;background:#fff;padding:0 14px}
.compact-details>summary{cursor:pointer;list-style:none;padding:13px 0;color:#39617f;font-size:12px;font-weight:850}
.compact-details>summary::-webkit-details-marker{display:none}
.compact-details>summary::after{content:"⌄";float:right;color:#7890a4}
.compact-details[open]>summary::after{content:"⌃"}
.compact-detail-grid{margin:0 0 14px}
.staff-owner-card{border-color:#bfe5d5!important;background:linear-gradient(145deg,#edfbf5,#fff)!important}
.staff-owner-card strong{color:#07865f}
.operations-primary-actions{align-items:stretch}
.action-more{position:relative}
.action-more>summary{display:flex;min-height:44px;align-items:center;justify-content:center;border:1px solid #cbdce8;border-radius:13px;background:#fff;padding:0 14px;color:#39617f;font-size:12px;font-weight:800;cursor:pointer;list-style:none}
.action-more>summary::-webkit-details-marker{display:none}
.advanced-actions{display:grid;gap:8px;margin-top:8px;padding:10px;border:1px solid #dbe7ef;border-radius:15px;background:#f8fbfd}
.operation-collapsible{padding:0!important}
.operation-collapsible>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 18px;cursor:pointer;list-style:none}
.operation-collapsible>summary::-webkit-details-marker{display:none}
.operation-collapsible>summary span{display:grid;gap:4px}
.operation-collapsible>summary small{color:#0878ef;font-size:9px;font-weight:900;letter-spacing:.13em}
.operation-collapsible>summary strong{font-size:18px}
.operation-collapsible>summary em{color:#718196;font-size:11px;font-style:normal}
.operation-collapsible>#bottle-balance-list{padding:0 18px 18px}
.report-details{margin-top:16px;padding:0 16px}
.report-details>.report-columns{margin-top:4px;padding-bottom:8px}
.report-details>.daily-payroll-section{padding-bottom:16px}
.permission-guide{padding:0 15px}
.permission-guide>summary{font-size:13px}
.system-export-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.system-export-grid a{display:flex;min-height:42px;align-items:center;justify-content:center;border:1px solid #cbdce8;border-radius:12px;background:#f8fbfd;color:#39617f;text-decoration:none;font-size:11px;font-weight:800}
.delivery-total-card{position:relative;overflow:hidden;background:linear-gradient(135deg,#eef9ff,#f8fffc);border-color:#a9d8f7}
.delivery-total-card>div:first-child{min-width:0}
.delivery-total-card>div:first-child small{color:#143552;font-weight:900;letter-spacing:.06em}
.delivery-total-card>div:first-child strong{font-size:28px;color:#10233b}
.delivery-goods-note{display:block;margin-top:4px;color:#5c7186;font-size:10px;line-height:1.4}
.deposit-addition{color:#07865f;font-weight:850}
.deposit-refund{color:#c8323d;font-weight:850}
.delivery-deposit-payment-note{margin:-6px 2px 0;padding:8px 10px;border-radius:10px;background:#f4faf7;color:#4b6f62}
.payment-result-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.payment-result-grid .debt-preview{border:1px solid #dce7ee;border-radius:12px;background:#f8fbfd;padding:10px;flex-direction:column;gap:4px}
.payment-result-grid .debt-preview strong{font-size:14px}
.customer-bottle-details{margin-top:10px;border:1px solid #dce8ef;border-radius:12px;background:#f8fbfd;padding:0 10px}
.customer-bottle-details>summary{display:flex;align-items:center;justify-content:space-between;padding:10px 0;cursor:pointer;list-style:none;color:#42627e;font-size:11px}
.customer-bottle-details>summary::-webkit-details-marker{display:none}
.customer-bottle-details>summary strong{color:#0878ef}
.customer-bottle-details .customer-stat{margin:0 0 8px;background:#fff}
.dialog-actions{position:sticky;bottom:0;z-index:3;margin:0 -4px;background:#fff;padding:12px 4px max(12px,env(safe-area-inset-bottom));box-shadow:0 -10px 24px #0f172a0a}
@media(max-width:560px){
  dialog form{gap:12px;padding:16px}
  .two{grid-template-columns:1fr 1fr;gap:8px}
  .total{padding:13px}
  .total strong{font-size:22px}
  .total>div:last-child{max-width:52%;font-size:10px}
  .operations-primary-actions{display:grid;grid-template-columns:1fr 1fr}
  .operations-primary-actions>#close-day{grid-column:1/-1}
  .operations-primary-actions>.action-more{grid-column:1/-1}
  .advanced-actions{grid-template-columns:1fr}
  .staff-money-grid{grid-template-columns:1fr 1fr}
  .payment-result-grid{grid-template-columns:1fr 1fr}
  .system-export-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:390px){
  .two{grid-template-columns:1fr}
  .staff-money-grid,.payment-result-grid{grid-template-columns:1fr}
}

/* v3.4.1 — ô thanh toán hiển thị tổng thực thu/chi đã gồm cọc */
.field-hint{display:block;margin-top:1px;color:#718196;font-size:10px;font-weight:600;line-height:1.35}.field-hint.negative{color:#d12530}

/* 3.4.5 — đối soát tiền nhân viên theo nguồn thu */
.staff-money-breakdown article{min-height:112px}.staff-money-breakdown .staff-owner-card{border-color:#b9dcf7;background:linear-gradient(145deg,#eef8ff,#fff)}.staff-money-breakdown .staff-owner-card strong{color:#0878ef}.admin-handover-row small{line-height:1.55}.admin-handover-row>div{min-width:0}
@media(max-width:560px){.staff-money-breakdown article{min-height:102px}.admin-handover-row small{font-size:9.5px}}


/* 3.5.0 — tổng thu theo nguồn + kiểm soát ngày kiểu enterprise */
.summary .summary-source-line{margin-top:3px;color:#536b80;font-size:10px;font-weight:650;line-height:1.35}.day-control{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:10px 0 14px;padding:13px 15px;border:1px solid #d8e6ef;border-radius:17px;background:#fff;box-shadow:0 7px 20px #33415508}.day-control small{display:block;color:#0878ef;font-size:10px;font-weight:850;letter-spacing:.12em}.day-control strong{display:block;margin-top:3px;font-size:14px}.day-control p{margin:4px 0 0;color:#708196;font-size:11px}.day-control-status{flex:none;border-radius:999px;padding:7px 10px;background:#edf7ff;color:#0b6fc7;font-size:10px;font-weight:850;white-space:nowrap}.day-control-status.ok{background:#e9f9f2;color:#087d59}.day-control-status.warning{background:#fff3dc;color:#9a6700}.report-strip p{margin:4px 0 0;color:#718196;font-size:10px;line-height:1.35}@media(max-width:560px){.day-control{align-items:flex-start}.day-control-status{margin-top:1px}.summary{min-height:136px}}

/* 3.8.0 — chi phí phát sinh nhân viên */
.staff-expense-panel{margin:12px 0 14px;border:1px solid #d8e8f3;border-radius:20px;background:#fff;padding:15px}.staff-expense-panel .section-head{margin:0 0 8px}.staff-expense-panel .helper-note{margin:0 0 6px}.staff-expense-row>div:last-child{align-items:flex-end}.expense-review-actions{display:flex!important;flex-direction:row!important;gap:6px;justify-content:flex-end}.expense-review-actions button{white-space:nowrap}@media(max-width:560px){.staff-expense-panel .section-head{align-items:flex-start}.staff-expense-panel .section-head .btn{padding:9px 11px}.expense-review-actions{flex-wrap:wrap}}

/* 3.8.0 - customer quick search */
.customer-search-panel{position:sticky;top:6px;z-index:4;display:flex;align-items:center;gap:10px;margin:0 0 10px;padding:9px;border:1px solid #dbe7ef;border-radius:17px;background:#f7fbfeee;box-shadow:0 8px 22px #3341550d;backdrop-filter:blur(10px)}
.customer-search-box{display:flex;align-items:center;flex:1;min-width:0;height:46px;border:1px solid #cbdce7;border-radius:13px;background:#fff;padding-left:12px;box-shadow:0 2px 8px #33415508}
.customer-search-box:focus-within{border-color:#39a1f2;box-shadow:0 0 0 3px #dff1ff}
.customer-search-box>span{color:#7890a4;font-size:22px;line-height:1}
.customer-search-box input{height:44px;border:0;box-shadow:none;padding:0 9px;background:transparent}
.customer-search-box input:focus{border:0;box-shadow:none}
.customer-search-clear{display:none;width:34px;height:34px;flex:0 0 34px;border:0;border-radius:10px;background:#edf3f7;color:#5d7387;font-size:22px;cursor:pointer}
.customer-search-clear.is-visible{display:block}
.customer-search-count{flex:0 0 auto;border-radius:999px;background:#e9f5ff;padding:7px 10px;color:#0872dd;font-size:11px;font-weight:800;white-space:nowrap}
@media(max-width:560px){.customer-search-panel{top:4px}.customer-search-count{padding:7px 8px}.customer-search-box input{font-size:16px}}

/* 3.12.0 — Enterprise Control Center & Customer Directory */
.enterprise-control{display:block;padding:14px 15px}
.enterprise-control-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.enterprise-control-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px}
.enterprise-control-grid button{display:grid;gap:4px;min-width:0;min-height:88px;text-align:left;border:1px solid #dce8f1;border-radius:14px;background:#f8fbfd;padding:11px 12px;color:#526b80;cursor:pointer}
.enterprise-control-grid button:active{transform:translateY(1px)}
.enterprise-control-grid button small{color:#6d8194;font-size:9px;letter-spacing:.1em}
.enterprise-control-grid button strong{overflow:hidden;color:#173650;font-size:15px;line-height:1.25;text-overflow:ellipsis}
.enterprise-control-grid button span{color:#718196;font-size:10px;line-height:1.35}
.enterprise-control-grid button:first-child{background:#eef8ff;border-color:#cfe7f8}
.enterprise-control-grid button:nth-child(2){background:#fff8ec;border-color:#f1e0bd}
.enterprise-control-grid button:nth-child(3){background:#eef9f5;border-color:#d4eadf}
.enterprise-control-grid button:nth-child(4){background:#fff5f5;border-color:#f2dada}
.customer-search-panel{flex-wrap:wrap}
.customer-filter-bar{display:flex;gap:6px;width:100%;overflow-x:auto;scrollbar-width:none;padding:1px 0}
.customer-filter-bar::-webkit-scrollbar{display:none}
.customer-filter-bar button{flex:0 0 auto;min-height:34px;border:1px solid #d6e4ee;border-radius:999px;background:#fff;padding:0 12px;color:#587086;font-size:11px;font-weight:800;cursor:pointer}
.customer-filter-bar button.active{border-color:#9dd0f5;background:#e9f5ff;color:#0872dd}
.customer-card .edit{min-width:40px;min-height:40px}
@media(max-width:760px){.enterprise-control-grid{grid-template-columns:1fr 1fr}.enterprise-control-grid button{min-height:82px}}
@media(max-width:560px){.enterprise-control{padding:13px}.enterprise-control-head{align-items:flex-start}.enterprise-control-grid{gap:7px}.enterprise-control-grid button{padding:10px;min-height:78px}.enterprise-control-grid button strong{font-size:14px}.customer-search-panel{align-items:stretch}.customer-search-count{align-self:center}}

/* 3.13.0 — Enterprise navigation, touch & accessibility */
.tabs{position:sticky;top:0;z-index:8;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.tab,.btn,.edit,.delete,.customer-action,.account-button{min-height:44px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #bfe3ff;outline-offset:2px}
.view{scroll-margin-top:78px}
@media(max-width:560px){
  .tabs{margin-left:-14px;margin-right:-14px;border-left:0;border-right:0;border-radius:0;padding-left:10px;padding-right:10px}
  .tab{min-width:82px;padding-left:10px;padding-right:10px}
  .page-head h2{font-size:18px}
  .section-head h2{font-size:17px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}


/* 3.15.0 — Customer Intelligence, quick delivery search & annual production */
.customer-month-panel p{margin:4px 0 0;color:#60768b;font-size:12px}
.customer-volume-stat{align-items:flex-start;flex-direction:column;gap:5px}.customer-volume-stat strong{font-size:13px}
.customer-business-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}.customer-business-row>span{display:grid;gap:4px;padding:9px 10px;border:1px solid #e0ebf2;border-radius:11px;color:#6a7f91;font-size:10px}.customer-business-row strong{color:#17324a;font-size:12px}.customer-insight-card-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:11px}.customer-insight-card-actions .btn{min-height:40px;padding:0 10px;font-size:12px}
.delivery-customer-picker{display:grid;gap:9px;padding:12px;border:1px solid #d7e8f3;border-radius:18px;background:linear-gradient(145deg,#f4faff,#fff)}.delivery-customer-search-box{display:flex;align-items:center;height:48px;border:1px solid #bed5e5;border-radius:13px;background:#fff;padding-left:11px}.delivery-customer-search-box:focus-within{border-color:#399ff1;box-shadow:0 0 0 3px #dff1ff}.delivery-customer-search-box>span{color:#7690a5;font-size:20px}.delivery-customer-search-box input{height:46px;border:0;box-shadow:none;background:transparent;padding:0 8px;font-size:16px}.delivery-customer-search-box input:focus{border:0;box-shadow:none}.delivery-customer-search-box button{display:none;width:34px;height:34px;flex:0 0 34px;border:0;border-radius:9px;background:#edf3f7;color:#60768a;font-size:20px}.delivery-customer-search-box button.is-visible{display:block}.delivery-customer-hidden{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}.delivery-customer-quick{display:flex;gap:6px;overflow-x:auto;align-items:center;scrollbar-width:none}.delivery-customer-quick::-webkit-scrollbar{display:none}.delivery-customer-quick span{flex:0 0 auto;color:#74879a;font-size:10px;font-weight:800}.delivery-customer-quick button{flex:0 0 auto;min-height:32px;border:1px solid #d3e2ec;border-radius:999px;background:#fff;padding:0 10px;color:#526d84;font-size:10px;font-weight:800}.delivery-customer-quick button.active{border-color:#8fc9f5;background:#eaf6ff;color:#0876e8}.delivery-customer-results{display:grid;gap:6px;max-height:230px;overflow:auto}.delivery-customer-result{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:9px;width:100%;border:1px solid #dce7ef;border-radius:12px;background:#fff;padding:9px;text-align:left;color:#17324a}.delivery-customer-result.selected{border-color:#58acf0;background:#eef8ff}.delivery-customer-result .avatar{width:36px;height:36px;border-radius:11px}.delivery-customer-result>span:nth-child(2){display:grid;min-width:0;gap:2px}.delivery-customer-result strong{font-size:12px}.delivery-customer-result small,.delivery-customer-result em{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#718498;font-size:9px;font-style:normal}.delivery-customer-result>span:last-child{text-align:right}.delivery-customer-result>span:last-child b{display:block;font-size:10px}.delivery-customer-empty{padding:16px;border:1px dashed #c9dce8;border-radius:12px;text-align:center;color:#718498;font-size:11px}.delivery-customer-selected{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px;border:1px solid #a9d5f7;border-radius:13px;background:#eaf6ff}.delivery-customer-selected.is-empty{display:grid;justify-content:stretch;text-align:center;border-style:dashed;background:#fff;color:#72879a}.delivery-customer-selected>div:first-child{display:flex;align-items:center;gap:9px;min-width:0}.delivery-customer-selected>div:first-child>div{display:grid;min-width:0}.delivery-customer-selected>div:last-child{text-align:right}.delivery-customer-selected strong{font-size:12px}.delivery-customer-selected small{display:block;color:#617a91;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.delivery-customer-selected b{font-size:10px}
.customer-insight-dialog{width:min(880px,calc(100% - 18px))}.customer-insight-shell{display:grid;gap:15px;padding:20px}.customer-insight-toolbar{display:grid;grid-template-columns:1fr 1fr;gap:10px}.customer-insight-kpis,.customer-year-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.customer-insight-kpis article,.customer-year-kpis article{padding:12px;border:1px solid #dce8ef;border-radius:14px;background:#f9fcfe}.customer-insight-kpis small,.customer-year-kpis small{display:block;color:#6b8093;font-size:9px;font-weight:850;letter-spacing:.06em}.customer-insight-kpis strong,.customer-year-kpis strong{display:block;margin-top:5px;color:#0876e8;font-size:15px}.customer-insight-section{padding:13px;border:1px solid #dce8ef;border-radius:17px;background:#fff}.customer-monthly-bars{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;height:120px;margin:8px 0 12px;align-items:end}.customer-monthly-bars button{display:grid;grid-template-rows:1fr auto;align-items:end;height:100%;border:0;background:transparent;padding:0;cursor:pointer}.customer-monthly-bars i{display:block;width:70%;min-height:2px;margin:auto;border-radius:5px 5px 2px 2px;background:#1786ef}.customer-monthly-bars span{margin-top:5px;color:#6c8092;font-size:8px}.customer-month-table-wrap,.customer-year-table-wrap{overflow:auto;border:1px solid #e1eaf0;border-radius:13px}.customer-month-table,.customer-year-table{width:100%;border-collapse:collapse;white-space:nowrap;font-size:10px}.customer-month-table th,.customer-month-table td,.customer-year-table th,.customer-year-table td{border-bottom:1px solid #e9eff3;padding:9px 8px;text-align:right}.customer-month-table th:first-child,.customer-month-table td:first-child,.customer-year-table th:nth-child(2),.customer-year-table td:nth-child(2){text-align:left}.customer-month-table tr.selected{background:#eef7ff}.customer-year-table tbody tr{cursor:pointer}.customer-year-table tbody tr:hover{background:#f3f9fe}.customer-year-table td:nth-child(2) strong,.customer-year-table td:nth-child(2) small{display:block}.customer-year-table td:nth-child(2) small{color:#74869a;font-size:9px}.customer-insight-deliveries{display:grid;gap:7px}.customer-insight-deliveries>div{display:flex;justify-content:space-between;gap:12px;padding:9px 10px;border-radius:11px;background:#f6fafc}.customer-insight-deliveries span{display:grid;gap:2px}.customer-insight-deliveries span:last-child{text-align:right}.customer-insight-deliveries small{color:#718498;font-size:9px}.customer-insight-actions{position:sticky;bottom:0;display:grid;grid-template-columns:1fr 1fr;gap:9px;background:#fff;padding-top:8px}.customer-intelligence-report{margin-top:14px;padding:15px;border:1px solid #dce8ef;border-radius:19px;background:#fff}.customer-intelligence-head{align-items:flex-start}.customer-year-actions{display:flex;gap:7px;align-items:center}.customer-year-actions input{width:110px;height:42px}.customer-year-kpis{grid-template-columns:repeat(6,1fr);margin:10px 0}.customer-year-kpis article:nth-child(4) strong,.customer-year-kpis article:nth-child(5) strong{color:#078d63}.customer-year-kpis article:nth-child(6) strong{color:#d12530}
@media(max-width:700px){.customer-insight-kpis{grid-template-columns:repeat(2,1fr)}.customer-year-kpis{grid-template-columns:repeat(3,1fr)}.customer-intelligence-head{display:grid;gap:10px}.customer-year-actions{width:100%}.customer-year-actions input,.customer-year-actions .btn{flex:1}.customer-year-table{min-width:780px}.customer-business-row{grid-template-columns:1fr}.delivery-customer-result{grid-template-columns:34px minmax(0,1fr)}.delivery-customer-result>span:last-child{grid-column:2;text-align:left;display:flex;gap:8px}.customer-insight-toolbar{grid-template-columns:1fr 1fr}.customer-insight-shell{padding:15px}}
@media(max-width:420px){.customer-insight-kpis{grid-template-columns:1fr 1fr}.customer-year-kpis{grid-template-columns:1fr 1fr}.customer-insight-toolbar{grid-template-columns:1fr}.customer-monthly-bars{height:96px}.customer-insight-card-actions{grid-template-columns:1fr 1fr}}


/* 3.17.0 — Enterprise Daily Overview: compact settlement + compact journal */
.admin-handover{margin:12px 0 14px;padding:17px 18px;border:1px solid #cfe4f3;border-radius:22px;background:#fff;box-shadow:0 10px 28px rgba(29,76,112,.06)}
.admin-handover .section-head{align-items:center;margin:0 0 12px}
.admin-handover .section-head>div small{color:#0878ef;font-size:10px;font-weight:900;letter-spacing:.14em}
.admin-handover .section-head h2{margin-top:5px;font-size:20px}
.admin-handover .section-head>strong{color:#0878ef;font-size:28px;line-height:1;white-space:nowrap}
.admin-handover-list{display:grid;gap:10px}
.handover-person-card{overflow:visible;border:1px solid #d9e6ef;border-radius:17px;background:#fff}
.handover-person-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 13px 9px}
.handover-person{display:flex;align-items:center;gap:10px;min-width:0}
.handover-person>span:last-child{display:grid;gap:2px;min-width:0}
.handover-person strong{font-size:16px;color:#152a3d}
.handover-person small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#6d8194;font-size:11px}
.handover-avatar{display:grid;width:40px;height:40px;flex:0 0 40px;place-items:center;border-radius:50%;background:linear-gradient(145deg,#2a91f3,#6caeff);color:#fff;font-size:15px;font-weight:900}
.handover-avatar.owner-pay{background:linear-gradient(145deg,#27ad7d,#7bd6ad)}
.handover-result{display:grid;gap:2px;flex:none;text-align:right}
.handover-result small{font-size:10px;font-weight:850}
.handover-result strong{font-size:16px;white-space:nowrap}
.handover-mini-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:0 12px 10px}
.handover-mini-grid>span{display:grid;gap:3px;min-width:0;padding:8px 7px;border-radius:11px;background:#f4f8fb;text-align:center}
.handover-mini-grid small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#718497;font-size:9px}
.handover-mini-grid strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#173650;font-size:11px}
.handover-foot{display:flex;align-items:center;gap:8px;min-height:43px;border-top:1px solid #e8eef3;padding:6px 12px;color:#6e8193;font-size:10px}
.handover-foot>span{white-space:nowrap}.handover-foot>span b{color:#37546c}
.handover-foot>i{font-style:normal;color:#b0bdc8}
.handover-detail{margin-left:auto;position:relative}
.handover-detail>summary{min-width:72px;cursor:pointer;list-style:none;border:1px solid #cfe0eb;border-radius:10px;background:#fff;padding:7px 10px;color:#0878ef;text-align:center;font-size:10px;font-weight:850}
.handover-detail>summary::-webkit-details-marker{display:none}
.handover-detail>summary::after{content:" ›";color:#8ca0b1}
.handover-detail[open]>summary::after{content:" ⌃"}
.handover-detail>div{position:absolute;z-index:12;right:0;top:calc(100% + 5px);width:min(330px,calc(100vw - 54px));display:grid;gap:5px;border:1px solid #d8e6ef;border-radius:13px;background:#fff;padding:10px;box-shadow:0 16px 34px rgba(26,56,82,.18)}
.handover-detail p{margin:0;color:#62778a;font-size:10px;line-height:1.4}.handover-detail b{color:#203e57}

.enterprise-quick{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:12px 0 14px;padding:16px 18px;border:1px solid #d7e6f0;border-radius:21px;background:#fff;box-shadow:0 8px 24px rgba(32,73,103,.045)}
.enterprise-quick>div:first-child small{color:#0878ef;font-size:10px;font-weight:900;letter-spacing:.14em}
.enterprise-quick>div:first-child h2{margin-top:4px}
.enterprise-quick>div:last-child{display:grid;grid-template-columns:1fr 1fr;gap:9px;min-width:340px}
.enterprise-quick .btn{min-height:46px;font-size:14px}

.overview-journal{margin:0 0 14px;padding:15px 16px;border:1px solid #d8e6ef;border-radius:21px;background:#fff;box-shadow:0 8px 24px rgba(32,73,103,.045)}
.overview-journal .section-head{margin:0 0 8px}
.overview-journal .section-head small{color:#0878ef;font-size:10px;font-weight:900;letter-spacing:.14em}
.overview-journal .section-head h2{margin-top:4px}
.overview-journal-filters{display:flex;gap:6px;margin-bottom:8px;overflow-x:auto;scrollbar-width:none}
.overview-journal-filters::-webkit-scrollbar{display:none}
.overview-journal-filters button{flex:0 0 auto;min-height:32px;border:1px solid #dbe6ee;border-radius:999px;background:#f7fafc;padding:0 11px;color:#60768a;font-size:10px;font-weight:800;cursor:pointer}
.overview-journal-filters button.active{border-color:#b9dcf7;background:#eaf5ff;color:#0878ef}
.journal-list{display:grid}
.journal-entry{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:74px;border-bottom:1px solid #e8eef3;padding:9px 2px;background:#fff}
.journal-entry:last-child{border-bottom:0}
.journal-kind-icon{display:grid;width:36px;height:36px;place-items:center;border-radius:11px;background:#eaf5ff;color:#0878ef;font-size:14px;font-weight:900}
.journal-kind-icon.payment{background:#eaf9f3;color:#07865f}
.journal-kind-icon.debt{background:#fff2f2;color:#d12530}
.journal-entry-body{display:grid;gap:2px;min-width:0}
.journal-entry-title{display:flex;align-items:center;gap:5px;min-width:0}
.journal-entry-title>strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#172b3e;font-size:13px}
.journal-entry-title .entry-badge{margin-left:0}
.journal-entry-body>small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#76899b;font-size:9px}
.journal-entry-body>p{margin:2px 0 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#536b80;font-size:10px}
.journal-entry-side{display:grid;justify-items:end;gap:5px;min-width:92px}
.journal-entry-side>strong{font-size:12px;white-space:nowrap;color:#0878ef}
.journal-entry-side>strong.positive{color:#07865f}
.journal-entry-actions{display:flex;gap:4px}
.journal-entry-actions .edit,.journal-entry-actions .delete{min-height:30px;padding:5px 8px;border:1px solid #d9e5ed;background:#fff;font-size:9px}
.journal-entry-actions .delete{border-color:#f1d1d4;color:#c72d38}
.overview-show-all{display:block;width:100%;min-height:38px;margin-top:6px;border:0;border-top:1px solid #e8eef3;background:#fff;color:#0878ef;font-size:10px;font-weight:850;cursor:pointer}

@media(max-width:700px){
  .admin-handover{padding:14px 15px;border-radius:19px}
  .admin-handover .section-head h2{font-size:18px}
  .admin-handover .section-head>strong{font-size:23px}
  .enterprise-quick{display:block;padding:14px 15px}
  .enterprise-quick>div:last-child{min-width:0;width:100%;margin-top:10px}
}
@media(max-width:430px){
  .admin-handover{padding:12px 13px}
  .admin-handover .section-head{align-items:flex-start}
  .admin-handover .section-head>div{min-width:0}
  .admin-handover .section-head h2{font-size:16px;line-height:1.2}
  .admin-handover .section-head>strong{font-size:20px}
  .handover-person-head{padding:10px 10px 7px}
  .handover-avatar{width:36px;height:36px;flex-basis:36px}
  .handover-person strong{font-size:14px}
  .handover-person small{font-size:9px}
  .handover-result strong{font-size:14px}
  .handover-mini-grid{gap:4px;padding:0 8px 8px}
  .handover-mini-grid>span{padding:6px 4px}
  .handover-mini-grid small{font-size:7.5px}
  .handover-mini-grid strong{font-size:9px}
  .handover-foot{gap:6px;padding:5px 9px;font-size:9px}
  .handover-detail>summary{min-width:64px;padding:6px 7px;font-size:9px}
  .enterprise-quick{padding:12px 13px;border-radius:18px}
  .enterprise-quick>div:first-child h2{font-size:17px}
  .enterprise-quick .btn{min-height:44px;padding:0 8px;font-size:13px}
  .overview-journal{padding:12px 13px;border-radius:18px}
  .overview-journal .section-head h2{font-size:17px}
  .journal-entry{grid-template-columns:34px minmax(0,1fr) auto;gap:8px;min-height:66px;padding:7px 0}
  .journal-kind-icon{width:32px;height:32px;border-radius:10px;font-size:12px}
  .journal-entry-title>strong{font-size:12px}
  .journal-entry-body>small{font-size:8px}
  .journal-entry-body>p{font-size:9px;max-width:44vw}
  .journal-entry-side{min-width:76px}
  .journal-entry-side>strong{font-size:10px}
  .journal-entry-actions .edit,.journal-entry-actions .delete{min-height:27px;padding:4px 6px;font-size:8px}
}

/* 3.18.0 — Employee Mobile Workflow */
.staff-workflow{margin:10px 0 12px;padding:14px;border:1px solid #cfe4f3;border-radius:20px;background:#fff;box-shadow:0 8px 24px rgba(25,66,98,.05)}
.staff-workflow-head{margin-bottom:9px!important}.staff-workflow-head small{color:#0878ef!important;font-size:9px!important;font-weight:900;letter-spacing:.13em}.staff-workflow-head h2{margin-top:3px;font-size:18px}
.staff-shift-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;border-radius:16px;background:linear-gradient(135deg,#0878ef,#2f8cf0);padding:13px 14px;color:#fff}
.staff-shift-hero>div{min-width:0}.staff-shift-hero small{display:block;font-size:8px;font-weight:900;letter-spacing:.1em;opacity:.82}.staff-shift-hero strong{display:block;margin-top:3px;font-size:27px;line-height:1.08}.staff-shift-hero p{margin:5px 0 0;max-width:440px;font-size:9px;line-height:1.35;opacity:.86}
.staff-shift-status{flex:none;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:rgba(255,255,255,.14);padding:6px 8px;font-size:8px;font-weight:850;white-space:nowrap}.staff-shift-status.ready{background:#eaf9f1;color:#087b56;border-color:#c9ebdc}
.staff-day-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:8px}.staff-day-kpis article{min-width:0;border:1px solid #e1e9ef;border-radius:12px;background:#f7fafc;padding:8px 9px}.staff-day-kpis small{display:block;color:#73869a;font-size:7px;font-weight:850;letter-spacing:.07em}.staff-day-kpis strong{display:block;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#173650;font-size:11px}
.staff-reconcile-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:8px}.staff-reconcile-strip article{min-width:0;border-radius:12px;background:#f4f8fb;padding:8px 9px}.staff-reconcile-strip small{display:block;color:#6e8194;font-size:8px}.staff-reconcile-strip strong{display:block;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#183a57;font-size:11px}.staff-reconcile-strip span{display:block;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#8a9aaa;font-size:7px}
.staff-settlement-more{margin-top:7px}.staff-settlement-more>summary{min-height:34px;border-radius:10px;background:#f8fbfd;padding:9px 11px;color:#0878ef;font-size:9px;font-weight:850}
.staff-detail-ledger{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding-top:7px}.staff-detail-ledger>div{display:grid;gap:2px;min-width:0;border:1px solid #e3ebf1;border-radius:10px;background:#fff;padding:8px}.staff-detail-ledger span{color:#6e8295;font-size:8px}.staff-detail-ledger strong{color:#183a57;font-size:11px}.staff-detail-ledger small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#8a9aaa;font-size:7px}
.staff-shift-readiness{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;border:1px solid #dce8ef;border-radius:13px;background:#fbfdfe;padding:9px 10px}.staff-shift-readiness>div:first-child{min-width:0}.staff-shift-readiness small{display:block;color:#0878ef;font-size:7px;font-weight:900;letter-spacing:.1em}.staff-shift-readiness strong{display:block;margin-top:2px;color:#173650;font-size:11px}.staff-shift-readiness p{margin:2px 0 0;color:#718498;font-size:8px;line-height:1.3}.staff-shift-checks{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px}.staff-shift-checks span{border-radius:999px;background:#eef5fa;padding:5px 7px;color:#536d82;font-size:7px;font-weight:800;white-space:nowrap}
.staff-expense-panel{margin:10px 0 12px!important;padding:12px 13px!important;border-radius:17px!important}.staff-expense-panel .section-head{margin-bottom:0}.staff-expense-panel .section-head h2{font-size:16px}.staff-expense-panel .btn{min-height:35px;padding:0 10px;font-size:10px}.staff-expense-details{margin-top:7px}.staff-expense-details>summary{min-height:34px;border-radius:10px;background:#f7fafc;padding:9px 10px;color:#526d82;font-size:9px;font-weight:800}.staff-expense-details[open]>summary{margin-bottom:5px}
.staff-edit-note{margin:0 0 6px;border-radius:10px;background:#f7fafc;padding:7px 9px;color:#6f8294;font-size:8px;line-height:1.35}
.staff-mode #overview>.summary-grid{display:none}
.staff-mode #overview>.toolbar{min-height:50px;margin-bottom:8px;padding:8px 10px;border-radius:14px}.staff-mode #overview>.toolbar>div strong{font-size:13px}.staff-mode #overview>.toolbar input{height:38px;max-width:150px;font-size:11px}
.staff-mode .enterprise-quick{position:sticky;z-index:5;bottom:calc(env(safe-area-inset-bottom,0px) + 7px);margin:10px 0 12px;padding:10px 11px;border-color:#cfe2ef;box-shadow:0 10px 28px rgba(22,58,85,.13)}
.staff-mode .enterprise-quick>div:first-child{display:none}.staff-mode .enterprise-quick>div:last-child{grid-template-columns:repeat(3,minmax(0,1fr));min-width:0;width:100%;margin:0}.staff-mode .enterprise-quick .btn{min-height:42px;padding:0 8px;font-size:11px}
.staff-mode #overview-journal{margin-top:0}.staff-mode .overview-journal-filters button{min-height:30px;padding:0 10px}
.staff-mode #deliveries .page-head:after{content:"Đơn hôm nay do bạn tạo hoặc được phân công có thể sửa khi nhập sai; ngày cũ và đơn đã chốt chỉ Admin chỉnh.";grid-column:1/-1;color:#718498;font-size:9px;line-height:1.4}

@media(max-width:560px){
  .staff-workflow{padding:11px 12px;border-radius:17px}.staff-workflow-head h2{font-size:16px}.staff-shift-hero{padding:11px 12px;border-radius:14px}.staff-shift-hero strong{font-size:23px}.staff-shift-hero p{font-size:8px}.staff-day-kpis,.staff-reconcile-strip{grid-template-columns:1fr 1fr}.staff-day-kpis article,.staff-reconcile-strip article{padding:7px 8px}.staff-day-kpis strong,.staff-reconcile-strip strong{font-size:10px}.staff-detail-ledger{grid-template-columns:1fr 1fr}.staff-shift-readiness{align-items:flex-start}.staff-shift-checks{max-width:42%}.staff-mode .enterprise-quick .btn{font-size:10px}.staff-mode #overview>.toolbar input{max-width:132px}
}
@media(max-width:390px){
  .staff-shift-hero strong{font-size:20px}.staff-shift-status{font-size:7px}.staff-detail-ledger{grid-template-columns:1fr}.staff-mode .enterprise-quick .btn{font-size:9px;padding:0 5px}.staff-shift-readiness{display:grid}.staff-shift-checks{max-width:none;justify-content:flex-start}
}

/* 3.28.0 — Touch feedback and keyboard focus without adding visual clutter */
button,.btn,.tab{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button:focus-visible,.btn:focus-visible,.tab:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #a8d8ff;outline-offset:2px}
.role-badge.supplier{background:#fff5df;color:#9a5b00}
body.supplier-mode .account-button{border-color:#f1d39a;background:#fffaf0}


/* 3.36.0 — Tùy chọn giao hàng gọn + thanh toán nhập trực tiếp bằng đồng */
.delivery-option-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0}
.delivery-option-chip{position:relative;display:flex;min-width:0;min-height:44px;align-items:center;justify-content:center;border:1px solid #cfe0eb;border-radius:12px;background:#f8fbfd;padding:0 7px;color:#526b80;font-size:12px;font-weight:850;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent}
.delivery-option-chip input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.delivery-option-chip span{display:flex;min-width:0;align-items:center;justify-content:center;gap:6px;white-space:nowrap}
.delivery-option-chip span::before{content:"+";display:grid;width:19px;height:19px;flex:0 0 19px;place-items:center;border:1px solid #bfd4e2;border-radius:6px;background:#fff;color:#6c8498;font-size:14px;line-height:1}
.delivery-option-chip:has(input:checked){border-color:#8ac7f2;background:#eef8ff;color:#0878ef;box-shadow:0 0 0 2px #dff1ff inset}
.delivery-option-chip:has(input:checked) span::before{content:"✓";border-color:#0878ef;background:#0878ef;color:#fff}
.delivery-option-chip.deposit-option:has(input:checked){border-color:#9bd9c3;background:#effbf6;color:#087a58;box-shadow:0 0 0 2px #def5eb inset}
.delivery-option-chip.deposit-option:has(input:checked) span::before{border-color:#079669;background:#079669}
.delivery-option-panel{margin-top:-2px}
.delivery-payroll-note{margin-top:-4px}
#delivery-paid,#payment-amount{font-variant-numeric:tabular-nums}
@media(max-width:390px){.delivery-option-strip{gap:6px}.delivery-option-chip{min-height:42px;padding:0 5px;font-size:11px}.delivery-option-chip span{gap:4px}.delivery-option-chip span::before{width:17px;height:17px;flex-basis:17px;font-size:12px}}


/* 3.40.0 — Thanh toán chuyến giao gọn, rõ và cân hàng trên mobile */
.delivery-payment-section{display:grid;gap:11px;padding:14px;border:1px solid #d6e6ef;border-radius:17px;background:linear-gradient(145deg,#fbfdff,#f7fbfd)}
.delivery-payment-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.delivery-payment-head>div:first-child{display:grid;gap:3px;min-width:0}
.delivery-payment-head small{color:#0878ef;font-size:10px;font-weight:900;letter-spacing:.12em}
.delivery-payment-head strong{color:#173651;font-size:16px;line-height:1.15}
.delivery-payment-head span{color:#71869a;font-size:10px;line-height:1.35}
.delivery-payment-shortcuts{display:flex;flex:0 0 auto;gap:6px}
.delivery-payment-shortcuts button{min-height:32px;border:1px solid #cbdfea;border-radius:999px;background:#fff;padding:0 10px;color:#46657e;font-size:11px;font-weight:850;cursor:pointer}
.delivery-payment-shortcuts button:active{background:#eaf6ff;color:#0878ef}
.delivery-payment-fields{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:10px;align-items:end}
.delivery-payment-fields label{gap:6px;font-size:12px;line-height:1.25}
.delivery-payment-fields input,.delivery-payment-fields select{height:52px;min-height:52px;font-size:17px;font-weight:800}
.delivery-payment-fields select:disabled{opacity:1;background:#f1f5f8;color:#7b8e9f;-webkit-text-fill-color:#7b8e9f}
.delivery-payment-hint{display:block;margin:0;color:#6f8396;font-size:10px;line-height:1.4}
@media(max-width:430px){.delivery-payment-section{gap:9px;padding:11px;border-radius:15px}.delivery-payment-head{align-items:center}.delivery-payment-head span{display:none}.delivery-payment-head strong{font-size:15px}.delivery-payment-shortcuts button{min-height:30px;padding:0 9px;font-size:10px}.delivery-payment-fields{grid-template-columns:1.15fr .85fr;gap:7px}.delivery-payment-fields label{font-size:10.5px}.delivery-payment-fields input,.delivery-payment-fields select{height:48px;min-height:48px;padding:0 10px;font-size:15px}.delivery-payment-hint{font-size:9px}.delivery-deposit-payment-note{font-size:10px;line-height:1.4}}


.debtor-name {
  border: 0;
  background: transparent;
  padding: 0;
  color: #d12530;
  font-size: 16px;
  font-weight: 800;
  text-align: left;
  text-decoration: underline;
  text-decoration-color: #f4a5aa;
  text-underline-offset: 4px;
  cursor: pointer;
}

.debtor-name:hover { color: #a91520; }

.debt-detail-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px;
  border: 1px solid #ffd0d3;
  border-radius: 16px;
  background: #fff2f3;
  color: #8f2730;
}

.debt-detail-summary strong { color: #d12530; font-size: 21px; }
.debt-detail-list { display: grid; gap: 10px; }

.debt-lot {
  padding: 13px;
  border: 1px solid #dce6ed;
  border-radius: 16px;
  background: #fff;
}

.debt-lot-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.debt-lot-head time { color: #26394f; font-size: 13px; font-weight: 800; }
.debt-lot-head strong { color: #d12530; }

.debt-lot-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  margin-top: 11px;
}

.debt-lot-grid div { padding: 8px; border-radius: 10px; background: #f5f8fa; }
.debt-lot-grid span { display: block; color: #7b8b9b; font-size: 10px; }
.debt-lot-grid strong { display: block; margin-top: 3px; color: #26394f; font-size: 13px; }
.debt-lot-note { margin: 9px 1px 0; color: #718196; font-size: 11px; }


.toolbar select,
.month-panel select {
  max-width: 180px;
}

.page-head > select {
  max-width: 210px;
}

.field-help {
  display: block;
  margin: -6px 1px 0;
  color: #64748b;
  font-size: 11px;
  line-height: 1.45;
}

.daily-payroll-section {
  margin-top: 16px;
}

.daily-payroll-card {
  overflow: hidden;
  border: 1px solid #dce6ed;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 7px 20px #3341550a;
}

.daily-payroll-card > header,
.daily-payroll-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.daily-payroll-card > header {
  padding: 12px 14px;
  background: #edf8ff;
  color: #24516f;
}

.daily-payroll-card > header span {
  color: #0878ef;
  font-size: 12px;
  font-weight: 800;
}

.daily-payroll-row {
  padding: 12px 14px;
  border-top: 1px solid #e7eef3;
}

.daily-payroll-row small {
  display: block;
  margin-top: 4px;
  color: #718196;
  font-size: 11px;
  line-height: 1.45;
}

.daily-payroll-row > strong {
  color: #0878ef;
  white-space: nowrap;
}

.app-version {
  align-self: center;
  padding: 8px 4px;
  color: #7b8b9a;
  font-size: 11px;
}

.pack-size-block {
  padding: 12px;
  border: 1px solid #dce9f2;
  border-radius: 18px;
  background: #f8fbfe;
}

.pack-size-block + .pack-size-block {
  margin-top: 2px;
}

.pack-size-title {
  display: block;
  margin-bottom: 9px;
  color: #0878ef;
  font-size: 11px;
  letter-spacing: 0.12em;
}

.pack-size-block .product-pack,
.pack-size-block .two {
  margin: 0;
}

.debt-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.debt-mode-panel {
  display: grid;
  gap: 15px;
  margin: 0;
}

.entry-badge.debt {
  background: #fff0f1;
  color: #c9232e;
}

.payment-method {
  display: inline-block;
  margin-top: 5px;
  color: #0878ef;
  font-size: 11px;
  font-weight: 750;
}

.report-strip p {
  margin: 5px 0 0;
  color: #718196;
  font-size: 9px;
  line-height: 1.4;
}

select:disabled {
  background: #f1f5f8;
  color: #94a3b8;
}

@media (max-width: 560px) {
  .month-panel select {
    max-width: none;
  }

  .page-head > select {
    max-width: 170px;
  }

  .debt-actions {
    width: 100%;
  }

  .debt-actions .btn {
    flex: 1;
  }
}

/* 3.9.0 — báo cáo đa kỳ & bảng lương trực quan */
.report-heading{align-items:center}.report-heading>strong{color:#0878ef;font-size:15px;text-align:right}.period-filter{display:grid;gap:10px;margin:0 0 15px;padding:8px;border:1px solid #dce7ee;border-radius:20px;background:#fff;box-shadow:0 7px 22px #3341550a}.period-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;padding:4px;border-radius:15px;background:#f1f6fa}.period-tabs button{min-height:38px;border:0;border-radius:12px;background:transparent;color:#64748b;font:inherit;font-size:12px;font-weight:800}.period-tabs button.active{background:#fff;color:#0878ef;box-shadow:0 3px 12px #33415514}.period-inputs{display:flex;justify-content:flex-end;padding:0 4px 4px}.period-inputs>input{width:min(240px,100%)}.custom-range{display:flex;align-items:center;gap:8px;width:100%}.custom-range input{min-width:0;flex:1}.custom-range span{color:#718196;font-size:11px}.period-badge{align-self:center;border-radius:999px;background:#eaf5ff;padding:6px 9px;color:#0878ef;font-size:10px;font-weight:850}.payroll-pro{position:relative;align-items:stretch;padding:0;overflow:hidden}.payroll-rank{display:grid;width:38px;flex:none;place-items:center;background:linear-gradient(180deg,#edf8ff,#f8fbfd);color:#0878ef;font-size:14px;font-weight:900}.payroll-main{flex:1;padding:14px;min-width:0}.payroll-main header{display:flex;align-items:center;justify-content:space-between;gap:10px}.payroll-main header>strong{font-size:17px}.payroll-main header>span{color:#0878ef;font-size:19px;font-weight:900;white-space:nowrap}.payroll-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:12px 0}.payroll-kpis span{border-radius:11px;background:#f4f8fb;padding:8px 5px;text-align:center}.payroll-kpis small{display:block;color:#8291a3;font-size:8px;font-weight:850;letter-spacing:.06em}.payroll-kpis b{display:block;margin-top:3px;color:#18344d;font-size:14px}.payroll-breakdown{display:grid;grid-template-columns:1fr 1fr;gap:7px}.payroll-breakdown span{display:flex;justify-content:space-between;gap:5px;border:1px solid #e2ebf1;border-radius:10px;padding:7px 8px;color:#66798d;font-size:10px}.payroll-breakdown b{color:#274b68}.payroll-main>p{margin:10px 0 0!important;padding-top:9px;border-top:1px dashed #dce6ed;font-size:10px!important}
@media(max-width:560px){.report-heading{gap:8px}.report-heading>strong{max-width:145px;font-size:12px}.period-filter{border-radius:17px}.period-tabs button{padding:0 5px;font-size:11px}.custom-range{display:grid;grid-template-columns:1fr auto 1fr}.payroll-rank{width:31px}.payroll-main{padding:12px 10px}.payroll-main header>span{font-size:17px}.payroll-breakdown{grid-template-columns:1fr}.payroll-section .section-head{align-items:flex-end}}

/* 3.10.0 — báo cáo điều hành, biểu đồ và quy trình chốt lương */
.period-filter{position:sticky;top:0;z-index:20;backdrop-filter:blur(14px)}
.report-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin:-4px 0 12px}.report-actions>span{margin-right:auto;color:#718196;font-size:10px}.report-actions .btn{min-height:36px;padding:0 12px;font-size:11px}
.finance-card[data-report-detail]{position:relative;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}.finance-card[data-report-detail]:hover,.finance-card[data-report-detail]:focus{outline:none;transform:translateY(-2px);box-shadow:0 12px 28px #33415516}.finance-card em{display:block;margin-top:8px;color:#8b9aaa;font-size:8px;font-style:normal}.metric-change{position:absolute;top:15px;right:14px;border-radius:999px;padding:4px 6px;font-size:9px;font-weight:900}.metric-change.good{background:#e7f8ef;color:#087d59}.metric-change.bad{background:#fff0f1;color:#bf2934}.metric-change.neutral{background:#eef3f6;color:#718196}.warning-value{color:#b66a00!important}.section-note{margin:4px 0 0;color:#718196;font-size:10px}
.year-chart-panel{margin:15px 0;padding:16px;border:1px solid #dce7ee;border-radius:20px;background:#fff;box-shadow:0 7px 22px #3341550a}.chart-legend{display:flex;align-items:center;gap:5px;color:#718196;font-size:9px}.chart-legend i{width:8px;height:8px;border-radius:3px;background:#1c8bf2}.chart-legend i+ i{margin-left:5px;background:#13a274}.year-chart{display:grid;grid-template-columns:repeat(12,minmax(38px,1fr));gap:7px;height:220px;margin-top:15px;padding-top:10px;overflow-x:auto}.chart-month{display:grid;grid-template-rows:1fr auto auto;min-width:38px;text-align:center}.chart-bars{display:flex;align-items:flex-end;justify-content:center;gap:3px;min-height:150px;border-bottom:1px solid #dce7ee}.chart-bars i{display:block;width:11px;min-height:0;border-radius:5px 5px 2px 2px}.revenue-bar{background:linear-gradient(180deg,#28a1ff,#0878ef)}.profit-bar{background:linear-gradient(180deg,#3ed6a3,#07936b)}.profit-bar.negative{background:linear-gradient(180deg,#ff8c94,#d83d49)}.chart-month>strong{margin-top:5px;color:#38546d;font-size:9px}.chart-month>small{color:#8493a3;font-size:8px}
.payroll-main header>div{display:flex;align-items:center;gap:7px;min-width:0}.payroll-status{border-radius:999px;padding:4px 7px;font-size:8px;font-weight:900;white-space:nowrap}.payroll-status.draft{background:#fff3dc;color:#9a6700}.payroll-status.finalized{background:#eaf5ff;color:#0878ef}.payroll-status.paid{background:#e7f8ef;color:#087d59}.payroll-trip-details{margin-top:10px;border-top:1px dashed #dce6ed}.payroll-trip-details>summary{padding:10px 0 4px;color:#0878ef;font-size:10px;font-weight:800;cursor:pointer}.payroll-trip{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid #edf2f5}.payroll-trip strong{font-size:10px}.payroll-trip small{display:block;margin-top:3px;color:#718196;font-size:9px}.payroll-trip>b{color:#0878ef;font-size:11px;white-space:nowrap}.payroll-main>footer{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid #e9eff3}.payroll-main>footer>small{color:#718196;font-size:8px}.payroll-main>footer>div{display:flex;gap:5px}.payroll-main>footer .btn{min-height:30px;padding:0 8px;font-size:9px}.status-paid{border-color:#bfe9d7}.status-finalized{border-color:#c9e4f9}
.daily-card-pro{display:block;padding:0;overflow:hidden}.daily-card-pro>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px;list-style:none;cursor:pointer}.daily-card-pro>summary::-webkit-details-marker{display:none}.daily-card-pro>summary>div:last-child{text-align:right}.daily-card-pro>summary p{margin:3px 0 0;color:#718196;font-size:10px}.daily-card-pro>summary small{color:#718196;font-size:9px}.daily-card-pro>summary div:last-child>strong{display:block;margin-top:4px}.daily-expanded{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;padding:12px;border-top:1px solid #e5edf2;background:#f8fbfd}.daily-expanded span{display:flex;justify-content:space-between;gap:8px;color:#718196;font-size:9px}.daily-expanded b{color:#24445e}.report-detail-content{display:grid;gap:0;border:1px solid #dfe9ef;border-radius:16px;overflow:hidden}.detail-period{padding:10px 12px;background:#edf7ff;color:#0878ef;font-size:11px;font-weight:850}.report-detail-content>div:not(.detail-period){display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border-top:1px solid #e7eef3}.report-detail-content span{color:#64788c;font-size:11px}.report-detail-content strong{font-size:13px}
@media(max-width:560px){.period-filter{top:0}.report-actions{display:grid;grid-template-columns:1fr 1fr}.report-actions>span{grid-column:1/-1}.report-actions .btn{width:100%}.metric-change{top:12px;right:11px}.finance-card em{display:none}.year-chart-panel{padding:13px}.year-chart{grid-template-columns:repeat(12,42px);height:205px}.chart-bars{min-height:138px}.payroll-main header{align-items:flex-start}.payroll-main header>div{align-items:flex-start;flex-direction:column;gap:4px}.payroll-main>footer{align-items:flex-start;flex-direction:column}.payroll-main>footer>div,.payroll-main>footer .btn{width:100%}.daily-card-pro>summary{align-items:flex-start;flex-direction:column}.daily-card-pro>summary>div:last-child{text-align:left}.daily-expanded{grid-template-columns:1fr}}
@media print{body.print-report{background:#fff}.print-report .header,.print-report .tabs,.print-report #overview,.print-report #deliveries,.print-report #debts,.print-report #customers,.print-report #operations,.print-report #team,.print-report footer,.print-report .period-filter,.print-report .report-actions,.print-report dialog,.print-report #toast{display:none!important}.print-report .shell{width:100%;max-width:none;margin:0;padding:0}.print-report #reports{display:block!important}.print-report .report-details{display:block!important}.print-report .report-details>summary{display:none}.print-report .finance-card,.print-report .report-strip,.print-report .payroll-card,.print-report .daily-card,.print-report .year-chart-panel{break-inside:avoid;box-shadow:none}.print-report .payroll-status-action{display:none}.print-report .report-columns{grid-template-columns:1fr}.print-report .finance-grid{grid-template-columns:repeat(4,1fr)}}
.payroll-status.changed{background:#fff0f1;color:#bf2934}.status-changed{border-color:#f2c6ca}.payroll-status.reference{background:#eef3f6;color:#64748b}

/* 3.10.1 — vá ổn định và tinh chỉnh hiển thị di động */
#reports.is-loading .period-filter{cursor:progress}#reports.is-loading .finance-grid,#reports.is-loading .report-strip{opacity:.62;transition:opacity .18s ease}.finance-card[data-report-detail]>small:first-child{display:block;padding-right:48px;line-height:1.3}.period-inputs input{min-height:42px}.report-strip>div:nth-child(2) strong.warning-value{color:#b66a00}.payroll-main>footer>div{flex-wrap:wrap}
@media(max-width:560px){.finance-card[data-report-detail]>small:first-child{padding-right:42px}.payroll-main>footer>div{flex-direction:column}.payroll-main>footer>div .btn{width:100%}.report-strip strong{overflow-wrap:anywhere}.report-heading h2{line-height:1.15}}

/* 3.39.0 — Bảng lương thu gọn theo nhân viên */
.payroll-card.payroll-collapsible{display:block;padding:0;overflow:hidden}
.payroll-collapsible>.payroll-compact-summary{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:76px;padding:0 14px 0 0;list-style:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.payroll-collapsible>.payroll-compact-summary::-webkit-details-marker{display:none}
.payroll-collapsible>.payroll-compact-summary::marker{display:none;content:""}
.payroll-collapsible .payroll-rank{align-self:stretch;width:38px}
.payroll-summary-person{display:grid;gap:5px;min-width:0}
.payroll-summary-person>strong{font-size:17px;line-height:1.1;color:#173651;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.payroll-summary-person>.payroll-status{width:max-content;font-style:normal}
.payroll-summary-total{display:grid;justify-items:end;gap:4px;white-space:nowrap}
.payroll-summary-total>strong{color:#0878ef;font-size:19px;font-weight:900}
.payroll-summary-total>small{color:#8192a2;font-size:8px;font-weight:750}
.payroll-collapsible>.payroll-expanded{padding:12px 14px 14px;border-top:1px solid #e4edf2;background:#fcfeff}
.payroll-collapsible:not([open])>.payroll-expanded{display:none}
@media(max-width:560px){
  .payroll-collapsible>.payroll-compact-summary{grid-template-columns:31px minmax(0,1fr) auto;gap:9px;min-height:72px;padding-right:10px}
  .payroll-collapsible .payroll-rank{width:31px}
  .payroll-summary-person>strong{font-size:16px}
  .payroll-summary-total>strong{font-size:17px}
  .payroll-summary-total>small{display:none}
  .payroll-collapsible>.payroll-expanded{padding:10px}
}


.operations-actions { display:flex; gap:12px; flex-wrap:wrap; margin:18px 0; }
.operations-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.operation-card { background:#fff; border:1px solid #d8e5ef; border-radius:24px; padding:20px; box-shadow:0 10px 28px rgba(21,55,88,.06); }
.operation-card .section-head { margin:0 0 14px; }
.operation-row { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:13px 0; border-top:1px solid #e6edf3; }
.operation-row:first-child { border-top:0; }
.operation-row > div { display:flex; flex-direction:column; gap:4px; min-width:0; }
.operation-row small { color:#718096; line-height:1.35; }
.operation-row.cancelled { opacity:.55; text-decoration:line-through; }
.aging-alert { margin:6px 0; padding:12px; border:1px solid #ffc4c7; border-radius:14px; background:#fff4f4; }
.closing-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.closing-grid span { display:flex; flex-direction:column; gap:5px; padding:12px; border-radius:14px; background:#f5f9fc; color:#64748b; }
.closing-grid strong { color:#10233d; font-size:1.08rem; }
.audit-row { display:grid; grid-template-columns:72px 1fr; gap:10px; padding:10px 0; border-top:1px solid #e6edf3; }
.audit-row:first-child { border-top:0; }
.audit-row > span { color:#0878ef; font-weight:800; }
.audit-row div { display:flex; flex-direction:column; gap:3px; }
.audit-row small { color:#718096; }
.mini-danger { border:0; background:#fff0f0; color:#c92a35; border-radius:10px; padding:6px 10px; font-weight:700; }
.qr-payment { text-align:center; border:1px solid #bee0ff; background:#f4faff; border-radius:18px; padding:12px; }
.qr-payment img { display:block; width:min(260px,100%); margin:auto; border-radius:12px; }
.qr-payment p { margin:8px 0 0; color:#315879; font-weight:700; }
.entry.cancelled { opacity:.6; }
.cancelled-badge { background:#e9edf1!important; color:#667485!important; }
.cancel-reason { color:#c92a35; font-weight:700; }
.entry-actions { display:flex; gap:7px; }
.edit-reason { border:1px solid #ffd180; background:#fff8e8; border-radius:14px; padding:10px; }
.operation-empty { padding:12px 0; }
.operation-subtitle { margin:18px 0 4px; padding-top:14px; border-top:2px solid #e8f0f6; color:#38546d; font-size:1rem; }
.aging-actions { display:flex; gap:8px; margin-top:5px; }
.aging-actions a,.aging-actions button { border:1px solid #b9d4ea; background:#fff; color:#17649b; border-radius:9px; padding:5px 9px; font:inherit; font-size:.82rem; text-decoration:none; }
.inventory-numbers { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.inventory-numbers span { display:flex; flex-direction:column; gap:6px; padding:14px; border-radius:15px; background:#f3f8fc; color:#64748b; }
.inventory-numbers strong { font-size:1.3rem; }
.bottle-company-preview { display:flex; justify-content:space-between; gap:12px; padding:12px 14px; border-radius:14px; background:#eef8ff; color:#46647c; }
.deposit-block { display:grid; gap:12px; padding:14px; border:1px solid #bee8d8; border-radius:17px; background:linear-gradient(145deg,#effcf7,#fff); }
.deposit-title { color:#07865f; font-size:12px; letter-spacing:.1em; }
.deposit-preview { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.deposit-preview span { display:grid; gap:4px; border-radius:11px; background:#fff; padding:9px; color:#6b7c8f; font-size:10px; }
.deposit-preview strong { color:#16344e; font-size:12px; }
@media(max-width:560px) { .deposit-preview { grid-template-columns:1fr; } .deposit-preview span { display:flex; justify-content:space-between; align-items:center; } }

@media (max-width:760px) {
  .operations-grid { grid-template-columns:1fr; }
  .operations-actions .btn { flex:1 1 45%; }
  .operation-card { padding:16px; border-radius:20px; }
  .closing-grid { grid-template-columns:1fr 1fr; }
  .audit-row { grid-template-columns:60px 1fr; }
}

.inventory-alert { display:grid; gap:4px; margin-top:10px; padding:11px 12px; border:1px solid #ffc9cc; border-radius:13px; background:#fff5f5; color:#a5252d; font-size:.83rem; line-height:1.4; }
.inventory-alert span { color:#6f3d42; }
.inventory-help { margin:9px 2px 0; color:#718096; font-size:.78rem; line-height:1.45; }
.inventory-current-preview { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.inventory-current-preview span { display:grid; gap:5px; padding:12px; border-radius:13px; background:#f3f8fc; color:#64748b; font-size:.78rem; }
.inventory-current-preview strong { color:#16344e; font-size:1rem; }
@media(max-width:560px) { .inventory-current-preview { grid-template-columns:1fr; } }

.settlement-total { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:4px; padding:13px 14px; border-radius:15px; background:#eef8ff; color:#315879; font-weight:800; }
.settlement-total strong { color:#0878ef; font-size:1.15rem; }
#employee-settlement-list .operation-row > strong { max-width:42%; text-align:right; line-height:1.25; }
@media(max-width:560px) { #employee-settlement-list .operation-row { align-items:flex-start; } #employee-settlement-list .operation-row > strong { max-width:45%; font-size:.92rem; } }

.bulk-assignment-preview { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin:4px 0 2px; }
.bulk-assignment-preview span { display:grid; gap:5px; padding:12px; border-radius:14px; background:#f3f8fc; color:#64748b; }
.bulk-assignment-preview small { font-size:.75rem; }
.bulk-assignment-preview strong { color:#16344e; font-size:.95rem; line-height:1.35; }
@media(max-width:560px) { .bulk-assignment-preview { grid-template-columns:1fr; } }


/* 3.6.0 — Enterprise Fleet Stock & Close Control */
.inventory-enterprise{grid-template-columns:repeat(2,minmax(0,1fr))}.inventory-enterprise span:nth-child(3){background:#eef9f5}.vehicle-stock-preview,.legacy-payment-preview{display:grid;gap:4px;padding:12px 14px;border-radius:14px;background:#eef8ff;color:#46647c}.legacy-payment-preview strong{color:#12395a}.legacy-payment-preview span{font-size:.78rem}.staff-vehicle-strip{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 10px;padding:10px 12px;border:1px solid #d6e8f4;border-radius:14px;background:#f6fbff;color:#47657d;font-size:.8rem;font-weight:750}.staff-vehicle-strip strong{color:#0878ef;font-size:1rem}@media(max-width:560px){.inventory-enterprise{grid-template-columns:1fr 1fr}}

/* 3.8.0 — duyệt chi phí nhân viên */
#expense-list .operation-row>div:last-child{align-items:flex-end}.expense-review-actions{display:flex;flex-direction:row;gap:6px;align-items:center}.expense-review-actions .edit,.expense-review-actions .mini-danger{margin-top:4px}


/* 3.11.0 — Enterprise Supplier & Receipt Control */
.supplier-enterprise-card{grid-column:1/-1}
.supplier-total-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:4px 0 14px}
.supplier-total-summary span{display:grid;gap:5px;padding:13px;border-radius:15px;background:#f3f8fc;color:#6b7c8f}
.supplier-total-summary small{font-size:.68rem;font-weight:800;letter-spacing:.08em}
.supplier-total-summary strong{color:#16344e;font-size:1.04rem}
.supplier-total-summary .due{background:#fff5f5}
.supplier-total-summary .due strong{color:#c92a35}
.supplier-toolbar{display:flex;gap:9px;align-items:center;margin-bottom:8px}
.supplier-search-wrap{display:flex;align-items:center;gap:8px;flex:1;border:1px solid #cbddea;border-radius:14px;background:#fff;padding:0 10px;min-height:46px}
.supplier-search-wrap>span{font-size:1.25rem;color:#6f879a}
.supplier-search-wrap input{border:0;outline:0;background:transparent;min-width:0;flex:1;font:inherit;color:#16344e}
.supplier-search-wrap button{border:0;background:transparent;color:#6f879a;font-size:1.4rem;padding:4px 6px}
.supplier-row-card,.receipt-row-card{border-top:1px solid #e6edf3;padding:15px 0}
.supplier-row-card:first-child,.receipt-row-card:first-child{border-top:0}
.supplier-row-main,.receipt-row-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.supplier-row-main>div,.receipt-row-head>div{display:grid;gap:3px;min-width:0}
.supplier-row-main>div>strong,.receipt-row-head>div>strong{font-size:1.05rem}
.supplier-row-main small,.receipt-row-head small,.receipt-note{color:#718096}
.supplier-finance-strip,.receipt-finance-line{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0}
.supplier-finance-strip span,.receipt-finance-line span{display:grid;gap:4px;padding:10px;border-radius:12px;background:#f6f9fc;color:#718096}
.supplier-finance-strip small{font-size:.68rem}
.supplier-finance-strip strong,.receipt-finance-line strong{color:#16344e}
.supplier-finance-strip .due{background:#fff5f5}.supplier-finance-strip .due strong{color:#c92a35}
.supplier-finance-strip .paid{background:#eef9f5}.supplier-finance-strip .paid strong{color:#07865f}
.supplier-defective-note{margin:4px 0 8px;color:#80651b;font-size:.8rem}
.supplier-row-actions,.receipt-row-actions{display:flex;gap:7px;flex-wrap:wrap}
.supplier-row-actions button,.receipt-row-actions button{min-height:36px}
.receipt-row-card>p{margin:8px 0;color:#5e7285;line-height:1.45}
.receipt-row-card.cancelled{opacity:.55}
.receipt-finance-line{font-size:.8rem}
.receipt-finance-line span{padding:8px 9px}
.receipt-form-section{display:grid;gap:11px;padding:13px;border:1px solid #deebf4;border-radius:16px;background:#fbfdff}
.receipt-form-section h3{margin:0;color:#2c5778;font-size:.9rem;letter-spacing:.04em}
.field-help{display:block;margin-top:5px;color:#7b8c9e;font-size:.74rem;font-weight:500;line-height:1.4}
.receipt-money-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.receipt-money-summary span{display:grid;gap:5px;padding:11px;border-radius:13px;background:#f3f8fc}
.receipt-money-summary small{color:#6d8093;font-size:.67rem;font-weight:800;letter-spacing:.07em}
.receipt-money-summary strong{font-size:1rem;color:#16344e}
.receipt-money-summary .due{background:#fff5f5}.receipt-money-summary .due strong{color:#c92a35}
.receipt-breakdown{color:#4380bd;font-size:.8rem;text-align:right}
.supplier-payment-preview{display:grid;gap:5px;padding:12px 14px;border-radius:14px;background:#eef8ff;color:#526c82}
.supplier-payment-preview strong{color:#c92a35}
#supplier-payment-list .operation-row>div:last-child{align-items:flex-end}

@media(max-width:760px){
  .supplier-enterprise-card{grid-column:auto}
  .supplier-total-summary{grid-template-columns:1fr 1fr}
  .supplier-toolbar{align-items:stretch;flex-direction:column}
  .supplier-filter-reset{width:100%}
}
@media(max-width:560px){
  .supplier-finance-strip,.receipt-finance-line,.receipt-money-summary{grid-template-columns:1fr}
  .supplier-finance-strip span,.receipt-finance-line span,.receipt-money-summary span{display:flex;justify-content:space-between;align-items:center}
  .supplier-row-main,.receipt-row-head{align-items:flex-start}
  .supplier-row-actions,.receipt-row-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .supplier-row-actions button,.receipt-row-actions button{width:100%}
}

/* 3.13.0 — Enterprise simplified workspace */
.enterprise-page-head{align-items:flex-start}
.enterprise-page-head .section-note{max-width:620px;margin:5px 0 0;color:#718196;font-size:.78rem;line-height:1.45}
.enterprise-attention{margin:12px 0 14px;padding:15px;border:1px solid #d9e7f0;border-radius:20px;background:linear-gradient(145deg,#f7fbfe,#fff);box-shadow:0 8px 24px rgba(31,70,105,.05)}
.enterprise-attention .section-head{margin:0 0 10px}
.enterprise-attention-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.enterprise-attention-grid button{display:grid;gap:4px;min-height:92px;border:1px solid #dae7ef;border-radius:14px;background:#fff;padding:11px 12px;color:#62778b;text-align:left;cursor:pointer}
.enterprise-attention-grid button small{color:#708498;font-size:.66rem;font-weight:850;letter-spacing:.09em}
.enterprise-attention-grid button strong{color:#173650;font-size:1rem;line-height:1.25}
.enterprise-attention-grid button span{font-size:.7rem;line-height:1.35}
.enterprise-attention-grid button.needs-attention{border-color:#f1cf9d;background:#fff9ef}
.enterprise-attention-grid button.needs-attention strong{color:#a86208}
.enterprise-attention-grid button.is-ok{background:#f7fcfa}
.enterprise-attention-grid button:focus-visible{outline:3px solid #bfe3ff;outline-offset:2px}
.enterprise-operations-grid{align-items:start}
.enterprise-core-card{scroll-margin-top:86px}
.enterprise-card-tag{align-self:center;border-radius:999px;background:#eaf5ff;padding:5px 8px;color:#0878ef;font-size:.66rem;font-weight:850;white-space:nowrap}
.enterprise-card-tag.neutral{background:#f0f4f7;color:#60778c}
.enterprise-secondary-card{grid-column:1/-1;scroll-margin-top:86px}
.enterprise-advanced-body{padding:0 18px 18px}
.enterprise-advanced-body .helper-note{margin:0 0 12px}
.enterprise-advanced-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.enterprise-advanced-actions .btn{width:100%}
.team-admin-tools{margin:0 0 14px;border:1px solid #dce7ee;border-radius:18px;background:#fff;padding:0}
.team-admin-tools>summary{padding:14px 16px;cursor:pointer;color:#31506c;font-size:.82rem;font-weight:850;list-style:none}
.team-admin-tools>summary::-webkit-details-marker{display:none}
.team-admin-tools>summary::after{content:"＋";float:right;color:#718196}
.team-admin-tools[open]>summary::after{content:"−"}
.team-admin-tools>.helper-note{margin:0 16px 12px}
.team-admin-tools>.team-actions{margin:0;padding:0 16px 16px}

@media(max-width:760px){
  .enterprise-attention-grid{grid-template-columns:1fr 1fr}
  .enterprise-attention-grid button{min-height:84px}
}
@media(max-width:560px){
  .enterprise-page-head{gap:8px}
  .enterprise-page-head .section-note{font-size:.72rem}
  .enterprise-attention{padding:12px}
  .enterprise-attention-grid{gap:7px}
  .enterprise-attention-grid button{min-height:80px;padding:10px}
  .enterprise-attention-grid button strong{font-size:.92rem}
  .enterprise-advanced-actions{grid-template-columns:1fr}
}

/* 3.15.0 — Enterprise Compact UX: progressive disclosure on mobile */
.customer-search-panel-compact{display:grid;gap:8px;padding:10px 12px;margin-bottom:8px;border:1px solid #dbe7ef;border-radius:16px;background:#fff;box-shadow:0 6px 18px #33415508}
.customer-search-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
.customer-search-panel-compact .customer-search-box{height:44px}
.customer-search-panel-compact .customer-search-box input{height:42px;font-size:14px}
.customer-search-panel-compact .customer-search-count{min-width:38px;padding:6px 8px;text-align:center;font-size:10px}
.customer-search-panel-compact .customer-filter-bar{gap:5px}
.customer-search-panel-compact .customer-filter-bar button{min-height:30px;padding:0 10px;font-size:10px}
.customer-month-compact{display:flex;align-items:center;gap:10px;margin:0 0 10px;padding:8px 10px;border:1px solid #dbe7ef;border-radius:15px;background:#f8fbfd}
.customer-month-compact input{width:132px;height:40px;flex:0 0 132px;border-radius:11px;padding:0 9px;font-size:12px}
.customer-month-compact>div{display:grid;min-width:0;gap:2px}
.customer-month-compact strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#0878ef;font-size:12px}
.customer-month-compact small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#6d8092;font-size:10px}

.compact-customer-card{padding:0;overflow:hidden;border-radius:15px;box-shadow:0 4px 14px #33415508}
.customer-compact-summary{display:grid;grid-template-columns:36px minmax(0,1fr) 28px;align-items:center;gap:10px;width:100%;min-height:58px;border:0;background:#fff;padding:9px 12px;text-align:left;color:#142237;cursor:pointer}
.customer-compact-summary .avatar{width:36px;height:36px;border-radius:11px}
.customer-compact-summary>strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.customer-card-chevron{display:grid;width:28px;height:28px;place-items:center;border-radius:9px;background:#f3f7fa;color:#61758a;font-size:15px}
.compact-customer-card.is-expanded .customer-compact-summary{background:#f8fcff;border-bottom:1px solid #e3edf3}
.compact-customer-details{display:grid;gap:9px;padding:11px 12px 12px;background:#fff}
.compact-contact{display:grid;gap:3px;color:#26394f;font-size:12px}
.compact-contact small{color:#718196;font-size:11px;line-height:1.35}
.compact-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:7px;margin:0!important}
.compact-actions .customer-action{min-height:36px;padding:7px 9px;font-size:11px}
.compact-customer-details .customer-stat{margin-top:0}
.compact-customer-details .customer-business-row{margin-top:0}
.compact-account-row{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.compact-account-row>span{display:grid;gap:4px;padding:8px 9px;border:1px solid #e1ebf1;border-radius:11px;color:#6a7d90;font-size:10px}
.compact-account-row strong{color:#17324a;font-size:11px}
.compact-detail-link{min-height:34px;border:0;background:transparent;color:#0878ef;font-size:11px;font-weight:800;cursor:pointer}

.delivery-customer-picker-compact{position:relative;display:block;padding:0;border:0;border-radius:0;background:transparent}
.delivery-customer-search-area{position:relative}
.delivery-search-label{gap:6px}
.delivery-customer-picker-compact .delivery-customer-search-box{height:46px;border-radius:12px}
.delivery-customer-picker-compact .delivery-customer-search-box input{height:44px;font-size:15px}
.delivery-customer-picker-compact .delivery-customer-results{display:none;position:absolute;z-index:40;top:calc(100% + 6px);left:0;right:0;max-height:276px;overflow:auto;gap:4px;padding:6px;border:1px solid #cfe0eb;border-radius:14px;background:#fff;box-shadow:0 18px 38px #193b5b26}
.delivery-customer-picker-compact .delivery-customer-results.is-open{display:grid}
.delivery-customer-result.compact{grid-template-columns:34px minmax(0,1fr) auto;min-height:48px;padding:6px 8px;border:0;border-radius:10px;background:#fff}
.delivery-customer-result.compact:hover,.delivery-customer-result.compact:focus-visible{background:#eef8ff}
.delivery-customer-result.compact .avatar{width:34px;height:34px;border-radius:10px}
.delivery-result-name{display:grid;min-width:0;gap:1px}
.delivery-result-name strong,.delivery-result-name small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.delivery-result-name strong{font-size:12px}.delivery-result-name small{color:#778a9b;font-size:9px}
.delivery-customer-result.compact>b{font-size:10px;white-space:nowrap}
.delivery-customer-picker-compact .delivery-customer-selected{display:flex;min-height:52px;padding:7px 9px;border-radius:12px}
.delivery-customer-picker-compact .delivery-customer-selected.is-empty{display:none}
.delivery-customer-picker-compact.has-selection .delivery-customer-search-area{display:none}
.delivery-selected-main{display:flex!important;align-items:center;gap:8px;min-width:0;text-align:left!important}
.delivery-selected-main .avatar{width:34px;height:34px;border-radius:10px}
.delivery-selected-main>div{display:grid;gap:1px;min-width:0}
.delivery-selected-main strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.delivery-selected-main small{font-size:9px}
.delivery-change-customer{min-width:54px;height:34px;border:1px solid #bcdcf3;border-radius:9px;background:#fff;color:#0878ef;font-size:11px;font-weight:800;cursor:pointer}

.customer-year-mobile-list{display:none}
.customer-year-rank{display:grid;grid-template-columns:28px minmax(0,1fr) auto 18px;align-items:center;gap:8px;width:100%;min-height:58px;border:0;border-bottom:1px solid #e7eef3;background:#fff;padding:8px 4px;text-align:left;color:#172b3f;cursor:pointer}
.customer-year-rank:last-child{border-bottom:0}
.rank-number{display:grid;width:26px;height:26px;place-items:center;border-radius:9px;background:#edf6fd;color:#0878ef;font-size:10px;font-weight:900}
.rank-customer,.rank-money{display:grid;gap:2px;min-width:0}.rank-customer strong,.rank-money strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.rank-customer small,.rank-money small{font-size:9px;color:#718196}.rank-money{text-align:right}.rank-chevron{color:#8aa0b2;font-size:18px}

@media(max-width:700px){
  #customers .page-head{margin-bottom:8px}
  #customers .page-head small{display:none}
  #customers .page-head h2{font-size:18px}
  #customers .page-head .btn{min-height:38px;padding:0 11px;font-size:11px}
  .customer-year-table-wrap{display:none}
  .customer-year-mobile-list{display:grid;border:1px solid #e1eaf0;border-radius:13px;overflow:hidden;background:#fff}
  .customer-intelligence-report{padding:11px;border-radius:16px}
  .customer-intelligence-head{gap:7px;margin-top:0}
  .customer-intelligence-head .section-note{font-size:10px;line-height:1.35}
  .customer-year-actions{display:grid;grid-template-columns:110px 1fr;gap:7px}
  .customer-year-actions input,.customer-year-actions .btn{width:100%;height:40px;min-height:40px}
  .customer-year-kpis{grid-template-columns:1fr 1fr;gap:7px;margin:8px 0}
  .customer-year-kpis article{min-height:72px;padding:9px 10px;border-radius:12px}
  .customer-year-kpis article strong{font-size:14px}
  #reports .finance-grid{gap:7px}
  #reports .finance-card{min-height:104px;padding:11px;border-radius:16px}
  #reports .finance-card strong{font-size:16px}
  #reports .report-strip{padding:8px;border-radius:15px}
  #reports .period-filter{margin-bottom:9px;padding:6px;border-radius:15px}
  #reports .period-tabs{gap:3px;padding:3px}
  #reports .period-tabs button{min-height:34px;font-size:10px}
  #reports .period-inputs{padding:0 2px 2px}
  #reports .period-inputs input{height:40px;min-height:40px}
}

@media(max-width:430px){
  .customer-search-panel-compact{padding:8px 9px;border-radius:14px}
  .customer-month-compact{padding:7px 8px}
  .customer-month-compact input{width:116px;flex-basis:116px}
  .customer-month-compact strong{font-size:11px}
  .customer-filter-bar button{padding:0 9px!important}
  .compact-customer-details{padding:10px}
  .customer-business-row{grid-template-columns:1fr 1fr!important}
  .customer-business-row>span{padding:8px;font-size:9px}
  .customer-insight-card-actions{gap:7px}
  .delivery-customer-picker-compact .delivery-customer-results{max-height:238px}
  .customer-year-kpis .pack-kpi{min-height:62px}
}

/* 3.16.0 — Enterprise Compact Control: dense, readable, detail on demand */
.settlement-hero{display:grid;gap:7px;margin:0 0 10px;padding:14px;border-radius:17px;background:linear-gradient(135deg,#0878ef,#1265d7);color:#fff;box-shadow:0 9px 24px rgba(8,120,239,.16)}
.settlement-hero>small{font-size:.65rem;font-weight:850;letter-spacing:.08em;opacity:.86}
.settlement-hero>strong{font-size:1.55rem;line-height:1.05}
.settlement-hero>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:2px}
.settlement-hero span{display:grid;gap:2px;padding:7px 8px;border-radius:10px;background:rgba(255,255,255,.12);font-size:.62rem;line-height:1.2}
.settlement-hero b{font-size:.72rem;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.employee-settlement-cards{display:grid;gap:9px}
.employee-settlement-card{overflow:hidden;border:1px solid #dce7ef;border-radius:15px;background:#fff}
.employee-settlement-card>header{display:flex;justify-content:space-between;align-items:flex-start;gap:9px;padding:11px 12px 7px}
.employee-settlement-card>header>div{display:grid;gap:2px;min-width:0}
.employee-settlement-card>header strong{font-size:.98rem;color:#172b3e}
.employee-settlement-card>header small{font-size:.68rem;color:#718196}
.employee-settlement-card>header>b{max-width:45%;padding:5px 7px;border-radius:9px;background:#fff4f4;text-align:right;font-size:.77rem;line-height:1.2}
.employee-settlement-card>header>b.positive{background:#edf9f4}
.settlement-mini-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:0 9px 9px}
.settlement-mini-grid span{display:grid;gap:3px;min-width:0;padding:7px 6px;border-radius:9px;background:#f4f8fb;text-align:center}
.settlement-mini-grid small{font-size:.52rem;font-weight:850;letter-spacing:.04em;color:#7a8b9c}
.settlement-mini-grid strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.66rem;color:#1b3d58}
.settlement-detail{border-top:1px solid #e6edf3}
.settlement-detail>summary{padding:8px 12px;color:#0878ef;text-align:center;font-size:.68rem;font-weight:850;cursor:pointer;list-style:none}
.settlement-detail>summary::-webkit-details-marker{display:none}
.settlement-detail>summary::after{content:"⌄";margin-left:6px}
.settlement-detail[open]>summary::after{content:"⌃"}
.settlement-detail>div{display:grid;gap:5px;padding:0 12px 11px;color:#61758a;font-size:.68rem;line-height:1.35}
.settlement-detail p{margin:0}
.settlement-detail b{color:#284c69}

.supplier-total-summary{gap:7px;margin:2px 0 9px}
.supplier-total-summary span{gap:3px;padding:9px 10px;border-radius:11px}
.supplier-total-summary small{font-size:.56rem}
.supplier-total-summary strong{font-size:.83rem}
.supplier-toolbar{margin-bottom:5px}
.supplier-search-wrap{min-height:40px;border-radius:12px}
.supplier-search-wrap input{font-size:.82rem}
.supplier-compact-card{margin:7px 0;padding:11px 12px!important;border:1px solid #dce8f0!important;border-radius:15px;background:#fff;box-shadow:0 4px 14px rgba(35,68,98,.035)}
.supplier-compact-card:first-child{border-top:1px solid #dce8f0!important}
.supplier-compact-card .supplier-row-main{align-items:center}
.supplier-compact-card .supplier-row-main>div>strong{font-size:.94rem}
.supplier-compact-card .supplier-row-main small{font-size:.65rem}
.supplier-held-pill{flex:none;padding:5px 8px;border-radius:9px;background:#fff3f3;font-size:.8rem;font-weight:900}
.supplier-held-pill.positive{background:#eef9f4}
.supplier-compact-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:8px 0 7px}
.supplier-compact-metrics span{display:grid!important;gap:2px!important;padding:7px 7px!important;border-radius:9px!important;min-width:0}
.supplier-compact-metrics small{font-size:.5rem!important;letter-spacing:.04em}
.supplier-compact-metrics strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.68rem}
.supplier-defective-note.compact{margin:0 0 6px;font-size:.66rem}
.supplier-compact-actions{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important}
.supplier-compact-actions button{min-height:32px!important;width:100%;padding:5px 4px!important;border-radius:9px;font-size:.63rem}
.supplier-compact-actions .primary-soft{background:#eef7ff;color:#0878ef;border-color:#bfe0f8}
.supplier-compact-actions .positive-soft{background:#eef9f4;color:#07865f;border-color:#bee9d8}
.supplier-history-disclosure{margin-top:9px;border:1px solid #dce7ef;border-radius:13px;background:#fff;overflow:hidden}
.supplier-history-disclosure>summary{display:flex;justify-content:space-between;align-items:center;gap:9px;min-height:40px;padding:9px 11px;color:#31506c;font-size:.72rem;font-weight:850;cursor:pointer;list-style:none}
.supplier-history-disclosure>summary::-webkit-details-marker{display:none}
.supplier-history-disclosure>summary::after{content:"⌄";color:#0878ef}
.supplier-history-disclosure[open]>summary::after{content:"⌃"}
.supplier-history-disclosure>summary b{margin-left:auto;display:grid;min-width:23px;height:23px;place-items:center;border-radius:8px;background:#edf6fd;color:#0878ef;font-size:.65rem}
.supplier-history-body{padding:0 10px 8px;border-top:1px solid #edf2f5}
.receipt-compact-card{padding:10px 0!important}
.receipt-compact-card .receipt-row-head strong{font-size:.78rem}
.receipt-compact-card .receipt-row-head small{font-size:.61rem}
.receipt-compact-card>p{margin:6px 0!important;font-size:.65rem;line-height:1.35}
.receipt-compact-card .receipt-finance-line{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px;margin:6px 0}
.receipt-compact-card .receipt-finance-line span{display:grid!important;gap:2px!important;padding:6px!important;border-radius:8px!important;font-size:.58rem}
.receipt-compact-card .receipt-finance-line small{font-size:.48rem;color:#7d8d9d;font-weight:850}
.receipt-compact-card .receipt-finance-line strong{font-size:.64rem;white-space:nowrap}
.receipt-compact-card .receipt-row-actions{display:flex!important;gap:5px;margin-top:6px}
.receipt-compact-card .receipt-row-actions button{width:auto!important;min-height:29px!important;padding:4px 8px!important;font-size:.59rem}
.payment-history .operation-row{padding:8px 0}
.payment-history .operation-row strong{font-size:.72rem}
.payment-history .operation-row small{font-size:.59rem}

.customer-year-kpis-compact{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:7px!important;margin:8px 0!important}
.customer-year-kpis-compact article{min-height:70px!important;padding:9px 10px!important;border-radius:12px!important}
.customer-year-kpis-compact article small{font-size:.55rem}
.customer-year-kpis-compact article>strong{margin-top:4px!important;font-size:.85rem!important}
.customer-year-kpis-compact .bottle-kpi>strong{color:#0878ef!important}
.customer-year-kpis-compact .bottle-kpi p{margin:4px 0 0;color:#708294;font-size:.55rem}
.customer-year-kpis-compact .bottle-kpi b{color:#315a77;font-size:.58rem}
.customer-year-kpis-compact .paid-kpi>strong{color:#078d63!important}
.customer-year-more{border-top:1px solid #e7eef3}
.customer-year-more>summary{padding:9px;color:#0878ef;text-align:center;font-size:.68rem;font-weight:850;cursor:pointer;list-style:none}
.customer-year-more>summary::-webkit-details-marker{display:none}
.customer-year-more>summary::after{content:"⌄";margin-left:6px}
.customer-year-more[open]>summary::after{content:"⌃"}

@media(max-width:700px){
  #operation-settlement .section-head,#operation-suppliers .section-head{margin-bottom:8px}
  #operation-settlement .enterprise-card-tag{display:none}
  #operation-settlement.operation-card,#operation-suppliers.operation-card{padding:12px;border-radius:17px}
  #operation-settlement .section-head h2,#operation-suppliers .section-head h2{font-size:17px}
  #operation-settlement .section-head small,#operation-suppliers .section-head small{font-size:9px}
  .supplier-total-summary{grid-template-columns:1fr 1fr!important}
  .supplier-toolbar{display:block!important}
  .supplier-filter-reset{margin-top:5px;width:auto!important;min-height:32px!important;font-size:.65rem}
  .customer-intelligence-report{padding:10px!important}
  .customer-intelligence-head{display:flex!important;align-items:center!important;gap:8px!important}
  .customer-intelligence-head>div{min-width:0;flex:1}
  .customer-intelligence-head>div>small,.customer-intelligence-head .section-note{display:none}
  .customer-intelligence-head h2{font-size:17px;margin:0}
  .customer-year-actions{display:flex!important;width:auto!important;flex:none;gap:5px!important}
  .customer-year-actions input{width:76px!important;height:34px!important;min-height:34px!important;padding:0 7px;font-size:.7rem}
  .customer-year-actions .btn{width:58px!important;height:34px!important;min-height:34px!important;padding:0 5px;font-size:.65rem}
  .customer-year-kpis-compact{grid-template-columns:1fr 1fr!important}
  .customer-year-kpis-compact article{min-height:61px!important}
  .customer-year-rank{min-height:50px;padding:6px 4px}
  .rank-number{width:24px;height:24px}
  .rank-customer strong,.rank-money strong{font-size:.68rem}
  .rank-customer small,.rank-money small{font-size:.56rem}
  #reports .period-filter{gap:5px!important;padding:5px!important;margin-bottom:6px!important}
  #reports .period-tabs button{min-height:30px!important;font-size:.62rem!important}
  #reports .period-inputs input{height:35px!important;min-height:35px!important;font-size:.72rem}
}

@media(max-width:430px){
  .settlement-hero{padding:11px;border-radius:14px}
  .settlement-hero>strong{font-size:1.28rem}
  .settlement-hero span{padding:6px 5px;font-size:.55rem}
  .settlement-hero b{font-size:.6rem}
  .employee-settlement-card>header{padding:9px 10px 6px}
  .employee-settlement-card>header strong{font-size:.9rem}
  .employee-settlement-card>header small{font-size:.59rem}
  .employee-settlement-card>header>b{font-size:.67rem}
  .settlement-mini-grid{padding:0 7px 7px;gap:4px}
  .settlement-mini-grid span{padding:6px 4px}
  .settlement-mini-grid small{font-size:.45rem}
  .settlement-mini-grid strong{font-size:.57rem}
  .supplier-compact-card{padding:9px 10px!important}
  .supplier-compact-actions button{font-size:.58rem}
  .customer-year-kpis-compact article{min-height:57px!important;padding:8px!important}
  .customer-year-kpis-compact article>strong{font-size:.78rem!important}
}


/* 3.24.0 — Enterprise Fleet Reload + Company Hub */
.operations-command-strip{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin:0 0 12px;
}
.operations-command{
  min-width:0;
  min-height:76px;
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  grid-template-rows:auto auto;
  align-items:center;
  column-gap:10px;
  padding:11px 12px;
  border:1px solid #d7e5ef;
  border-radius:16px;
  background:#fff;
  color:#173651;
  text-align:left;
  box-shadow:0 6px 18px rgba(27,64,95,.05);
  cursor:pointer;
}
.operations-command>span{
  grid-row:1/3;display:grid;place-items:center;width:36px;height:36px;border-radius:11px;
  background:#edf6ff;color:#0878ef;font-size:1.15rem;font-weight:900
}
.operations-command strong{font-size:.87rem;line-height:1.15}
.operations-command small{font-size:.66rem;color:#71869a;line-height:1.2}
.operations-command.primary{border-color:#a8d4fb;background:#f5fbff}
.operations-command.positive{border-color:#bce6d5;background:#f4fcf8}
.operations-command.positive>span{background:#e3f7ee;color:#07865f}
.operations-command:disabled{opacity:.48;cursor:not-allowed}
.compact-attention{margin-bottom:12px}
.enterprise-operations-reordered{align-items:start}
.operation-inline-details{border:1px solid #dfeaf2;border-radius:13px;background:#f8fbfd;overflow:hidden}
.operation-inline-details>summary{padding:11px 12px;color:#176ca9;font-size:.78rem;font-weight:850;cursor:pointer}
.operation-inline-details[open]>summary{border-bottom:1px solid #e2ebf2}
.operation-inline-details>#closing-summary{padding:10px}
.vehicle-stock-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.vehicle-auto-confirm-note{display:grid;gap:3px;margin:0 0 12px;padding:11px 12px;border:1px solid #bde7d5;border-radius:14px;background:#f1fbf6;color:#557365}
.vehicle-auto-confirm-note strong{color:#07865f;font-size:.86rem}
.vehicle-auto-confirm-note span{font-size:.72rem;line-height:1.35}
.vehicle-stock-preview{display:grid!important;gap:4px!important}
.vehicle-stock-preview strong{color:#173651}
.vehicle-stock-preview span{font-size:.74rem}
.fleet-location-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
.vehicle-location-row>strong{white-space:nowrap}

.company-page-head{margin-bottom:10px}
.company-head-actions{display:flex;align-items:center;gap:8px}
.company-head-actions input{min-width:158px}
.company-hub{margin-bottom:12px}
.company-section-head{align-items:center}
.company-total-summary{grid-template-columns:repeat(6,minmax(0,1fr));margin-bottom:12px}
.company-total-summary span{min-height:66px}
.company-supplier-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.company-profile-card{margin:0!important;padding:14px!important;border:1px solid #dce8f0!important;border-radius:17px!important}
.company-profile-head strong{font-size:1rem!important}
.company-profile-meta{display:flex;flex-wrap:wrap;gap:5px;margin:8px 0}
.company-profile-meta span{padding:5px 7px;border-radius:999px;background:#f2f7fb;color:#688096;font-size:.62rem;font-weight:750}
.company-finance-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.company-finance-grid span{padding:9px!important}
.company-finance-grid small{font-size:.54rem!important}
.company-finance-grid strong{font-size:.72rem!important}
.company-profile-actions{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.company-profile-actions button{min-width:0!important}
.company-history-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.company-history-card{min-width:0}
.company-history-card .supplier-history-disclosure{margin:0;border:0;background:transparent}
.company-history-card .supplier-history-disclosure>summary{padding:7px 0}
.company-history-card .supplier-history-body{padding:0}

@media(max-width:760px){
  .operations-command-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .operations-command{min-height:64px;padding:8px 9px;grid-template-columns:30px minmax(0,1fr);column-gap:7px}
  .operations-command>span{width:30px;height:30px;border-radius:9px;font-size:1rem}
  .operations-command strong{font-size:.76rem}
  .operations-command small{font-size:.58rem}
  .compact-attention .section-head h2{font-size:1rem}
  .fleet-location-summary{grid-template-columns:1fr 1fr}
  .vehicle-stock-fields{grid-template-columns:1fr 1fr}
  .company-head-actions{width:100%;display:grid;grid-template-columns:1fr auto}
  .company-head-actions input{min-width:0;width:100%}
  .company-total-summary{grid-template-columns:1fr 1fr;gap:6px}
  .company-total-summary span{min-height:58px;padding:8px 9px}
  .company-supplier-list{grid-template-columns:1fr}
  .company-profile-card{padding:12px!important}
  .company-profile-meta{gap:4px}
  .company-finance-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .company-profile-actions{grid-template-columns:1fr 1fr!important}
  .company-history-grid{grid-template-columns:1fr}
}

/* 3.24.0 — Compact operations + vehicle empty bottle reconciliation */
.inventory-card-tools{display:flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.inventory-mini-action{min-height:30px;padding:5px 9px;border:1px solid #b9d9ee;border-radius:10px;background:#f2f9ff;color:#0d6da8;font-size:.68rem;font-weight:850;cursor:pointer}
.inventory-mini-action:hover{background:#e9f5ff}
.vehicle-location-balance{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0}
.vehicle-location-balance>strong{white-space:nowrap}
.vehicle-empty-edit{min-height:29px;padding:5px 8px;border-radius:9px;font-size:.65rem}
.vehicle-empty-adjustment-note{display:grid;gap:4px;padding:11px 12px;border:1px solid #c8e2f3;border-radius:14px;background:#f3f9fd;color:#587287}
.vehicle-empty-adjustment-note strong{color:#176b9f;font-size:.84rem}
.vehicle-empty-adjustment-note span{font-size:.72rem;line-height:1.4}
.vehicle-empty-compare{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;gap:10px}
.vehicle-empty-compare>div,.vehicle-empty-compare>label{min-height:74px;padding:10px 11px;border:1px solid #dce8f0;border-radius:14px;background:#f8fbfd}
.vehicle-empty-compare>div{display:grid;align-content:center;gap:5px}
.vehicle-empty-compare small,.vehicle-empty-compare>label{font-size:.68rem;font-weight:850;color:#6a8094;letter-spacing:.04em}
.vehicle-empty-compare strong{font-size:1.15rem;color:#173651}
.vehicle-empty-compare>span{align-self:center;color:#82a0b5;font-size:1.2rem;font-weight:900}
.vehicle-empty-compare input{margin-top:5px;background:#fff}
.vehicle-empty-adjustment-preview{display:grid;gap:4px;padding:10px 12px;border:1px solid #dce8f0;border-radius:13px;background:#f8fbfd;color:#64798c}
.vehicle-empty-adjustment-preview strong{color:#173651;font-size:.84rem}
.vehicle-empty-adjustment-preview span{font-size:.71rem;line-height:1.35}
.vehicle-empty-adjustment-preview.is-positive{border-color:#bde5d3;background:#f2fbf7}
.vehicle-empty-adjustment-preview.is-positive strong{color:#087957}
.vehicle-empty-adjustment-preview.is-warning{border-color:#f0c7c7;background:#fff5f5}
.vehicle-empty-adjustment-preview.is-warning strong{color:#b32936}
.vehicle-empty-quick-row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:9px}
.vehicle-empty-quick-row .btn{min-height:36px}
.vehicle-empty-quick-row span{font-size:.68rem;color:#71869a;line-height:1.35}

@media(max-width:760px){
  .operations-command-strip{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
  .operations-command{min-height:54px;padding:6px 4px;display:grid;grid-template-columns:1fr;grid-template-rows:24px auto;gap:3px;place-items:center;text-align:center;border-radius:13px}
  .operations-command>span{grid-row:auto;width:24px;height:24px;border-radius:7px;font-size:.82rem}
  .operations-command strong{font-size:.62rem;line-height:1.05;white-space:normal}
  .operations-command small{display:none}
  .inventory-card-tools{gap:5px}
  .inventory-mini-action{min-height:28px;padding:4px 7px;font-size:.61rem}
  .vehicle-location-row{align-items:center}
  .vehicle-location-balance{display:grid;justify-items:end;gap:4px}
  .vehicle-location-balance>strong{font-size:.78rem}
  .vehicle-empty-edit{min-height:26px;padding:4px 7px;font-size:.59rem}
  .vehicle-empty-compare{grid-template-columns:1fr auto 1fr;gap:6px}
  .vehicle-empty-compare>div,.vehicle-empty-compare>label{min-height:68px;padding:8px}
  .vehicle-empty-compare>span{font-size:1rem}
  .vehicle-empty-quick-row{grid-template-columns:1fr;gap:5px}
  .vehicle-empty-quick-row .btn{width:max-content;min-height:34px}
}

/* 3.28.0 — Deduplicated mobile UX: one action per place, contextual status only */
.company-title-mobile{display:none}
#operations .operations-command-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
.vehicle-empty-balance-strip{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.vehicle-empty-balance-strip>span{display:grid;gap:4px;padding:9px 10px;border:1px solid #dce8f0;border-radius:12px;background:#f8fbfd;color:#71869a;font-size:.66rem;font-weight:750}
.vehicle-empty-balance-strip strong{color:#173651;font-size:.82rem}
.vehicle-empty-quick-row>div{display:flex;gap:6px;flex-wrap:wrap}
#vehicle-empty-save:disabled{opacity:.45;cursor:not-allowed;filter:saturate(.6)}
.vehicle-empty-return-tool{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:7px;padding:9px 10px;border:1px solid #dce8f0;border-radius:13px;background:#fbfdff}
.vehicle-empty-return-tool label{margin:0;font-size:.66rem;font-weight:850;color:#6a8094;letter-spacing:.04em}
.vehicle-empty-return-tool input{margin-top:5px;background:#fff}
.vehicle-empty-return-tool .btn{min-height:40px;white-space:nowrap}
.vehicle-empty-return-tool>span{grid-column:1/-1;font-size:.67rem;color:#71869a;line-height:1.3}
.label-mobile{display:none}
.vehicle-empty-return-presets{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:-3px}
.vehicle-empty-return-presets>span{color:#71869a;font-size:.67rem;font-weight:800}
.vehicle-empty-return-presets>div{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.vehicle-empty-return-presets button{min-width:42px;min-height:34px;border:1px solid #c9deeb;border-radius:999px;background:#f7fbfe;color:#176ca9;padding:0 10px;font-size:.7rem;font-weight:850;cursor:pointer;touch-action:manipulation}
.vehicle-empty-return-presets button:last-child{border-color:#b9e4d2;background:#f0fbf6;color:#087957}
.vehicle-empty-return-presets button:active{transform:translateY(1px)}
#vehicle-empty-adjustment-dialog .dialog-actions{background:#fff}

@media(max-width:760px){
  .label-desktop{display:none}
  .label-mobile{display:inline}

  /* Vận hành: chỉ giữ 3 hành động thuộc đúng ngữ cảnh; Công ty dùng tab riêng. */
  #operations>.enterprise-page-head .section-note{display:none}
  #operations>.enterprise-page-head{margin-bottom:7px;gap:8px}
  #operations>.enterprise-page-head h2{font-size:1.25rem;line-height:1.12}
  #operations>.enterprise-page-head input{min-height:40px;height:40px;max-width:138px}
  #operations .operations-command-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:8px}
  #operations .operations-command{min-height:52px;padding:5px 5px;display:grid;grid-template-columns:1fr;grid-template-rows:23px auto;gap:3px;place-items:center;text-align:center;border-radius:12px}
  #operations .operations-command>span{grid-row:auto;width:23px;height:23px;border-radius:7px;font-size:.78rem}
  #operations .operations-command strong{font-size:.68rem;line-height:1.08;white-space:normal}
  #operations .operations-command small{display:none}

  /* Trạng thái sạch không chiếm chỗ; chỉ hiện khối cảnh báo khi thật sự cần xử lý. */
  #operations .compact-attention.is-clean{display:none}
  #operations .compact-attention.has-issues{display:block;padding:10px 11px;margin-bottom:9px;border-radius:15px}
  #operations .compact-attention.has-issues .enterprise-attention-grid button.is-ok:not([data-enterprise-action="closing"]){display:none}
  #operations .compact-attention.has-issues .enterprise-attention-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  #operations .compact-attention.has-issues .enterprise-attention-grid button{min-height:76px;padding:8px}
  #operations .compact-attention.has-issues .enterprise-attention-grid button strong{font-size:.78rem}

  /* Công ty: bỏ thanh lệnh lặp; ngày + tạo phiếu + tạo công ty nằm ngay trong header. */
  #company .company-title-desktop{display:none}
  #company .company-title-mobile{display:inline}
  #company .company-page-head{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;align-items:stretch;padding:0 2px 4px;margin-bottom:7px}
  #company .company-page-head>div:first-child{min-width:0}
  #company .company-page-head h2{max-width:none;font-size:1.28rem;line-height:1.12;text-wrap:balance}
  #company .company-page-head .section-note{display:none}
  #company .company-head-actions{width:100%;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) 74px 84px;gap:6px;align-items:stretch}
  #company .company-head-actions input{width:100%;min-width:0;max-width:none;height:42px;padding-inline:9px;overflow:hidden}
  #company .company-head-actions .btn{width:auto;min-width:0;min-height:42px;height:42px;padding:0 6px;border-radius:12px;font-size:.68rem;line-height:1.08;white-space:nowrap}
  #company .company-receipt-add{border-color:#badbf1;background:#f4faff;color:#0e6da8}
  #company .company-hub{margin-bottom:9px}
  #company .operation-card{padding:12px!important;border-radius:16px!important}
  #company .company-section-head{margin-top:0}
  #company .company-section-head h2{font-size:1.05rem}
  #company .company-total-summary{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin-bottom:8px}
  #company .company-total-summary span{min-height:56px;padding:7px}
  #company .company-total-summary small{font-size:.50rem;line-height:1.12}
  #company .company-total-summary strong{font-size:.70rem;line-height:1.15;overflow-wrap:anywhere}

  /* Vỏ xe: giữ các nút thao tác một tay, không lặp hướng dẫn dài. */
  .vehicle-empty-balance-strip{gap:6px}
  .vehicle-empty-balance-strip>span{padding:7px 8px}
  .vehicle-empty-return-tool{grid-template-columns:minmax(0,1fr) 94px;padding:8px;gap:6px}
  .vehicle-empty-return-tool .btn{min-height:38px;padding-inline:7px;font-size:.68rem}
  .vehicle-empty-return-tool>span{font-size:.63rem}
  .vehicle-empty-return-presets{display:grid;grid-template-columns:auto minmax(0,1fr);gap:7px}
  .vehicle-empty-return-presets>div{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
  .vehicle-empty-return-presets button{min-width:0;min-height:34px;padding:0 4px;font-size:.67rem}
  .vehicle-empty-quick-row{grid-template-columns:1fr;gap:5px}
  .vehicle-empty-quick-row>span{display:none}
  .vehicle-empty-quick-row>div{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .vehicle-empty-quick-row .btn{width:100%;min-height:34px;padding-inline:7px;font-size:.68rem}
  #vehicle-empty-adjustment-dialog{width:calc(100% - 12px);max-height:94dvh;border-radius:22px 22px 14px 14px}
  #vehicle-empty-adjustment-dialog form{gap:11px;padding:14px 14px max(12px,env(safe-area-inset-bottom))}
  #vehicle-empty-adjustment-dialog .dialog-head{padding-bottom:10px}
  #vehicle-empty-adjustment-dialog .dialog-head h2{font-size:1.08rem}
  #vehicle-empty-adjustment-dialog .vehicle-empty-adjustment-note{padding:8px 9px;border-radius:12px}
  #vehicle-empty-adjustment-dialog .vehicle-empty-adjustment-note span{font-size:.66rem}
  #vehicle-empty-adjustment-dialog label{gap:5px}
  #vehicle-empty-adjustment-dialog input,#vehicle-empty-adjustment-dialog select{height:44px}
  .vehicle-empty-compare>div,.vehicle-empty-compare>label{min-height:66px;padding:8px}
  .vehicle-empty-compare strong{font-size:1rem}
  #vehicle-empty-adjustment-dialog .dialog-actions{position:sticky;bottom:-1px;z-index:3;margin:0 -14px -14px;padding:10px 14px max(10px,env(safe-area-inset-bottom));box-shadow:0 -8px 20px rgba(20,54,79,.08)}
  #vehicle-empty-adjustment-dialog .dialog-actions .btn{min-height:44px}
}

@media(max-width:390px){
  #operations .operations-command strong{font-size:.65rem}
  #company .company-page-head h2{font-size:1.22rem}
  #company .company-head-actions{grid-template-columns:minmax(0,1fr) 68px 78px;gap:5px}
  #company .company-head-actions .btn{font-size:.64rem;padding-inline:4px}
  #company .company-total-summary strong{font-size:.66rem}
  #company .company-total-summary small{font-size:.47rem}
  .vehicle-empty-return-presets>span{font-size:.62rem}
  .vehicle-empty-return-presets button{font-size:.63rem}
}

/* 3.31.0 — Enterprise supplier receipts: period search + large bottle-first cards */
#company{--company-ink:#16344e;--company-muted:#6b8092;--company-line:#dce8f0;--company-blue:#0878ef;--company-soft:#f5f9fc}
#company .company-page-head{align-items:flex-end;margin-bottom:12px}
#company .company-title-block h2{font-size:1.9rem;line-height:1.12}
#company .company-title-block .section-note{font-size:.84rem;line-height:1.5;max-width:760px}
#company .company-head-actions{display:flex;justify-content:flex-end;gap:8px}
#company .company-head-actions .btn{min-height:46px;padding:0 16px;border-radius:13px;font-size:.82rem;font-weight:850}

.company-period-panel{display:grid;grid-template-columns:minmax(220px,.72fr) minmax(0,1.55fr);gap:14px;align-items:end;margin:0 0 14px;padding:15px 16px;border:1px solid #cfe1ee;border-radius:18px;background:linear-gradient(135deg,#f7fbff,#eef7fd);box-shadow:0 6px 18px rgba(35,76,105,.05)}
.company-period-heading{display:grid;gap:4px;min-width:0}
.company-period-heading>div{display:grid;gap:3px}
.company-period-heading small{font-size:.68rem;font-weight:900;letter-spacing:.12em;color:#0878ef}
.company-period-heading strong{font-size:1.12rem;line-height:1.2;color:#16344e}
.company-period-heading>span{font-size:.76rem;font-weight:800;color:#5e778d}
.company-period-controls{display:grid;grid-template-columns:minmax(150px,.9fr) minmax(180px,1.2fr) auto;gap:9px;align-items:end}
.company-period-controls label{display:grid;gap:5px;min-width:0;margin:0;color:#5f7588;font-size:.66rem;font-weight:850;letter-spacing:.04em}
.company-period-controls input,.company-period-controls select{width:100%;min-width:0;height:46px;padding:0 12px;border:1px solid #c7dce9;border-radius:12px;background:#fff;color:#173651;font-size:.92rem;font-weight:750;outline:none}
.company-period-controls input:focus,.company-period-controls select:focus{border-color:#6bb6ee;box-shadow:0 0 0 3px rgba(8,120,239,.09)}
.company-period-controls .btn{height:46px;min-height:46px;padding:0 13px;white-space:nowrap;border-radius:12px}
.company-period-controls>.is-hidden{display:none!important}

#company .company-hub{padding:18px!important;border-radius:20px!important}
#company .company-section-head{align-items:flex-start;margin-bottom:12px}
#company .company-section-head h2{font-size:1.45rem;line-height:1.15}
#company .company-summary-note{margin:5px 0 0;color:#6b8092;font-size:.76rem;line-height:1.42}
#company .company-total-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:16px}
#company .company-total-summary>span{position:relative;display:grid;align-content:center;gap:5px;min-height:104px;padding:13px 14px;border:1px solid #e1eaf1;border-radius:16px;background:#f7fafc;color:#647b8e;overflow:hidden}
#company .company-total-summary>span:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:#c8dce9}
#company .company-total-summary>span.company-summary-primary{background:#f5faff;border-color:#d5e8f5}
#company .company-total-summary>span.company-summary-primary:before{background:#2188d9}
#company .company-total-summary>span.received{background:#f2fbf7;border-color:#d6eee3}
#company .company-total-summary>span.received:before{background:#14956d}
#company .company-total-summary>span.sent{background:#f4f8ff;border-color:#dbe6f8}
#company .company-total-summary>span.sent:before{background:#547dc8}
#company .company-total-summary>span.defective{background:#fff8f2;border-color:#f2e0d0}
#company .company-total-summary>span.defective:before{background:#d8873f}
#company .company-total-summary>span.due{background:#fff5f5;border-color:#f3d9dc}
#company .company-total-summary>span.due:before{background:#c92a35}
#company .company-total-summary small{font-size:.66rem!important;line-height:1.2;font-weight:900;letter-spacing:.07em;color:#5e7a91}
#company .company-total-summary strong{font-size:1.52rem!important;line-height:1.05;font-weight:900;color:#16344e;overflow-wrap:anywhere}
#company .company-total-summary strong em{font-size:.72rem;font-style:normal;font-weight:850;color:#6b8092}
#company .company-total-summary>span>i{font-size:.65rem;font-style:normal;font-weight:700;color:#8195a6}
#company .company-total-summary .due strong{color:#c92a35}

#company .company-supplier-list{gap:12px}
#company .company-profile-card.company-profile-enterprise{padding:17px!important;border-radius:18px!important;background:#fff;box-shadow:0 7px 22px rgba(24,62,90,.055)}
#company .company-profile-enterprise .company-profile-head{align-items:center}
#company .company-profile-enterprise .company-profile-head>div{display:grid;gap:4px}
#company .company-profile-enterprise .company-profile-head>div>small{font-size:.62rem;font-weight:900;letter-spacing:.09em;color:#2581c7}
#company .company-profile-enterprise .company-profile-head>div>strong{font-size:1.35rem!important;line-height:1.15;color:#173651}
#company .company-profile-enterprise .company-profile-head p{margin:0;color:#70869a;font-size:.78rem;line-height:1.35}
#company .company-profile-enterprise .supplier-held-pill{display:grid;grid-template-columns:auto auto;align-items:baseline;gap:3px;min-width:116px;padding:10px 12px;border-radius:14px;text-align:right}
#company .company-profile-enterprise .supplier-held-pill small{grid-column:1/-1;font-size:.56rem;font-weight:900;letter-spacing:.08em}
#company .company-profile-enterprise .supplier-held-pill strong{font-size:1.55rem;line-height:1}
#company .company-bottle-lifetime{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:12px 0}
#company .company-bottle-lifetime span{display:grid;align-content:center;min-height:54px;padding:8px 10px;border:1px solid #e4edf3;border-radius:12px;background:#f8fbfd;color:#657d91;font-size:.69rem!important;line-height:1.3;font-weight:750}
#company .company-bottle-lifetime b{font-size:1.05rem;color:#173651}
#company .company-finance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
#company .company-finance-grid span{min-height:68px;padding:10px 11px!important;border-radius:13px}
#company .company-finance-grid small{font-size:.60rem!important;line-height:1.15}
#company .company-finance-grid strong{font-size:.90rem!important;line-height:1.2;white-space:normal!important}
#company .company-profile-actions{gap:7px!important;margin-top:10px}
#company .company-profile-actions button{min-height:42px!important;font-size:.72rem!important;font-weight:850}

#company .company-history-grid{grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:14px;align-items:start}
#company .company-history-card{padding:17px!important;border-radius:20px!important}
#company .company-history-card>.section-head{margin-bottom:10px}
#company .company-history-card>.section-head h2{font-size:1.35rem;line-height:1.15}
#company .company-history-card>.section-head p{margin:5px 0 0;color:#71869a;font-size:.75rem;line-height:1.4}
#company .company-receipt-disclosure{border:0;border-radius:0;background:transparent}
#company .company-receipt-disclosure>summary{min-height:48px;padding:10px 0 12px;border-bottom:1px solid #dfe9f0;font-size:.82rem;font-weight:900;color:#31506c}
#company .company-receipt-disclosure>summary b{min-width:29px;height:29px;font-size:.72rem;border-radius:9px}
#company .company-receipt-list{display:grid;gap:12px;padding:12px 0 0!important;border:0!important}

#company .receipt-enterprise-card{margin:0;padding:15px!important;border:1px solid #dbe7ef!important;border-radius:17px!important;background:#fff;box-shadow:0 5px 16px rgba(27,67,96,.045)}
#company .receipt-enterprise-card.cancelled{opacity:.62;background:#f7f8f9}
#company .receipt-enterprise-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:start;margin-bottom:12px}
#company .receipt-enterprise-identity{display:grid;gap:4px;min-width:0}
#company .receipt-number-line{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
#company .receipt-number-line span{padding:4px 7px;border-radius:8px;background:#eaf5fd;color:#0878ef;font-size:.64rem;font-weight:950;letter-spacing:.06em}
#company .receipt-number-line time{color:#637b8f;font-size:.78rem;font-weight:850}
#company .receipt-enterprise-identity>strong{font-size:1.22rem;line-height:1.15;color:#173651}
#company .receipt-enterprise-identity>small{font-size:.68rem;line-height:1.35;color:#7b8fa0}
#company .receipt-enterprise-status{display:grid;gap:4px;min-width:138px;padding:9px 11px;border-radius:13px;text-align:right}
#company .receipt-enterprise-status small{font-size:.56rem;font-weight:900;letter-spacing:.07em}
#company .receipt-enterprise-status strong{font-size:.90rem;line-height:1.15}
#company .receipt-enterprise-status.has-due{background:#fff1f1;color:#c92a35}
#company .receipt-enterprise-status.is-paid{background:#edf9f4;color:#07865f}

#company .receipt-bottle-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:9px}
#company .receipt-bottle-grid>span{display:grid;grid-template-columns:auto 1fr;align-items:end;column-gap:4px;row-gap:4px;min-height:91px;padding:11px;border:1px solid #e0eaf1;border-radius:14px;background:#f8fbfd}
#company .receipt-bottle-grid small{grid-column:1/-1;font-size:.59rem;line-height:1.15;font-weight:900;letter-spacing:.055em;color:#668095}
#company .receipt-bottle-grid strong{font-size:1.68rem;line-height:.95;color:#173651}
#company .receipt-bottle-grid em{font-size:.67rem;font-style:normal;font-weight:850;color:#74899b;padding-bottom:2px}
#company .receipt-bottle-grid i{grid-column:1/-1;font-size:.60rem;font-style:normal;line-height:1.2;color:#70869a}
#company .receipt-bottle-grid .received{background:#f1fbf6;border-color:#d4ebdf}
#company .receipt-bottle-grid .received strong{color:#087957}
#company .receipt-bottle-grid .sent{background:#f1f7ff;border-color:#d8e5f6}
#company .receipt-bottle-grid .sent strong{color:#356db7}
#company .receipt-bottle-grid .defective{background:#fff8f1;border-color:#f2e0cf}
#company .receipt-bottle-grid .defective strong{color:#ba6a25}
#company .receipt-bottle-grid .holding.increase{background:#fff4f4;border-color:#f0d5d8}
#company .receipt-bottle-grid .holding.increase strong{color:#c92a35}
#company .receipt-bottle-grid .holding.decrease{background:#f0faf5;border-color:#d4ebdf}
#company .receipt-bottle-grid .holding.decrease strong{color:#07865f}

#company .receipt-enterprise-finance{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:0}
#company .receipt-enterprise-finance span{display:grid;gap:4px;min-height:63px;padding:9px 10px;border:1px solid #e5edf2;border-radius:12px;background:#fbfdfe}
#company .receipt-enterprise-finance small{font-size:.55rem;font-weight:900;line-height:1.15;letter-spacing:.05em;color:#758a9b}
#company .receipt-enterprise-finance strong{font-size:.82rem;line-height:1.2;color:#173651;white-space:normal;overflow-wrap:anywhere}
#company .receipt-enterprise-finance .due{background:#fff5f5}
#company .receipt-enterprise-finance .due strong{color:#c92a35}
#company .receipt-enterprise-finance .paid{background:#f1faf6}
#company .receipt-enterprise-finance .paid strong{color:#07865f}
#company .receipt-enterprise-note{margin-top:9px;padding:9px 10px;border-left:3px solid #b8d8ed;border-radius:0 10px 10px 0;background:#f7fbfe}
#company .receipt-enterprise-note small{font-size:.56rem;font-weight:900;letter-spacing:.07em;color:#61839c}
#company .receipt-enterprise-note p{margin:3px 0 0;color:#4f6a7e;font-size:.72rem;line-height:1.42}
#company .receipt-enterprise-actions{display:flex;justify-content:flex-end;gap:7px;margin-top:10px}
#company .receipt-enterprise-actions button{min-height:38px;padding:7px 12px;border-radius:10px;font-size:.68rem;font-weight:850}
#company .receipt-readonly-note{display:block;margin-top:9px;padding:8px 10px;border-radius:10px;background:#f5f8fa;color:#6f8496;font-size:.67rem;font-weight:750}
#company .company-payment-row{min-height:66px;padding:10px 0}
#company .company-payment-row>div>strong{font-size:.83rem}
#company .company-payment-row small{font-size:.67rem;line-height:1.4}

@media(max-width:980px){
  #company .company-total-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  #company .company-history-grid{grid-template-columns:1fr}
  #company .company-bottle-lifetime{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:760px){
  #company .company-page-head{display:grid;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;margin-bottom:10px!important;padding:0 2px!important}
  #company .company-page-head h2{font-size:1.52rem!important;line-height:1.12!important}
  #company .company-page-head .section-note{display:block!important;margin-top:5px;font-size:.72rem;line-height:1.35}
  #company .company-head-actions{width:100%;display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important}
  #company .company-head-actions .btn{height:44px!important;min-height:44px!important;padding:0 9px!important;border-radius:12px!important;font-size:.75rem!important}

  .company-period-panel{grid-template-columns:1fr;gap:9px;margin-bottom:10px;padding:12px;border-radius:16px}
  .company-period-heading{grid-template-columns:minmax(0,1fr);gap:3px}
  .company-period-heading small{font-size:.60rem}
  .company-period-heading strong{font-size:1rem}
  .company-period-heading>span{font-size:.68rem}
  .company-period-controls{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr) 78px;gap:6px}
  .company-period-controls label{font-size:.58rem;gap:4px}
  .company-period-controls input,.company-period-controls select{height:43px;padding:0 8px;font-size:.78rem;border-radius:11px}
  .company-period-controls .btn{height:43px;min-height:43px;padding:0 5px;font-size:.66rem}

  #company .company-hub{padding:13px!important;border-radius:17px!important;margin-bottom:10px!important}
  #company .company-section-head h2{font-size:1.18rem!important}
  #company .company-summary-note{font-size:.67rem}
  #company .company-total-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important;margin-bottom:11px!important}
  #company .company-total-summary>span{min-height:89px!important;padding:10px 11px!important;border-radius:14px}
  #company .company-total-summary small{font-size:.57rem!important}
  #company .company-total-summary strong{font-size:1.28rem!important}
  #company .company-total-summary strong em{font-size:.65rem}
  #company .company-total-summary>span>i{font-size:.59rem}

  #company .company-profile-card.company-profile-enterprise{padding:13px!important;border-radius:16px!important}
  #company .company-profile-enterprise .company-profile-head{gap:8px}
  #company .company-profile-enterprise .company-profile-head>div>strong{font-size:1.18rem!important}
  #company .company-profile-enterprise .company-profile-head p{font-size:.70rem}
  #company .company-profile-enterprise .supplier-held-pill{min-width:96px;padding:8px 9px}
  #company .company-profile-enterprise .supplier-held-pill strong{font-size:1.35rem}
  #company .company-bottle-lifetime{grid-template-columns:1fr 1fr;gap:6px;margin:10px 0}
  #company .company-bottle-lifetime span{min-height:50px;padding:7px 8px;font-size:.64rem!important}
  #company .company-bottle-lifetime b{font-size:.95rem}
  #company .company-finance-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important}
  #company .company-finance-grid span{min-height:62px;padding:8px!important}
  #company .company-finance-grid small{font-size:.52rem!important}
  #company .company-finance-grid strong{font-size:.76rem!important}
  #company .company-profile-actions{grid-template-columns:1fr 1fr!important}
  #company .company-profile-actions button{min-height:40px!important;font-size:.67rem!important}

  #company .company-history-card{padding:13px!important;border-radius:17px!important}
  #company .company-history-card>.section-head h2{font-size:1.18rem}
  #company .company-history-card>.section-head p{font-size:.67rem}
  #company .company-receipt-disclosure>summary{min-height:44px;font-size:.72rem}
  #company .company-receipt-list{gap:10px;padding-top:10px!important}
  #company .receipt-enterprise-card{padding:12px!important;border-radius:15px!important}
  #company .receipt-enterprise-head{grid-template-columns:minmax(0,1fr) auto;gap:7px;margin-bottom:10px}
  #company .receipt-enterprise-identity>strong{font-size:1.08rem}
  #company .receipt-number-line span{font-size:.57rem}
  #company .receipt-number-line time{font-size:.68rem}
  #company .receipt-enterprise-identity>small{font-size:.61rem}
  #company .receipt-enterprise-status{min-width:110px;padding:8px}
  #company .receipt-enterprise-status small{font-size:.49rem}
  #company .receipt-enterprise-status strong{font-size:.75rem}
  #company .receipt-bottle-grid{grid-template-columns:1fr 1fr;gap:6px;margin-bottom:7px}
  #company .receipt-bottle-grid>span{min-height:84px;padding:9px;border-radius:13px}
  #company .receipt-bottle-grid small{font-size:.53rem}
  #company .receipt-bottle-grid strong{font-size:1.58rem}
  #company .receipt-bottle-grid em{font-size:.63rem}
  #company .receipt-bottle-grid i{font-size:.55rem}
  #company .receipt-enterprise-finance{grid-template-columns:1fr 1fr;gap:6px}
  #company .receipt-enterprise-finance span{min-height:58px;padding:8px}
  #company .receipt-enterprise-finance small{font-size:.50rem}
  #company .receipt-enterprise-finance strong{font-size:.76rem}
  #company .receipt-enterprise-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  #company .receipt-enterprise-actions button{width:100%;min-height:39px}
}

@media(max-width:390px){
  .company-period-controls{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr) 68px}
  .company-period-controls input,.company-period-controls select{font-size:.73rem;padding:0 6px}
  .company-period-controls .btn{font-size:.61rem}
  #company .company-total-summary strong{font-size:1.20rem!important}
  #company .receipt-enterprise-head{grid-template-columns:1fr}
  #company .receipt-enterprise-status{width:100%;min-width:0;text-align:left;grid-template-columns:auto 1fr;align-items:center}
  #company .receipt-enterprise-status strong{text-align:right}
}

/* 3.31.0 — Large, readable stock-receipt form */
#receipt-dialog.receipt-enterprise-dialog{width:min(760px,calc(100% - 28px));max-height:92dvh;border-radius:22px}
#receipt-dialog #receipt-form{gap:14px;padding:20px}
#receipt-dialog .dialog-head{padding-bottom:12px;border-bottom:1px solid #e1eaf1}
#receipt-dialog .dialog-head small{font-size:.67rem;font-weight:900;letter-spacing:.10em;color:#0878ef}
#receipt-dialog .dialog-head h2{margin-top:4px;font-size:1.55rem;line-height:1.12;color:#173651}
#receipt-dialog .receipt-form-section{gap:13px;padding:15px 16px;border-radius:17px;background:#f9fcfe}
#receipt-dialog .receipt-form-section h3{font-size:1.02rem;line-height:1.2;color:#214e70}
#receipt-dialog label{gap:6px;font-size:.76rem;font-weight:850;color:#5c7387}
#receipt-dialog input,#receipt-dialog select{min-height:50px;height:50px;padding:0 12px;border-radius:12px;font-size:.96rem;font-weight:750;color:#173651;background:#fff}
#receipt-dialog .receipt-quantity-grid{gap:10px}
#receipt-dialog .receipt-quantity-field{padding:11px 12px;border:1px solid #dce8f0;border-radius:14px;background:#fff}
#receipt-dialog .receipt-quantity-field:first-child{border-color:#d8e5f6;background:#f5f9ff}
#receipt-dialog .receipt-quantity-field:last-child{border-color:#d4ebdf;background:#f4fbf7}
#receipt-dialog .receipt-quantity-field input{height:58px;min-height:58px;margin-top:2px;font-size:1.42rem;font-weight:900;text-align:center}
#receipt-dialog #receipt-defective-returned,#receipt-dialog #receipt-unit-cost,#receipt-dialog #receipt-paid{font-size:1.12rem;font-weight:850}
#receipt-dialog .field-help{font-size:.70rem;line-height:1.45;color:#758a9d}
#receipt-dialog .bottle-company-preview{min-height:58px;align-items:center;padding:12px 14px;border:1px solid #cfe2ef;border-radius:14px;background:#eef8ff;font-size:.76rem;font-weight:800}
#receipt-dialog .bottle-company-preview strong{font-size:1.02rem;color:#0e6da8;text-align:right}
#receipt-dialog .receipt-money-summary{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
#receipt-dialog .receipt-money-summary span{min-height:84px;align-content:center;padding:12px 13px;border:1px solid #e0eaf1;border-radius:14px;background:#f6f9fc}
#receipt-dialog .receipt-money-summary small{font-size:.60rem;line-height:1.15}
#receipt-dialog .receipt-money-summary strong{font-size:1.12rem;line-height:1.15}
#receipt-dialog .receipt-money-summary .due{border-color:#f0d7da;background:#fff4f4}
#receipt-dialog .receipt-breakdown{padding:8px 10px;border-radius:10px;background:#eef7fd;font-size:.75rem;font-weight:750;text-align:left}
#receipt-dialog>.dialog-actions,#receipt-dialog .dialog-actions{gap:9px;margin-top:0}
#receipt-dialog .dialog-actions .btn{min-height:48px;border-radius:12px;font-size:.82rem;font-weight:900}

@media(max-width:560px){
  #receipt-dialog.receipt-enterprise-dialog{width:calc(100% - 12px);max-height:95dvh;border-radius:22px 22px 14px 14px}
  #receipt-dialog #receipt-form{gap:10px;padding:14px 14px max(12px,env(safe-area-inset-bottom))}
  #receipt-dialog .dialog-head{padding-bottom:9px}
  #receipt-dialog .dialog-head h2{font-size:1.32rem}
  #receipt-dialog .receipt-form-section{gap:10px;padding:11px;border-radius:15px}
  #receipt-dialog .receipt-form-section h3{font-size:.94rem}
  #receipt-dialog label{font-size:.68rem}
  #receipt-dialog input,#receipt-dialog select{height:48px;min-height:48px;font-size:.90rem}
  #receipt-dialog .receipt-quantity-grid{display:grid;grid-template-columns:1fr 1fr!important;gap:7px}
  #receipt-dialog .receipt-quantity-field{padding:9px 8px;font-size:.64rem;text-align:center}
  #receipt-dialog .receipt-quantity-field input{height:56px;min-height:56px;font-size:1.48rem;padding:0 5px}
  #receipt-dialog .receipt-finance-section>.two{grid-template-columns:1fr!important}
  #receipt-dialog .receipt-money-summary{grid-template-columns:1fr 1fr;gap:6px}
  #receipt-dialog .receipt-money-summary .due{grid-column:1/-1}
  #receipt-dialog .receipt-money-summary span{min-height:68px;padding:9px 10px}
  #receipt-dialog .receipt-money-summary strong{font-size:1rem}
  #receipt-dialog .bottle-company-preview{min-height:52px;padding:10px 11px;font-size:.68rem}
  #receipt-dialog .bottle-company-preview strong{font-size:.90rem}
  #receipt-dialog .dialog-actions{position:sticky;bottom:-1px;z-index:4;margin:0 -14px -14px;padding:10px 14px max(10px,env(safe-area-inset-bottom));background:#fff;box-shadow:0 -8px 20px rgba(20,54,79,.08)}
  #receipt-dialog .dialog-actions .btn{min-height:46px}
}

/* 3.32.0 — Công ty tự thanh toán / tất toán */
.supplier-company-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}
.supplier-company-actions .edit{min-height:50px;font-size:15px;font-weight:800;border-radius:14px}
.supplier-company-actions .settlement-strong{background:#0f6f61;color:#fff;border-color:#0f6f61;box-shadow:0 8px 20px rgba(15,111,97,.16)}
.supplier-company-actions .paid-soft,.supplier-receipt-actions .paid-soft{background:#ecf8f3;color:#087454;border-color:#ccebdd}
.supplier-receipt-actions{grid-template-columns:repeat(3,minmax(0,1fr))}
.supplier-receipt-actions .payment-primary{font-weight:900;min-height:48px}
.management-review-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:9px;align-items:center}
.management-review-note{grid-column:1/-1;padding:10px 12px;border-radius:12px;background:#f3f7fb;color:#5d7184;font-size:13px;font-weight:700;line-height:1.4}
.supplier-money-dialog form{max-width:660px}
.supplier-money-dialog .dialog-head h2{font-size:25px;line-height:1.15}
.supplier-money-help{margin:0 0 14px;padding:12px 14px;border-radius:14px;background:#f1f7fd;color:#516b82;font-size:14px;font-weight:650;line-height:1.5}
.supplier-money-dialog label{font-size:14px;font-weight:800;color:#35526b}
.supplier-money-dialog input,.supplier-money-dialog select{min-height:52px;font-size:17px;font-weight:750}
.supplier-payment-preview{padding:16px 18px;border-radius:16px;font-size:15px;line-height:1.45}
.supplier-payment-preview strong{font-size:20px}
.supplier-fill-due{width:100%;min-height:48px;font-weight:850}
.supplier-settlement-summary{display:grid;gap:7px;padding:18px;border-radius:18px;background:#eef8f5;border:1px solid #cfe9e0;margin-bottom:16px}
.supplier-settlement-summary small{font-size:12px;font-weight:900;letter-spacing:.08em;color:#16725f}
.supplier-settlement-summary strong{font-size:21px;color:#17344b}
.supplier-settlement-summary span{font-size:14px;color:#607487;font-weight:700}
.supplier-settlement-summary b{font-size:30px;line-height:1;color:#087454}
.supplier-settlement-summary p{margin:3px 0 0;color:#5b7183;font-size:13px;line-height:1.5}
.company-payment-row>div:first-child{display:grid;gap:4px}
.company-payment-row>div:first-child small+small{font-weight:750;color:#668097}
@media(max-width:760px){
  .supplier-company-actions,.supplier-receipt-actions,.management-review-actions{grid-template-columns:1fr}
  .management-review-note{grid-column:auto}
  .supplier-company-actions .edit,.supplier-receipt-actions .edit,.supplier-receipt-actions .mini-danger{width:100%;min-height:50px;font-size:15px}
  .supplier-money-dialog .two{grid-template-columns:1fr}
  .supplier-settlement-summary b{font-size:27px}
}


/* 3.33.0 — Admin nhập hàng/thanh toán + thời gian nghiệp vụ */
.transaction-datetime{align-items:end}
.transaction-datetime input[type="date"],.transaction-datetime input[type="time"]{font-variant-numeric:tabular-nums;font-weight:800}
#company .management-receipt-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));justify-content:stretch}
#company .management-receipt-actions button{width:100%}
#company .company-profile-actions.management-review-actions .primary-soft{font-weight:900}
#company .company-profile-actions.management-review-actions .settlement-strong{background:#0f6f61;color:#fff;border-color:#0f6f61}
@media(max-width:760px){
  .transaction-datetime{grid-template-columns:1fr 1fr!important}
  #company .management-receipt-actions{grid-template-columns:1fr}
}

/* 3.33.1 — Giá nhập mặc định 4.200đ/bình; ô đơn giá dùng đồng thực tế. */

/* 3.35.0 — Chu trình công ty → xe → khách → vỏ về xe, cho phép giữ vỏ qua đêm */
.receipt-vehicle-route-field{margin-top:12px}
.inventory-cycle-help strong{color:#16405f}.cycle-location-summary .cycle-primary{background:#eef8ff;border-left:4px solid #1688e8}.cycle-location-summary .cycle-primary small{font-size:.68rem;color:#6d8598;font-weight:750}
.cycle-vehicle-row{align-items:center}.cycle-vehicle-actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}.cycle-receipt-action{color:#0878ef!important;background:#eef8ff!important;border-color:#b9daf2!important}
@media(max-width:560px){.cycle-vehicle-row{align-items:flex-start}.cycle-vehicle-row .vehicle-location-balance{align-items:flex-end}.cycle-vehicle-actions{max-width:190px}}


/* 3.37.0 — Vận hành gọn: điều chỉnh lên đầu, bỏ lịch sử dài khỏi thẻ tồn kho */
#operations .operations-command-strip-six{grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}
#operations .operations-command-strip-six .operations-command{min-height:68px;padding:9px 8px;column-gap:7px}
#operations .operations-command.adjustment{border-color:#c7dff0;background:#f8fcff}
#operations .operations-command.adjustment>span{background:#eaf5fc;color:#176ca9}
#operations #operation-inventory .inventory-card-tools{min-width:auto}
@media(max-width:760px){
  #operations .operations-command-strip-six{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:9px}
  #operations .operations-command-strip-six .operations-command{min-height:54px;padding:5px 4px;grid-template-columns:1fr;grid-template-rows:23px auto;gap:3px;place-items:center;text-align:center;border-radius:12px}
  #operations .operations-command-strip-six .operations-command>span{grid-row:auto;width:23px;height:23px;border-radius:7px;font-size:.78rem}
  #operations .operations-command-strip-six .operations-command strong{font-size:.66rem;line-height:1.08;white-space:normal}
  #operations .operations-command-strip-six .operations-command small{display:none}
}
@media(max-width:390px){
  #operations .operations-command-strip-six{gap:5px}
  #operations .operations-command-strip-six .operations-command strong{font-size:.62rem}
}

/* 3.38.0 — Company card + collapsed stock receipts */
#company .company-history-grid.company-history-single{grid-template-columns:minmax(0,1fr)}
#company .company-link-metrics span{position:relative;display:grid;grid-template-columns:auto 1fr;align-items:end;gap:3px 5px;min-height:68px;padding:10px 11px}
#company .company-link-metrics span small{grid-column:1/-1;font-size:.56rem;font-weight:900;letter-spacing:.075em;color:#678197}
#company .company-link-metrics span b{font-size:1.34rem;line-height:1;color:#173651}
#company .company-link-metrics span em{font-size:.64rem;font-style:normal;font-weight:800;color:#73899c;padding-bottom:1px}
#company .company-link-metrics .sales{background:#f1fbf6;border-color:#d4ebdf}
#company .company-link-metrics .sales b{color:#087957}
#company .company-link-metrics .receipts{background:#f1f7ff;border-color:#d8e5f6}
#company .company-link-metrics .receipts b{color:#356db7}
#company .company-link-metrics .defective{background:#fff8f1;border-color:#f2e0cf}
#company .company-link-metrics .defective b{color:#ba6a25}
#company .company-link-metrics .latest{background:#f8fafc}
#company .company-link-metrics .latest b{font-size:.88rem;line-height:1.2}
#company .company-link-metrics .latest em{grid-column:1/-1;padding:0}

#company details.receipt-item-disclosure.receipt-enterprise-card{padding:0!important;overflow:hidden}
#company .receipt-item-summary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;min-height:92px;padding:13px 14px;cursor:pointer;list-style:none;-webkit-tap-highlight-color:transparent}
#company .receipt-item-summary::-webkit-details-marker{display:none}
#company .receipt-item-summary::marker{display:none;content:""}
#company .receipt-item-summary-main{display:grid;gap:4px;min-width:0}
#company .receipt-item-summary-main>strong{font-size:1.12rem;line-height:1.12;color:#173651;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#company .receipt-item-summary-main>small{font-size:.66rem;font-weight:750;color:#74899b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#company .receipt-item-summary-side{display:flex;align-items:center;gap:8px;min-width:0}
#company .receipt-item-summary .receipt-enterprise-status{min-width:126px;margin:0}
#company .receipt-item-chevron{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:#eef6fc;color:#0878ef;font-size:1.12rem;font-weight:900;line-height:1;transition:transform .18s ease}
#company details.receipt-item-disclosure[open] .receipt-item-chevron{transform:rotate(180deg)}
#company .receipt-item-detail{padding:12px 14px 14px;border-top:1px solid #e3edf3;background:#fcfeff}
#company .receipt-detail-meta{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 10px}
#company .receipt-detail-meta span{padding:5px 8px;border-radius:9px;background:#f1f5f8;color:#6c8295;font-size:.62rem;font-weight:800}
#company details.receipt-item-disclosure.cancelled .receipt-item-summary{background:#f7f8f9}

@media(max-width:760px){
  #company .company-link-metrics span{min-height:64px;padding:9px 10px}
  #company .company-link-metrics span small{font-size:.52rem}
  #company .company-link-metrics span b{font-size:1.18rem}
  #company .company-link-metrics .latest b{font-size:.80rem}
  #company .receipt-item-summary{grid-template-columns:minmax(0,1fr) auto;gap:7px;min-height:82px;padding:11px 10px}
  #company .receipt-item-summary-main>strong{font-size:1rem}
  #company .receipt-item-summary-main>small{font-size:.60rem}
  #company .receipt-item-summary .receipt-enterprise-status{min-width:105px;padding:7px 8px}
  #company .receipt-item-summary .receipt-enterprise-status small{font-size:.47rem}
  #company .receipt-item-summary .receipt-enterprise-status strong{font-size:.70rem}
  #company .receipt-item-chevron{width:25px;height:25px;border-radius:8px;font-size:1rem}
  #company .receipt-item-detail{padding:10px}
}

@media(max-width:390px){
  #company .receipt-item-summary{grid-template-columns:minmax(0,1fr);gap:8px}
  #company .receipt-item-summary-side{justify-content:space-between}
  #company .receipt-item-summary .receipt-enterprise-status{flex:1;display:grid;grid-template-columns:auto 1fr;align-items:center;text-align:left}
  #company .receipt-item-summary .receipt-enterprise-status strong{text-align:right}
}

/* 3.39.0 — Tổng thu công ty + quỹ vỏ chung Phước/Pull */
#company .company-link-metrics .collected{background:#f2fbf7;border-color:#d3ebdf}
#company .company-link-metrics .collected b{color:#087957;font-size:1.05rem;line-height:1.15;overflow-wrap:anywhere}
#company .company-link-metrics .collected em{grid-column:1/-1;padding:0}
.shared-empty-pool-row{border-color:#cfe6dc!important;background:#f3fbf7!important}
.shared-empty-pool-row>div:first-child>strong{color:#087957}
.shared-empty-pool-row .vehicle-location-balance>strong{color:#087957}


/* 3.39.0 — QR chuyển khoản ổn định qua proxy cùng tên miền */
.qr-payment .qr-load-error{display:block;margin:12px auto;padding:12px 14px;max-width:420px;border:1px solid #f2c9c9;border-radius:12px;background:#fff5f5;color:#b4232d;font-size:.9rem;font-weight:700;line-height:1.4}
.qr-payment .qr-load-error.is-hidden{display:none}
.qr-payment img[hidden]{display:none!important}


/* 3.40.0 — Vận hành: 4 công cụ kiểm soát, bỏ thao tác nhập liệu đã chuyển sang Tổng quan */
#operations .operations-command-strip-four{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
#operations .operations-command-strip-four .operations-command{min-height:66px}
@media(max-width:760px){#operations .operations-command-strip-four{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}#operations .operations-command-strip-four .operations-command{min-height:58px}}


/* 3.41.0 — Vận hành trực tiếp: Công ty → Xe, không còn kho/nạp xe trong luồng chính */
#operations .operations-command-strip-three{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
#operations .operations-command-strip-three .operations-command{min-height:66px}
#operations .cycle-location-summary{grid-template-columns:repeat(4,minmax(0,1fr))}
#operations .legacy-warehouse-history{margin-top:10px;opacity:.82}
@media(max-width:760px){
  #operations .operations-command-strip-three{grid-template-columns:1fr 1fr;gap:7px}
  #operations .operations-command-strip-three .operations-command:first-child{grid-column:1/-1}
  #operations .cycle-location-summary{grid-template-columns:1fr 1fr}
}


/* 3.42.0 — Nhận trực tiếp lốc 330/500 từ công ty lên xe */
#receipt-dialog .receipt-pack-section{background:#f7fbff;border-color:#d9e9f5}
#receipt-dialog .receipt-pack-grid,#receipt-dialog .receipt-pack-cost-grid{gap:10px}
#receipt-dialog #receipt-pack-330-received,#receipt-dialog #receipt-pack-500-received{font-size:1.12rem;font-weight:850}
#company .receipt-bottle-grid .received.pack{background:#f4f9ff;border-color:#dce8f5}
#company .receipt-bottle-grid .received.pack strong{color:#176eae}
@media(max-width:640px){#receipt-dialog .receipt-pack-grid,#receipt-dialog .receipt-pack-cost-grid{grid-template-columns:1fr 1fr}#company .receipt-enterprise-finance{grid-template-columns:1fr 1fr}}

/* 3.43.0 — Nước lốc là tùy chọn, ẩn mặc định trong phiếu nhận chuyến */
#receipt-dialog .receipt-pack-optional-control{margin-top:-2px}
#receipt-dialog .receipt-pack-toggle{display:flex;align-items:center;gap:11px;width:100%;padding:12px 14px;border:1px dashed #bfd7e8;border-radius:15px;background:#f7fbfe;color:#214e70;cursor:pointer;user-select:none}
#receipt-dialog .receipt-pack-toggle input{flex:0 0 auto;width:20px;height:20px;min-height:20px;margin:0;padding:0;accent-color:#0878ef}
#receipt-dialog .receipt-pack-toggle span{display:grid;gap:2px;text-align:left}
#receipt-dialog .receipt-pack-toggle strong{font-size:.86rem;line-height:1.2}
#receipt-dialog .receipt-pack-toggle small{font-size:.68rem;font-weight:700;color:#758a9d}
#receipt-dialog .receipt-pack-toggle:has(input:checked){border-style:solid;border-color:#a9d2ef;background:#eef8ff}
#receipt-dialog .receipt-pack-section{background:#f7fbff;border-color:#d9e9f5}
#receipt-dialog .receipt-section-title-row small{display:block;margin-top:3px;font-size:.68rem;font-weight:700;color:#758a9d}
@media(max-width:640px){
  #receipt-dialog .receipt-pack-toggle{padding:10px 11px;border-radius:13px}
  #receipt-dialog .receipt-pack-toggle strong{font-size:.78rem}
  #receipt-dialog .receipt-pack-toggle small{font-size:.63rem}
}


/* 3.44.0 — Vận hành gọn: bỏ nút Nhận hàng công ty bị lặp; thao tác nhận hàng nằm ở Tổng quan/Công ty */
#operations .operations-command-strip-two{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#operations .operations-command-strip-two .operations-command{min-height:62px}
@media(max-width:760px){
  #operations .operations-command-strip-two{grid-template-columns:1fr 1fr;gap:7px;margin-bottom:8px}
  #operations .operations-command-strip-two .operations-command{min-height:54px;padding:6px 7px}
}

/* 3.47.0 — lỗi phiếu nhận hàng hiển thị ngay trong modal + đối soát quỹ vỏ */
.receipt-empty-stock-state{display:grid;gap:5px;margin-top:2px;padding:11px 12px;border:1px solid #d8e7f1;border-radius:14px;background:#f7fbfe;color:#567087}
.receipt-empty-stock-state>span{display:flex;justify-content:space-between;gap:10px;font-size:.78rem;font-weight:800}
.receipt-empty-stock-state>span strong{color:#174d72}
.receipt-empty-stock-state>small{line-height:1.45}
.receipt-empty-stock-state.is-short{border-color:#f2c5c9;background:#fff6f6;color:#9f3340}
.receipt-empty-stock-state.is-short>span strong{color:#c02635}
.receipt-empty-reconcile{display:flex;grid-template-columns:auto 1fr;align-items:flex-start;gap:9px;margin-top:5px;padding:10px;border-radius:12px;background:#fff;border:1px solid #f0cfd2;color:#28465f}
.receipt-empty-reconcile input{width:20px;height:20px;margin:1px 0 0;flex:0 0 auto}
.receipt-empty-reconcile span{display:grid;gap:3px}
.receipt-empty-reconcile span strong{font-size:.78rem}
.receipt-empty-reconcile span small{font-size:.7rem;line-height:1.4;color:#6f8192;font-weight:600}
.receipt-form-error{position:sticky;bottom:72px;z-index:5;padding:11px 12px;border:1px solid #efb8be;border-radius:13px;background:#fff2f3;color:#a61f2d;font-size:.78rem;font-weight:800;line-height:1.45;box-shadow:0 8px 20px rgba(122,25,37,.08)}


/* 3.49.0 — Thanh toán phiếu nhận hàng: Nợ lại / Thu đủ */
.receipt-payment-choice{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid #d8e7f2;border-radius:14px;background:linear-gradient(145deg,#f7fbff,#fff)}
.receipt-payment-choice>div:first-child{display:grid;gap:2px;min-width:0}.receipt-payment-choice small{color:#0878ef!important;font-size:.58rem!important;font-weight:900!important;letter-spacing:.1em!important}.receipt-payment-choice strong{font-size:.9rem;color:#214a6b}.receipt-payment-choice span{color:#71869a;font-size:.66rem;line-height:1.35}.receipt-payment-shortcuts{display:flex;gap:6px;flex:none}.receipt-payment-shortcuts button{min-height:38px;border:1px solid #d1e0ec;border-radius:11px;background:#fff;padding:0 13px;color:#49657e;font-size:.72rem;font-weight:900;cursor:pointer}.receipt-payment-shortcuts button[data-receipt-payment="debt"].active{border-color:#f0c98c;background:#fff8e9;color:#a36000}.receipt-payment-shortcuts button[data-receipt-payment="full"].active{border-color:#b8e5d2;background:#edf9f4;color:#087d5b}.receipt-payment-helper{display:block;margin-top:-4px}.receipt-payment-helper:empty{display:none}
@media(max-width:560px){.receipt-payment-choice{align-items:stretch;flex-direction:column;padding:10px}.receipt-payment-shortcuts{display:grid;grid-template-columns:1fr 1fr}.receipt-payment-shortcuts button{min-height:42px}.receipt-payment-fields{grid-template-columns:1fr!important}}

/* 3.49.0 — Thẻ công ty ưu tiên sản lượng lốc thay Phiếu hàng / Gần nhất */
#company .company-link-metrics .latest.pack{background:#f6f3ff;border-color:#e4dcff}
#company .company-link-metrics .latest.pack b{font-size:1.34rem;line-height:1;color:#6d4bf4}
#company .company-link-metrics .latest.pack em{grid-column:auto;padding-bottom:1px}
@media(max-width:560px){#company .company-link-metrics .latest.pack b{font-size:1.18rem}}

/* 3.94.0 — Unified stock ledger */
.stock-ledger-rows { display: grid; gap: 8px; }
.stock-ledger-row { grid-template-columns: auto minmax(0,1fr); align-items: center; }
.stock-ledger-type { min-width: 96px; border-radius: 999px; background: #edf5ff; padding: 6px 9px; color: #0b6ff3; font-size: .7rem; font-weight: 850; text-align: center; white-space: nowrap; }
@media (max-width: 560px) { .stock-ledger-row { grid-template-columns: 1fr; gap: 6px; } .stock-ledger-type { justify-self: start; min-width: 0; } }
.settlement-shift-control { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:10px; padding:9px 10px; border:1px solid #e0e9f1; border-radius:12px; background:#f8fafc; color:#6c7f92; font-size:.75rem; }
.settlement-shift-control.closed { border-color:#bfe6d5; background:#eefaf5; color:#087557; }
.settlement-shift-control .edit { min-height:34px; white-space:nowrap; }


/* 3.19.0 — Employee Enterprise Console
   Lớp giao diện này được nạp sau các stylesheet cũ để nâng cấp riêng trải nghiệm
   nhân viên mà không thay đổi màn hình quản trị hay công thức nghiệp vụ. */

:root {
  --employee-blue: #0b78e3;
  --employee-blue-dark: #075eaf;
  --employee-blue-soft: #eaf5ff;
  --employee-green: #07865f;
  --employee-green-soft: #eaf8f2;
  --employee-ink: #14283b;
  --employee-muted: #63798d;
  --employee-line: #d7e4ee;
  --employee-surface: #ffffff;
  --employee-shadow: 0 10px 28px rgba(25, 62, 91, .08);
}

/* Tìm kiếm dùng chung cho chuyến giao và công nợ. */
.employee-search-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  margin: 0 0 12px;
  padding: 10px;
  border: 1px solid var(--employee-line);
  border-radius: 18px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 7px 20px rgba(28, 65, 94, .05);
}

.employee-search-box {
  display: flex;
  min-width: 0;
  height: 48px;
  align-items: center;
  border: 1px solid #c7d8e5;
  border-radius: 14px;
  background: #fff;
  padding-left: 13px;
  transition: border-color .18s ease, box-shadow .18s ease;
}

.employee-search-box:focus-within {
  border-color: #55a9ef;
  box-shadow: 0 0 0 4px rgba(11, 120, 227, .12);
}

.employee-search-box > span {
  flex: 0 0 auto;
  color: #71899d;
  font-size: 1.45rem;
  line-height: 1;
}

.employee-search-box input {
  min-width: 0;
  height: 46px;
  border: 0;
  background: transparent;
  box-shadow: none;
  padding: 0 9px;
  font-size: 1rem;
}

.employee-search-box input:focus {
  border: 0;
  box-shadow: none;
}

.employee-search-box button {
  display: none;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  margin-right: 4px;
  border: 0;
  border-radius: 11px;
  background: #edf3f7;
  color: #566f83;
  font-size: 1.3rem;
  cursor: pointer;
}

.employee-search-box button.is-visible { display: grid; place-items: center; }

.employee-search-count {
  min-width: 72px;
  border-radius: 999px;
  background: var(--employee-blue-soft);
  padding: 9px 11px;
  color: var(--employee-blue-dark);
  text-align: center;
  font-size: .78rem;
  font-weight: 800;
  white-space: nowrap;
}

/* Khung ứng dụng nhân viên. */
.staff-mode {
  color: var(--employee-ink);
  background:
    radial-gradient(circle at 12% -6%, rgba(114, 196, 255, .30), transparent 25rem),
    linear-gradient(180deg, #f7fbfe 0, #f1f6fa 36rem, #eef4f8 100%);
}

.staff-mode .shell {
  width: min(760px, 100%);
  padding-top: max(14px, env(safe-area-inset-top));
  padding-bottom: calc(44px + env(safe-area-inset-bottom));
}

.staff-mode .header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 4px 2px 16px;
}

.staff-mode .brand { min-width: 0; }
.staff-mode .brand > div { min-width: 0; }
.staff-mode .brand small {
  display: block;
  overflow: hidden;
  color: var(--employee-blue);
  font-size: .75rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.staff-mode .brand h1 {
  overflow: hidden;
  margin-top: 3px;
  color: #10243a;
  font-size: 1.35rem;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.staff-mode .logo {
  width: 50px;
  height: 50px;
  flex: 0 0 50px;
  border-radius: 16px;
  background: linear-gradient(145deg, #0c82ed, #086bcd);
  box-shadow: 0 10px 22px rgba(8, 120, 239, .24);
}

.staff-mode .account-button {
  min-width: 106px;
  max-width: 126px;
  min-height: 50px;
  border-color: #cbdde9;
  border-radius: 15px;
  padding: 7px 11px;
  box-shadow: 0 6px 16px rgba(27, 64, 91, .06);
}

.staff-mode .account-button span {
  max-width: 102px;
  color: #17344c;
  font-size: .9rem;
}

.staff-mode .account-button small {
  margin-top: 2px;
  color: #6b8093;
  font-size: .7rem;
  letter-spacing: 0;
}

/* Bốn mục chính luôn vừa một hàng, không bị cuộn hoặc cắt chữ trên iPhone. */
.staff-mode .tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  top: 0;
  gap: 4px;
  margin: 0;
  padding: 5px;
  border: 1px solid #d5e2ec;
  border-radius: 17px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 8px 24px rgba(28, 65, 94, .07);
}

.staff-mode .tabs .tab {
  display: grid;
  min-width: 0;
  min-height: 48px;
  place-items: center;
  border-radius: 12px;
  padding: 0 5px;
  color: #64798c;
  font-size: .83rem;
  line-height: 1.1;
  white-space: nowrap;
}

.staff-mode .tabs .tab.active {
  background: linear-gradient(180deg, #edf7ff, #e5f3ff);
  color: var(--employee-blue);
  box-shadow: inset 0 0 0 1px rgba(59, 151, 228, .12);
}

.staff-mode .view { margin-top: 14px; }

/* Ngày làm việc. */
.staff-mode #overview > .toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 148px;
  min-height: 66px;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  padding: 11px 13px;
  border-color: var(--employee-line);
  border-radius: 18px;
  box-shadow: var(--employee-shadow);
}

.staff-mode #overview > .toolbar small {
  color: var(--employee-blue);
  font-size: .75rem;
  font-weight: 900;
  letter-spacing: .1em;
}

.staff-mode #overview > .toolbar small::after { display: none; content: none; }
.staff-mode #overview > .toolbar strong {
  overflow: hidden;
  margin-top: 4px;
  color: #263f56;
  font-size: .9rem;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.staff-mode #overview > .toolbar input {
  width: 148px;
  max-width: none;
  height: 44px;
  border-radius: 13px;
  font-size: .9rem;
  font-weight: 750;
}

/* Cụm thao tác đầu ca: rõ nghĩa, vùng chạm lớn, không có nút vỡ dòng. */
.staff-command-bar {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  margin-bottom: 12px;
}

.staff-command {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  min-height: 64px;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--employee-line);
  border-radius: 17px;
  background: #fff;
  padding: 8px 11px;
  color: var(--employee-ink);
  text-align: left;
  box-shadow: 0 6px 18px rgba(27, 64, 91, .055);
  cursor: pointer;
}

.staff-command > span:last-child { display: grid; min-width: 0; gap: 3px; }
.staff-command strong { font-size: .93rem; line-height: 1.1; }
.staff-command small {
  overflow: hidden;
  color: #6a8093;
  font-size: .75rem;
  letter-spacing: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.staff-command-icon {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 12px;
  background: #eef4f8;
  color: #3f6684;
  font-size: 1.25rem;
  font-weight: 850;
}

.staff-command-primary {
  border-color: transparent;
  background: linear-gradient(145deg, #0b80ea, #076bcf);
  color: #fff;
  box-shadow: 0 10px 24px rgba(8, 112, 216, .22);
}

.staff-command-primary .staff-command-icon { background: rgba(255, 255, 255, .18); color: #fff; }
.staff-command-primary small { color: rgba(255, 255, 255, .82); }
.staff-command-money { border-color: #c9e7da; background: linear-gradient(145deg, #f4fcf8, #fff); }
.staff-command-money .staff-command-icon { background: var(--employee-green-soft); color: var(--employee-green); }

/* Tổng quan ca làm. */
.staff-mode .staff-workflow {
  margin: 0 0 12px;
  padding: 15px;
  border-color: #cfe0eb;
  border-radius: 22px;
  box-shadow: var(--employee-shadow);
}

.staff-mode .staff-workflow-head {
  align-items: center;
  gap: 10px;
  margin: 0 0 12px !important;
}

.staff-mode .staff-workflow-head > div { min-width: 0; }
.staff-mode .staff-workflow-head small { font-size: .75rem !important; letter-spacing: .11em; }
.staff-mode .staff-workflow-head h2 {
  overflow: hidden;
  margin-top: 4px;
  font-size: 1.08rem;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.staff-mode #staff-profile-pill {
  max-width: 42%;
  overflow: hidden;
  flex: 0 0 auto;
  padding: 7px 10px;
  font-size: .75rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.staff-mode .staff-link-warning { font-size: .82rem; }
.staff-mode .staff-shift-hero {
  position: relative;
  overflow: hidden;
  min-height: 126px;
  align-items: flex-start;
  padding: 18px;
  border-radius: 19px;
  background: linear-gradient(140deg, #075fab 0%, #0a7be0 62%, #2b93ee 100%);
  box-shadow: 0 13px 28px rgba(7, 101, 185, .2);
}

.staff-mode .staff-shift-hero::after {
  position: absolute;
  right: -32px;
  bottom: -54px;
  width: 150px;
  height: 150px;
  border: 26px solid rgba(255, 255, 255, .08);
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

.staff-mode .staff-shift-hero > div { position: relative; z-index: 1; }
.staff-mode .staff-shift-hero small { font-size: .75rem; letter-spacing: .11em; }
.staff-mode .staff-shift-hero strong {
  margin-top: 8px;
  font-size: clamp(1.8rem, 8vw, 2.45rem);
  line-height: 1;
  letter-spacing: -.035em;
}

.staff-mode .staff-shift-hero p {
  max-width: 440px;
  margin-top: 10px;
  font-size: .78rem;
  line-height: 1.45;
}

.staff-mode .staff-shift-status {
  position: relative;
  z-index: 1;
  padding: 8px 10px;
  font-size: .75rem;
}

.staff-mode .staff-day-kpis {
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 10px;
}

.staff-mode .staff-day-kpis article {
  min-height: 80px;
  border-color: #dce7ee;
  border-radius: 15px;
  padding: 12px;
}

.staff-mode .staff-day-kpis article:last-child { grid-column: 1 / -1; min-height: 72px; }
.staff-mode .staff-day-kpis small {
  color: #6b8093;
  font-size: .7rem;
  line-height: 1.25;
  letter-spacing: .07em;
}

.staff-mode .staff-day-kpis strong {
  margin-top: 8px;
  overflow: visible;
  color: #193b57;
  font-size: .98rem;
  line-height: 1.35;
  text-overflow: clip;
  white-space: normal;
}

.staff-money-primary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 8px;
}

.staff-money-primary article {
  display: grid;
  min-width: 0;
  min-height: 104px;
  align-content: start;
  border: 1px solid #dbe7ef;
  border-radius: 15px;
  background: #fff;
  padding: 12px;
}

.staff-money-primary article:last-child { grid-column: 1 / -1; min-height: 94px; background: #f4f9fd; }
.staff-money-primary small {
  color: #6b8093;
  font-size: .75rem;
  font-weight: 900;
  letter-spacing: .06em;
  line-height: 1.3;
}

.staff-money-primary strong {
  overflow-wrap: anywhere;
  margin-top: 9px;
  color: #163a58;
  font-size: 1.1rem;
  line-height: 1.15;
}

.staff-money-primary article:first-child strong { color: var(--employee-blue-dark); }
.staff-money-primary article:nth-child(2) strong { color: #7a5a08; }
.staff-money-primary article:last-child strong { color: var(--employee-green); }
.staff-money-primary span {
  overflow: hidden;
  margin-top: 7px;
  color: #718598;
  font-size: .75rem;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.staff-mode .staff-settlement-more {
  margin-top: 9px;
  border-radius: 14px;
  padding: 0 11px;
}

.staff-mode .staff-settlement-more > summary {
  display: block;
  min-height: 46px;
  padding: 14px 2px;
  font-size: .82rem;
}

.staff-mode .staff-reconcile-strip {
  grid-template-columns: 1fr;
  gap: 7px;
  margin: 0 0 7px;
}

.staff-mode .staff-reconcile-strip article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px 12px;
  min-height: 58px;
  border: 1px solid #e0e9ef;
  border-radius: 12px;
  padding: 9px 11px;
}

.staff-mode .staff-reconcile-strip small { font-size: .78rem; }
.staff-mode .staff-reconcile-strip strong {
  margin: 0;
  overflow: visible;
  font-size: .86rem;
  text-overflow: clip;
}

.staff-mode .staff-reconcile-strip span {
  grid-column: 1 / -1;
  margin: 0;
  overflow: visible;
  font-size: .7rem;
  text-overflow: clip;
  white-space: normal;
}

.staff-mode .staff-detail-ledger { grid-template-columns: 1fr; gap: 7px; }
.staff-mode .staff-detail-ledger > div {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px 12px;
  min-height: 58px;
  padding: 9px 11px;
}

.staff-mode .staff-detail-ledger span { font-size: .78rem; }
.staff-mode .staff-detail-ledger strong { font-size: .86rem; }
.staff-mode .staff-detail-ledger small {
  grid-column: 1 / -1;
  overflow: visible;
  font-size: .7rem;
  text-overflow: clip;
  white-space: normal;
}

.staff-mode .staff-shift-readiness {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-height: 84px;
  gap: 10px;
  margin-top: 9px;
  border-radius: 15px;
  padding: 11px 12px;
}

.staff-mode .staff-shift-readiness small { font-size: .75rem; }
.staff-mode .staff-shift-readiness strong { margin-top: 4px; font-size: .88rem; }
.staff-mode .staff-shift-readiness p { margin-top: 4px; font-size: .75rem; line-height: 1.4; }
.staff-mode .staff-shift-checks { display: grid; max-width: none; justify-items: end; gap: 5px; }
.staff-mode .staff-shift-checks span { padding: 6px 8px; font-size: .75rem; }

/* Chi phí và nhật ký. */
.staff-mode .staff-expense-panel,
.staff-mode .overview-journal {
  border-color: #d5e3ed;
  border-radius: 20px !important;
  box-shadow: var(--employee-shadow);
}

.staff-mode .staff-expense-panel { padding: 14px !important; }
.staff-mode .staff-expense-panel .section-head { align-items: center; }
.staff-mode .staff-expense-panel .section-head small,
.staff-mode .overview-journal .section-head small { font-size: .7rem; }
.staff-mode .staff-expense-panel .section-head h2,
.staff-mode .overview-journal .section-head h2 { font-size: 1.02rem; }
.staff-mode .staff-expense-panel .btn { min-height: 44px; padding: 0 12px; font-size: .78rem; }
.staff-mode .staff-expense-details > summary { min-height: 44px; padding: 13px 10px; font-size: .78rem; }
.staff-mode .staff-edit-note { padding: 10px 11px; font-size: .75rem; line-height: 1.45; }
.staff-mode .overview-journal { padding: 14px 15px; }
.staff-mode .overview-journal-filters { gap: 7px; margin-bottom: 9px; }
.staff-mode .overview-journal-filters button {
  min-height: 38px;
  padding: 0 13px;
  font-size: .75rem;
}

.staff-mode .journal-entry {
  grid-template-columns: 40px minmax(0, 1fr) auto;
  gap: 10px;
  min-height: 82px;
  padding: 10px 0;
}

.staff-mode .journal-kind-icon { width: 40px; height: 40px; border-radius: 12px; font-size: .9rem; }
.staff-mode .journal-entry-title > strong { font-size: .88rem; }
.staff-mode .journal-entry-body > small { margin-top: 2px; font-size: .7rem; }
.staff-mode .journal-entry-body > p { max-width: none; font-size: .75rem; line-height: 1.35; }
.staff-mode .journal-entry-side { min-width: 88px; }
.staff-mode .journal-entry-side > strong { font-size: .78rem; }
.staff-mode .journal-entry-actions .edit,
.staff-mode .journal-entry-actions .delete { min-height: 36px; padding: 6px 9px; font-size: .7rem; }
.staff-mode .overview-show-all { min-height: 44px; font-size: .78rem; }

/* Trang giao hàng: sửa triệt để lỗi tiêu đề/nút bị chia thành ba cột. */
.staff-mode #deliveries .page-head::after { display: none; content: none; }
.staff-mode .delivery-page-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 86px;
  margin-bottom: 10px;
  padding: 12px 14px;
  border: 1px solid var(--employee-line);
  border-radius: 20px;
  background: #fff;
  box-shadow: var(--employee-shadow);
}

.staff-mode .delivery-page-head > div { min-width: 0; }
.staff-mode .delivery-page-head small { color: var(--employee-blue); font-size: .75rem; letter-spacing: .11em; }
.staff-mode .delivery-page-head h2 { margin-top: 4px; font-size: 1.25rem; }
.staff-mode .staff-page-note {
  max-width: 430px;
  margin: 5px 0 0;
  color: #667d90;
  font-size: .75rem;
  line-height: 1.35;
}

.staff-mode .delivery-create-button {
  min-width: 126px;
  min-height: 48px;
  padding: 0 14px;
  border-radius: 14px;
  font-size: .85rem;
  white-space: nowrap;
  box-shadow: 0 8px 18px rgba(8, 120, 239, .18);
}

.staff-mode #deliveries .employee-search-panel {
  position: sticky;
  z-index: 4;
  top: 62px;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.staff-mode #delivery-list .entry-list { gap: 10px; }
.staff-mode #delivery-list .entry {
  overflow: hidden;
  border-color: #d7e4ed;
  border-radius: 20px;
  padding: 14px;
  box-shadow: var(--employee-shadow);
}

.staff-mode #delivery-list .entry-top { align-items: flex-start; }
.staff-mode #delivery-list .entry-top > div:first-child { min-width: 0; }
.staff-mode #delivery-list .entry h3 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  color: #142b40;
  font-size: 1rem;
  line-height: 1.3;
}

.staff-mode #delivery-list .entry-badge { margin-left: 0; padding: 5px 8px; font-size: .75rem; }
.staff-mode #delivery-list .entry-date { display: block; margin-top: 5px; font-size: .75rem; line-height: 1.35; }
.staff-mode #delivery-list .entry-actions { display: flex; flex: 0 0 auto; gap: 5px; }
.staff-mode #delivery-list .entry-actions .edit,
.staff-mode #delivery-list .entry-actions .delete { min-height: 40px; padding: 7px 10px; font-size: .75rem; }
.staff-mode #delivery-list .entry-values {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 12px;
}

.staff-mode #delivery-list .entry-values > div {
  border: 1px solid #e0e9ef;
  border-radius: 13px;
  background: #f8fbfd;
  padding: 10px;
}

.staff-mode #delivery-list .entry-values .products { grid-column: 1 / -1; background: #f3f9fe; }
.staff-mode #delivery-list .entry-values small { font-size: .7rem; }
.staff-mode #delivery-list .entry-values strong { margin-top: 5px; font-size: .82rem; line-height: 1.45; }
.staff-mode #delivery-list .entry-people,
.staff-mode #delivery-list .payment-method,
.staff-mode #delivery-list .muted { font-size: .75rem; line-height: 1.45; }

/* Công nợ: tổng quan trước, tìm nhanh sau, từng khách có nút thu rõ ràng. */
.staff-mode .debt-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 18px;
  border-color: #f0d1d4;
  border-radius: 21px;
  background: linear-gradient(145deg, #fff4f4, #fff);
  box-shadow: var(--employee-shadow);
}

.staff-mode .debt-hero small { font-size: .75rem; letter-spacing: .1em; }
.staff-mode .debt-hero strong { font-size: 1.8rem; }
.staff-mode .debt-hero p { margin-top: 5px; font-size: .82rem; }
.staff-mode .debt-hero .btn { width: auto; min-width: 126px; min-height: 48px; font-size: .82rem; white-space: nowrap; }
.staff-mode #debt-list { grid-template-columns: 1fr; gap: 10px; }
.staff-mode #debt-list .debtor {
  min-height: 88px;
  border-color: #d9e5ed;
  border-radius: 18px;
  padding: 13px 14px;
  box-shadow: var(--employee-shadow);
}

.staff-mode #debt-list .debtor > div:first-child { min-width: 0; }
.staff-mode #debt-list .debtor > div:first-child strong { color: #17324a; font-size: .92rem; }
.staff-mode #debt-list .debtor .muted { margin: 5px 0 0; font-size: .76rem; }
.staff-mode #debt-list .debtor > div:last-child { display: grid; justify-items: end; gap: 7px; }
.staff-mode #debt-list .debtor > div:last-child > strong { font-size: .9rem; white-space: nowrap; }
.staff-mode #debt-list .debtor .edit { min-width: 82px; min-height: 40px; color: #fff; background: var(--employee-green); font-size: .75rem; font-weight: 800; }

/* Danh bạ và sản lượng: tăng độ đọc so với bản compact cũ. */
.staff-mode #customers .page-head {
  align-items: center;
  margin-bottom: 10px;
  padding: 5px 2px;
}

.staff-mode #customers .page-head small { display: block; font-size: .75rem; }
.staff-mode #customers .page-head h2 { font-size: 1.25rem; }
.staff-mode #customers .page-head .btn { min-height: 46px; padding: 0 13px; font-size: .8rem; white-space: nowrap; }
.staff-mode .customer-search-panel-compact {
  position: sticky;
  top: 62px;
  z-index: 4;
  gap: 10px;
  margin-bottom: 10px;
  padding: 10px;
  border-radius: 18px;
  box-shadow: var(--employee-shadow);
}

.staff-mode .customer-search-panel-compact .customer-search-box { height: 48px; }
.staff-mode .customer-search-panel-compact .customer-search-box input { height: 46px; font-size: 1rem; }
.staff-mode .customer-search-panel-compact .customer-search-count { min-width: 68px; padding: 8px 9px; font-size: .75rem; }
.staff-mode .customer-search-panel-compact .customer-filter-bar { gap: 7px; }
.staff-mode .customer-search-panel-compact .customer-filter-bar button { min-height: 38px; padding: 0 13px; font-size: .75rem; }
.staff-mode .customer-month-compact {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 148px;
  align-items: center;
  gap: 12px;
  min-height: 78px;
  margin-bottom: 10px;
  padding: 12px 13px;
  border-color: #cfe3f1;
  border-radius: 18px;
  background: linear-gradient(145deg, #eef8ff, #fff);
}

.staff-mode .customer-month-compact input { grid-column: 2; grid-row: 1; width: 148px; height: 46px; font-size: .85rem; }
.staff-mode .customer-month-compact > div { grid-column: 1; grid-row: 1; gap: 5px; }
.staff-mode .customer-month-label {
  color: var(--employee-blue);
  font-size: .75rem;
  font-weight: 900;
  letter-spacing: .09em;
}
.staff-mode .customer-month-compact strong {
  overflow: visible;
  color: var(--employee-blue-dark);
  font-size: .86rem;
  line-height: 1.4;
  text-overflow: clip;
  white-space: normal;
}

.staff-mode .customer-month-compact small { overflow: visible; font-size: .75rem; text-overflow: clip; white-space: normal; }
.staff-mode .compact-customer-card { border-radius: 18px; box-shadow: var(--employee-shadow); }
.staff-mode .customer-compact-summary { grid-template-columns: 42px minmax(0, 1fr) 32px; min-height: 68px; padding: 10px 12px; }
.staff-mode .customer-compact-summary .avatar { width: 42px; height: 42px; border-radius: 13px; }
.staff-mode .customer-compact-summary > strong { font-size: .94rem; }
.staff-mode .compact-customer-details { gap: 10px; padding: 12px; }
.staff-mode .compact-contact { font-size: .82rem; }
.staff-mode .compact-contact small { font-size: .76rem; }
.staff-mode .compact-actions .customer-action { min-height: 44px; font-size: .78rem; }
.staff-mode .customer-volume-stat { padding: 11px 12px; font-size: .76rem; }
.staff-mode .customer-volume-stat strong { font-size: .82rem; line-height: 1.4; }
.staff-mode .customer-business-row > span,
.staff-mode .compact-account-row > span { padding: 10px; font-size: .75rem; }
.staff-mode .customer-business-row strong,
.staff-mode .compact-account-row strong { font-size: .8rem; line-height: 1.35; }
.staff-mode .customer-insight-card-actions .btn { min-height: 44px; font-size: .78rem; }
.staff-mode .compact-detail-link { min-height: 42px; font-size: .78rem; }

/* Biểu mẫu nhân viên như một bottom sheet, giữ nút lưu trong tầm tay. */
.staff-mode dialog { border-radius: 24px; }
.staff-mode dialog form { gap: 14px; }
.staff-mode .dialog-head small { font-size: .75rem; }
.staff-mode .dialog-head h2 { font-size: 1.45rem; line-height: 1.2; }
.staff-mode .icon-btn { width: 44px; height: 44px; flex: 0 0 44px; border-radius: 13px; }
.staff-mode dialog label { font-size: .85rem; line-height: 1.35; }
.staff-mode dialog input,
.staff-mode dialog select { min-height: 50px; font-size: 1rem; }
.staff-mode dialog .helper-note,
.staff-mode dialog .field-hint,
.staff-mode dialog .field-hint-inline { font-size: .75rem; line-height: 1.45; }
.staff-mode dialog .check-row { min-height: 54px; font-size: .88rem; }
.staff-mode dialog .dialog-actions .btn { min-height: 52px; font-size: .9rem; }

.staff-mode .delivery-customer-picker-compact .delivery-customer-search-box {
  height: 50px;
  border-radius: 14px;
}

.staff-mode .delivery-customer-picker-compact .delivery-customer-search-box input {
  height: 48px;
  font-size: 1rem;
}

.staff-mode .delivery-customer-picker-compact .delivery-customer-results {
  max-height: 310px;
  gap: 6px;
  padding: 7px;
  border-radius: 15px;
}

.staff-mode .delivery-customer-result.compact {
  grid-template-columns: 40px minmax(0, 1fr) auto;
  min-height: 58px;
  gap: 9px;
  padding: 8px 9px;
}

.staff-mode .delivery-customer-result.compact .avatar { width: 40px; height: 40px; }
.staff-mode .delivery-result-name strong { font-size: .88rem; }
.staff-mode .delivery-result-name small { font-size: .75rem; }
.staff-mode .delivery-customer-result.compact > b { font-size: .75rem; }
.staff-mode .delivery-customer-picker-compact .delivery-customer-selected { min-height: 60px; padding: 9px 10px; }
.staff-mode .delivery-selected-main .avatar { width: 40px; height: 40px; }
.staff-mode .delivery-selected-main strong { font-size: .9rem; }
.staff-mode .delivery-selected-main small { font-size: .75rem; }
.staff-mode .delivery-change-customer { min-width: 64px; height: 40px; font-size: .75rem; }

/* Hồ sơ 360° vẫn đầy đủ trên tài khoản nhân viên nhưng được trình bày dễ đọc. */
.staff-mode .customer-insight-shell { gap: 14px; }
.staff-mode .customer-insight-toolbar { gap: 10px; }
.staff-mode .customer-insight-kpis { grid-template-columns: 1fr 1fr; gap: 8px; }
.staff-mode .customer-insight-kpis article {
  min-height: 88px;
  border-radius: 14px;
  padding: 11px;
}

.staff-mode .customer-insight-kpis small { font-size: .75rem; line-height: 1.3; }
.staff-mode .customer-insight-kpis strong { margin-top: 7px; font-size: .94rem; line-height: 1.3; }
.staff-mode .customer-insight-section { padding: 12px; }
.staff-mode .customer-insight-section .section-head small { font-size: .75rem; }
.staff-mode .customer-insight-section .section-head h2 { font-size: 1rem; }
.staff-mode .customer-monthly-bars span { font-size: .75rem; }
.staff-mode .customer-month-table { min-width: 600px; font-size: .75rem; }
.staff-mode .customer-month-table th,
.staff-mode .customer-month-table td { padding: 10px 8px; }
.staff-mode .customer-insight-deliveries > div { min-height: 58px; align-items: center; }
.staff-mode .customer-insight-deliveries small { font-size: .75rem; line-height: 1.35; }
.staff-mode .customer-insight-actions .btn { min-height: 50px; font-size: .85rem; }

.staff-mode .empty {
  min-height: 164px;
  display: grid;
  place-items: center;
  align-content: center;
  border-color: #c6dce9;
  border-radius: 20px;
  padding: 28px 18px;
  color: #697f92;
  font-size: .9rem;
  line-height: 1.5;
}

.staff-mode footer { margin-top: 24px; }
.staff-mode footer button,
.staff-mode footer .app-version { min-height: 40px; font-size: .75rem; }

@media (max-width: 700px) {
  .staff-mode .shell { padding-left: 12px; padding-right: 12px; }
  .staff-mode .tabs { margin-left: -12px; margin-right: -12px; border-right: 0; border-left: 0; border-radius: 0; }
  .staff-mode dialog {
    width: 100%;
    max-width: none;
    max-height: calc(100dvh - max(8px, env(safe-area-inset-top)));
    margin: auto 0 0;
    border-radius: 24px 24px 0 0;
  }
  .staff-mode dialog form { padding: 18px 16px max(14px, env(safe-area-inset-bottom)); }
  .staff-mode dialog .dialog-head { position: sticky; z-index: 5; top: -18px; margin: -18px -16px 0; background: #fff; padding: 17px 16px 13px; }
}

@media (max-width: 430px) {
  .staff-mode .header { gap: 9px; }
  .staff-mode .brand { gap: 9px; }
  .staff-mode .logo { width: 46px; height: 46px; flex-basis: 46px; border-radius: 15px; }
  .staff-mode .brand h1 { font-size: 1.15rem; }
  .staff-mode .brand small { font-size: .75rem; }
  .staff-mode .account-button { min-width: 98px; max-width: 108px; min-height: 48px; padding: 6px 9px; }
  .staff-mode .account-button span { max-width: 88px; font-size: .82rem; }
  .staff-mode .account-button small { font-size: .75rem; }
  .staff-mode .tabs .tab { min-height: 47px; padding: 0 3px; font-size: .78rem; }
  .staff-mode #overview > .toolbar { grid-template-columns: minmax(0, 1fr) 135px; padding: 10px 11px; }
  .staff-mode #overview > .toolbar input { width: 135px; }
  .staff-command { grid-template-columns: 36px minmax(0, 1fr); min-height: 62px; gap: 8px; padding: 8px 9px; }
  .staff-command-icon { width: 36px; height: 36px; }
  .staff-command strong { font-size: .87rem; }
  .staff-command small { font-size: .75rem; }
  .staff-mode .staff-workflow { padding: 12px; border-radius: 19px; }
  .staff-mode .staff-shift-hero { min-height: 120px; padding: 16px; }
  .staff-mode .staff-shift-hero strong { font-size: 1.9rem; }
  .staff-mode .staff-shift-status { padding: 7px 8px; }
  .staff-mode .delivery-page-head { padding: 11px 12px; }
  .staff-mode .delivery-create-button { min-width: 116px; padding: 0 11px; }
  .employee-search-panel { gap: 7px; padding: 8px; }
  .employee-search-count { min-width: 62px; padding: 8px; font-size: .7rem; }
  .staff-mode .customer-month-compact { grid-template-columns: minmax(0, 1fr) 132px; padding: 11px; }
  .staff-mode .customer-month-compact input { width: 132px; }
}

@media (max-width: 370px) {
  .staff-mode .brand h1 { font-size: 1.02rem; }
  .staff-mode .account-button { min-width: 91px; max-width: 96px; }
  .staff-mode .account-button span { max-width: 76px; }
  .staff-mode .tabs .tab { font-size: .75rem; }
  .staff-mode #overview > .toolbar { grid-template-columns: 1fr; }
  .staff-mode #overview > .toolbar input { width: 100%; }
  .staff-command-bar { grid-template-columns: 1fr; }
  .staff-command { min-height: 60px; }
  .staff-mode .staff-shift-hero { display: grid; gap: 10px; }
  .staff-mode .staff-shift-status { justify-self: start; }
  .staff-mode .staff-money-primary { grid-template-columns: 1fr; }
  .staff-money-primary article:last-child { grid-column: auto; }
  .staff-mode .staff-shift-readiness { grid-template-columns: 1fr; }
  .staff-mode .staff-shift-checks { justify-items: start; }
  .staff-mode .delivery-page-head { grid-template-columns: 1fr; }
  .staff-mode .delivery-create-button { width: 100%; }
  .employee-search-panel { grid-template-columns: 1fr; }
  .employee-search-count { justify-self: start; }
  .staff-mode .debt-hero { grid-template-columns: 1fr; }
  .staff-mode .debt-hero .btn { width: 100%; }
  .staff-mode .customer-month-compact { grid-template-columns: 1fr; }
  .staff-mode .customer-month-compact input,
  .staff-mode .customer-month-compact > div { grid-column: 1; grid-row: auto; width: 100%; }
  .staff-mode #delivery-list .entry-values { grid-template-columns: 1fr; }
  .staff-mode #delivery-list .entry-values .products { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .employee-search-box,
  .staff-command { transition: none; }
}


/* 3.24.0 — Nhân viên tự nạp hàng trong ca */
.staff-mode .staff-command-bar{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.staff-mode #staff-vehicle-load-open{
  border-color:#bedcf6;
  background:linear-gradient(145deg,#f2f9ff,#fff);
}
.staff-mode #staff-vehicle-load-open .staff-command-icon{
  background:#e7f3ff;color:#0878ef;
}
.staff-mode #vehicle-stock-dialog .vehicle-auto-confirm-note{
  background:#eefaf4;border-color:#b9e6d2;
}
.staff-mode #vehicle-stock-dialog #vehicle-stock-employee-field{display:none!important}
.staff-mode #vehicle-stock-dialog .dialog-actions .primary{background:#0878ef}
@media(max-width:560px){
  .staff-mode .staff-command-bar{grid-template-columns:1fr 1fr;gap:8px}
  .staff-mode .staff-command{min-height:58px}
}

/* 3.94.0 — Employee One-hand Flow: danh sách chuyến gọn + thao tác mượt */
.staff-mode {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.staff-mode button,
.staff-mode .tab,
.staff-mode summary,
.staff-mode input,
.staff-mode select {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.staff-mode #deliveries { padding-bottom: calc(112px + env(safe-area-inset-bottom)); }
.staff-mode #deliveries .employee-search-panel {
  background: rgba(255,255,255,.985);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.staff-mode #delivery-list .staff-delivery-list-compact {
  display: grid;
  gap: 7px;
}
.staff-mode .staff-delivery-compact {
  overflow: clip;
  border: 1px solid #d8e5ee;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 4px 14px rgba(25,62,91,.045);
  content-visibility: auto;
  contain-intrinsic-size: auto 74px;
}
.staff-mode .staff-delivery-compact > summary {
  display: grid;
  grid-template-columns: 34px minmax(0,1fr) auto 18px;
  min-height: 70px;
  align-items: center;
  gap: 9px;
  padding: 9px 10px;
  list-style: none;
  cursor: pointer;
}
.staff-mode .staff-delivery-compact > summary::-webkit-details-marker { display: none; }
.staff-mode .staff-delivery-number {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 10px;
  background: #eaf5ff;
  color: #0878ef;
  font-size: .84rem;
  font-weight: 900;
}
.staff-mode .staff-delivery-main,
.staff-mode .staff-delivery-money { min-width: 0; }
.staff-mode .staff-delivery-main { display: grid; gap: 3px; }
.staff-mode .staff-delivery-main > strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #163149;
  font-size: .92rem;
}
.staff-mode .staff-delivery-main > small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #71879a;
  font-size: .72rem;
}
.staff-mode .staff-delivery-money {
  display: grid;
  justify-items: end;
  gap: 2px;
  text-align: right;
  white-space: nowrap;
}
.staff-mode .staff-delivery-money > strong { color: #12304a; font-size: .82rem; }
.staff-mode .staff-delivery-money > small { font-size: .68rem; font-weight: 800; }
.staff-mode .staff-delivery-chevron {
  color: #7d91a3;
  font-size: 1.35rem;
  transition: transform .16s ease;
}
.staff-mode .staff-delivery-compact[open] .staff-delivery-chevron { transform: rotate(90deg); }
.staff-mode .staff-delivery-compact[open] > summary { background: #f8fbfe; }
.staff-mode .staff-delivery-expanded {
  display: grid;
  gap: 9px;
  border-top: 1px solid #e6eef4;
  padding: 10px 11px 11px 53px;
}
.staff-mode .staff-delivery-facts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
}
.staff-mode .staff-delivery-facts > span {
  display: grid;
  gap: 2px;
  min-width: 0;
  border-radius: 10px;
  background: #f5f9fc;
  padding: 7px 8px;
}
.staff-mode .staff-delivery-facts > span.wide { grid-column: 1/-1; }
.staff-mode .staff-delivery-facts small { color: #7990a3; font-size: .65rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.staff-mode .staff-delivery-facts b { overflow-wrap: anywhere; color: #213c53; font-size: .74rem; }
.staff-mode .staff-delivery-note { margin: 0; color: #657b8d; font-size: .73rem; line-height: 1.4; }
.staff-mode .staff-delivery-actions { display: flex; justify-content: flex-end; gap: 6px; }
.staff-mode .staff-delivery-actions .edit,
.staff-mode .staff-delivery-actions .delete { min-height: 34px; padding: 5px 11px; font-size: .72rem; }
.staff-mode .staff-delivery-compact.cancelled { opacity: .62; }

/* Phiếu nhân viên ưu tiên thao tác trong ngày, giảm nhầm ngày cũ. */
.staff-mode #delivery-date:disabled,
.staff-mode #expense-date:disabled {
  opacity: 1;
  -webkit-text-fill-color: #17344c;
  background: #f4f8fb;
}

@media (max-width: 430px) {
  .staff-mode .staff-delivery-compact > summary {
    grid-template-columns: 32px minmax(0,1fr) auto 16px;
    min-height: 66px;
    gap: 7px;
    padding: 8px 8px;
  }
  .staff-mode .staff-delivery-number { width: 30px; height: 30px; border-radius: 9px; }
  .staff-mode .staff-delivery-main > strong { font-size: .86rem; }
  .staff-mode .staff-delivery-main > small { max-width: 48vw; font-size: .68rem; }
  .staff-mode .staff-delivery-money > strong { font-size: .76rem; }
  .staff-mode .staff-delivery-money > small { font-size: .63rem; }
  .staff-mode .staff-delivery-expanded { padding-left: 47px; }
}

/* 3.94.0 — Staff Desktop Workspace + chốt ca chuẩn Enterprise */
.staff-mode .staff-shift-actions {
  display: grid;
  justify-items: end;
  gap: 5px;
  min-width: 150px;
}
.staff-mode .staff-shift-actions .btn { min-height: 42px; padding: 0 14px; white-space: nowrap; }
.staff-mode .staff-shift-actions small { max-width: 220px; color: #6f8395; font-size: .68rem; line-height: 1.35; text-align: right; }
.staff-mode .staff-shift-dialog-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  margin: 8px 0 14px;
}
.staff-mode .staff-shift-dialog-summary > span {
  display: grid;
  gap: 5px;
  border: 1px solid #dbe7f0;
  border-radius: 14px;
  background: #f7fbfe;
  padding: 11px 12px;
  color: #6a8194;
  font-size: .75rem;
}
.staff-mode .staff-shift-dialog-summary strong { color: #173b59; font-size: 1rem; }

@media (min-width: 981px) {
  /* Bỏ khung 760px kiểu điện thoại: nhân viên dùng workspace desktop thật. */
  .staff-mode .shell {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 30px 60px calc(var(--af-sidebar, 236px) + 30px);
  }
  .staff-mode .header {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    height: 92px;
    min-height: 92px;
    align-items: center;
    justify-content: flex-end;
    padding: 0;
    background: rgba(243,246,251,.9);
    border-bottom: 1px solid rgba(219,228,239,.76);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
  }
  .staff-mode .brand {
    position: fixed;
    z-index: 40;
    left: 18px;
    top: 18px;
    display: flex;
    width: 200px;
    align-items: center;
    gap: 10px;
  }
  .staff-mode .brand h1 { font-size: 1.04rem; }
  .staff-mode .brand small { font-size: .64rem; }
  .staff-mode .logo { width: 48px; height: 48px; flex-basis: 48px; border-radius: 15px; }
  .staff-mode .account-button { max-width: 190px; min-width: 150px; }
  .staff-mode .account-button span { max-width: 160px; }
  .staff-mode .tabs {
    position: fixed !important;
    z-index: 30;
    left: 0;
    top: 0;
    bottom: 0;
    width: var(--af-sidebar, 236px);
    height: auto;
    display: flex !important;
    flex-direction: column;
    gap: 5px;
    overflow-y: auto;
    padding: 84px 16px 72px;
    border: 0 !important;
    border-right: 1px solid #dbe4ef !important;
    border-radius: 0 !important;
    background: rgba(255,255,255,.96) !important;
    box-shadow: none !important;
  }
  .staff-mode .tabs .tab {
    display: flex;
    width: 100%;
    min-height: 49px;
    align-items: center;
    justify-content: flex-start;
    gap: 11px;
    border-radius: 14px;
    padding: 10px 12px;
    font-size: .82rem;
    text-align: left;
  }
  .staff-mode .tabs .tab-copy { display: grid; place-items: initial; gap: 1px; }
  .staff-mode .tabs .tab-copy > small { display: block !important; font-size: .58rem !important; }
  .staff-mode .tabs .tab-icon { display: grid !important; width: 28px; height: 28px; place-items: center; }
  .staff-mode .view { width: 100%; max-width: 1450px; margin: 0; padding-top: 26px; }
  .staff-mode #overview > .toolbar { grid-template-columns: minmax(0,1fr) 180px; }
  .staff-mode #overview > .toolbar input { width: 180px; }
  .staff-mode .staff-command-bar { grid-template-columns: repeat(4, minmax(170px, 1fr)); gap: 12px; }
  .staff-mode .staff-command { min-height: 74px; grid-template-columns: 46px minmax(0,1fr); padding: 12px 14px; }
  .staff-mode .staff-command-icon { width: 46px; height: 46px; }
  .staff-mode .staff-workflow { padding: 20px; border-radius: 24px; }
  .staff-mode .staff-shift-hero { min-height: 150px; padding: 24px 26px; }
  .staff-mode .staff-shift-hero strong { font-size: 2.35rem; }
  .staff-mode .staff-day-kpis { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
  .staff-mode .staff-day-kpis article:last-child { grid-column: auto; min-height: inherit; }
  .staff-mode .staff-money-primary { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
  .staff-mode .staff-reconcile-strip { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .staff-mode .staff-detail-ledger { grid-template-columns: repeat(5,minmax(0,1fr)); gap: 9px; }
  .staff-mode .staff-shift-readiness { grid-template-columns: minmax(300px,1fr) auto auto; gap: 18px; align-items: center; }
  .staff-mode .staff-shift-actions { justify-items: end; }
  .staff-mode .staff-expense-panel,
  .staff-mode .overview-journal { padding: 18px 20px !important; }
  .staff-mode #delivery-list .staff-delivery-list-compact { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .staff-mode .staff-delivery-compact > summary { min-height: 78px; }
  .staff-mode .staff-delivery-expanded { padding-left: 58px; }
  .staff-mode #debt-list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .staff-mode #customer-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .staff-mode .customer-insight-kpis { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .staff-mode dialog { width: min(760px, calc(100vw - 48px)); max-width: 760px; }
}

@media (max-width: 700px) {
  .staff-mode .staff-shift-actions { grid-column: 1 / -1; width: 100%; justify-items: stretch; }
  .staff-mode .staff-shift-actions .btn { width: 100%; }
  .staff-mode .staff-shift-actions small { max-width: none; text-align: left; }
  .staff-mode .staff-shift-dialog-summary { grid-template-columns: 1fr; }
}


/* 3.20.0 — Admin Enterprise Command Center
   Scoped to management accounts so the employee workflow stays unchanged. */

.tab-icon,
.tab-copy > small { display: none; }
.management-command-center { display: none; }
.management-nav-shortcuts { display: none; }

.management-mode {
  --admin-ink: #10253b;
  --admin-muted: #64788d;
  --admin-line: #d9e5ee;
  --admin-soft: #f4f8fb;
  --admin-blue: #0878ef;
  --admin-blue-dark: #0864c7;
  --admin-green: #078b64;
  --admin-amber: #aa6b08;
  --admin-red: #c73542;
  color: var(--admin-ink);
  background:
    radial-gradient(circle at 82% 0, rgba(8, 120, 239, .11), transparent 28rem),
    linear-gradient(180deg, #eef5fa 0, #f6f9fb 420px, #f4f7fa 100%);
}

.management-mode .shell {
  width: min(1480px, 100%);
  padding: 18px 20px 42px;
}

.management-mode .header {
  min-height: 72px;
  padding: 8px 2px 16px;
}

.management-mode .logo {
  width: 50px;
  height: 50px;
  border-radius: 16px;
  background: linear-gradient(145deg, #1597ff, #0866d5);
  box-shadow: 0 12px 26px rgba(8, 120, 239, .24);
}

.management-mode .brand small {
  font-size: 12px;
  letter-spacing: .15em;
}

.management-mode .brand h1 {
  margin-top: 3px;
  color: var(--admin-ink);
  font-size: 25px;
  letter-spacing: -.025em;
}

.management-mode .account-box { gap: 10px; }

.management-mode .account-box > .customer-add {
  min-height: 46px;
  border-color: #bddaf0;
  background: #fff;
  color: #176496;
  box-shadow: 0 6px 18px rgba(26, 71, 103, .06);
}

.management-mode .account-button {
  min-width: 174px;
  min-height: 48px;
  border-color: #cedee9;
  border-radius: 15px;
  padding: 7px 13px;
  box-shadow: 0 6px 18px rgba(26, 71, 103, .06);
}

.management-mode .account-button span {
  max-width: 210px;
  font-size: 14px;
}

.management-mode .account-button small {
  margin-top: 2px;
  color: #718499;
  font-size: 11px;
}

.management-mode .tabs {
  border-color: #d5e2eb;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 10px 30px rgba(25, 61, 90, .06);
}

.management-mode .tab {
  min-height: 48px;
  color: #597086;
  font-size: 14px;
  transition: color .18s ease, background .18s ease, transform .18s ease;
}

.management-mode .tab:hover { background: #f3f8fc; color: #245878; }
.management-mode .tab.active { background: #eaf5ff; color: var(--admin-blue); }

.management-mode .view { margin-top: 20px; }

.management-mode .page-head {
  min-height: 58px;
  margin-bottom: 14px;
  padding: 5px 2px;
}

.management-mode .page-head small,
.management-mode .section-head small,
.management-mode .view > .toolbar small {
  color: var(--admin-blue);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .13em;
}

.management-mode .page-head h2,
.management-mode .section-head h2 {
  color: var(--admin-ink);
  font-size: 22px;
  letter-spacing: -.025em;
}

.management-mode .section-note {
  color: var(--admin-muted);
  font-size: 13px;
  line-height: 1.5;
}

.management-mode .btn {
  min-height: 44px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 800;
}

.management-mode .btn.primary {
  background: linear-gradient(135deg, #1188f7, #0870dd);
  box-shadow: 0 7px 17px rgba(8, 120, 239, .18);
}

.management-mode .btn.green {
  background: linear-gradient(135deg, #0ca878, #078a63);
  box-shadow: 0 7px 17px rgba(7, 150, 105, .15);
}

.management-mode input,
.management-mode select {
  height: 46px;
  border-color: #c9dae6;
  border-radius: 12px;
  font-size: 15px;
}

/* Overview command center */
.management-mode #overview > .toolbar {
  min-height: 66px;
  border-color: #d6e4ed;
  border-radius: 18px;
  padding: 10px 14px 10px 18px;
  box-shadow: 0 8px 24px rgba(24, 64, 94, .045);
}

.management-mode #overview > .toolbar strong {
  margin-top: 5px;
  color: var(--admin-ink);
  font-size: 17px;
}

.management-mode #overview > .toolbar input { width: 168px; }

.management-mode .management-command-center {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr) 250px;
  align-items: stretch;
  gap: 12px;
  margin: 12px 0;
  padding: 12px;
  border: 1px solid #cfe0ec;
  border-radius: 22px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 12px 32px rgba(25, 65, 95, .07);
}

.management-command-intro {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: 7px 4px 7px 8px;
}

.management-command-intro small {
  color: var(--admin-blue);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .13em;
}

.management-command-intro strong {
  margin-top: 5px;
  color: var(--admin-ink);
  font-size: 18px;
  letter-spacing: -.02em;
}

.management-command-intro span {
  margin-top: 4px;
  color: var(--admin-muted);
  font-size: 12px;
  line-height: 1.4;
}

.management-command-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.management-command {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-content: center;
  min-width: 0;
  min-height: 82px;
  border: 1px solid #d7e4ed;
  border-radius: 15px;
  background: #f8fbfd;
  padding: 10px;
  color: #365a75;
  text-align: left;
  cursor: pointer;
}

.management-command > span {
  grid-row: 1 / 3;
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  align-self: center;
  border-radius: 10px;
  background: #e8f3fb;
  color: #176da8;
  font-size: 18px;
  font-weight: 900;
}

.management-command strong {
  align-self: end;
  overflow: hidden;
  color: #173852;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.management-command small {
  align-self: start;
  margin-top: 3px;
  overflow: hidden;
  color: #718397;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.management-command.primary {
  border-color: #c0def5;
  background: #edf7ff;
}

.management-command.primary > span { background: var(--admin-blue); color: #fff; }
.management-command.positive { border-color: #c9eadc; background: #f1fbf7; }
.management-command.positive > span { background: var(--admin-green); color: #fff; }
.management-command.command-delivery{border-color:#c7ddf8;background:linear-gradient(180deg,#f4f9ff,#eef6ff)}
.management-command.command-payment{border-color:#cbe9dc;background:linear-gradient(180deg,#f4fcf8,#effaf5)}
.management-command.command-receipt{border-color:#d7e4ef;background:linear-gradient(180deg,#f8fbfd,#f3f8fc)}
.management-command.command-expense{border-color:#d7e4ef;background:linear-gradient(180deg,#fbfcfd,#f5f8fb)}
.management-command.command-delivery>span{background:#1778ec;color:#fff}
.management-command.command-payment>span{background:#0d9b67;color:#fff}
.management-command.command-receipt>span{background:#eef4fb;color:#2d7bb7}
.management-command.command-expense>span{background:#edf3f8;color:#2c79b4}
.management-command:hover { border-color: #9dc9e7; transform: translateY(-1px); }

.management-attention-cta {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  border: 1px solid #cfe7dc;
  border-radius: 16px;
  background: #f1faf6;
  padding: 11px;
  color: #285b48;
  text-align: left;
  cursor: pointer;
}

.management-attention-icon {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 11px;
  background: #dcefe6;
  color: #087653;
  font-size: 18px;
  font-weight: 950;
}

.management-attention-cta > span:nth-child(2) { display: grid; min-width: 0; gap: 2px; }
.management-attention-cta small { color: #4d7f6c; font-size: 9px; font-weight: 900; letter-spacing: .1em; }
.management-attention-cta strong { overflow: hidden; color: #116746; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.management-attention-cta em { overflow: hidden; color: #678477; font-size: 10px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.management-attention-cta > b { color: #5c8a78; font-size: 24px; }
.management-attention-cta.has-warning { border-color: #edce9c; background: #fff8eb; }
.management-attention-cta.has-warning .management-attention-icon { background: #ffe7b9; color: #9b620a; }
.management-attention-cta.has-warning small,
.management-attention-cta.has-warning strong { color: #905b09; }

.management-mode #overview > .summary-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0;
}

.management-mode #overview .summary {
  min-height: 142px;
  border-color: #d9e5ed;
  border-radius: 19px;
  padding: 16px;
  box-shadow: 0 9px 25px rgba(26, 67, 97, .055);
}

.management-mode #overview .summary > span {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 12px;
  background: rgba(255, 255, 255, .8);
  font-size: 20px;
}

.management-mode #overview .summary small { margin-top: 15px; font-size: 11px; }
.management-mode #overview .summary strong { margin-top: 7px; font-size: 21px; letter-spacing: -.025em; }
.management-mode #overview .summary p,
.management-mode #overview .summary .summary-source-line { margin-top: 5px; font-size: 12px; line-height: 1.4; }

.management-mode .enterprise-control {
  display: block;
  margin: 12px 0;
  border-color: #d7e4ed;
  border-radius: 21px;
  padding: 16px;
  box-shadow: 0 9px 26px rgba(25, 65, 95, .05);
}

.management-mode .enterprise-control-head strong { margin-top: 5px; font-size: 18px; }
.management-mode .enterprise-control-head p { margin-top: 5px; font-size: 12px; line-height: 1.45; }
.management-mode .day-control-status { padding: 8px 12px; font-size: 11px; }
.management-mode .enterprise-control-grid { gap: 9px; }

.management-mode .enterprise-control-grid button {
  min-height: 100px;
  border-radius: 14px;
  padding: 13px;
}

.management-mode .enterprise-control-grid button small { font-size: 10px; }
.management-mode .enterprise-control-grid button strong { font-size: 16px; }
.management-mode .enterprise-control-grid button span { font-size: 11px; line-height: 1.4; }

.management-mode .admin-handover {
  margin: 12px 0;
  border-color: #d7e4ed;
  border-radius: 21px;
  padding: 16px;
  box-shadow: 0 9px 26px rgba(25, 65, 95, .05);
}

.management-mode .admin-handover .section-head > strong { font-size: 25px; }
.management-mode .admin-handover-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.management-mode .handover-person-card { border-radius: 16px; box-shadow: 0 5px 16px rgba(27, 65, 94, .035); }
.management-mode .handover-person-head { padding: 13px 14px 10px; }
.management-mode .handover-person strong { font-size: 15px; }
.management-mode .handover-person small { font-size: 11px; }
.management-mode .handover-result small { font-size: 10px; }
.management-mode .handover-result strong { font-size: 14px; }
.management-mode .handover-mini-grid { gap: 7px; padding: 0 12px 11px; }
.management-mode .handover-mini-grid > span { padding: 8px 6px; }
.management-mode .handover-mini-grid small { font-size: 9px; }
.management-mode .handover-mini-grid strong { font-size: 11px; }
.management-mode .handover-foot { font-size: 11px; }

.management-mode .enterprise-quick { display: none; }

.management-mode .overview-journal {
  border-color: #d7e4ed;
  border-radius: 21px;
  padding: 16px;
  box-shadow: 0 9px 26px rgba(25, 65, 95, .05);
}

.management-mode .overview-journal-filters button { min-height: 34px; padding: 0 13px; font-size: 11px; }
.management-mode .journal-entry { min-height: 78px; }
.management-mode .journal-entry-title > strong { font-size: 14px; }
.management-mode .journal-entry-body > small { font-size: 10px; }
.management-mode .journal-entry-body > p { font-size: 11px; }
.management-mode .journal-entry-side > strong { font-size: 13px; }
.management-mode .journal-entry-actions .edit,
.management-mode .journal-entry-actions .delete { min-height: 32px; font-size: 10px; }

/* Directories, reports and operations */
.management-mode .employee-search-panel,
.management-mode .customer-search-panel,
.management-mode .customer-month-compact,
.management-mode .period-filter,
.management-mode .report-strip,
.management-mode .customer-intelligence-report,
.management-mode .enterprise-attention,
.management-mode .operation-card,
.management-mode .team-admin-tools,
.management-mode .permission-guide {
  border-color: #d7e4ed;
  box-shadow: 0 8px 24px rgba(25, 65, 95, .045);
}

.management-mode .employee-search-panel { padding: 12px; border-radius: 18px; }
.management-mode .employee-search-box { min-height: 48px; border-radius: 13px; }
.management-mode .employee-search-box input { font-size: 14px; }
.management-mode .employee-search-count { font-size: 12px; }
.management-mode .entry,
.management-mode .customer-card,
.management-mode .debtor { border-color: #d8e4ed; box-shadow: 0 7px 22px rgba(29, 67, 96, .045); }
.management-mode .entry h3,
.management-mode .customer-card h3 { font-size: 16px; }
.management-mode .entry-date,
.management-mode .muted { font-size: 13px; }

.management-mode #reports .report-heading > strong { font-size: 15px; }
.management-mode #reports .period-filter { gap: 12px; margin-bottom: 12px; padding: 10px; border-radius: 18px; }
.management-mode #reports .period-tabs button { min-height: 38px; font-size: 12px; }
.management-mode #reports .report-actions { min-height: 50px; }
.management-mode #reports .report-actions > span { font-size: 12px; }
.management-mode #reports .finance-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.management-mode #reports .finance-card { min-height: 155px; border-radius: 18px; padding: 16px; }
.management-mode #reports .finance-card small { font-size: 10px; }
.management-mode #reports .finance-card strong { font-size: 22px; }
.management-mode #reports .finance-card p { font-size: 12px; }
.management-mode #reports .finance-card em { font-size: 10px; }
.management-mode #reports .metric-change { font-size: 11px; }
.management-mode #reports .customer-intelligence-report { border-radius: 20px; padding: 16px; }
.management-mode #reports .customer-year-kpis-compact { gap: 9px !important; }
.management-mode #reports .customer-year-kpis-compact article { min-height: 83px !important; padding: 12px !important; }
.management-mode #reports .customer-year-kpis-compact article small { font-size: 9px; }
.management-mode #reports .customer-year-kpis-compact article > strong { font-size: 15px !important; }
.management-mode #reports .customer-year-table { font-size: 11px; }
.management-mode #reports .customer-year-table th,
.management-mode #reports .customer-year-table td { padding: 11px 9px; }
.management-mode #reports .report-strip { padding: 15px; }
.management-mode #reports .report-strip small { font-size: 10px; }
.management-mode #reports .report-strip strong { font-size: 16px; }
.management-mode #reports .report-strip p { font-size: 11px; }

.management-mode #operations .enterprise-page-head { margin-bottom: 10px; }
.management-mode #operations .enterprise-attention { border-radius: 20px; padding: 16px; }
.management-mode #operations .enterprise-attention-grid { gap: 9px; }
.management-mode #operations .enterprise-attention-grid button { min-height: 108px; padding: 13px; }
.management-mode #operations .enterprise-attention-grid button small { font-size: 10px; }
.management-mode #operations .enterprise-attention-grid button strong { font-size: 16px; }
.management-mode #operations .enterprise-attention-grid button span { font-size: 11px; }
.management-mode #operations .operations-primary-actions { gap: 9px; margin: 12px 0; }
.management-mode #operations .operations-primary-actions .btn { flex: 1 1 180px; }
.management-mode #operations .enterprise-operations-grid { gap: 12px; }
.management-mode #operations .operation-card { border-radius: 19px; padding: 16px; }
.management-mode #operations .operation-card .section-head { margin: 0 0 12px; }
.management-mode #operations .operation-card .section-head h2 { font-size: 19px; }
.management-mode #operations .operation-row strong { font-size: 13px; }
.management-mode #operations .operation-row small { font-size: 11px; }
.management-mode #operations .settlement-hero > small { font-size: 10px; }
.management-mode #operations .settlement-hero > strong { font-size: 24px; }
.management-mode #operations .settlement-hero span { font-size: 10px; }
.management-mode #operations .settlement-hero b { font-size: 12px; }
.management-mode #operations .employee-settlement-card > header strong { font-size: 15px; }
.management-mode #operations .employee-settlement-card > header small { font-size: 11px; }
.management-mode #operations .employee-settlement-card > header > b { font-size: 12px; }
.management-mode #operations .settlement-mini-grid small { font-size: 9px; }
.management-mode #operations .settlement-mini-grid strong { font-size: 11px; }
.management-mode #operations .settlement-detail > summary,
.management-mode #operations .settlement-detail > div { font-size: 11px; }
.management-mode #operations .supplier-search-wrap input { font-size: 14px; }
.management-mode #operations .supplier-compact-card .supplier-row-main > div > strong { font-size: 15px; }
.management-mode #operations .supplier-compact-card .supplier-row-main small { font-size: 10px; }
.management-mode #operations .supplier-compact-metrics small { font-size: 8px !important; }
.management-mode #operations .supplier-compact-metrics strong { font-size: 11px; }
.management-mode #operations .supplier-compact-actions button { min-height: 34px !important; font-size: 10px; }
.management-mode #operations .supplier-history-disclosure > summary { font-size: 12px; }

.management-mode #team .team-admin-tools { border-radius: 18px; }
.management-mode #team .team-admin-tools > summary { min-height: 50px; padding: 15px 17px; font-size: 14px; }
.management-mode #team .helper-note { font-size: 12px; line-height: 1.5; }
.management-mode #team .person-card { min-height: 76px; padding: 14px; }
.management-mode #team .person-card p { font-size: 12px; }
.management-mode #team .status,
.management-mode #team .role-badge { font-size: 10px; }
.management-mode #team .permission-guide { padding: 16px; }
.management-mode #team .permission-guide summary { font-size: 14px; }
.management-mode #team .permission-guide p { font-size: 12px; line-height: 1.55; }

/* Dialogs */
.management-mode dialog {
  width: min(620px, calc(100% - 28px));
  border: 1px solid rgba(202, 218, 230, .8);
  border-radius: 22px;
  box-shadow: 0 30px 90px rgba(15, 34, 58, .32);
}

.management-mode dialog form { gap: 16px; padding: 22px; }
.management-mode .dialog-head h2 { font-size: 23px; }
.management-mode dialog label { font-size: 14px; }
.management-mode dialog .helper-note { font-size: 12px; }

.management-mode footer { align-items: center; margin-top: 22px; }
.management-mode footer button,
.management-mode footer .app-version { min-height: 36px; font-size: 11px; }

/* Desktop command navigation */
@media (min-width: 1080px) {
  .management-mode .shell {
    display: grid;
    grid-template-columns: 236px minmax(0, 1fr);
    grid-template-rows: auto minmax(520px, auto) auto;
    column-gap: 22px;
    align-items: start;
  }

  .management-mode .header {
    position: sticky;
    z-index: 20;
    top: 0;
    grid-column: 1 / -1;
    grid-row: 1;
    background: rgba(239, 246, 251, .91);
    backdrop-filter: blur(16px);
  }

  .management-mode .tabs {
    position: sticky;
    top: 92px;
    grid-column: 1;
    grid-row: 2;
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 100%;
    overflow: visible;
    border-radius: 20px;
    padding: 12px;
  }

  .management-mode .tabs::before {
    content: "KHÔNG GIAN QUẢN TRỊ";
    padding: 4px 9px 8px;
    color: #8091a2;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .12em;
  }

  .management-mode .tab {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    flex: 0 0 auto;
    width: 100%;
    min-height: 58px;
    border-radius: 13px;
    padding: 8px 10px;
    text-align: left;
  }

  .management-mode .tab-icon {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 10px;
    background: #f0f5f8;
    color: #5c7488;
    font-size: 17px;
    font-weight: 900;
  }

  .management-mode .tab.active .tab-icon { background: var(--admin-blue); color: #fff; }

  .management-mode .tab-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
    font-size: 14px;
  }

  .management-mode .tab-copy > small {
    display: block;
    overflow: hidden;
    color: #8494a3;
    font-size: 10px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .management-mode .tab.active .tab-copy > small { color: #5685aa; }

  .management-mode .management-nav-shortcuts {
    display: grid;
    gap: 4px;
    margin-top: 5px;
    border-top: 1px solid #e3ebf1;
    padding: 12px 3px 2px;
  }

  .management-mode .management-nav-shortcuts > small {
    padding: 0 7px 5px;
    color: #8a99a7;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .11em;
  }

  .management-mode .management-nav-shortcuts > button {
    min-height: 38px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    padding: 0 9px;
    color: #60768a;
    text-align: left;
    font-size: 12px;
    font-weight: 750;
    cursor: pointer;
  }

  .management-mode .management-nav-shortcuts > button:hover { background: #f2f7fa; color: #1f628e; }
  .management-mode .management-nav-shortcuts > button span { display: inline-block; width: 22px; color: #1680cf; text-align: center; }

  .management-mode .view {
    grid-column: 2;
    grid-row: 2;
    min-width: 0;
    margin-top: 0;
  }

  .management-mode footer { grid-column: 2; grid-row: 3; }
}

@media (max-width: 1220px) {
  .management-mode .management-command-center { grid-template-columns: 170px minmax(0, 1fr); }
  .management-mode .management-attention-cta { grid-column: 1 / -1; }
  .management-mode .management-attention-cta em { white-space: normal; }
}

@media (max-width: 1079px) {
  .management-mode .tabs {
    position: sticky;
    z-index: 12;
    top: 0;
    padding: 6px;
    backdrop-filter: blur(15px);
  }

  .management-mode .tab { min-width: 105px; }
  .management-mode .admin-handover-list { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .management-mode .shell { padding: 12px 12px 34px; }
  .management-mode .header { min-height: 62px; padding-bottom: 12px; }
  .management-mode .logo { width: 43px; height: 43px; border-radius: 14px; }
  .management-mode .brand { gap: 9px; }
  .management-mode .brand small { font-size: 9px; }
  .management-mode .brand h1 { max-width: 190px; font-size: 18px; }
  .management-mode .account-button { min-width: 0; max-width: 114px; min-height: 43px; padding: 6px 9px; }
  .management-mode .account-button span { max-width: 94px; font-size: 12px; }
  .management-mode .account-button small { font-size: 9px; }
  .management-mode .tabs { margin: 0 -12px; border-right: 0; border-left: 0; border-radius: 0; }
  .management-mode .tab { min-width: 94px; min-height: 44px; font-size: 12px; }
  .management-mode .view { margin-top: 14px; }
  .management-mode .page-head { min-height: 50px; }
  .management-mode .page-head h2,
  .management-mode .section-head h2 { font-size: 19px; }
  .management-mode .page-head small,
  .management-mode .section-head small,
  .management-mode .view > .toolbar small { font-size: 10px; }
  .management-mode #overview > .toolbar { min-height: 58px; padding: 9px 11px; }
  .management-mode #overview > .toolbar strong { font-size: 14px; }
  .management-mode #overview > .toolbar input { width: 145px; height: 40px; font-size: 12px; }
  .management-mode .management-command-center { grid-template-columns: 1fr; gap: 9px; padding: 10px; border-radius: 18px; }
  .management-command-intro { padding: 3px 3px 1px; }
  .management-command-intro strong { font-size: 16px; }
  .management-command-intro span { font-size: 11px; }
  .management-command-actions { grid-template-columns: 1fr 1fr; gap: 7px; }
  .management-command { min-height: 68px; padding: 8px; }
  .management-attention-cta { grid-column: auto; min-height: 66px; }
  .management-mode #overview > .summary-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .management-mode #overview .summary { min-height: 132px; padding: 13px; }
  .management-mode #overview .summary > span { width: 34px; height: 34px; font-size: 18px; }
  .management-mode #overview .summary small { margin-top: 12px; font-size: 10px; }
  .management-mode #overview .summary strong { font-size: 17px; }
  .management-mode #overview .summary p,
  .management-mode #overview .summary .summary-source-line { font-size: 11px; }
  .management-mode .enterprise-control,
  .management-mode .admin-handover,
  .management-mode .overview-journal { padding: 13px; border-radius: 18px; }
  .management-mode .enterprise-control-grid { grid-template-columns: 1fr 1fr; gap: 7px; }
  .management-mode .enterprise-control-grid button { min-height: 86px; padding: 10px; }
  .management-mode .enterprise-control-grid button small { font-size: 9px; }
  .management-mode .enterprise-control-grid button strong { font-size: 14px; }
  .management-mode .enterprise-control-grid button span { font-size: 10px; }
  .management-mode .admin-handover .section-head > strong { font-size: 19px; }
  .management-mode .handover-person strong { font-size: 14px; }
  .management-mode .handover-person small { font-size: 10px; }
  .management-mode .handover-mini-grid small { font-size: 9px; }
  .management-mode .handover-mini-grid strong { font-size: 11px; }
  .management-mode .journal-entry-title > strong { font-size: 13px; }
  .management-mode .journal-entry-body > small { font-size: 10px; }
  .management-mode .journal-entry-body > p { font-size: 11px; }
  .management-mode #reports .finance-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .management-mode #reports .finance-card { min-height: 125px; padding: 13px; }
  .management-mode #reports .finance-card strong { font-size: 17px; }
  .management-mode #reports .customer-intelligence-report { padding: 12px !important; }
  .management-mode #operations .enterprise-attention-grid { grid-template-columns: 1fr 1fr; gap: 7px; }
  .management-mode #operations .enterprise-attention-grid button { min-height: 90px; padding: 10px; }
  .management-mode #operations .enterprise-attention-grid button small { font-size: 9px; }
  .management-mode #operations .enterprise-attention-grid button strong { font-size: 14px; }
  .management-mode #operations .enterprise-attention-grid button span { font-size: 10px; }
  .management-mode #operations .operations-primary-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .management-mode #operations .operations-primary-actions .btn { min-width: 0; padding: 0 7px; font-size: 11px; }
  .management-mode dialog { width: calc(100% - 16px); max-height: 94dvh; margin-bottom: max(8px, env(safe-area-inset-bottom)); border-radius: 22px 22px 15px 15px; }
  .management-mode dialog form { gap: 14px; padding: 17px; }
  .management-mode .dialog-head h2 { font-size: 20px; }
}

@media (max-width: 430px) {
  .management-mode .brand h1 { max-width: 155px; font-size: 16px; }
  .management-mode .brand small { letter-spacing: .1em; }
  .management-mode #overview > .toolbar { display: grid; grid-template-columns: minmax(0, 1fr) 130px; }
  .management-mode #overview > .toolbar input { width: 130px; }
  .management-command strong { font-size: 12px; }
  .management-command small { font-size: 10px; }
  .management-attention-cta strong { font-size: 12px; }
  .management-attention-cta em { font-size: 10px; }
  .management-mode #overview .summary strong { font-size: 15px; }
  .management-mode #overview .summary { min-height: 127px; }
  .management-mode .enterprise-control-head { display: grid; }
  .management-mode .day-control-status { width: max-content; }
  .management-mode .admin-handover .section-head { align-items: flex-start; }
  .management-mode .admin-handover .section-head h2 { font-size: 17px; }
  .management-mode #reports .period-filter { padding: 6px; }
  .management-mode #reports .period-tabs button { min-height: 34px !important; font-size: 10px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .management-mode *,
  .management-mode *::before,
  .management-mode *::after { scroll-behavior: auto !important; transition: none !important; }
}


/* 3.24.0 — Admin compact operations + Company tab */
.management-mode #company .page-head,
.management-mode #operations .page-head{margin-bottom:10px}
.management-mode #company .operation-card{border-radius:19px;padding:16px}
.management-mode #company .company-profile-card{box-shadow:0 6px 18px rgba(32,67,97,.045)}
.management-mode #company .company-history-card{padding:14px}
.management-mode #company .receipt-row-card{padding:10px 0}
.management-mode #operations .operations-command-strip{margin-top:0}
.management-mode #operations .enterprise-operations-reordered{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.management-mode #operations #operation-inventory,
.management-mode #operations #operation-settlement{grid-column:auto}
.management-mode #operations #operation-bottles,
.management-mode #operations #operation-advanced{grid-column:1/-1}
@media(max-width:760px){
  .management-mode #operations .enterprise-operations-reordered{grid-template-columns:1fr}
  .management-mode #operations #operation-bottles,
  .management-mode #operations #operation-advanced{grid-column:auto}
  .management-mode #company .page-head{align-items:stretch}
}

/* 3.28.0 — Consolidated management mobile UX */
@media(max-width:760px){
  .management-mode .management-command-center{grid-template-columns:1fr;gap:8px;margin:6px 0 10px;padding:8px;border-radius:16px}
  .management-mode .management-command-intro{display:none}
  .management-mode .management-command-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .management-mode .management-command{min-height:78px;padding:10px 11px;grid-template-columns:38px minmax(0,1fr);grid-template-rows:auto auto;column-gap:9px;row-gap:2px;border-radius:16px;align-items:center;box-shadow:0 10px 24px rgba(18,56,89,.06)}
  .management-mode .management-command>span{grid-row:1 / 3;width:38px;height:38px;border-radius:12px;font-size:17px}
  .management-mode .management-command strong{align-self:end;font-size:13px;line-height:1.15;white-space:normal}
  .management-mode .management-command small{display:block;align-self:start;margin-top:1px;font-size:10px;line-height:1.25;white-space:normal;color:#6e8193}

  /* Không lặp thông báo “ổn định”; chỉ hiện nút cảnh báo nếu có việc thật sự cần xử lý. */
  .management-mode .management-attention-cta:not(.has-warning){display:none}
  .management-mode .management-attention-cta.has-warning{display:grid;min-height:40px;padding:5px 8px;grid-template-columns:26px minmax(0,1fr) auto;gap:7px;border-radius:11px}
  .management-mode .management-attention-icon{width:25px;height:25px;border-radius:8px;font-size:12px}
  .management-mode .management-attention-cta small{font-size:7.8px}
  .management-mode .management-attention-cta strong{font-size:10.5px}
  .management-mode .management-attention-cta em{display:none}
  .management-mode .management-attention-cta>b{font-size:18px}

  /* Trung tâm kiểm soát lặp lại thông tin Vận hành; ẩn trên mobile, vẫn giữ trên desktop. */
  .management-mode #overview .enterprise-control{display:none}

  .management-mode #operations .enterprise-operations-reordered{grid-template-columns:1fr}
  .management-mode #operations #operation-bottles,
  .management-mode #operations #operation-advanced{grid-column:auto}
  .management-mode #company .page-head{align-items:stretch}
}

@media(max-width:390px){
  .management-mode .management-command{min-height:74px;padding:9px 9px 8px;grid-template-columns:34px minmax(0,1fr);column-gap:8px;border-radius:14px}
  .management-mode .management-command>span{width:34px;height:34px;font-size:15px;border-radius:11px}
  .management-mode .management-command strong{font-size:12px}
  .management-mode .management-command small{font-size:9px}
}


/* 3.40.0 — Tổng quan chứa nghiệp vụ hằng ngày; Vận hành chỉ giữ kiểm soát */
.management-mode .management-command-actions-five{grid-template-columns:repeat(5,minmax(0,1fr))}
.management-command.operational{border-color:#d2e4ef;background:#f8fbfd}
.management-command.operational>span{background:#eaf4fa;color:#176ca9}
@media(max-width:760px){
  .management-mode .management-command-actions-five{grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}
  .management-mode .management-command-actions-five .management-command:nth-child(-n+3){grid-column:span 2}
  .management-mode .management-command-actions-five .management-command:nth-child(n+4){grid-column:span 3}
}
@media(max-width:390px){
  .management-mode .management-command-actions-five{gap:4px}
}


/* 3.40.0 — Delivery payment typography must win over generic management dialog rules */
.management-mode #delivery-dialog .delivery-payment-fields label{gap:6px;font-size:12px;line-height:1.25}
.management-mode #delivery-dialog .delivery-payment-fields input,.management-mode #delivery-dialog .delivery-payment-fields select{height:52px;min-height:52px;font-size:17px;font-weight:800}
@media(max-width:430px){.management-mode #delivery-dialog .delivery-payment-fields label{font-size:10.5px}.management-mode #delivery-dialog .delivery-payment-fields input,.management-mode #delivery-dialog .delivery-payment-fields select{height:48px;min-height:48px;padding:0 10px;font-size:15px}}


/* 3.41.0 — Luồng trực tiếp Công ty → Xe, bỏ bước Nạp xe khỏi nghiệp vụ hằng ngày */
.management-mode .management-command-actions-four{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:760px){
  .management-mode .management-command-actions-four{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .management-mode .management-command-actions-four .management-command{min-height:78px}
}


/* AquaFlow UI layer for Sổ Giao Hàng v3.94.0
   Giữ nguyên nghiệp vụ/backend v3.x, thay đổi hệ thống thị giác + Order Flow. */
:root{
  --af-bg:#f3f6fb;--af-surface:#fff;--af-surface-2:#f7f9fc;--af-ink:#0b1f3a;--af-muted:#6c7f95;
  --af-line:#dbe4ef;--af-blue:#0b6ff3;--af-blue-2:#eaf3ff;--af-green:#06966d;--af-green-2:#eaf8f3;
  --af-orange:#c86a0a;--af-orange-2:#fff4e8;--af-red:#d52a39;--af-red-2:#fff0f2;--af-violet:#6d4bf4;
  --af-shadow:0 14px 40px rgba(24,55,94,.08);--af-radius:24px;--af-sidebar:236px;
}
html{color:var(--af-ink);background:var(--af-bg)}
body{background:linear-gradient(180deg,#eff5fc 0,#f7f9fc 420px,#f3f6fb 100%);color:var(--af-ink)}
button,input,select,textarea{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}

/* Brand + application shell */
.logo{width:48px;height:48px;border-radius:15px;background:linear-gradient(145deg,#0b6ff3,#23a0ff)!important;color:#fff;font-size:22px!important;font-weight:950;box-shadow:0 12px 28px rgba(11,111,243,.25)!important}
.brand small,.view small,.dialog-head small{color:var(--af-blue)}
.header{background:rgba(243,246,251,.88);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(219,228,239,.78)}
.account-button{border-color:var(--af-line);border-radius:14px;background:#fff;box-shadow:0 4px 16px rgba(21,57,96,.04)}
.btn{border-radius:14px;transition:transform .16s,box-shadow .16s,border-color .16s}
.btn:hover{transform:translateY(-1px)}
.btn.primary{background:linear-gradient(135deg,#0b6ff3,#1688ff);box-shadow:0 8px 22px rgba(11,111,243,.2)}
.btn.secondary{border-color:#d3e2ef;background:#fff;color:#315b7d}
.btn.green{background:linear-gradient(135deg,#078e68,#0aa77b)}

/* Cards */
.toolbar,.quick,.month-panel,.summary,.entry,.customer-card,.debtor,.finance-card,.report-strip,.operation-card,.admin-handover,.overview-journal,.enterprise-control,.management-command-center,.company-command-center,.company-panel,.customer-intelligence-report,.staff-settlement,.staff-workflow{border-color:var(--af-line)!important;box-shadow:0 8px 28px rgba(21,57,96,.05)!important}
.toolbar,.quick,.month-panel,.summary,.entry,.customer-card,.debtor,.finance-card,.report-strip,.operation-card,.admin-handover,.overview-journal,.enterprise-control,.management-command-center,.company-command-center,.company-panel,.customer-intelligence-report,.staff-settlement,.staff-workflow{background:var(--af-surface)}
.summary,.finance-card,.operation-card,.admin-handover,.overview-journal,.management-command-center,.company-panel{border-radius:22px}
.page-head h2,.section-head h2{letter-spacing:-.45px;color:var(--af-ink)}
.page-head .section-note,.section-note,.muted{color:var(--af-muted)}
.pill{background:var(--af-blue-2);color:var(--af-blue)}

/* Main navigation: AquaFlow sidebar on desktop */
@media(min-width:981px){
  .shell{width:100%;max-width:none;margin:0;padding:0 28px 52px calc(var(--af-sidebar) + 28px)}
  .header{position:sticky;top:0;z-index:20;height:92px;padding:0;display:flex;justify-content:flex-end}
  .brand{position:fixed;z-index:32;left:18px;top:18px;width:200px;padding:0}
  .brand h1{font-size:17px;margin-top:2px;white-space:nowrap}.brand small{font-size:10px;letter-spacing:.16em}
  .tabs{position:fixed!important;z-index:30;left:0;top:0;bottom:0;width:var(--af-sidebar);height:auto;display:flex!important;flex-direction:column;gap:5px;overflow-y:auto;overflow-x:hidden;padding:84px 16px 72px;background:rgba(255,255,255,.94)!important;border:0!important;border-right:1px solid var(--af-line)!important;border-radius:0!important;box-shadow:none!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
  .tab{flex:0 0 auto!important;min-width:0!important;width:100%;min-height:49px;display:flex;align-items:center;gap:11px;border-radius:14px!important;padding:10px 12px!important;text-align:left;color:#64788f;background:transparent}
  .tab-icon{display:grid!important;width:28px;height:28px;flex:0 0 28px;place-items:center;border-radius:9px;background:#f3f6fa;font-size:14px!important}
  .tab-copy{display:grid;gap:1px;font-size:13px}.tab-copy>small{display:block!important;color:#8a9bad!important;font-size:9px!important;font-weight:650!important;letter-spacing:0!important}
  .tab.active{background:var(--af-blue-2)!important;color:var(--af-blue)!important}.tab.active .tab-icon{background:#fff}.tab.active .tab-copy>small{color:#5f8fcb!important}
  .view{margin-top:0;padding-top:26px;max-width:1450px}.view.active{display:block}
  footer{margin-left:0}
}

/* Mobile: compact topbar + bottom navigation */
@media(max-width:980px){
  .shell{width:100%;max-width:none;padding:0 12px 94px}
  .header{position:sticky;top:0;z-index:20;min-height:78px;padding:10px 2px;background:rgba(243,246,251,.94)}
  .brand{gap:9px}.brand .logo{width:42px;height:42px;border-radius:13px;font-size:19px!important}.brand h1{font-size:17px}.brand small{font-size:9px}
  .account-box>.customer-add{display:none}.account-button{min-height:42px;padding:6px 10px}.account-button span{max-width:112px}
  .tabs{position:fixed!important;left:0;right:0;bottom:0;top:auto!important;z-index:50;height:76px;display:flex!important;gap:0;padding:6px 7px calc(7px + env(safe-area-inset-bottom));overflow-x:auto;overflow-y:hidden;border:0!important;border-top:1px solid var(--af-line)!important;border-radius:0!important;background:rgba(255,255,255,.95)!important;box-shadow:0 -8px 30px rgba(20,48,79,.07)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);scroll-snap-type:x proximity}
  .tab{flex:0 0 78px!important;min-width:78px!important;height:58px;display:grid;place-items:center;align-content:center;gap:3px;padding:5px 4px!important;border-radius:13px!important;font-size:10px;scroll-snap-align:center}
  .tab-icon{display:block!important;font-size:19px!important;line-height:1}.tab-copy{display:block;font-size:10px;line-height:1.1}.tab-copy>small{display:none!important}
  .tab.active{background:var(--af-blue-2)!important;color:var(--af-blue)!important}
  .view{margin-top:10px}.page-head{align-items:flex-start}.page-head h2{font-size:24px}
  footer{display:none}
}

/* 3.94.0 — Tổng quan: Live Command Center / Sẵn sàng cho ngày mới */
.overview-day-readiness{--overview-progress:0deg;min-height:190px;margin:14px 0 16px;padding:28px 30px;border-radius:30px;background:linear-gradient(135deg,#0963d9 0%,#0d82f7 55%,#47b8ff 100%);box-shadow:0 20px 48px rgba(10,111,238,.22);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative;overflow:hidden}
.overview-day-readiness:before{content:"";position:absolute;right:70px;top:-122px;width:310px;height:310px;border:58px solid rgba(255,255,255,.055);border-radius:50%}
.overview-day-readiness:after{content:"";position:absolute;right:-105px;bottom:-160px;width:300px;height:300px;border:42px solid rgba(255,255,255,.045);border-radius:50%}
.overview-readiness-copy{position:relative;z-index:2;min-width:0;display:grid;gap:10px;max-width:720px}
.overview-readiness-copy small{color:#d9edff!important;font-size:11px!important;font-weight:950!important;letter-spacing:.22em!important}
.overview-readiness-copy strong{font-size:36px;line-height:1.03;letter-spacing:-1.1px;color:#fff}
.overview-readiness-copy span{font-size:15px;line-height:1.45;color:#d9ecff}
.overview-readiness-progress{position:relative;z-index:2;flex:0 0 126px;width:126px;height:126px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(rgba(255,255,255,.98) 0 var(--overview-progress),rgba(255,255,255,.22) var(--overview-progress) 360deg);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.overview-readiness-progress:before{content:"";position:absolute;inset:11px;border-radius:50%;background:linear-gradient(145deg,rgba(28,141,245,.96),rgba(54,169,247,.94));box-shadow:inset 0 0 22px rgba(255,255,255,.09)}
.overview-readiness-progress>div{position:relative;z-index:1;display:grid;justify-items:center;gap:1px}.overview-readiness-progress strong{font-size:30px;line-height:1;color:#fff}.overview-readiness-progress span{font-size:10px;color:#e7f4ff}
.overview-day-readiness.has-orders{background:linear-gradient(135deg,#075fd3 0%,#0a7df0 52%,#37aaf6 100%)}
.overview-day-readiness.is-complete{background:linear-gradient(135deg,#08725f 0%,#099d7d 58%,#2fcaa1 100%)}
.overview-day-readiness.is-complete .overview-readiness-progress:before{background:linear-gradient(145deg,#0a9b7d,#27bd9b)}
@media(max-width:700px){.overview-day-readiness{min-height:184px;padding:24px 22px;border-radius:26px;gap:14px}.overview-readiness-copy{gap:8px}.overview-readiness-copy small{font-size:10px!important}.overview-readiness-copy strong{font-size:31px;max-width:390px}.overview-readiness-copy span{font-size:13px}.overview-readiness-progress{flex-basis:112px;width:112px;height:112px}.overview-readiness-progress strong{font-size:27px}}
@media(max-width:460px){.overview-day-readiness{min-height:174px;padding:22px 18px}.overview-readiness-copy strong{font-size:27px;max-width:245px}.overview-readiness-copy span{font-size:12px;max-width:235px}.overview-readiness-progress{flex-basis:96px;width:96px;height:96px}.overview-readiness-progress:before{inset:9px}.overview-readiness-progress strong{font-size:23px}.overview-readiness-progress span{font-size:9px}}

/* AquaFlow Order Flow */
.aquaflow-page-head{align-items:flex-start}.aquaflow-page-head p{max-width:690px;margin:6px 0 0;line-height:1.5}
.aquaflow-order-hero{min-height:138px;border-radius:28px;background:linear-gradient(135deg,#0a65dc 0,#1387ff 58%,#4db5ff 100%);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:24px 26px;box-shadow:0 18px 44px rgba(11,111,243,.18);position:relative;overflow:hidden}
.aquaflow-order-hero:after{content:"";position:absolute;width:220px;height:220px;border:40px solid rgba(255,255,255,.08);border-radius:50%;right:-85px;top:-95px}
.aquaflow-order-hero>div{position:relative;z-index:2;display:grid;gap:6px}.aquaflow-order-hero small{color:#d9ecff!important;letter-spacing:.14em}.aquaflow-order-hero strong{font-size:29px;letter-spacing:-.8px}.aquaflow-order-hero span{color:#d8eaff;font-size:13px}.aquaflow-order-hero .btn{position:relative;z-index:2;border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.96);color:#0b6ff3}
.order-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0}.order-kpi-grid article{min-height:112px;border:1px solid var(--af-line);border-radius:20px;background:#fff;padding:16px;box-shadow:0 6px 24px rgba(21,57,96,.045)}
.order-kpi-grid article:nth-child(1){border-left:5px solid var(--af-blue)}.order-kpi-grid article:nth-child(2){border-left:5px solid var(--af-orange)}.order-kpi-grid article:nth-child(3){border-left:5px solid var(--af-green)}.order-kpi-grid article:nth-child(4){border-left:5px solid var(--af-violet)}
.order-kpi-grid small{font-size:10px!important;font-weight:900;letter-spacing:.08em}.order-kpi-grid strong{display:block;margin-top:11px;font-size:26px;letter-spacing:-.7px}.order-kpi-grid span{display:block;margin-top:5px;color:var(--af-muted);font-size:11px}
.order-filter-panel{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 12px;padding:11px 12px;border:1px solid var(--af-line);border-radius:18px;background:#fff}
.order-filter-tabs{display:flex;gap:6px;overflow:auto;scrollbar-width:none}.order-filter-tabs::-webkit-scrollbar{display:none}.order-filter-tabs button{flex:none;min-height:36px;border:1px solid #dbe6ef;border-radius:999px;background:#f7fafc;padding:0 12px;color:#65798d;font-size:11px;font-weight:850}.order-filter-tabs button.active{border-color:#b8d9ff;background:var(--af-blue-2);color:var(--af-blue)}
.order-filter-tools{display:flex;gap:8px}.order-filter-tools input{height:40px;border-radius:12px}.order-filter-tools input[type="search"]{min-width:230px}
.aquaflow-order-list{display:grid;gap:10px}.aquaflow-order-card{display:grid;grid-template-columns:86px minmax(250px,1.4fr) minmax(150px,.8fr) auto;gap:14px;align-items:center;padding:16px 17px;border:1px solid var(--af-line);border-radius:19px;background:#fff;box-shadow:0 6px 22px rgba(21,57,96,.045);position:relative;overflow:hidden}.aquaflow-order-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#bfd1e4}.aquaflow-order-card.urgent:before{background:var(--af-red)}.aquaflow-order-card.high:before{background:var(--af-orange)}.aquaflow-order-card.in_progress:before{background:var(--af-blue)}.aquaflow-order-card.completed:before{background:var(--af-green)}.aquaflow-order-card.cancelled{opacity:.65}
.order-card-time{display:grid;gap:3px}.order-card-time strong{font-size:20px;color:#173552}.order-card-time span{color:var(--af-muted);font-size:10px}.order-card-main{min-width:0;display:grid;gap:5px}.order-card-title{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.order-card-title>strong{font-size:16px}.order-card-main p{margin:0;color:#3d5871;font-size:12px}.order-card-main>small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--af-muted)!important;font-size:10px!important;letter-spacing:0!important}.order-card-money{display:grid;justify-items:end;gap:4px;text-align:right;min-width:0}.order-card-money strong{font-size:17px}.order-card-money span{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--af-muted);font-size:10px}.order-card-actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}
.status{display:inline-flex;width:max-content;border-radius:999px;padding:5px 8px;font-size:9px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}.status.pending,.status.assigned{background:#edf4ff;color:var(--af-blue)}.status.in_progress{background:#fff4dd;color:#a55b00}.status.completed{background:var(--af-green-2);color:var(--af-green)}.status.failed{background:var(--af-red-2);color:var(--af-red)}.status.cancelled{background:#eef1f4;color:#708093}
.order-priority{border-radius:999px;padding:4px 7px;font-size:9px;font-weight:900}.order-priority.high{background:var(--af-orange-2);color:var(--af-orange)}.order-priority.urgent{background:var(--af-red-2);color:var(--af-red)}
.mini-btn{min-height:34px;border:1px solid var(--af-line);border-radius:10px;background:#fff;padding:0 10px;font-size:10px;font-weight:850}.mini-btn.primary{border-color:#0b6ff3;background:#0b6ff3;color:#fff}.mini-btn.secondary{background:#eef5ff;color:#0b6ff3;border-color:#d3e6ff}.mini-btn.ghost{color:#60778e}.mini-btn.danger{border-color:#ffd4d8;background:#fff4f5;color:#c72d38}
.empty-state{padding:34px 18px;text-align:center;color:var(--af-muted);border:1px dashed #cbd7e5;border-radius:18px;background:#fff}.empty-state b{display:block;color:#50677e;margin-bottom:6px}.empty-state span{font-size:12px}

/* Order dialog + order completion banner */
.aquaflow-order-dialog{width:min(620px,calc(100% - 22px))}.aquaflow-line-items{padding:13px;border:1px solid var(--af-line);border-radius:18px;background:#f8fbfe}.aquaflow-line-items .section-head{margin:0 0 10px}.aquaflow-line-items .section-head h3{margin:3px 0 0}.order-pack-toggle{margin:12px 0 0}.aquaflow-order-total{background:linear-gradient(135deg,#edf7ff,#fff)}
.delivery-order-context{display:grid;gap:3px;margin:-2px 0 1px;padding:12px 13px;border:1px solid #b9dcff;border-radius:15px;background:#edf7ff}.delivery-order-context span{font-size:9px;font-weight:900;letter-spacing:.12em;color:#0b6ff3}.delivery-order-context strong{font-size:14px}.delivery-order-context small{color:#607993!important;font-size:10px!important;letter-spacing:0!important}

/* Improve dialogs in AquaFlow style */
dialog{border-radius:26px;box-shadow:0 28px 80px rgba(15,23,42,.28)}dialog::backdrop{background:rgba(15,34,58,.52);backdrop-filter:blur(3px)}dialog form{padding:22px}.dialog-head{border-color:#e5edf4}.icon-btn{border-radius:12px;background:#f2f6f9}.dialog-actions{border-color:#e5edf4}
input,select{border-color:#cddbe7;border-radius:13px}input:focus,select:focus{border-color:#79b3ff;box-shadow:0 0 0 4px rgba(11,111,243,.09)}

/* Login */
.login-page{background:radial-gradient(circle at 28% 18%,#d8eaff 0,transparent 32%),radial-gradient(circle at 75% 72%,#dff8ee 0,transparent 30%),#edf4fb}
.login-page .login-card{border-radius:30px;border:1px solid rgba(255,255,255,.85);background:rgba(255,255,255,.95);box-shadow:0 28px 80px rgba(19,62,111,.15);backdrop-filter:blur(18px)}
.login-brand .logo{width:64px;height:64px;border-radius:19px;font-size:29px!important}.login-brand small{color:var(--af-blue);letter-spacing:.16em}.login-copy h2{letter-spacing:-.5px}

/* Responsive order flow */
@media(max-width:900px){
  .order-kpi-grid{grid-template-columns:repeat(2,1fr);gap:9px}.order-filter-panel{align-items:stretch;flex-direction:column}.order-filter-tools{display:grid;grid-template-columns:150px 1fr}.order-filter-tools input[type="search"]{min-width:0}
  .aquaflow-order-card{grid-template-columns:70px minmax(0,1fr) auto}.order-card-money{grid-column:2;justify-items:start;text-align:left}.order-card-actions{grid-column:1/-1;justify-content:stretch}.order-card-actions .mini-btn{flex:1}.order-card-main>small{white-space:normal}
}
@media(max-width:560px){
  .aquaflow-order-hero{min-height:150px;padding:20px;border-radius:24px;align-items:flex-start}.aquaflow-order-hero strong{font-size:24px}.aquaflow-order-hero .btn{position:absolute;right:16px;bottom:16px;min-height:40px}.order-kpi-grid article{min-height:102px;padding:13px;border-radius:17px}.order-kpi-grid strong{font-size:22px}
  .order-filter-tools{grid-template-columns:1fr}.aquaflow-order-card{grid-template-columns:58px 1fr;padding:13px;gap:10px}.order-card-time strong{font-size:17px}.order-card-money{grid-column:2}.order-card-actions{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,1fr)}.order-card-actions .mini-btn{width:100%}
  .aquaflow-order-dialog{width:calc(100% - 14px)}dialog form{padding:17px}.aquaflow-line-items{padding:11px}
}


/* 3.49.0 — Order Center mobile: cards rõ ràng, xem chi tiết, không bị bottom nav che */
.aquaflow-order-card{grid-template-columns:1fr!important;gap:12px!important;align-items:stretch!important;padding:16px 17px!important;overflow:visible}
.order-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.order-card-time{display:flex;align-items:baseline;gap:9px}.order-card-time span{order:0;font-size:10px;font-weight:850}.order-card-time strong{order:1;font-size:15px}.order-card-badges{display:flex;align-items:center;justify-content:flex-end;gap:5px;flex-wrap:wrap}
.order-card-customer{display:grid;grid-template-columns:42px minmax(0,1fr) 28px;align-items:center;gap:10px;width:100%;border:0;border-radius:15px;background:#f7faff;padding:10px;text-align:left;color:var(--af-ink);cursor:pointer}.order-customer-avatar{display:grid;width:42px;height:42px;place-items:center;border-radius:13px;background:linear-gradient(145deg,#e6f2ff,#f6fbff);color:var(--af-blue);font-size:16px;font-weight:950}.order-customer-copy{display:grid;gap:3px;min-width:0}.order-customer-copy strong{font-size:16px}.order-customer-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--af-muted);font-size:10px}.order-card-chevron{display:grid;width:28px;height:28px;place-items:center;border-radius:9px;background:#fff;color:#6f8499;font-size:22px}
.order-card-products{display:flex;gap:6px;flex-wrap:wrap}.order-card-products span{display:inline-flex;align-items:center;gap:4px;border:1px solid #dce8f3;border-radius:999px;background:#fff;padding:6px 9px;color:#5c7187;font-size:10px;font-weight:750}.order-card-products b{color:#163b5c;font-size:11px}
.order-card-meta{display:grid;grid-template-columns:1fr 1fr;gap:7px}.order-card-meta>span{display:grid;gap:3px;padding:9px 10px;border-radius:12px;background:#f7f9fc}.order-card-meta small{font-size:8px!important;font-weight:900!important;letter-spacing:.09em!important;color:#8494a6!important}.order-card-meta strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:#173653}.order-card-meta>span:first-child strong{color:var(--af-blue);font-size:15px}
.order-card-note{border-left:3px solid #d9e7f4;padding:6px 9px;color:#667c91;font-size:10px;line-height:1.45}.order-card-note b{color:#b55400}.order-card-actions{display:flex;gap:6px;justify-content:flex-start!important;flex-wrap:wrap}.order-card-actions .mini-btn.detail{background:#f7fafc;color:#315b7d;border-color:#dbe7f0}
.aquaflow-order-detail-dialog{width:min(680px,calc(100% - 18px));max-height:min(880px,calc(100dvh - 20px));padding:0}.order-detail-shell{display:grid;gap:14px;padding:20px}.order-detail-head{margin:0}.order-detail-content{display:grid;gap:11px;overflow:auto}.order-detail-customer{display:grid;grid-template-columns:50px minmax(0,1fr) auto;align-items:center;gap:11px;padding:14px;border:1px solid #d9e6f1;border-radius:18px;background:linear-gradient(145deg,#f5faff,#fff)}.order-detail-avatar{display:grid;width:50px;height:50px;place-items:center;border-radius:15px;background:linear-gradient(145deg,#0b6ff3,#2ba5ff);color:#fff;font-size:20px;font-weight:950}.order-detail-customer>div:nth-child(2){display:grid;gap:3px;min-width:0}.order-detail-customer strong{font-size:17px}.order-detail-customer span,.order-detail-customer small{color:var(--af-muted);font-size:10px}.order-detail-call{display:grid;min-height:38px;place-items:center;border:1px solid #cfe2f2;border-radius:12px;background:#fff;padding:0 10px;color:var(--af-blue);font-size:11px;font-weight:850;text-decoration:none}
.order-detail-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.order-detail-kpis span{display:grid;gap:4px;padding:10px;border-radius:13px;background:#f7f9fc}.order-detail-kpis small{font-size:8px!important;font-weight:900!important;letter-spacing:.08em!important;color:#8192a4!important}.order-detail-kpis strong{font-size:12px;color:#173653}.order-detail-section{border:1px solid #dfe8f1;border-radius:16px;background:#fff;padding:13px}.order-detail-section-head{display:grid;gap:2px;margin-bottom:9px}.order-detail-section-head small{font-size:8px!important;font-weight:900!important;letter-spacing:.12em!important}.order-detail-section-head strong{font-size:14px}.order-detail-products{display:grid;gap:0}.order-detail-products>div{display:grid;grid-template-columns:1fr auto auto;gap:10px;padding:9px 0;border-top:1px solid #edf2f6;align-items:center}.order-detail-products span{font-size:11px;color:#4d657b}.order-detail-products strong{font-size:10px;color:#75889a}.order-detail-products b{font-size:11px}.order-detail-total{display:flex;align-items:center;justify-content:space-between;margin-top:6px;padding-top:10px;border-top:1px dashed #dbe5ed;color:#536a7f;font-size:11px}.order-detail-total strong{font-size:17px;color:var(--af-blue)}.order-detail-people{display:grid;grid-template-columns:1fr 1fr;gap:7px}.order-detail-people span{display:grid;gap:3px;padding:9px;border-radius:11px;background:#f7f9fc;color:#728398;font-size:9px}.order-detail-people strong{color:#173653;font-size:11px}.order-detail-note{margin:0;color:#4f667c;font-size:11px;line-height:1.55}.order-detail-failure{margin:8px 0 0;padding:9px;border-radius:10px;background:#fff4ed;color:#9e5300;font-size:10px}.order-detail-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:4px}.order-detail-actions>#order-detail-primary{display:flex;justify-content:flex-end}
@media(max-width:980px){#orders{padding-bottom:calc(118px + env(safe-area-inset-bottom))}.aquaflow-order-list{padding-bottom:18px}.aquaflow-order-card{border-radius:20px!important}.order-card-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))}.order-card-actions .mini-btn{width:100%}.order-card-actions .mini-btn.detail{grid-column:1/-1}.order-customer-copy small{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.aquaflow-order-detail-dialog{width:calc(100% - 14px);max-height:calc(100dvh - 12px)}.order-detail-shell{padding:16px 14px max(16px,env(safe-area-inset-bottom))}.order-detail-kpis{grid-template-columns:1fr 1fr}.order-detail-actions{position:sticky;bottom:-1px;background:#fff;padding:10px 0 0}.order-detail-actions .btn{min-height:44px}}
@media(max-width:560px){.order-filter-panel{position:relative}.order-kpi-grid{margin-bottom:12px}.aquaflow-order-card{padding:13px!important;gap:10px!important}.order-card-head{align-items:center}.order-card-time{display:grid;gap:2px}.order-card-time span{font-size:9px}.order-card-time strong{font-size:13px}.order-card-customer{grid-template-columns:40px minmax(0,1fr) 26px;padding:9px}.order-customer-avatar{width:40px;height:40px}.order-customer-copy strong{font-size:15px}.order-card-meta>span{padding:8px}.order-card-actions{gap:6px}.order-card-actions .mini-btn{min-height:38px}.order-detail-products>div{grid-template-columns:1fr auto}.order-detail-products>div>b{grid-column:2}.order-detail-customer{grid-template-columns:46px minmax(0,1fr);padding:12px}.order-detail-avatar{width:46px;height:46px}.order-detail-call{grid-column:1/-1}.order-detail-people{grid-template-columns:1fr}.order-detail-actions{display:grid;grid-template-columns:1fr 1fr}.order-detail-actions>#order-detail-primary,.order-detail-actions>#order-detail-primary .btn{width:100%}}

/* 3.49.0 — Order Center Compact + điều hướng thẳng tới danh sách đơn */
.overview-readiness-orders{position:relative;z-index:3;width:max-content;min-height:38px;border:1px solid rgba(255,255,255,.42);border-radius:12px;background:rgba(255,255,255,.96);padding:0 13px;color:#0b6ff3;font:inherit;font-size:11px;font-weight:900;box-shadow:0 7px 18px rgba(0,60,130,.12)}
.order-center-compact .aquaflow-page-head{margin-bottom:8px}
.order-center-compact .aquaflow-order-hero{min-height:98px;padding:16px 18px;border-radius:22px;box-shadow:0 12px 30px rgba(11,111,243,.15)}
.order-center-compact .aquaflow-order-hero strong{font-size:23px}.order-center-compact .aquaflow-order-hero span{font-size:11px}.order-center-compact .aquaflow-order-hero .btn{min-height:38px;padding:0 14px}
.order-center-compact .order-kpi-grid{gap:8px;margin:10px 0}
.order-center-compact .order-kpi-grid article{min-height:76px;padding:10px 11px;border-radius:15px}
.order-center-compact .order-kpi-grid small{font-size:8px!important}.order-center-compact .order-kpi-grid strong{margin-top:5px;font-size:20px}.order-center-compact .order-kpi-grid span{margin-top:2px;font-size:9px}
.order-center-compact .order-filter-panel{margin:6px 0 10px;padding:8px;border-radius:15px;gap:8px}
.order-center-compact .order-filter-tabs button{min-height:32px;padding:0 10px;font-size:10px}
.order-center-compact .order-filter-tools input{height:36px;font-size:11px}
.order-center-compact .aquaflow-order-list{gap:8px}
.order-center-compact .aquaflow-order-card{gap:8px!important;padding:12px 13px!important;border-radius:17px!important}
.order-center-compact .order-card-customer{grid-template-columns:36px minmax(0,1fr) 24px;gap:8px;padding:8px;border-radius:12px}
.order-center-compact .order-customer-avatar{width:36px;height:36px;border-radius:11px;font-size:14px}.order-center-compact .order-customer-copy strong{font-size:14px}.order-center-compact .order-customer-copy small{font-size:9px}
.order-center-compact .order-card-products span{padding:4px 7px;font-size:9px}.order-center-compact .order-card-products b{font-size:10px}
.order-center-compact .order-card-meta{gap:6px}.order-center-compact .order-card-meta>span{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 8px;border-radius:10px}.order-center-compact .order-card-meta small{font-size:7px!important}.order-center-compact .order-card-meta strong{font-size:11px}.order-center-compact .order-card-meta>span:first-child strong{font-size:13px}
.order-center-compact .order-card-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px}.order-center-compact .order-card-actions .mini-btn.detail{grid-column:auto!important}.order-center-compact .order-card-actions .mini-btn{min-height:36px}
.order-more-actions{border-top:1px dashed #dfe8f0;padding-top:5px}.order-more-actions>summary{list-style:none;cursor:pointer;color:#72859a;text-align:center;font-size:9px;font-weight:850}.order-more-actions>summary::-webkit-details-marker{display:none}.order-more-actions>summary:after{content:"  ···"}.order-more-actions>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:7px}.order-more-actions .mini-btn{width:100%;min-height:34px}
@media(max-width:980px){
  .overview-readiness-orders{min-height:34px;padding:0 11px;font-size:10px}
  .order-center-compact .aquaflow-page-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}.order-center-compact .aquaflow-page-head h2{font-size:21px}.order-center-compact .aquaflow-page-head p{display:none}.order-center-compact .aquaflow-page-head .btn{min-height:40px;padding:0 12px}
  .order-center-compact .order-kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.order-center-compact .order-kpi-grid article{min-height:66px;padding:8px 7px;border-left-width:3px}.order-center-compact .order-kpi-grid span{display:none}.order-center-compact .order-kpi-grid strong{font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .order-center-compact .order-filter-panel{flex-direction:column;align-items:stretch}.order-center-compact .order-filter-tools{display:grid;grid-template-columns:132px minmax(0,1fr);gap:6px}.order-center-compact .order-filter-tools input[type="search"]{min-width:0}
}
@media(max-width:560px){
  .overview-day-readiness{padding-bottom:18px}.overview-readiness-copy{gap:6px}.overview-readiness-orders{margin-top:3px}
  .order-center-compact .aquaflow-order-hero{min-height:88px;padding:14px 15px;align-items:center}.order-center-compact .aquaflow-order-hero strong{font-size:20px}.order-center-compact .aquaflow-order-hero .btn{position:relative;right:auto;bottom:auto;min-height:36px;padding:0 11px;font-size:10px}
  .order-center-compact .order-kpi-grid article{min-height:62px;padding:7px 6px}.order-center-compact .order-kpi-grid small{font-size:7px!important;letter-spacing:.04em}.order-center-compact .order-kpi-grid strong{font-size:15px}
  .order-center-compact .order-filter-tabs{margin:-1px -1px 0}.order-center-compact .order-filter-tools{grid-template-columns:124px minmax(0,1fr)}
  .order-center-compact .aquaflow-order-card{padding:11px!important}.order-center-compact .order-card-head{gap:6px}.order-center-compact .order-card-time strong{font-size:12px}.order-center-compact .order-card-badges .status{font-size:8px;padding:4px 6px}
}


/* 3.94.0 — Mobile safe-area: báo cáo/bảng lương luôn nằm trên thanh điều hướng */
@media(max-width:980px){
  /* Chừa một vùng cuộn thật phía sau nội dung thay vì để card cuối nằm dưới bottom nav. */
  .shell{padding-bottom:calc(132px + env(safe-area-inset-bottom))}
  #reports{padding-bottom:calc(76px + env(safe-area-inset-bottom));scroll-padding-bottom:calc(148px + env(safe-area-inset-bottom))}
  #reports .report-details{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
  #reports .daily-payroll-section,
  #reports .payroll-section,
  #reports details{scroll-margin-bottom:calc(148px + env(safe-area-inset-bottom))}
}
@media(max-width:560px){
  #reports .report-details{padding-bottom:calc(112px + env(safe-area-inset-bottom))}
}


/* AquaFlow Unified Enterprise Design System — v3.94.0
   Lớp thị giác cuối cùng cho toàn bộ Admin / Manager / Staff / Supplier.
   Mục tiêu: một shell, một hệ token, một nhịp bố cục, không còn cảm giác chắp vá. */
:root{
  --af-bg:#eef4fa;
  --af-bg-2:#f7faff;
  --af-surface:#ffffff;
  --af-surface-soft:#f6f9fd;
  --af-ink:#10243b;
  --af-ink-2:#284760;
  --af-muted:#6e8296;
  --af-line:#dbe6f0;
  --af-line-strong:#cbd9e6;
  --af-primary:#0878ef;
  --af-primary-2:#23a3ff;
  --af-primary-soft:#eaf4ff;
  --af-success:#07966f;
  --af-success-soft:#eaf8f3;
  --af-warning:#d47a0a;
  --af-warning-soft:#fff5e7;
  --af-danger:#d93a4b;
  --af-danger-soft:#fff0f2;
  --af-violet:#7557ef;
  --af-violet-soft:#f1edff;
  --af-navy:#071b34;
  --af-navy-2:#0b315d;
  --af-radius-xs:10px;
  --af-radius-sm:14px;
  --af-radius-md:18px;
  --af-radius-lg:22px;
  --af-radius-xl:28px;
  --af-shadow-sm:0 5px 16px rgba(24,55,91,.045);
  --af-shadow:0 12px 34px rgba(24,55,91,.075);
  --af-shadow-lg:0 22px 52px rgba(18,58,100,.11);
  --af-sidebar:248px;
  --af-content:1500px;
}
*{box-sizing:border-box}
html{scroll-behavior:auto;background:var(--af-bg)}
body{overflow-x:hidden;background:
  radial-gradient(circle at 88% -8%,rgba(35,163,255,.16),transparent 28rem),
  radial-gradient(circle at 28% 0,rgba(117,87,239,.055),transparent 24rem),
  linear-gradient(180deg,#eef5fc 0,#f8fbfe 440px,#f2f6fa 100%);color:var(--af-ink)}
body,button,input,select,textarea{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,select,textarea{font-size:14px}

/* ---------- Application shell ---------- */
.logo{display:grid!important;place-items:center;width:46px!important;height:46px!important;flex:0 0 46px!important;border-radius:15px!important;background:linear-gradient(145deg,#1bb5ff,#0878ef 58%,#7058ef)!important;color:#fff!important;font-size:20px!important;font-weight:950!important;box-shadow:0 12px 30px rgba(8,120,239,.28)!important}
.brand{align-items:center!important}.brand small{color:#68c8ff!important;font-weight:900!important;letter-spacing:.17em!important}.brand h1{color:inherit;letter-spacing:-.025em!important}
.header{border-bottom:1px solid rgba(210,225,238,.86)!important;background:rgba(247,250,254,.88)!important;box-shadow:0 5px 22px rgba(20,54,86,.035)!important;backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important}
.account-box{align-items:center!important;gap:10px!important}
.account-button{border:1px solid var(--af-line)!important;border-radius:15px!important;background:#fff!important;box-shadow:var(--af-shadow-sm)!important}
.account-button span{color:var(--af-ink)!important;font-weight:850!important}.account-button small{color:var(--af-muted)!important}

@media(min-width:981px){
  .shell,.management-mode .shell,.staff-mode .shell,.supplier-mode .shell{width:100%!important;max-width:none!important;margin:0!important;padding:0 30px 70px calc(var(--af-sidebar) + 30px)!important}
  .header,.management-mode .header,.staff-mode .header,.supplier-mode .header{position:sticky!important;top:0!important;z-index:24!important;height:82px!important;min-height:82px!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:flex-end!important}
  .brand,.management-mode .brand,.staff-mode .brand,.supplier-mode .brand{position:fixed!important;z-index:45!important;left:20px!important;top:17px!important;width:205px!important;color:#fff!important;display:flex!important;gap:11px!important;padding:0!important}
  .brand h1,.management-mode .brand h1,.staff-mode .brand h1,.supplier-mode .brand h1{margin:2px 0 0!important;color:#fff!important;font-size:16px!important;line-height:1.15!important;white-space:nowrap!important}
  .brand small,.management-mode .brand small,.staff-mode .brand small,.supplier-mode .brand small{font-size:9px!important}
  .tabs,.management-mode .tabs,.staff-mode .tabs,.supplier-mode .tabs{position:fixed!important;z-index:40!important;left:0!important;top:0!important;bottom:0!important;width:var(--af-sidebar)!important;height:auto!important;display:flex!important;flex-direction:column!important;gap:5px!important;overflow-y:auto!important;overflow-x:hidden!important;margin:0!important;padding:86px 14px 80px!important;border:0!important;border-radius:0!important;border-right:1px solid rgba(255,255,255,.07)!important;background:linear-gradient(180deg,var(--af-navy) 0%,#082646 55%,#0a315d 100%)!important;box-shadow:14px 0 44px rgba(4,29,54,.12)!important;backdrop-filter:none!important}
  .tab,.management-mode .tab,.staff-mode .tab,.supplier-mode .tab{position:relative!important;flex:0 0 auto!important;width:100%!important;min-width:0!important;min-height:48px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:11px!important;border:1px solid transparent!important;border-radius:13px!important;padding:9px 11px!important;background:transparent!important;color:#c4d7e8!important;text-align:left!important;box-shadow:none!important}
  .tab:hover,.management-mode .tab:hover,.staff-mode .tab:hover{background:rgba(255,255,255,.07)!important;color:#fff!important}
  .tab-icon,.management-mode .tab-icon,.staff-mode .tab-icon{display:grid!important;width:29px!important;height:29px!important;flex:0 0 29px!important;place-items:center!important;border-radius:9px!important;background:rgba(255,255,255,.08)!important;color:#9fd7ff!important;font-size:14px!important}
  .tab-copy,.management-mode .tab-copy,.staff-mode .tab-copy{display:grid!important;gap:1px!important;color:inherit!important;font-size:12.5px!important;font-weight:800!important;line-height:1.15!important}
  .tab-copy>small,.management-mode .tab-copy>small,.staff-mode .tab-copy>small{display:block!important;color:#7596b3!important;font-size:8.5px!important;font-weight:650!important;letter-spacing:0!important}
  .tab.active,.management-mode .tab.active,.staff-mode .tab.active,.supplier-mode .tab.active{border-color:rgba(135,210,255,.3)!important;background:linear-gradient(135deg,rgba(8,120,239,.92),rgba(35,163,255,.8))!important;color:#fff!important;box-shadow:0 9px 22px rgba(0,113,231,.22)!important}
  .tab.active .tab-icon{background:rgba(255,255,255,.18)!important;color:#fff!important}.tab.active .tab-copy>small{color:#d7efff!important}
  .view,.management-mode .view,.staff-mode .view,.supplier-mode .view{width:100%!important;max-width:var(--af-content)!important;margin:0!important;padding-top:24px!important}
}

/* ---------- Unified module rhythm ---------- */
:where(#overview,#orders,#deliveries,#debts,#customers,#reports,#operations,#company,#team){--af-module-line:var(--af-line);--af-module-radius:var(--af-radius-lg)}
:where(.page-head,.section-head,.aquaflow-page-head){gap:14px!important}
:where(.page-head,.aquaflow-page-head){min-height:58px!important;margin:0 0 14px!important;padding:2px 2px 0!important;align-items:flex-start!important}
:where(.page-head,.aquaflow-page-head) h2,:where(.section-head) h2{margin:3px 0 0!important;color:var(--af-ink)!important;font-size:22px!important;line-height:1.12!important;letter-spacing:-.035em!important}
:where(.page-head,.aquaflow-page-head,.section-head) small{color:var(--af-primary)!important;font-size:9.5px!important;font-weight:950!important;letter-spacing:.15em!important}
:where(.section-note,.page-head p,.aquaflow-page-head p){color:var(--af-muted)!important;line-height:1.5!important}

/* One card system for every module */
:where(.toolbar,.quick,.month-panel,.order-filter-panel,.employee-search-panel,.customer-search-panel,.company-period-panel,.operation-card,.finance-card,.report-strip,.management-command-center,.company-command-center,.company-panel,.staff-workflow,.staff-settlement,.customer-intelligence-report,.enterprise-control,.admin-handover,.overview-journal,.debt-hero,.staff-expense-panel,.supplier-row-card,.receipt-enterprise-card,.order-card,.customer-card,.debtor,.entry){
  border:1px solid var(--af-module-line,var(--af-line))!important;
  border-radius:var(--af-module-radius,var(--af-radius-lg))!important;
  background:rgba(255,255,255,.97)!important;
  box-shadow:var(--af-shadow-sm)!important;
}
:where(.toolbar,.quick,.month-panel,.order-filter-panel,.employee-search-panel,.customer-search-panel,.company-period-panel,.operation-card,.finance-card,.report-strip,.company-panel,.staff-workflow,.staff-settlement,.enterprise-control,.admin-handover,.overview-journal,.debt-hero){margin-bottom:14px!important}
:where(.operation-card,.finance-card,.company-panel,.staff-workflow,.staff-settlement,.enterprise-control,.admin-handover,.overview-journal){overflow:clip}

/* Buttons and controls */
:where(.btn,.edit,.mini-btn,.tab,.staff-command,.management-command,.overview-journal-filters button,.order-filter-tabs button,.customer-filter-bar button){transition:transform .14s ease,box-shadow .14s ease,background-color .14s ease,border-color .14s ease,color .14s ease!important}
:where(.btn,.edit,.mini-btn,.staff-command,.management-command):active{transform:scale(.985)!important}
.btn{min-height:43px!important;border-radius:12px!important;padding:0 15px!important;font-weight:850!important}
.btn.primary{border-color:transparent!important;background:linear-gradient(135deg,var(--af-primary),var(--af-primary-2))!important;color:#fff!important;box-shadow:0 8px 20px rgba(8,120,239,.2)!important}
.btn.green{border-color:transparent!important;background:linear-gradient(135deg,#07966f,#16b784)!important;color:#fff!important;box-shadow:0 8px 20px rgba(7,150,111,.16)!important}
.btn.secondary{border-color:var(--af-line-strong)!important;background:#fff!important;color:#315b7b!important}
:where(input,select,textarea){border:1px solid var(--af-line-strong)!important;border-radius:12px!important;background:#fff!important;color:var(--af-ink)!important;outline:none!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)!important}
:where(input,select,textarea):focus{border-color:#76b8f5!important;box-shadow:0 0 0 3px rgba(8,120,239,.1)!important}

/* KPI language */
.summary-grid{gap:10px!important}
.summary{position:relative!important;overflow:hidden!important;min-height:116px!important;border:0!important;border-radius:19px!important;padding:17px 18px!important;color:#fff!important;box-shadow:0 13px 28px rgba(20,60,100,.12)!important}
.summary:after{content:"";position:absolute;right:-28px;top:-34px;width:105px;height:105px;border:24px solid rgba(255,255,255,.11);border-radius:50%}
.summary.blue{background:linear-gradient(135deg,#0a7af4,#2ba7ff)!important}.summary.amber{background:linear-gradient(135deg,#ef8b14,#ffb029)!important}.summary.green{background:linear-gradient(135deg,#079a70,#12bd8d)!important}.summary.red{background:linear-gradient(135deg,#dc3c55,#f65d72)!important}
.summary small,.summary p,.summary span{color:rgba(255,255,255,.9)!important}.summary strong{color:#fff!important}

/* Enterprise overview hero follows same visual language */
.overview-day-readiness,.aquaflow-order-hero{border:1px solid rgba(255,255,255,.18)!important;border-radius:var(--af-radius-xl)!important;background:linear-gradient(135deg,#075fd3 0%,#0b82f6 52%,#4fb7ff 100%)!important;box-shadow:0 20px 45px rgba(8,120,239,.19)!important}
.overview-day-readiness.is-complete{background:linear-gradient(135deg,#08775e,#0ba57e 56%,#45d1aa)!important}

/* Tables / lists */
table{width:100%;border-collapse:separate!important;border-spacing:0!important}
th{background:#f4f8fc!important;color:#668097!important;font-size:10px!important;font-weight:900!important;letter-spacing:.055em!important;text-transform:uppercase}
th,td{border-bottom:1px solid #e8eff5!important;padding:10px 11px!important}
tr:last-child td{border-bottom:0!important}
:where(.card-grid,.company-supplier-list,.aquaflow-order-list,.admin-handover-list){gap:10px!important}
:where(.entry,.customer-card,.debtor,.supplier-row-card,.order-card):hover{border-color:#c6dcef!important;box-shadow:0 10px 27px rgba(22,62,99,.08)!important}

/* Status pills */
:where(.pill,.day-control-status,.employee-search-count,.supplier-held-pill,.receipt-enterprise-status){border-radius:999px!important;font-weight:850!important}
.pill{border:1px solid #cfe5fb!important;background:var(--af-primary-soft)!important;color:var(--af-primary)!important}

/* Dialog system */
dialog{border:0!important;border-radius:24px!important;background:#fff!important;box-shadow:0 32px 88px rgba(8,35,65,.24)!important}
dialog::backdrop{background:rgba(5,21,39,.48)!important;backdrop-filter:blur(4px)!important;-webkit-backdrop-filter:blur(4px)!important}
.dialog-head{border-bottom:1px solid var(--af-line)!important;padding-bottom:13px!important}.dialog-head h2{color:var(--af-ink)!important;letter-spacing:-.03em!important}

/* View transition: same for every module */
.view.active{animation:af-unified-enter .17s cubic-bezier(.22,.61,.36,1)}
@keyframes af-unified-enter{from{opacity:.48;transform:translateY(5px)}to{opacity:1;transform:none}}

/* ---------- Staff desktop: same enterprise shell, denser work area ---------- */
@media(min-width:981px){
  .staff-mode #overview>.toolbar{grid-template-columns:minmax(0,1fr) 188px!important;max-width:none!important}
  .staff-mode .staff-command-bar{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important}
  .staff-mode .staff-command{min-height:74px!important;border:1px solid var(--af-line)!important;border-radius:16px!important;background:#fff!important;box-shadow:var(--af-shadow-sm)!important}
  .staff-mode .staff-command:hover{border-color:#bad9f4!important;box-shadow:var(--af-shadow)!important}
  .staff-mode #delivery-list .staff-delivery-list-compact{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .staff-mode #customer-list,.staff-mode #debt-list{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .staff-mode .staff-shift-readiness{border-radius:18px!important;border:1px solid var(--af-line)!important;box-shadow:var(--af-shadow-sm)!important}
}

/* ---------- Company module ---------- */
.company-period-panel{padding:14px 16px!important}.company-period-controls{gap:9px!important}.company-period-heading strong{color:var(--af-ink)!important}
.company-total-summary{gap:9px!important}.company-total-summary>span{border:1px solid var(--af-line)!important;border-radius:16px!important;background:var(--af-surface-soft)!important;box-shadow:none!important}
.company-total-summary .company-summary-primary{background:linear-gradient(145deg,#f1f7ff,#fff)!important}.company-total-summary .received{background:linear-gradient(145deg,#edf9f4,#fff)!important}.company-total-summary .sent{background:linear-gradient(145deg,#fff7eb,#fff)!important}.company-total-summary .defective{background:linear-gradient(145deg,#fff0f2,#fff)!important}
.company-total-summary strong{color:var(--af-ink)!important}.company-total-summary small{color:var(--af-muted)!important}.company-total-summary i{color:#8294a5!important}

/* ---------- Operations / reports ---------- */
.operation-grid,.finance-grid{gap:12px!important}.operation-card .section-head,.finance-card .section-head{padding-bottom:7px!important}
#stock-ledger-list .stock-ledger-item{border-color:var(--af-line)!important;border-radius:15px!important;background:#fff!important}
.report-strip{padding:16px!important}.report-details{border-radius:18px!important}

/* ---------- Mobile: same components, one-hand flow ---------- */
@media(max-width:980px){
  body{background:linear-gradient(180deg,#f2f7fc,#f7f9fc 340px,#f4f7fa)}
  .shell,.management-mode .shell,.staff-mode .shell,.supplier-mode .shell{width:100%!important;max-width:none!important;padding:0 11px calc(102px + env(safe-area-inset-bottom))!important}
  .header,.management-mode .header,.staff-mode .header,.supplier-mode .header{position:sticky!important;top:0!important;z-index:32!important;min-height:72px!important;padding:9px 2px!important;background:rgba(246,250,254,.94)!important}
  .brand{position:static!important;width:auto!important;color:var(--af-ink)!important}.brand h1{color:var(--af-ink)!important;font-size:15px!important}.brand small{color:var(--af-primary)!important;font-size:8px!important}.logo{width:40px!important;height:40px!important;flex-basis:40px!important;border-radius:13px!important;font-size:17px!important}
  .account-box>.customer-add{display:none!important}.account-button{min-height:40px!important;min-width:0!important;padding:6px 9px!important}.account-button span{max-width:94px!important;font-size:11px!important}.account-button small{font-size:8px!important}
  .tabs,.management-mode .tabs,.staff-mode .tabs,.supplier-mode .tabs{position:fixed!important;z-index:60!important;left:0!important;right:0!important;bottom:0!important;top:auto!important;width:auto!important;height:calc(72px + env(safe-area-inset-bottom))!important;display:flex!important;flex-direction:row!important;gap:1px!important;overflow-x:auto!important;overflow-y:hidden!important;margin:0!important;padding:5px 5px calc(6px + env(safe-area-inset-bottom))!important;border:0!important;border-top:1px solid var(--af-line)!important;border-radius:0!important;background:rgba(255,255,255,.965)!important;box-shadow:0 -10px 30px rgba(19,51,81,.08)!important;backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important}
  .tab,.management-mode .tab,.staff-mode .tab,.supplier-mode .tab{flex:0 0 72px!important;min-width:72px!important;width:72px!important;height:58px!important;min-height:58px!important;display:grid!important;place-items:center!important;align-content:center!important;gap:3px!important;border:0!important;border-radius:12px!important;padding:4px 3px!important;background:transparent!important;color:#678096!important;text-align:center!important;box-shadow:none!important}
  .tab-icon{display:block!important;width:auto!important;height:auto!important;background:none!important;color:inherit!important;font-size:18px!important}.tab-copy{display:block!important;color:inherit!important;font-size:9px!important;line-height:1.05!important}.tab-copy>small{display:none!important}
  .tab.active{background:var(--af-primary-soft)!important;color:var(--af-primary)!important;box-shadow:none!important}
  .view,.management-mode .view,.staff-mode .view,.supplier-mode .view{width:100%!important;max-width:none!important;margin:8px 0 0!important;padding-top:0!important;padding-bottom:18px!important}
  :where(.page-head,.aquaflow-page-head){min-height:auto!important;margin-bottom:11px!important}.page-head h2,.aquaflow-page-head h2{font-size:21px!important}
  :where(.toolbar,.quick,.month-panel,.order-filter-panel,.employee-search-panel,.customer-search-panel,.company-period-panel,.operation-card,.finance-card,.report-strip,.management-command-center,.company-command-center,.company-panel,.staff-workflow,.staff-settlement,.customer-intelligence-report,.enterprise-control,.admin-handover,.overview-journal,.debt-hero,.staff-expense-panel){border-radius:17px!important}
  .summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.summary{min-height:105px!important;padding:14px!important;border-radius:16px!important}.summary strong{font-size:18px!important}
  .overview-day-readiness,.aquaflow-order-hero{border-radius:22px!important}
  dialog{width:min(94vw,640px)!important;max-height:88dvh!important;border-radius:21px!important}
}
@media(max-width:520px){
  .summary{min-height:98px!important}.summary small{font-size:8.5px!important}.summary strong{font-size:16px!important}.summary p{font-size:9.5px!important}
  .company-total-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .company-total-summary>span{min-height:90px!important;padding:11px!important}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.view.active{animation:none}:where(.btn,.edit,.mini-btn,.tab,.staff-command,.management-command){transition:none!important}}


/* ========================================================================== 
   AquaFlow Unified Enterprise Authority — v3.94.0
   One visual contract for every tab. This final section is authoritative.
   ========================================================================== */
body.unified-shell{
  --u-bg:#f3f7fb;--u-surface:#fff;--u-soft:#f7fafd;--u-ink:#10243b;--u-muted:#6f8294;
  --u-line:#dbe6ef;--u-primary:#0878ef;--u-success:#078b68;--u-warning:#c97508;--u-danger:#d63c4c;
  --u-radius:18px;--u-radius-sm:13px;--u-shadow:0 8px 24px rgba(22,55,88,.055);
  --u-shadow-hover:0 14px 34px rgba(22,55,88,.09);background:var(--u-bg)!important;color:var(--u-ink)!important;
}
body.unified-shell [hidden]{display:none!important}
body.unified-shell .is-hidden{display:none!important}
body.unified-shell .view[data-rbac-allowed="false"]{display:none!important}

/* Every page has the same width, rhythm and title language. */
body.unified-shell .view{color:var(--u-ink)}
body.unified-shell .view>.page-head,
body.unified-shell .view>.aquaflow-page-head,
body.unified-shell .view>.toolbar{margin-bottom:14px!important}
body.unified-shell :is(.page-head,.aquaflow-page-head,.section-head){align-items:flex-start!important}
body.unified-shell :is(.page-head,.aquaflow-page-head) h2{font-size:22px!important;font-weight:900!important;letter-spacing:-.035em!important;color:var(--u-ink)!important}
body.unified-shell .section-head h2{font-size:18px!important;font-weight:875!important;letter-spacing:-.025em!important;color:var(--u-ink)!important}
body.unified-shell :is(.page-head,.aquaflow-page-head,.section-head) small{font-size:9px!important;font-weight:900!important;letter-spacing:.14em!important;color:var(--u-primary)!important}
body.unified-shell :is(.section-note,.helper-note,.page-head p,.aquaflow-page-head p){color:var(--u-muted)!important}

/* All first-level panels use one surface contract. */
body.unified-shell :is(
  .toolbar,.quick,.month-panel,.order-filter-panel,.employee-search-panel,.customer-search-panel,
  .company-period-panel,.operation-card,.finance-card,.report-strip,.management-command-center,.company-command-center,
  .company-panel,.staff-workflow,.staff-settlement,.customer-intelligence-report,.enterprise-control,.admin-handover,
  .overview-journal,.debt-hero,.staff-expense-panel,.supplier-row-card,.receipt-enterprise-card,.order-card,.customer-card,
  .debtor,.entry,.team-admin-tools,.permission-guide,.report-details,.compact-details
){border:1px solid var(--u-line)!important;border-radius:var(--u-radius)!important;background:var(--u-surface)!important;box-shadow:var(--u-shadow)!important}
body.unified-shell :is(.operation-card,.finance-card,.company-panel,.staff-workflow,.staff-settlement,.enterprise-control,.admin-handover,.overview-journal,.staff-expense-panel){padding:16px!important}
body.unified-shell :is(.order-card,.customer-card,.debtor,.entry,.supplier-row-card,.receipt-enterprise-card){transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease!important}
body.unified-shell :is(.order-card,.customer-card,.debtor,.entry,.supplier-row-card,.receipt-enterprise-card):hover{border-color:#c5d9ea!important;box-shadow:var(--u-shadow-hover)!important}

/* One control system. */
body.unified-shell :is(input,select,textarea){border:1px solid #cedde9!important;border-radius:12px!important;background:#fff!important;color:var(--u-ink)!important;box-shadow:none!important;outline:none!important}
body.unified-shell :is(input,select,textarea):focus{border-color:#7dbbf5!important;box-shadow:0 0 0 3px rgba(8,120,239,.11)!important}
body.unified-shell :is(.btn,.edit,.mini-btn,.customer-action,.account-button,.overview-show-all){border-radius:12px!important;font-weight:800!important;box-shadow:none!important}
body.unified-shell .btn.primary{background:linear-gradient(135deg,#0878ef,#1698ff)!important;border-color:#0878ef!important;color:#fff!important}
body.unified-shell .btn.green{background:linear-gradient(135deg,#078b68,#0baa7d)!important;border-color:#078b68!important;color:#fff!important}
body.unified-shell .btn.secondary{background:#fff!important;border:1px solid #cedde9!important;color:#284a65!important}

/* Tables/lists should look like the same product in every module. */
body.unified-shell :is(table,.table){border-collapse:separate!important;border-spacing:0!important;width:100%!important}
body.unified-shell :is(th,.table-head){color:#6e8396!important;font-size:10px!important;font-weight:900!important;letter-spacing:.045em!important;background:#f7fafd!important}
body.unified-shell td{border-bottom:1px solid #edf2f6!important;color:#28475f!important}
body.unified-shell tr:last-child td{border-bottom:0!important}
body.unified-shell :is(.pill,.role-badge,.enterprise-card-tag,.day-control-status,.employee-search-count){border-radius:999px!important;font-weight:850!important}

/* Staff: only capability-authorized nav remains; forbidden items take no layout space. */
body.unified-shell.staff-mode .tabs .tab[hidden]{display:none!important}
body.unified-shell.staff-mode .tabs{align-content:flex-start!important}
body.unified-shell.staff-mode .management-command-center,
body.unified-shell.staff-mode .permission-report,
body.unified-shell.staff-mode .permission-company,
body.unified-shell.staff-mode .permission-admin{display:none!important}
body.unified-shell.staff-mode .staff-command-bar{display:grid!important}
body.unified-shell.staff-mode .staff-only:not(.is-hidden){display:revert}
body.unified-shell.staff-mode .staff-tab-label{display:inline!important}
body.unified-shell.staff-mode .admin-tab-label{display:none!important}

/* Desktop uses one shell for every role, with only the number of permitted menu items changing. */
@media(min-width:981px){
  body.unified-shell .shell{display:block!important;padding-left:278px!important;padding-right:30px!important}
  /* The fixed sidebar already has its own space. A legacy grid reserved it twice.
     Keep the fixed brand anchored to the viewport, above the sidebar backdrop. */
  body.unified-shell .header{z-index:45!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  body.unified-shell .brand>div{min-width:0}
  body.unified-shell .brand h1{overflow:hidden;text-overflow:ellipsis}
  body.unified-shell .tabs{width:248px!important;padding:88px 14px 90px!important}
  body.unified-shell .view{max-width:1480px!important;margin-inline:auto!important;padding-top:22px!important}
  body.unified-shell .tab{min-height:50px!important;border-radius:13px!important}
  body.unified-shell .tab-copy{font-size:12.5px!important}.tab-copy>small{font-size:8.5px!important}
  body.unified-shell.staff-mode #delivery-list .staff-delivery-list-compact,
  body.unified-shell.staff-mode #customer-list,
  body.unified-shell.staff-mode #debt-list{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  body.unified-shell.staff-mode .staff-command-bar{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important}
}

/* Mobile has one bottom nav; with staff it naturally collapses to the five permitted destinations. */
@media(max-width:980px){
  body.unified-shell .shell{padding-inline:10px!important;padding-bottom:calc(92px + env(safe-area-inset-bottom))!important}
  body.unified-shell .tabs{justify-content:space-around!important;overflow-x:auto!important}
  body.unified-shell .tabs .tab:not([hidden]){flex:1 0 64px!important;max-width:88px!important;min-width:64px!important;width:auto!important}
  body.unified-shell .view{margin-top:6px!important}
  body.unified-shell :is(.operation-card,.finance-card,.company-panel,.staff-workflow,.staff-settlement,.enterprise-control,.admin-handover,.overview-journal,.staff-expense-panel){padding:13px!important;border-radius:16px!important}
  body.unified-shell :is(.page-head,.aquaflow-page-head) h2{font-size:20px!important}
}

/* ========================================================================== 
   v3.94.0 — Classic Blue Cohesion Patch
   Safe polish only: keep the proven Classic Blue DOM/layout, normalize rhythm,
   prevent overflow, and hide RBAC-gated UI until permissions are resolved.
   ========================================================================== */

/* Prevent any unauthorized navigation/action flash before /api/data resolves. */
body.unified-shell:not(.rbac-ready) .tabs,
body.unified-shell:not(.rbac-ready) .view,
body.unified-shell:not(.rbac-ready) [data-action-capability]{visibility:hidden!important}
body.unified-shell.rbac-ready .tabs,
body.unified-shell.rbac-ready .view.active{visibility:visible}

/* Shared containment rules: eliminate the most common card/table overflow bugs. */
body.unified-shell .shell,
body.unified-shell .view,
body.unified-shell .view > *,
body.unified-shell :is(.summary-grid,.finance-grid,.card-grid,.enterprise-control-grid,.management-command-actions,.company-total-summary,.staff-command-bar) > *{min-width:0!important}
body.unified-shell :is(h1,h2,h3,strong,p,small,span,em){overflow-wrap:anywhere}
body.unified-shell img,body.unified-shell svg{max-width:100%}

/* One spacing contract across every top-level tab without changing its structure. */
body.unified-shell .view > :is(.page-head,.aquaflow-page-head,.toolbar){min-height:68px!important;padding-block:13px!important}
body.unified-shell .view > .toolbar{padding-inline:16px!important}
body.unified-shell .view > :is(.page-head,.aquaflow-page-head){padding-inline:2px!important}
body.unified-shell .section-head{min-height:46px!important;margin:18px 2px 10px!important;gap:12px!important}
body.unified-shell :is(.page-head,.aquaflow-page-head,.toolbar,.section-head) > *{min-width:0}

/* Buttons and inputs share the same visual height; no tab gets a one-off control size. */
body.unified-shell :is(.btn,.account-button,.edit,.delete,.mini-btn,.customer-action,.overview-show-all){min-height:42px!important}
body.unified-shell :is(input,select,textarea){max-width:100%!important}
body.unified-shell textarea{min-height:92px;resize:vertical}
body.unified-shell .dialog-actions > *{min-width:0}

/* Stable cards: same edge treatment, safe internal widths, no accidental horizontal growth. */
body.unified-shell :is(.summary,.finance-card,.operation-card,.company-panel,.staff-workflow,.staff-settlement,.enterprise-control,.admin-handover,.overview-journal,.staff-expense-panel,.order-card,.entry,.customer-card,.debtor,.supplier-row-card,.receipt-enterprise-card){min-width:0!important;overflow-wrap:anywhere}
body.unified-shell .summary-grid > .summary{height:100%}
body.unified-shell :is(.summary strong,.finance-card strong){font-variant-numeric:tabular-nums}

/* Tables/details stay inside their tab. Horizontal scroll is local, never the whole page. */
body.unified-shell :is(.report-details,.compact-details,.operation-card,.company-panel,.team-admin-tools,.customer-intelligence-report){max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain}
body.unified-shell :is(table,.table){min-width:0!important}
body.unified-shell :is(th,td){vertical-align:middle}

/* Sidebar keeps Classic Blue styling but remains usable on short desktop screens. */
@media(min-width:981px){
  body.unified-shell .tabs{max-height:100dvh!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain!important;scrollbar-width:thin}
  body.unified-shell .shell{min-height:100vh}
  body.unified-shell .header{min-width:0}
  body.unified-shell .account-box{min-width:0;flex:0 1 auto}
  body.unified-shell .account-button span{max-width:180px}
  body.unified-shell .view > :is(.page-head,.aquaflow-page-head,.toolbar){border-radius:16px}
  body.unified-shell.staff-mode .staff-command-bar > *{min-width:0}
  body.unified-shell.staff-mode :is(#delivery-list .staff-delivery-list-compact,#customer-list,#debt-list){align-items:start}
}

/* Tablet/mobile: retain one-hand flow and keep five staff destinations evenly sized. */
@media(max-width:980px){
  body.unified-shell .header{gap:8px!important}
  body.unified-shell .brand{min-width:0}
  body.unified-shell .brand h1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body.unified-shell .account-box{flex:0 0 auto}
  body.unified-shell .tabs{gap:2px!important}
  body.unified-shell.staff-mode .tabs .tab:not([hidden]){flex:1 1 20%!important;min-width:58px!important;max-width:none!important}
  body.unified-shell .view > :is(.page-head,.aquaflow-page-head,.toolbar){min-height:0!important}
  body.unified-shell :is(.section-head,.page-head,.aquaflow-page-head,.toolbar){max-width:100%}
  body.unified-shell :is(.page-head,.aquaflow-page-head) > :last-child{flex-shrink:0}
  body.unified-shell dialog form{padding:17px!important}
}

@media(max-width:430px){
  body.unified-shell .two{grid-template-columns:1fr!important}
  body.unified-shell .dialog-actions{grid-template-columns:1fr!important}
  body.unified-shell .summary-grid{gap:8px!important}
  body.unified-shell .summary{padding:12px!important}
  body.unified-shell .brand h1{font-size:18px!important}
  body.unified-shell .brand small{font-size:8px!important}
}

/* ========================================================================== 
   v3.94.0 — Classic Blue Compact Ledger
   Hàng & vỏ: chữ lớn, dễ đọc, mặc định thu gọn để không chiếm màn hình.
   Không đổi shell/DOM của các module khác.
   ========================================================================== */
body.unified-shell #operation-stock-ledger.stock-ledger-card{
  padding:0!important;
  overflow:hidden!important;
  border-color:#d7e5f1!important;
  background:#fff!important;
}
body.unified-shell #operation-stock-ledger>summary{
  list-style:none!important;
  cursor:pointer!important;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
}
body.unified-shell #operation-stock-ledger>summary::-webkit-details-marker{display:none!important}
body.unified-shell .stock-ledger-summary{
  display:block!important;
  padding:17px 18px 13px!important;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important;
}
body.unified-shell .stock-ledger-summary:focus-visible{
  outline:3px solid rgba(8,120,239,.18)!important;
  outline-offset:-3px!important;
}
body.unified-shell .stock-ledger-summary-top{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:12px!important;
  min-width:0!important;
}
body.unified-shell .stock-ledger-title{min-width:0!important}
body.unified-shell .stock-ledger-title>small{
  display:block!important;
  margin-bottom:4px!important;
  color:#0878ef!important;
  font-size:10.5px!important;
  font-weight:950!important;
  letter-spacing:.16em!important;
}
body.unified-shell .stock-ledger-title>h2{
  margin:0!important;
  color:#10243b!important;
  font-size:23px!important;
  line-height:1.08!important;
  font-weight:950!important;
  letter-spacing:-.035em!important;
}
body.unified-shell .stock-ledger-summary-actions{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  flex:0 0 auto!important;
}
body.unified-shell .stock-ledger-summary-actions .enterprise-card-tag{
  min-height:34px!important;
  display:inline-flex!important;
  align-items:center!important;
  padding:0 11px!important;
  font-size:12px!important;
}
body.unified-shell .stock-ledger-chevron{
  width:34px!important;
  height:34px!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid #d7e5f1!important;
  border-radius:11px!important;
  color:#0878ef!important;
  background:#f6faff!important;
  font-size:22px!important;
  line-height:1!important;
  transition:transform .18s ease!important;
}
body.unified-shell #operation-stock-ledger[open] .stock-ledger-chevron{transform:rotate(180deg)!important}
body.unified-shell .stock-ledger-glance{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  margin-top:13px!important;
  border:1px solid #dce9f4!important;
  border-radius:15px!important;
  background:#f7fbff!important;
  overflow:hidden!important;
}
body.unified-shell .stock-ledger-glance>span{
  min-width:0!important;
  min-height:58px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:8px 12px!important;
  position:relative!important;
}
body.unified-shell .stock-ledger-glance>span+span:before{
  content:"";
  position:absolute;
  left:0;top:11px;bottom:11px;
  width:1px;
  background:#d9e8f5;
}
body.unified-shell .stock-ledger-glance small{
  color:#687f94!important;
  font-size:10.5px!important;
  line-height:1.1!important;
  font-weight:800!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
body.unified-shell .stock-ledger-glance strong{
  margin-top:3px!important;
  color:#10243b!important;
  font-size:19px!important;
  line-height:1.05!important;
  font-weight:950!important;
  font-variant-numeric:tabular-nums!important;
  white-space:nowrap!important;
}
body.unified-shell .stock-ledger-collapse-hint{
  display:flex!important;
  justify-content:flex-end!important;
  margin-top:7px!important;
  color:#0878ef!important;
  font-size:11px!important;
  font-weight:850!important;
}
body.unified-shell .stock-ledger-collapse-hint .when-open{display:none!important}
body.unified-shell #operation-stock-ledger[open] .stock-ledger-collapse-hint .when-closed{display:none!important}
body.unified-shell #operation-stock-ledger[open] .stock-ledger-collapse-hint .when-open{display:inline!important}
body.unified-shell .stock-ledger-body{
  padding:13px 18px 17px!important;
  border-top:1px solid #e5edf4!important;
  background:#fff!important;
}
body.unified-shell .stock-ledger-note{
  margin:0 0 11px!important;
  font-size:13.5px!important;
  line-height:1.4!important;
}
body.unified-shell .stock-ledger-filters{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:7px!important;
  margin-bottom:12px!important;
}
body.unified-shell .stock-ledger-filter{
  min-width:0!important;
  min-height:41px!important;
  border:1px solid #d6e3ef!important;
  border-radius:12px!important;
  background:#fff!important;
  color:#23435e!important;
  font-size:13px!important;
  line-height:1!important;
  font-weight:900!important;
  white-space:nowrap!important;
  padding:0 8px!important;
}
body.unified-shell .stock-ledger-filter span{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:20px!important;
  height:20px!important;
  margin-left:3px!important;
  padding:0 5px!important;
  border-radius:999px!important;
  background:#eef4f9!important;
  color:#6c8193!important;
  font-size:10px!important;
  font-weight:900!important;
}
body.unified-shell .stock-ledger-filter.active{
  border-color:#0878ef!important;
  background:linear-gradient(135deg,#0878ef,#168df7)!important;
  color:#fff!important;
  box-shadow:0 7px 18px rgba(8,120,239,.16)!important;
}
body.unified-shell .stock-ledger-filter.active span{background:rgba(255,255,255,.20)!important;color:#fff!important}
body.unified-shell #stock-ledger-list{overflow:visible!important}
body.unified-shell .stock-ledger-rows{
  display:grid!important;
  gap:7px!important;
}
body.unified-shell #stock-ledger-list .stock-ledger-row{
  min-width:0!important;
  min-height:66px!important;
  display:grid!important;
  grid-template-columns:104px minmax(0,1fr) 48px!important;
  align-items:center!important;
  gap:11px!important;
  margin:0!important;
  padding:9px 11px!important;
  border:1px solid #e0e9f1!important;
  border-radius:14px!important;
  background:#fff!important;
  box-shadow:0 3px 12px rgba(18,49,78,.025)!important;
}
body.unified-shell #stock-ledger-list .stock-ledger-row[hidden]{display:none!important}
body.unified-shell .stock-ledger-type{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:34px!important;
  padding:0 9px!important;
  border-radius:999px!important;
  background:#edf6ff!important;
  color:#0878ef!important;
  font-size:13px!important;
  line-height:1!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
body.unified-shell .stock-ledger-receipt .stock-ledger-type{background:#ecf9f4!important;color:#078b68!important}
body.unified-shell .stock-ledger-adjustment .stock-ledger-type{background:#fff6e8!important;color:#b96600!important}
body.unified-shell .stock-ledger-main{min-width:0!important}
body.unified-shell .stock-ledger-main strong{
  display:block!important;
  color:#10243b!important;
  font-size:16.5px!important;
  line-height:1.18!important;
  font-weight:925!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
body.unified-shell .stock-ledger-main small{
  display:block!important;
  margin-top:3px!important;
  color:#0878ef!important;
  font-size:13.5px!important;
  line-height:1.18!important;
  font-weight:775!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
body.unified-shell .stock-ledger-receipt .stock-ledger-main small{color:#078b68!important}
body.unified-shell .stock-ledger-adjustment .stock-ledger-main small{color:#a96209!important}
body.unified-shell #stock-ledger-list .stock-ledger-row time{
  justify-self:end!important;
  color:#0878ef!important;
  font-size:13.5px!important;
  line-height:1!important;
  font-weight:900!important;
  font-variant-numeric:tabular-nums!important;
  white-space:nowrap!important;
}

@media(max-width:520px){
  body.unified-shell .stock-ledger-summary{padding:15px 13px 11px!important}
  body.unified-shell .stock-ledger-title>h2{font-size:21px!important}
  body.unified-shell .stock-ledger-summary-actions .enterprise-card-tag{display:none!important}
  body.unified-shell .stock-ledger-chevron{width:32px!important;height:32px!important}
  body.unified-shell .stock-ledger-glance{margin-top:11px!important}
  body.unified-shell .stock-ledger-glance>span{min-height:55px!important;padding:7px 8px!important}
  body.unified-shell .stock-ledger-glance small{font-size:9.5px!important}
  body.unified-shell .stock-ledger-glance strong{font-size:17px!important}
  body.unified-shell .stock-ledger-body{padding:11px 12px 14px!important}
  body.unified-shell .stock-ledger-filters{gap:5px!important}
  body.unified-shell .stock-ledger-filter{min-height:39px!important;padding:0 5px!important;font-size:11.5px!important}
  body.unified-shell .stock-ledger-filter span{display:none!important}
  body.unified-shell #stock-ledger-list .stock-ledger-row{grid-template-columns:88px minmax(0,1fr) 43px!important;gap:8px!important;min-height:64px!important;padding:8px 9px!important;border-radius:13px!important}
  body.unified-shell .stock-ledger-type{min-height:32px!important;padding:0 7px!important;font-size:12.5px!important}
  body.unified-shell .stock-ledger-main strong{font-size:16px!important}
  body.unified-shell .stock-ledger-main small{font-size:13px!important}
  body.unified-shell #stock-ledger-list .stock-ledger-row time{font-size:12.5px!important}
}

@media(max-width:370px){
  body.unified-shell .stock-ledger-filter{font-size:10.8px!important}
  body.unified-shell #stock-ledger-list .stock-ledger-row{grid-template-columns:80px minmax(0,1fr) 40px!important;gap:7px!important}
  body.unified-shell .stock-ledger-type{font-size:11.5px!important}
  body.unified-shell .stock-ledger-main strong{font-size:15.5px!important}
  body.unified-shell .stock-ledger-main small{font-size:12.5px!important}
}


/* ========================================================================== 
   v3.94.0 — Mobile Compact Forms + Operations Width Guard
   - Sửa tab Vận hành bị ép chữ thành cột dọc trên Safari/iPhone.
   - Thu gọn Ghi chuyến giao / Nhận hàng tại công ty nhưng vẫn giữ chữ rõ.
   - Hai nút Hủy/Lưu luôn nằm cùng hàng và luôn nhìn thấy ở đáy modal.
   - Số tiền trong summary không bị bẻ giữa các chữ số.
   ========================================================================== */

/* Headings must never be broken character-by-character by the global overflow guard. */
body.unified-shell :is(h1,h2,h3){overflow-wrap:normal!important;word-break:normal!important}

/* Vận hành: date control gets a bounded column; title owns the remaining width. */
@media(max-width:980px){
  body.unified-shell #operations>.enterprise-page-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 142px!important;
    align-items:center!important;
    column-gap:10px!important;
    row-gap:4px!important;
    width:100%!important;
  }
  body.unified-shell #operations>.enterprise-page-head>div:first-child{min-width:0!important;width:auto!important}
  body.unified-shell #operations>.enterprise-page-head :is(small,h2,.section-note){overflow-wrap:normal!important;word-break:normal!important}
  body.unified-shell #operations>.enterprise-page-head input{
    width:142px!important;
    min-width:0!important;
    max-width:142px!important;
    justify-self:end!important;
  }
  body.unified-shell #operations,
  body.unified-shell #operations>.operations-command-strip,
  body.unified-shell #operations>.enterprise-attention,
  body.unified-shell #operations>.operations-grid{width:100%!important;min-width:0!important;max-width:100%!important}
}

/* Money is a numeric token: never wrap 500.000 into 500.00 + 0. */
body.unified-shell #receipt-dialog .receipt-money-summary strong,
body.unified-shell #delivery-dialog :is(#delivery-total,#delivery-debt,#delivery-net-cashflow),
body.unified-shell #receipt-dialog :is(#receipt-total,#receipt-paid-preview,#receipt-due-preview){
  overflow-wrap:normal!important;
  word-break:keep-all!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums!important;
}

@media(max-width:560px){
  /* Both frequent dialogs use almost the whole viewport and one consistent compact rhythm. */
  body.unified-shell #delivery-dialog,
  body.unified-shell #receipt-dialog.receipt-enterprise-dialog{
    width:calc(100% - 8px)!important;
    max-width:640px!important;
    max-height:calc(100dvh - 8px)!important;
    margin-block:4px!important;
    border-radius:20px 20px 12px 12px!important;
    overflow:auto!important;
  }
  body.unified-shell #delivery-dialog form,
  body.unified-shell #receipt-dialog #receipt-form{
    gap:8px!important;
    padding:12px 12px max(10px,env(safe-area-inset-bottom))!important;
  }
  body.unified-shell #delivery-dialog .dialog-head,
  body.unified-shell #receipt-dialog .dialog-head{
    position:sticky!important;
    top:-12px!important;
    z-index:7!important;
    margin:0 -12px!important;
    padding:10px 12px 9px!important;
    background:rgba(255,255,255,.98)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
  }
  body.unified-shell #delivery-dialog .dialog-head h2,
  body.unified-shell #receipt-dialog .dialog-head h2{font-size:1.22rem!important;line-height:1.08!important}
  body.unified-shell #delivery-dialog .dialog-head small,
  body.unified-shell #receipt-dialog .dialog-head small{font-size:.58rem!important;letter-spacing:.13em!important}
  body.unified-shell #delivery-dialog .icon-btn,
  body.unified-shell #receipt-dialog .icon-btn{width:38px!important;height:38px!important;flex:0 0 38px!important}

  /* Undo the generic one-column mobile rule only inside the two high-frequency forms. */
  body.unified-shell #delivery-dialog .two,
  body.unified-shell #receipt-dialog .two,
  body.unified-shell #receipt-dialog .receipt-finance-section>.two,
  body.unified-shell #receipt-dialog .receipt-payment-fields{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:7px!important;
  }

  body.unified-shell #delivery-dialog label,
  body.unified-shell #receipt-dialog label{gap:5px!important;font-size:.68rem!important;line-height:1.25!important}
  body.unified-shell #delivery-dialog :is(input,select),
  body.unified-shell #receipt-dialog :is(input,select){
    height:43px!important;
    min-height:43px!important;
    border-radius:11px!important;
    padding-inline:10px!important;
    font-size:.88rem!important;
  }

  /* Delivery: compact core + optional panels. */
  body.unified-shell #delivery-dialog .delivery-customer-picker-compact .delivery-customer-search-box{height:43px!important;border-radius:11px!important}
  body.unified-shell #delivery-dialog .delivery-customer-picker-compact .delivery-customer-search-box input{height:41px!important;min-height:41px!important;font-size:.88rem!important}
  body.unified-shell #delivery-dialog .delivery-customer-selected{min-height:46px!important;padding:6px 8px!important}
  body.unified-shell #delivery-dialog .delivery-option-strip{gap:6px!important}
  body.unified-shell #delivery-dialog .delivery-option-chip{min-height:39px!important;border-radius:11px!important;padding:0 5px!important;font-size:10.5px!important}
  body.unified-shell #delivery-dialog .delivery-option-chip span{gap:4px!important}
  body.unified-shell #delivery-dialog .delivery-option-chip span::before{width:17px!important;height:17px!important;flex-basis:17px!important;font-size:12px!important}
  body.unified-shell #delivery-dialog .damaged-bottle-field,
  body.unified-shell #delivery-dialog .pack-size-block,
  body.unified-shell #delivery-dialog .deposit-block{padding:9px!important;border-radius:13px!important}
  body.unified-shell #delivery-dialog .pack-size-title,
  body.unified-shell #delivery-dialog .deposit-title{margin-bottom:6px!important;font-size:9.5px!important}
  body.unified-shell #delivery-dialog .product-pack{padding:8px!important;border-radius:12px!important}
  body.unified-shell #delivery-dialog .product-pack.two{grid-template-columns:1fr 1fr!important;gap:6px!important}
  body.unified-shell #delivery-dialog .deposit-preview{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important}
  body.unified-shell #delivery-dialog .deposit-preview span{display:grid!important;min-width:0!important;gap:2px!important;padding:7px!important;font-size:8px!important;text-align:center!important}
  body.unified-shell #delivery-dialog .deposit-preview strong{font-size:9.5px!important;white-space:nowrap!important}
  body.unified-shell #delivery-dialog .helper-note{font-size:9px!important;line-height:1.32!important}
  body.unified-shell #delivery-dialog .bottle-company-preview{min-height:42px!important;padding:8px 10px!important;border-radius:11px!important;font-size:10px!important}
  body.unified-shell #delivery-dialog .total.delivery-total-card{min-height:68px!important;padding:10px 11px!important;border-radius:14px!important}
  body.unified-shell #delivery-dialog .delivery-total-card>div:first-child strong{font-size:21px!important}
  body.unified-shell #delivery-dialog .delivery-goods-note{font-size:8.5px!important}
  body.unified-shell #delivery-dialog .delivery-payment-section{gap:7px!important;padding:9px!important;border-radius:13px!important}
  body.unified-shell #delivery-dialog .delivery-payment-head{align-items:center!important;gap:7px!important}
  body.unified-shell #delivery-dialog .delivery-payment-head span{display:none!important}
  body.unified-shell #delivery-dialog .delivery-payment-head strong{font-size:13px!important}
  body.unified-shell #delivery-dialog .delivery-payment-shortcuts{gap:4px!important}
  body.unified-shell #delivery-dialog .delivery-payment-shortcuts button{min-height:28px!important;padding:0 8px!important;font-size:9.5px!important}
  body.unified-shell #delivery-dialog .delivery-payment-fields{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)!important;gap:6px!important}
  body.unified-shell #delivery-dialog .delivery-payment-fields :is(input,select){height:43px!important;min-height:43px!important;font-size:.88rem!important}
  body.unified-shell #delivery-dialog .payment-result-grid{gap:6px!important}
  body.unified-shell #delivery-dialog .payment-result-grid .debt-preview{padding:8px!important;border-radius:10px!important;gap:2px!important;font-size:9px!important}
  body.unified-shell #delivery-dialog .payment-result-grid .debt-preview strong{font-size:11px!important;white-space:nowrap!important}

  /* Receipt: denser info, bottle, pack and finance sections. */
  body.unified-shell #receipt-dialog .receipt-form-section{gap:8px!important;padding:9px!important;border-radius:13px!important}
  body.unified-shell #receipt-dialog .receipt-form-section h3{font-size:.86rem!important}
  body.unified-shell #receipt-dialog .receipt-quantity-grid{grid-template-columns:1fr 1fr!important;gap:6px!important}
  body.unified-shell #receipt-dialog .receipt-quantity-field{padding:7px!important;border-radius:11px!important}
  body.unified-shell #receipt-dialog .receipt-quantity-field input{height:48px!important;min-height:48px!important;margin-top:1px!important;font-size:1.25rem!important}
  body.unified-shell #receipt-dialog #receipt-defective-returned,
  body.unified-shell #receipt-dialog #receipt-unit-cost,
  body.unified-shell #receipt-dialog #receipt-paid{font-size:1rem!important}
  body.unified-shell #receipt-dialog .field-help{font-size:.61rem!important;line-height:1.32!important}
  body.unified-shell #receipt-dialog .receipt-empty-stock-state{padding:9px!important;border-radius:12px!important}
  body.unified-shell #receipt-dialog .receipt-empty-stock-state>span{font-size:.68rem!important}
  body.unified-shell #receipt-dialog .bottle-company-preview{min-height:44px!important;padding:8px 10px!important;border-radius:11px!important;font-size:.65rem!important}
  body.unified-shell #receipt-dialog .bottle-company-preview strong{font-size:.82rem!important}
  body.unified-shell #receipt-dialog .receipt-pack-toggle{padding:8px 9px!important;border-radius:11px!important;gap:8px!important}
  body.unified-shell #receipt-dialog .receipt-pack-toggle input{width:18px!important;height:18px!important;min-height:18px!important}
  body.unified-shell #receipt-dialog .receipt-pack-toggle strong{font-size:.72rem!important}
  body.unified-shell #receipt-dialog .receipt-pack-toggle small{font-size:.57rem!important}
  body.unified-shell #receipt-dialog .receipt-pack-grid,
  body.unified-shell #receipt-dialog .receipt-pack-cost-grid{grid-template-columns:1fr 1fr!important;gap:6px!important}
  body.unified-shell #receipt-dialog .receipt-payment-choice{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:7px!important;
    padding:8px!important;
    border-radius:11px!important;
  }
  body.unified-shell #receipt-dialog .receipt-payment-choice>div:first-child{gap:1px!important}
  body.unified-shell #receipt-dialog .receipt-payment-choice>div:first-child>span{display:none!important}
  body.unified-shell #receipt-dialog .receipt-payment-choice strong{font-size:.76rem!important}
  body.unified-shell #receipt-dialog .receipt-payment-shortcuts{display:grid!important;grid-template-columns:1fr 1fr!important;gap:4px!important}
  body.unified-shell #receipt-dialog .receipt-payment-shortcuts button{min-height:34px!important;padding:0 9px!important;font-size:.66rem!important}
  body.unified-shell #receipt-dialog .receipt-money-summary{grid-template-columns:1fr 1fr!important;gap:5px!important}
  body.unified-shell #receipt-dialog .receipt-money-summary .due{grid-column:1/-1!important}
  body.unified-shell #receipt-dialog .receipt-money-summary span{min-height:58px!important;padding:7px 9px!important;border-radius:11px!important}
  body.unified-shell #receipt-dialog .receipt-money-summary small{font-size:.50rem!important;letter-spacing:.05em!important}
  body.unified-shell #receipt-dialog .receipt-money-summary strong{font-size:.88rem!important}
  body.unified-shell #receipt-dialog .receipt-breakdown{padding:7px 9px!important;font-size:.66rem!important}

  /* Frequent actions always visible side-by-side, including <=430px. */
  body.unified-shell #delivery-dialog .dialog-actions,
  body.unified-shell #receipt-dialog .dialog-actions{
    position:sticky!important;
    bottom:-1px!important;
    z-index:8!important;
    display:grid!important;
    grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)!important;
    gap:7px!important;
    margin:0 -12px -12px!important;
    padding:8px 12px max(8px,env(safe-area-inset-bottom))!important;
    background:rgba(255,255,255,.98)!important;
    box-shadow:0 -8px 20px rgba(20,54,79,.08)!important;
  }
  body.unified-shell #delivery-dialog .dialog-actions .btn,
  body.unified-shell #receipt-dialog .dialog-actions .btn{min-height:44px!important;border-radius:11px!important;font-size:.78rem!important}
}

@media(max-width:430px){
  body.unified-shell #operations>.enterprise-page-head{grid-template-columns:minmax(0,1fr) 126px!important}
  body.unified-shell #operations>.enterprise-page-head input{width:126px!important;max-width:126px!important;height:40px!important;min-height:40px!important;padding-inline:7px!important;font-size:11px!important}
  body.unified-shell #operations>.enterprise-page-head h2{font-size:18px!important;line-height:1.1!important}
  body.unified-shell #operations>.enterprise-page-head small{font-size:8px!important;letter-spacing:.10em!important}
  body.unified-shell #operations>.enterprise-page-head .section-note{display:none!important}
}


/* =========================================================
   v3.95.0 — Company Daily-Only Lookup
   ========================================================= */
.company-day-only-panel{grid-template-columns:minmax(210px,.72fr) minmax(280px,1fr)!important;align-items:end!important;padding:13px 15px!important}
.company-day-only-controls{grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important;align-items:end!important}
.company-day-only-controls .company-date-field{min-width:0!important}
.company-day-only-controls .btn{min-width:92px!important}
.company-day-only-panel .company-period-heading strong{font-size:1.04rem!important}
@media(max-width:700px){
  .company-day-only-panel{grid-template-columns:1fr!important;gap:8px!important;padding:11px 12px!important}
  .company-day-only-controls{grid-template-columns:minmax(0,1fr) 82px!important;gap:7px!important}
  .company-day-only-controls input{height:42px!important;font-size:.82rem!important}
  .company-day-only-controls .btn{min-width:0!important;height:42px!important;min-height:42px!important;padding:0 7px!important;font-size:.68rem!important}
  .company-day-only-panel .company-period-heading{display:flex!important;align-items:end!important;justify-content:space-between!important;gap:10px!important}
  .company-day-only-panel .company-period-heading>span{white-space:nowrap!important;text-align:right!important}
}
@media(max-width:390px){
  .company-day-only-panel .company-period-heading{display:grid!important;grid-template-columns:1fr!important}
  .company-day-only-panel .company-period-heading>span{text-align:left!important}
}


/* =========================================================
   v4.00.0 — Order UX: "Xem đơn cần giao" + unified customer search picker
   ========================================================= */
.order-customer-picker{position:relative;display:grid;gap:5px;z-index:20}
.order-customer-search-label{display:grid;gap:7px}
.order-customer-search-box{display:grid;grid-template-columns:22px minmax(0,1fr) 34px;align-items:center;gap:5px;min-height:52px;border:1px solid #cddbe7;border-radius:13px;background:#fff;padding:0 8px;transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}
.order-customer-search-box:focus-within{border-color:#79b3ff;box-shadow:0 0 0 4px rgba(11,111,243,.09)}
.order-customer-picker.has-selection .order-customer-search-box{border-color:#a9ddc8;background:#f8fffb}
.order-customer-search-icon{display:grid;place-items:center;color:#6f8498;font-size:18px;font-weight:900}
.order-customer-search-box input{width:100%;height:50px!important;min-height:50px!important;border:0!important;border-radius:0!important;background:transparent!important;padding:0 2px!important;box-shadow:none!important;font:inherit}
.order-customer-search-box input::-webkit-search-cancel-button{display:none}
#order-customer-search-clear{display:none;width:30px;height:30px;border:0;border-radius:9px;background:#eef4f8;color:#647a8d;font-size:18px;line-height:1;cursor:pointer}
#order-customer-search-clear.is-visible{display:grid;place-items:center}
.order-customer-results{display:none;position:absolute;z-index:90;top:calc(100% + 5px);left:0;right:0;max-height:286px;overflow:auto;padding:6px;border:1px solid #cfe0eb;border-radius:14px;background:#fff;box-shadow:0 18px 42px rgba(20,57,89,.2)}
.order-customer-results.is-open{display:grid;gap:3px}
.order-customer-result{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:9px;width:100%;min-height:52px;border:0;border-radius:11px;background:#fff;padding:7px 8px;text-align:left;color:#172b3f;cursor:pointer}
.order-customer-result:hover,.order-customer-result:focus{outline:0;background:#f1f8ff}
.order-customer-result-avatar{display:grid;width:36px;height:36px;place-items:center;border-radius:11px;background:#eaf5ff;color:#0878ef;font-size:13px;font-weight:950}
.order-customer-result-copy{display:grid;gap:2px;min-width:0}.order-customer-result-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.order-customer-result-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#778b9e;font-size:9.5px!important;letter-spacing:0!important}
.order-customer-result-action{border-radius:8px;background:#edf6ff;padding:5px 7px;color:#0878ef;font-size:9px;font-weight:900}
.order-customer-empty{padding:14px 10px;text-align:center;color:#73879a;font-size:11px}
#order-go-deliveries{white-space:nowrap}
@media(max-width:560px){
  body.unified-shell #order-dialog.aquaflow-order-dialog{width:calc(100% - 8px)!important;max-height:calc(100dvh - 8px)!important;margin-block:4px!important;border-radius:20px 20px 12px 12px!important;overflow:auto!important}
  body.unified-shell #order-dialog #order-form{gap:9px!important;padding:12px 12px max(10px,env(safe-area-inset-bottom))!important}
  body.unified-shell #order-dialog .dialog-head{position:sticky!important;top:-12px!important;z-index:30!important;margin:0 -12px!important;padding:10px 12px 9px!important;background:rgba(255,255,255,.98)!important;backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important}
  body.unified-shell #order-dialog .dialog-head h2{font-size:1.22rem!important;line-height:1.08!important}
  body.unified-shell #order-dialog .dialog-head .muted{margin-top:4px!important;font-size:.63rem!important;line-height:1.35!important}
  body.unified-shell #order-dialog .order-customer-search-box{min-height:44px;border-radius:11px}
  body.unified-shell #order-dialog .order-customer-search-box input{height:42px!important;min-height:42px!important;font-size:.86rem!important}
  body.unified-shell #order-dialog .order-customer-results{max-height:248px;border-radius:12px}
  body.unified-shell #order-dialog .order-customer-result{min-height:48px;padding:6px 7px}
  body.unified-shell #order-dialog .dialog-actions{position:sticky!important;bottom:-1px!important;z-index:25!important;display:grid!important;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)!important;gap:7px!important;margin:0 -12px -12px!important;padding:8px 12px max(8px,env(safe-area-inset-bottom))!important;background:rgba(255,255,255,.98)!important;box-shadow:0 -8px 20px rgba(20,54,79,.08)!important}
  body.unified-shell #order-dialog .dialog-actions .btn{min-height:44px!important;border-radius:11px!important}
}


/* =========================================================
   v4.00.0 — Shared Unassigned Orders + First-Tap Claim
   Đơn chưa phân công hiển thị cho mọi nhân viên; người đầu tiên
   bấm Giao đơn sẽ nhận quyền phụ trách và đơn rời danh sách chung.
   ========================================================= */
.aquaflow-order-card.pending .order-card-meta span:last-child strong{font-weight:900}


/* v4.00.0 — New empty bottle auto-balance */
.inventory-card-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.inventory-inline-action{border:1px solid #b8dcff;background:#eef7ff;color:#0878dc;border-radius:999px;padding:9px 13px;font:800 .78rem/1.1 inherit;white-space:nowrap;cursor:pointer}
.inventory-inline-action:disabled{opacity:.45;cursor:not-allowed}
.new-empty-bottles-dialog form{max-width:620px}
.new-empty-bottles-current{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:8px 0 14px}
.new-empty-bottles-current span{display:flex;flex-direction:column;gap:6px;padding:14px;border:1px solid #cfe0ef;border-radius:18px;background:#f7fbff;color:#587188;font-weight:700}
.new-empty-bottles-current strong{font-size:1.35rem;color:#0f2942}
.new-empty-bottles-preview{display:flex;flex-direction:column;gap:5px;padding:14px 16px;margin:10px 0 14px;border:1px solid #bfe4d3;border-radius:18px;background:#f1fbf6}
.new-empty-bottles-preview strong{color:#087a52;font-size:1rem}
.new-empty-bottles-preview span{color:#60788d;font-size:.88rem;line-height:1.45}
@media(max-width:560px){.inventory-card-tools{gap:6px}.inventory-inline-action{padding:8px 10px;font-size:.72rem}.new-empty-bottles-current{grid-template-columns:1fr 1fr}.new-empty-bottles-dialog .dialog-actions{position:sticky;bottom:0;background:#fff;padding-top:10px}}

/* v4.00.0 — Free physical empty-bottle reconciliation */
.vehicle-empty-actual-dialog .vehicle-empty-adjustment-note{margin-bottom:2px}
.vehicle-empty-actual-dialog .vehicle-empty-balance-strip strong{font-variant-numeric:tabular-nums}
.vehicle-empty-actual-dialog #vehicle-empty-adjustment-delta{color:#0878dc}
@media(max-width:560px){
  #operation-inventory .inventory-card-tools{justify-content:flex-start}
  #operation-inventory .inventory-inline-action{padding:7px 9px;font-size:.68rem}
  .vehicle-empty-actual-dialog .dialog-actions{position:sticky;bottom:0;background:#fff;padding-top:10px}
}

/* 4.01.1 — Employee goods total + new debt */
.staff-mode .staff-money-primary .staff-goods-total { background: #eef7ff; border-color: #cfe4f7; }
.staff-mode .staff-money-primary .staff-goods-total strong { color: var(--employee-blue-dark); }
.staff-mode .staff-money-primary .staff-new-debt { background: #fff8e8; border-color: #f1dfae; }
.staff-mode .staff-money-primary .staff-new-debt strong { color: #a45a00; }

/* =========================================================
   4.01.1 UI Fix — Employee mobile debt layout
   ========================================================= */
.staff-mode .debt-hero > div:first-child { min-width: 0; }
.staff-mode .debt-hero #debt-total { max-width:100%; white-space:nowrap; word-break:keep-all; overflow-wrap:normal; font-variant-numeric:tabular-nums; letter-spacing:-.035em; line-height:1.06; }
.staff-mode .debt-hero .debt-actions { min-width:0; }
.staff-mode #debt-list .debtor > div:first-child strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media(max-width:980px){
  body[data-role="staff"] .tabs{overflow-x:hidden!important}
  body[data-role="staff"] .tabs .tab:not([hidden]){flex:1 1 0!important;width:auto!important;min-width:0!important;max-width:none!important}
}
@media(max-width:520px){
  .staff-mode .debt-hero{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:9px;min-height:128px;padding:15px 14px}
  .staff-mode .debt-hero small{font-size:.69rem;line-height:1.35;letter-spacing:.09em}
  .staff-mode .debt-hero #debt-total{margin-top:7px;font-size:clamp(1.38rem,6.5vw,1.62rem)}
  .staff-mode .debt-hero p{margin-top:7px;font-size:.74rem;line-height:1.35}
  .staff-mode .debt-hero .debt-actions .btn{width:auto;min-width:106px;min-height:44px;padding:0 10px;border-radius:13px;font-size:.72rem}
  .staff-mode .debt-search-panel{grid-template-columns:minmax(0,1fr) auto;gap:7px;padding:8px}
  .staff-mode .debt-search-panel .employee-search-box{height:46px;padding-left:10px;border-radius:13px}
  .staff-mode .debt-search-panel .employee-search-box>span{font-size:1.2rem}
  .staff-mode .debt-search-panel .employee-search-box input{height:44px;padding:0 7px;font-size:.9rem}
  .staff-mode .debt-search-panel .employee-search-count{min-width:60px;padding:8px 9px;font-size:.67rem}
  .staff-mode #debt-list{gap:9px}
  .staff-mode #debt-list .debtor{min-height:80px;gap:8px;padding:11px 12px;border-radius:16px}
  .staff-mode #debt-list .debtor>div:first-child{max-width:calc(100% - 118px)}
  .staff-mode #debt-list .debtor>div:first-child strong{font-size:.88rem}
  .staff-mode #debt-list .debtor .muted{margin-top:4px;font-size:.7rem}
  .staff-mode #debt-list .debtor>div:last-child{gap:6px}
  .staff-mode #debt-list .debtor>div:last-child>strong{font-size:.82rem;font-variant-numeric:tabular-nums}
  .staff-mode #debt-list .debtor .edit{min-width:76px;min-height:38px;padding:0 11px;border-radius:11px;font-size:.7rem}
}
@media(max-width:380px){
  .staff-mode .debt-hero{grid-template-columns:minmax(0,1fr) 98px;gap:7px;padding:14px 12px}
  .staff-mode .debt-hero #debt-total{font-size:1.32rem}
  .staff-mode .debt-hero .debt-actions .btn{width:98px;min-width:98px;padding:0 7px;font-size:.68rem}
}


/* 4.01.5 — Phiếu công ty nhìn thấy ngay bình nhận + vỏ trả */
#company .receipt-physical-summary{display:flex;flex-wrap:wrap;gap:5px;margin-top:1px}
#company .receipt-physical-summary span{display:inline-flex;align-items:center;gap:3px;min-height:24px;padding:4px 7px;border:1px solid #dbe8f1;border-radius:999px;background:#f7fbfe;color:#5d7387;font-size:.62rem;font-weight:800;line-height:1}
#company .receipt-physical-summary b{font-size:.72rem;color:#173651;font-variant-numeric:tabular-nums}
#company .receipt-physical-summary .full{border-color:#cfe8dd;background:#f1faf6;color:#27735d}
#company .receipt-physical-summary .full b{color:#087957}
#company .receipt-physical-summary .empty{border-color:#d4e4f4;background:#f1f7ff;color:#4d6f95}
#company .receipt-physical-summary .empty b{color:#356db7}
#company .receipt-physical-summary .defective{border-color:#f0dcc9;background:#fff8f1;color:#9a642f}
#company .receipt-physical-summary .defective b{color:#ba6a25}
@media(max-width:760px){#company .receipt-item-summary{min-height:96px}#company .receipt-physical-summary span{min-height:22px;padding:3px 6px;font-size:.56rem}#company .receipt-physical-summary b{font-size:.66rem}}


/* 4.01.5 — Employee Android/iPhone parity + delivery payment choice */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body[data-role="staff"]{overflow-x:hidden}
.staff-mode :is(button,input,select,textarea){font-family:inherit}
.staff-mode :is(input,select,textarea){min-width:0;max-width:100%}
.staff-mode select{-webkit-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,#5f7488 50%),linear-gradient(135deg,#5f7488 50%,transparent 50%)!important;background-position:calc(100% - 17px) 50%,calc(100% - 12px) 50%!important;background-size:5px 5px,5px 5px!important;background-repeat:no-repeat!important;padding-right:34px!important}
.staff-mode .delivery-payment-shortcuts button{min-height:42px;border:1px solid #cdddea;background:#f6f9fc;color:#48657d;transition:background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease}
.staff-mode .delivery-payment-shortcuts button.is-active{border-color:#74b8f2;background:#eaf5ff;color:#0878ef;box-shadow:inset 0 0 0 1px rgba(8,120,239,.08)}
.staff-mode .delivery-payment-shortcuts button[data-paid="0"].is-active{border-color:#e7c7a1;background:#fff7e9;color:#a05c0d}
.staff-mode #bottle-quantity:placeholder-shown,.staff-mode #delivery-returned-bottles:placeholder-shown{border-style:dashed!important;background:#fbfdff!important}
@media(max-width:980px){body[data-role="staff"] .shell{width:100%!important;max-width:none!important}body[data-role="staff"] .header,body[data-role="staff"] .view,body[data-role="staff"] .tabs{max-width:100vw!important}.staff-mode dialog{max-width:100vw!important}.staff-mode dialog form{width:100%;min-width:0}.staff-mode dialog .two>*{min-width:0}.staff-mode input[type="date"],.staff-mode input[type="time"]{width:100%;min-width:0;line-height:normal}.staff-mode .dialog-actions{padding-bottom:max(10px,env(safe-area-inset-bottom))}}
@media(max-width:520px){.staff-mode #delivery-dialog .delivery-payment-head{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important}.staff-mode #delivery-dialog .delivery-payment-shortcuts{display:grid!important;grid-template-columns:1fr 1fr!important;gap:5px!important}.staff-mode #delivery-dialog .delivery-payment-shortcuts button{min-width:72px!important;padding:0 8px!important;font-size:.72rem!important}.staff-mode #delivery-dialog .delivery-payment-fields{grid-template-columns:1fr 1fr!important;gap:7px!important}}
@supports(height:100svh){@media(max-width:700px){.staff-mode dialog{max-height:calc(100svh - max(6px,env(safe-area-inset-top)))!important}}}

/* v4.01.5 - đối soát bình đầy trên xe */
.vehicle-full-target{display:grid;gap:4px;align-content:center;min-height:74px;padding:10px 12px;border:1px solid #cfe2f1;border-radius:14px;background:#f7fbfe}
.vehicle-full-target small{font-size:.65rem;font-weight:800;letter-spacing:.08em;color:#6a8295}
.vehicle-full-target strong{font-size:1.35rem;color:#0e76d9;font-variant-numeric:tabular-nums}
#vehicle-full-adjustment-dialog .dialog-actions{background:#fff}
@media(max-width:560px){#vehicle-full-adjustment-dialog{width:calc(100% - 12px);max-height:94dvh;border-radius:22px 22px 14px 14px}#vehicle-full-adjustment-dialog form{gap:11px;padding:14px 14px max(12px,env(safe-area-inset-bottom))}#vehicle-full-adjustment-dialog .dialog-actions{position:sticky;bottom:-1px;z-index:3;margin:0 -14px -14px;padding:10px 14px max(10px,env(safe-area-inset-bottom));box-shadow:0 -8px 20px rgba(20,54,79,.08)}#vehicle-full-adjustment-dialog .dialog-actions .btn{min-height:44px}}

/* 4.01.6 — Vehicle Full Adjust: modal dùng chung hệ thống đối soát thực tế */
#vehicle-full-adjustment-dialog #vehicle-full-adjustment-delta{font-variant-numeric:tabular-nums}
#vehicle-full-adjustment-dialog #vehicle-full-after{font-variant-numeric:tabular-nums}

/* 4.01.7 — Debt By Order */
.debt-lot-actions {
  display:flex;
  justify-content:flex-end;
  margin-top:11px;
}
.debt-lot-actions .btn {
  min-height:40px;
  padding:9px 14px;
  border-radius:12px;
  font-size:13px;
}
.payment-target-preview {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.payment-target-preview span { color:#708197; }
.payment-target-preview strong { white-space:nowrap; }
@media (max-width:520px) {
  .debt-lot-actions .btn { width:100%; }
  #payment-target { font-size:16px; }
}

/* 4.01.8 — Bảng lương theo từng ngày trong tháng */
.payroll-day-details{margin-top:12px;border:1px solid #d8e7f1;border-radius:15px;background:#fff;overflow:hidden}
.payroll-day-details>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:54px;padding:10px 12px;list-style:none;cursor:pointer;background:linear-gradient(135deg,#eef8ff,#f9fcff);-webkit-tap-highlight-color:transparent}
.payroll-day-details>summary::-webkit-details-marker{display:none}
.payroll-day-details>summary::marker{display:none;content:""}
.payroll-day-details>summary span{display:grid;gap:2px;min-width:0}
.payroll-day-details>summary b{color:#173651;font-size:12px}
.payroll-day-details>summary small{color:#718196;font-size:9px;font-weight:750}
.payroll-day-details>summary>strong{color:#0878ef;font-size:13px;white-space:nowrap}
.payroll-day-ledger{border-top:1px solid #dfeaf1;background:#fff}
.payroll-day-head,.payroll-day-row,.payroll-day-total{display:grid;grid-template-columns:112px minmax(92px,1fr) 132px;align-items:center;column-gap:10px}
.payroll-day-head{padding:8px 12px;background:#f4f8fb;color:#718196;font-size:8px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.payroll-day-head span:last-child{text-align:right}
.payroll-day-row{position:relative;min-height:49px;padding:8px 12px;border-top:1px solid #edf2f5}
.payroll-day-row:first-of-type{border-top:0}
.payroll-day-date{color:#284963;font-size:10px;font-weight:850}
.payroll-day-bottles{display:flex;align-items:baseline;gap:2px;color:#173651;white-space:nowrap}
.payroll-day-bottles b{font-size:13px}
.payroll-day-bottles small{color:#718196;font-size:9px}
.payroll-day-row>strong{color:#0878ef;font-size:11px;text-align:right;white-space:nowrap}
.payroll-day-row>em{grid-column:1/-1;margin-top:2px;color:#8292a2;font-size:8px;font-style:normal}
.payroll-day-row.is-zero{min-height:38px;background:#fbfcfd;opacity:.6}
.payroll-day-row.is-zero>em{display:none}
.payroll-day-total{padding:11px 12px;border-top:2px solid #cfe2ef;background:#edf8ff}
.payroll-day-total span{color:#0878ef;font-size:9px;font-weight:950;letter-spacing:.06em}
.payroll-day-total b{color:#173651;font-size:11px}
.payroll-day-total strong{color:#0878ef;font-size:13px;text-align:right;white-space:nowrap}
@media(max-width:560px){
  .payroll-day-head,.payroll-day-row,.payroll-day-total{grid-template-columns:82px minmax(74px,1fr) 112px;column-gap:7px}
  .payroll-day-details>summary{padding:9px 10px}
  .payroll-day-head,.payroll-day-row,.payroll-day-total{padding-left:10px;padding-right:10px}
  .payroll-day-date{font-size:9px}
  .payroll-day-bottles b{font-size:12px}
  .payroll-day-row>strong{font-size:10px}
  .payroll-day-row>em{font-size:7.5px}
}
@media(max-width:380px){
  .payroll-day-head,.payroll-day-row,.payroll-day-total{grid-template-columns:72px minmax(66px,1fr) 100px;column-gap:5px}
  .payroll-day-bottles small{font-size:8px}
  .payroll-day-total strong{font-size:11px}
}

/* 4.01.9 — Weekly assistant payroll + compact daily report */
.payroll-report-stack{grid-template-columns:1fr!important;gap:18px!important}
.compact-section-head{margin-bottom:9px!important}
.compact-section-head h2{margin-top:2px}
.weekly-assistant-section,.compact-report-section{min-width:0}
.weekly-payroll-list,.compact-daily-list{display:grid;gap:8px}
.weekly-payroll-card,.daily-compact-row,.daily-payroll-compact{overflow:hidden;border:1px solid #d9e7f0;border-radius:16px;background:#fff;box-shadow:0 5px 16px #33415508}
.weekly-payroll-card>summary,.daily-payroll-compact>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:58px;padding:10px 13px;list-style:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.weekly-payroll-card>summary::-webkit-details-marker,.daily-payroll-compact>summary::-webkit-details-marker,.daily-compact-row>summary::-webkit-details-marker{display:none}
.weekly-payroll-card>summary::marker,.daily-payroll-compact>summary::marker,.daily-compact-row>summary::marker{content:""}
.weekly-payroll-card>summary{background:linear-gradient(135deg,#edf8ff,#f9fcff)}
.weekly-payroll-card>summary span,.daily-payroll-compact>summary span{display:grid;gap:2px;min-width:0}
.weekly-payroll-card>summary small{color:#0878ef;font-size:8px;font-weight:950;letter-spacing:.1em}
.weekly-payroll-card>summary b{color:#173651;font-size:12px}
.weekly-payroll-card>summary>strong{color:#0878ef;font-size:15px;white-space:nowrap}
.weekly-payroll-body{border-top:1px solid #deebf2}
.weekly-payroll-person{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 13px;border-top:1px solid #edf2f5}
.weekly-payroll-person:first-child{border-top:0}
.weekly-payroll-person>div{min-width:0}
.weekly-payroll-person>div>strong{display:block;color:#173651;font-size:12px}
.weekly-payroll-person small{display:block;margin-top:2px;color:#718196;font-size:9px;line-height:1.35}
.weekly-payroll-person>strong{color:#0878ef;font-size:12px;white-space:nowrap}
.weekly-payroll-body footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 13px;border-top:1px solid #d5e7f2;background:#f3f9fd}
.weekly-payroll-body footer span{color:#64788c;font-size:10px;font-weight:800}
.weekly-payroll-body footer strong{color:#0878ef;font-size:13px;white-space:nowrap}

.daily-compact-row>summary{display:grid;grid-template-columns:minmax(95px,1.25fr) minmax(70px,.8fr) minmax(70px,.8fr) minmax(72px,.8fr);align-items:center;column-gap:8px;min-height:52px;padding:8px 12px;list-style:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.daily-compact-row>summary>span:not(.daily-compact-date){display:grid;gap:1px}
.daily-compact-row>summary small{color:#8a99a8;font-size:7px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.daily-compact-row>summary b{color:#36546d;font-size:10px;white-space:nowrap}
.daily-compact-date{color:#173651;font-size:11px;font-weight:900;white-space:nowrap}
.daily-compact-row>summary>strong{text-align:right;font-size:11px;white-space:nowrap}
.daily-compact-row[open]>summary{background:#f7fbfe}
.compact-expanded{grid-template-columns:repeat(2,minmax(0,1fr))!important;padding:9px 12px!important}
.compact-expanded span{font-size:9px!important}

.daily-payroll-compact>summary{min-height:54px;background:#fbfdff}
.daily-payroll-compact>summary b{color:#173651;font-size:11px}
.daily-payroll-compact>summary small{color:#8292a2;font-size:8px}
.daily-payroll-compact>summary>strong{color:#0878ef;font-size:12px;white-space:nowrap}
.daily-payroll-compact[open]>summary{background:#edf8ff}
.daily-payroll-compact-body{border-top:1px solid #e0ebf2}
.daily-payroll-compact-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border-top:1px solid #edf2f5}
.daily-payroll-compact-row:first-child{border-top:0}
.daily-payroll-compact-row>div{min-width:0}
.daily-payroll-compact-row>div>strong{display:block;color:#173651;font-size:11px}
.daily-payroll-compact-row small{display:block;margin-top:2px;color:#718196;font-size:8.5px;line-height:1.35}
.daily-payroll-compact-row>strong{color:#0878ef;font-size:11px;white-space:nowrap}

@media(max-width:560px){
  #reports .report-details{padding-left:10px;padding-right:10px}
  .payroll-report-stack{gap:15px!important}
  .weekly-payroll-card,.daily-compact-row,.daily-payroll-compact{border-radius:14px}
  .weekly-payroll-card>summary,.daily-payroll-compact>summary{min-height:54px;padding:9px 11px}
  .weekly-payroll-card>summary b{font-size:11px}
  .weekly-payroll-card>summary>strong{font-size:13px}
  .weekly-payroll-person,.weekly-payroll-body footer{padding:9px 11px}
  .daily-compact-row>summary{grid-template-columns:90px minmax(58px,.7fr) minmax(58px,.7fr) minmax(64px,.8fr);column-gap:5px;padding:7px 10px;min-height:48px}
  .daily-compact-date{font-size:10px}
  .daily-compact-row>summary b,.daily-compact-row>summary>strong{font-size:9.5px}
  .compact-expanded{padding:8px 10px!important}
  .daily-payroll-compact-row{padding:8px 10px}
}

@media(max-width:390px){
  .daily-compact-row>summary{grid-template-columns:84px minmax(52px,.65fr) minmax(52px,.65fr) minmax(58px,.75fr);column-gap:4px}
  .daily-compact-row>summary small{font-size:6.5px}
  .daily-compact-row>summary b,.daily-compact-row>summary>strong{font-size:9px}
  .weekly-payroll-person small{font-size:8px}
}


/* 4.02.0 — Enterprise Payroll Center: one payroll surface for month → week → day */
.enterprise-payroll-center{min-width:0;border:1px solid #d6e6f1;border-radius:24px;background:linear-gradient(180deg,#f7fbff 0,#fff 150px);padding:18px;box-shadow:0 12px 32px #244c6a0b}
.payroll-enterprise-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:13px}.payroll-enterprise-head>div{min-width:0}.payroll-enterprise-head small{color:#0878ef;font-size:9px;font-weight:950;letter-spacing:.14em}.payroll-enterprise-head h2{margin:3px 0 2px;color:#122f49;font-size:22px;line-height:1.12}.payroll-enterprise-head .section-note{margin:0;color:#6f8193;font-size:10px;line-height:1.45}.payroll-enterprise-head .period-badge{flex:0 0 auto}
.payroll-enterprise-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:10px}.payroll-enterprise-kpis article{display:grid;align-content:center;min-width:0;min-height:82px;border:1px solid #deebf3;border-radius:16px;background:#fff;padding:11px 12px;box-shadow:0 5px 16px #33415507}.payroll-enterprise-kpis article:nth-child(2){background:linear-gradient(145deg,#edf8ff,#fff)}.payroll-enterprise-kpis small{overflow:hidden;color:#7a8ea2;font-size:7.5px;font-weight:950;letter-spacing:.08em;white-space:nowrap;text-overflow:ellipsis}.payroll-enterprise-kpis strong{display:block;overflow:hidden;margin-top:5px;color:#0878ef;font-size:17px;font-weight:950;white-space:nowrap;text-overflow:ellipsis}.payroll-enterprise-kpis span{display:block;overflow:hidden;margin-top:2px;color:#6f8193;font-size:8.5px;white-space:nowrap;text-overflow:ellipsis}
.payroll-enterprise-note{margin-bottom:11px;border-left:3px solid #1687f5;border-radius:10px;background:#f1f8fe;padding:9px 11px;color:#62788d;font-size:9.5px;line-height:1.45}.payroll-enterprise-note b{color:#244966}
.enterprise-payroll-list{display:grid;gap:9px}.enterprise-payroll-person{overflow:hidden;border:1px solid #d9e6ef;border-radius:18px;background:#fff;box-shadow:0 5px 18px #33415508}.enterprise-payroll-person.status-paid{border-color:#b9e7d4}.enterprise-payroll-person.status-changed{border-color:#f2b7ba}
.enterprise-payroll-person-summary{display:grid;grid-template-columns:34px minmax(0,1.2fr) minmax(100px,.65fr) minmax(120px,.75fr);align-items:center;gap:10px;min-height:78px;padding:0 13px 0 0;list-style:none;cursor:pointer;-webkit-tap-highlight-color:transparent}.enterprise-payroll-person-summary::-webkit-details-marker{display:none}.enterprise-payroll-person-summary::marker{content:""}.enterprise-payroll-person[open]>.enterprise-payroll-person-summary{background:#fbfdff;border-bottom:1px solid #e2edf4}
.enterprise-payroll-rank{display:grid;align-self:stretch;place-items:center;background:#eef8ff;color:#0878ef;font-size:15px;font-weight:950}.enterprise-payroll-person-copy{display:grid;gap:5px;min-width:0}.enterprise-payroll-person-copy>strong{overflow:hidden;color:#173651;font-size:17px;line-height:1.1;white-space:nowrap;text-overflow:ellipsis}.enterprise-payroll-person-copy>small{display:flex;align-items:center;gap:5px;min-width:0}.payroll-role-chip{display:inline-flex;width:max-content;border-radius:999px;background:#eef6fd;padding:4px 7px;color:#486b89;font-size:7.5px;font-style:normal;font-weight:900}.enterprise-payroll-person-copy .payroll-status{padding:4px 7px;font-size:7.5px}
.enterprise-payroll-person-volume{display:grid;justify-items:end;gap:3px;min-width:0}.enterprise-payroll-person-volume>b{color:#315875;font-size:12px;white-space:nowrap}.enterprise-payroll-person-volume>small{color:#8293a4;font-size:8px;white-space:nowrap}.enterprise-payroll-person-total{display:grid;justify-items:end;gap:3px;min-width:0}.enterprise-payroll-person-total>strong{color:#0878ef;font-size:17px;font-weight:950;white-space:nowrap}.enterprise-payroll-person-total>small{color:#8394a5;font-size:7.5px;white-space:nowrap}
.enterprise-payroll-person-body{display:grid;gap:11px;padding:12px 13px 14px;background:#fcfeff}.enterprise-payroll-person-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.enterprise-payroll-person-kpis span{display:grid;gap:3px;min-width:0;border-radius:11px;background:#f3f7fa;padding:8px;text-align:center}.enterprise-payroll-person-kpis small{color:#8092a4;font-size:7px;font-weight:950;letter-spacing:.07em}.enterprise-payroll-person-kpis b{overflow:hidden;color:#173651;font-size:11px;white-space:nowrap;text-overflow:ellipsis}.enterprise-payroll-role-split{display:grid;grid-template-columns:1fr 1fr;gap:6px}.enterprise-payroll-role-split span{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid #e1ebf2;border-radius:10px;background:#fff;padding:8px 10px;color:#708398;font-size:9px}.enterprise-payroll-role-split b{color:#274964;font-size:10px;white-space:nowrap}
.enterprise-payroll-subhead{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;padding-top:2px}.enterprise-payroll-subhead>div{display:grid;gap:2px}.enterprise-payroll-subhead small{color:#0878ef;font-size:7.5px;font-weight:950;letter-spacing:.12em}.enterprise-payroll-subhead strong{color:#173651;font-size:13px}.enterprise-payroll-subhead>span{color:#8998a7;font-size:8px;text-align:right}
.payroll-week-ledger{display:grid;gap:7px}.payroll-week-card,.payroll-sunday-card{overflow:hidden;border:1px solid #d9e6ef;border-radius:14px;background:#fff}.payroll-week-card>summary,.payroll-sunday-card>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:54px;padding:9px 11px;list-style:none;cursor:pointer;-webkit-tap-highlight-color:transparent}.payroll-week-card>summary::-webkit-details-marker,.payroll-sunday-card>summary::-webkit-details-marker{display:none}.payroll-week-card>summary::marker,.payroll-sunday-card>summary::marker{content:""}.payroll-week-card[open]>summary{background:linear-gradient(135deg,#edf8ff,#f9fcff);border-bottom:1px solid #dceaf3}.payroll-week-card>summary>span:first-child,.payroll-sunday-card>summary>span:first-child{display:grid;gap:2px;min-width:0}.payroll-week-card>summary>span:first-child small{color:#0878ef;font-size:7px;font-weight:950;letter-spacing:.09em}.payroll-week-card>summary>span:first-child b,.payroll-sunday-card>summary b{color:#244966;font-size:10px}.payroll-week-summary-meta{display:grid;justify-items:end;gap:2px}.payroll-week-summary-meta small{color:#7b8ea0;font-size:7.5px}.payroll-week-summary-meta strong,.payroll-sunday-card>summary>strong{color:#0878ef;font-size:12px;white-space:nowrap}
.payroll-week-days{display:grid}.payroll-week-day{display:grid;grid-template-columns:56px minmax(0,1fr) 106px;align-items:center;gap:8px;min-height:48px;padding:7px 10px;border-top:1px solid #edf2f6}.payroll-week-day:first-child{border-top:0}.payroll-week-day.is-zero{min-height:39px;background:#fbfcfd;opacity:.55}.payroll-week-date{display:flex;align-items:center;gap:5px}.payroll-week-date b{display:grid;width:26px;height:26px;place-items:center;border-radius:8px;background:#edf7ff;color:#0878ef;font-size:9px}.payroll-week-date small{color:#718598;font-size:8px}.payroll-week-volume{display:grid;gap:2px;min-width:0}.payroll-week-volume b{overflow:hidden;color:#264a66;font-size:9.5px;white-space:nowrap;text-overflow:ellipsis}.payroll-week-volume small{overflow:hidden;color:#7e8fa0;font-size:7.8px;white-space:nowrap;text-overflow:ellipsis}.payroll-week-day>strong{color:#0878ef;font-size:10px;text-align:right;white-space:nowrap}.payroll-week-day.is-zero>strong{color:#9aa8b5}.payroll-week-days>footer{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:9px;padding:9px 10px;border-top:1px solid #d7e6ef;background:#f2f8fc}.payroll-week-days>footer span{color:#536f85;font-size:8.5px;font-weight:900}.payroll-week-days>footer b{color:#607b90;font-size:8.5px;white-space:nowrap}.payroll-week-days>footer strong{color:#0878ef;font-size:11px;white-space:nowrap}.payroll-empty-week{border:1px dashed #cfdee9;border-radius:12px;padding:12px;color:#7c8ea0;font-size:9px;text-align:center}
.payroll-sunday-card{border-style:dashed}.payroll-sunday-card>summary small{color:#8b99a7;font-size:8px}.enterprise-payroll-reconcile{border-top:1px dashed #dce7ef;padding-top:8px}.enterprise-payroll-reconcile>summary{color:#59738a;font-size:9px;font-weight:850;cursor:pointer}.enterprise-payroll-reconcile .payroll-trip{padding-left:0;padding-right:0}.enterprise-payroll-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #e3edf3;padding-top:10px}.enterprise-payroll-actions>small{max-width:55%;color:#778a9b;font-size:8px;line-height:1.4}.enterprise-payroll-actions>div{display:flex;gap:6px;justify-content:flex-end}.enterprise-payroll-actions .btn{min-height:34px;padding:7px 10px;font-size:9px}
@media(max-width:620px){
  #reports .enterprise-payroll-details{padding-left:8px;padding-right:8px}.enterprise-payroll-center{border-radius:19px;padding:11px}.payroll-enterprise-head{margin-bottom:10px}.payroll-enterprise-head h2{font-size:19px}.payroll-enterprise-head .section-note{font-size:9px}.payroll-enterprise-head .period-badge{padding:7px 9px;font-size:9px}.payroll-enterprise-kpis{gap:5px}.payroll-enterprise-kpis article{min-height:70px;border-radius:13px;padding:8px}.payroll-enterprise-kpis small{font-size:6.5px}.payroll-enterprise-kpis strong{font-size:13px}.payroll-enterprise-kpis span{font-size:7px}.payroll-enterprise-note{font-size:8.5px;padding:8px 9px}
  .enterprise-payroll-person{border-radius:15px}.enterprise-payroll-person-summary{grid-template-columns:28px minmax(0,1fr) auto;gap:7px;min-height:70px;padding-right:9px}.enterprise-payroll-rank{font-size:13px}.enterprise-payroll-person-copy>strong{font-size:15px}.enterprise-payroll-person-volume{display:none}.enterprise-payroll-person-total>strong{font-size:14px}.enterprise-payroll-person-total>small{font-size:7px}.payroll-role-chip,.enterprise-payroll-person-copy .payroll-status{padding:3px 5px;font-size:6.8px}.enterprise-payroll-person-body{gap:9px;padding:9px}.enterprise-payroll-person-kpis{gap:4px}.enterprise-payroll-person-kpis span{padding:7px 4px}.enterprise-payroll-person-kpis small{font-size:6.2px}.enterprise-payroll-person-kpis b{font-size:9px}.enterprise-payroll-role-split span{padding:7px 8px;font-size:8px}.enterprise-payroll-role-split b{font-size:8.5px}.enterprise-payroll-subhead strong{font-size:11px}.enterprise-payroll-subhead>span{display:none}
  .payroll-week-card>summary,.payroll-sunday-card>summary{min-height:50px;padding:8px 9px}.payroll-week-card>summary>span:first-child b,.payroll-sunday-card>summary b{font-size:9px}.payroll-week-summary-meta strong,.payroll-sunday-card>summary>strong{font-size:10.5px}.payroll-week-day{grid-template-columns:50px minmax(0,1fr) 92px;gap:6px;min-height:45px;padding:6px 8px}.payroll-week-date b{width:23px;height:23px;font-size:8px}.payroll-week-date small{font-size:7px}.payroll-week-volume b{font-size:8.5px}.payroll-week-volume small{font-size:7px}.payroll-week-day>strong{font-size:9px}.payroll-week-days>footer{gap:6px;padding:8px}.payroll-week-days>footer span,.payroll-week-days>footer b{font-size:7.5px}.payroll-week-days>footer strong{font-size:9.5px}.enterprise-payroll-actions{align-items:stretch;flex-direction:column}.enterprise-payroll-actions>small{max-width:none}.enterprise-payroll-actions>div{justify-content:stretch}.enterprise-payroll-actions .btn{flex:1}
}
@media(max-width:380px){.payroll-enterprise-kpis article:nth-child(3){display:none}.payroll-enterprise-kpis{grid-template-columns:1fr 1fr}.payroll-week-day{grid-template-columns:46px minmax(0,1fr) 82px}.payroll-week-day>strong{font-size:8.5px}}

/* 4.02.1 — Enterprise Debt Collection / Mẫu 3 */
.payment-enterprise-dialog{
  width:min(760px,calc(100% - 24px));
  max-height:94dvh;
  border-radius:28px;
  background:#fff;
  box-shadow:0 30px 90px rgba(15,39,67,.28);
}
.payment-enterprise-form{gap:16px!important;padding:22px!important;background:linear-gradient(180deg,#fff 0,#fbfdff 100%)}
.payment-enterprise-head{align-items:flex-start}
.payment-enterprise-head h2{font-size:1.55rem;letter-spacing:-.03em;color:#10253e}
.payment-enterprise-head p{margin:6px 0 0;color:#71839a;font-size:.82rem;font-weight:550}
.payment-customer-select{margin-top:-2px}
.payment-customer-card{
  display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:13px;align-items:center;
  padding:14px 16px;border:1px solid #d9e8f4;border-radius:18px;background:linear-gradient(135deg,#f8fcff,#fff);
  box-shadow:0 8px 20px rgba(30,84,128,.05)
}
.payment-customer-avatar{display:grid;width:52px;height:52px;place-items:center;border-radius:50%;background:linear-gradient(145deg,#41b4ff,#0878ef);color:#fff;font-size:1.25rem;font-weight:900;box-shadow:0 8px 18px rgba(8,120,239,.24)}
.payment-customer-copy{min-width:0}
.payment-customer-copy strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#10253e;font-size:1rem}
.payment-customer-copy small{display:block;margin-top:3px;color:#6d8198;font-weight:700}
.payment-customer-copy p{margin:4px 0 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#7c8da0;font-size:.72rem}
.payment-customer-balance{min-width:150px;padding-left:15px;border-left:1px solid #dce8f1;text-align:right}
.payment-customer-balance span{display:block;color:#78899e;font-size:.72rem}
.payment-customer-balance strong{display:block;margin-top:4px;color:#dc2431;font-size:1.18rem;white-space:nowrap}
.payment-mode-tabs,.payment-method-tabs{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid #cfe1ee;border-radius:14px;background:#f8fbfd;overflow:hidden}
.payment-mode-tabs button,.payment-method-tabs button{min-height:48px;border:0;border-right:1px solid #d9e6ef;background:transparent;color:#35516e;font-weight:800;cursor:pointer}
.payment-mode-tabs button:last-child,.payment-method-tabs button:last-child{border-right:0}
.payment-mode-tabs button.active,.payment-method-tabs button.active{background:linear-gradient(135deg,#138cff,#066ee7);color:#fff;box-shadow:inset 0 -1px 0 rgba(0,0,0,.04)}
.payment-amount-section{padding:0}
.payment-amount-section label{gap:8px}
.payment-amount-input{display:grid;grid-template-columns:1fr 48px;border:1px solid #bdd9eb;border-radius:14px;overflow:hidden;background:#fff}
.payment-amount-input input{height:56px;border:0;border-radius:0;font-size:1.25rem;font-weight:900;color:#10253e;box-shadow:none!important}
.payment-amount-input b{display:grid;place-items:center;border-left:1px solid #dbe8f1;color:#4a6078;background:#f8fbfd}
.payment-quick-amounts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:9px}
.payment-quick-amounts button{min-height:38px;border:1px solid #cfe1ee;border-radius:11px;background:#fff;color:#41607c;font-size:.76rem;font-weight:800;cursor:pointer}
.payment-quick-amounts button:active{border-color:#1689f7;background:#eef7ff;color:#0878ef}
.payment-method-section{display:grid;gap:8px;color:#26394f;font-size:13px;font-weight:800}
.payment-method-native{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.payment-method-tabs button{position:relative}
.payment-method-tabs button span{display:none;margin-left:6px}
.payment-method-tabs button.active span{display:inline}
.payment-order-panel{border:1px solid #d9e6ef;border-radius:17px;overflow:hidden;background:#fff}
.payment-order-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 14px;background:#f8fbfe;border-bottom:1px solid #e1ebf2}
.payment-order-heading>div{display:grid;gap:2px}
.payment-order-heading strong{color:#10253e;font-size:.9rem}
.payment-order-heading small{color:#71849a;font-size:.7rem}
.payment-order-heading label{display:flex;grid-auto-flow:column;align-items:center;gap:7px;color:#0878ef;font-size:.74rem;white-space:nowrap}
.payment-order-heading input{width:18px;height:18px;padding:0;border-radius:5px}
.payment-order-table-head,.payment-order-row{display:grid;grid-template-columns:36px minmax(140px,1.4fr) 105px 105px 125px;gap:8px;align-items:center}
.payment-order-table-head{padding:9px 12px;background:#edf6fd;color:#647d96;font-size:.62rem;font-weight:900;text-transform:uppercase;letter-spacing:.04em}
.payment-order-row{min-height:62px;padding:9px 12px;border-top:1px solid #e5edf3;cursor:pointer}
.payment-order-row:first-child{border-top:0}
.payment-order-row:hover{background:#fbfdff}
.payment-order-select{display:grid;place-items:center}
.payment-order-check{width:19px!important;height:19px!important;padding:0!important;border-radius:5px!important}
.payment-order-identity{display:grid;gap:2px;min-width:0}
.payment-order-identity b{color:#20384f;font-size:.76rem}
.payment-order-identity small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#6c8095;font-size:.7rem;font-weight:800}
.payment-order-total{display:grid;gap:2px;color:#526b84;font-size:.72rem;font-weight:750}
.payment-order-total b{color:#526b84;font-size:.72rem;font-weight:850}
.payment-order-total small{color:#6f8297;font-size:.67rem;font-weight:750}
.payment-order-total .payment-order-after{color:#0878ef}
.payment-order-remaining{color:#d92734;font-size:.76rem;white-space:nowrap}
.payment-order-amount{height:38px!important;border-radius:10px!important;padding:0 9px!important;font-size:.78rem!important;font-weight:850!important;text-align:right}
.payment-orders-empty{display:grid;gap:4px;padding:28px;text-align:center;color:#71839a}
.payment-orders-empty strong{color:#24405d}
.payment-total-note{display:flex;gap:12px;align-items:flex-start;padding:14px 15px;border:1px solid #cfe3f3;border-radius:15px;background:#eef8ff}
.payment-total-note>span{display:grid;width:34px;height:34px;place-items:center;border-radius:10px;background:#fff;color:#0878ef;font-size:1.1rem}
.payment-total-note strong{color:#1b3b58;font-size:.85rem}
.payment-total-note p{margin:4px 0 0;color:#6b8298;font-size:.72rem;line-height:1.45}
.payment-meta-grid{display:grid;grid-template-columns:180px 1fr;gap:10px}
.payment-submit-summary{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-radius:12px;background:#f2f8fd;color:#61778d;font-size:.76rem;font-weight:800}
.payment-submit-summary strong{color:#0878ef;font-size:.95rem}
.payment-enterprise-actions{position:sticky;bottom:-22px;z-index:2;margin:0 -22px -22px;padding:14px 22px calc(14px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);backdrop-filter:blur(12px);box-shadow:0 -10px 28px rgba(20,54,85,.07)}
.payment-enterprise-actions .btn.primary{background:linear-gradient(135deg,#138cff,#066ee7);box-shadow:0 8px 18px rgba(8,120,239,.2)}

@media(max-width:640px){
  .payment-enterprise-dialog{inset:auto 0 0 0;width:100%;max-width:100%;max-height:calc(100dvh - 6px);margin:0;border-radius:26px 26px 0 0}
  .payment-enterprise-form{gap:13px!important;padding:18px!important}
  .payment-enterprise-head h2{font-size:1.35rem}
  .payment-enterprise-head p{font-size:.74rem}
  .payment-customer-card{grid-template-columns:46px minmax(0,1fr) auto;padding:12px;gap:10px}
  .payment-customer-avatar{width:46px;height:46px}
  .payment-customer-balance{min-width:118px;padding-left:10px}
  .payment-customer-balance strong{font-size:1rem}
  .payment-customer-copy strong{font-size:.92rem}
  .payment-quick-amounts{grid-template-columns:1fr 1fr}
  .payment-mode-tabs button,.payment-method-tabs button{min-height:46px;font-size:.78rem}
  .payment-order-table-head{display:none}
  .payment-order-row{grid-template-columns:32px minmax(0,1fr) 116px;grid-template-areas:"select identity remaining" "select total amount";gap:7px 8px;padding:10px 11px}
  .payment-order-select{grid-area:select}
  .payment-order-identity{grid-area:identity}
  .payment-order-total{grid-area:total;font-size:.7rem}
  .payment-order-total::before{content:none}
  .payment-order-remaining{grid-area:remaining;text-align:right;font-size:.72rem}
  .payment-order-remaining::before{content:"Còn ";color:#91a0af;font-weight:650}
  .payment-order-amount{grid-area:amount;width:100%!important}
  .payment-order-heading{padding:11px 12px}
  .payment-meta-grid{grid-template-columns:1fr}
  .payment-enterprise-actions{bottom:-18px;margin:0 -18px -18px;padding-left:18px;padding-right:18px}
}

@media(max-width:390px){
  .payment-enterprise-form{padding:15px!important}
  .payment-customer-card{grid-template-columns:42px minmax(0,1fr);align-items:start}
  .payment-customer-avatar{width:42px;height:42px}
  .payment-customer-balance{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;min-width:0;padding:9px 0 0;border-left:0;border-top:1px solid #e1ebf2;text-align:left}
  .payment-customer-balance strong{margin:0}
  .payment-order-row{grid-template-columns:30px minmax(0,1fr) 104px}
  .payment-enterprise-actions{bottom:-15px;margin:0 -15px -15px;padding-left:15px;padding-right:15px}
}


/* v4.03.0 — AquaFlow Enterprise Blue Debt UI */
#debts{--debt-blue:#0878ef;--debt-blue-deep:#0668d8;--debt-soft:#eef7ff;--debt-line:#d8e7f3}
.debt-page-head-new{align-items:flex-end;gap:14px;margin-bottom:14px}.debt-page-head-new h2{margin:4px 0 3px;color:#10253e;font-size:2rem;line-height:1.05;letter-spacing:-.04em}.debt-page-head-new p{margin:0;color:#6e8197;font-size:1rem}.debt-date-chip{display:inline-flex;align-items:center;min-height:44px;padding:0 15px;border:1px solid var(--debt-line);border-radius:14px;background:#fff;color:#607991;font-size:.9rem;font-weight:800;white-space:nowrap}
.debt-hero-new{display:grid!important;gap:16px!important;margin-bottom:14px!important;padding:18px!important;border:1px solid var(--debt-line)!important;border-radius:24px!important;background:linear-gradient(180deg,#fbfdff,#fff)!important;box-shadow:0 10px 28px rgba(21,57,96,.06)!important}.debt-hero-metrics-new{display:grid;grid-template-columns:1.7fr 1fr;border:1px solid #e2edf5;border-radius:20px;overflow:hidden;background:#fff}.debt-metric-new{display:grid;grid-template-columns:62px minmax(0,1fr);gap:14px;align-items:center;padding:17px}.debt-metric-new+.debt-metric-new{border-left:1px solid #e2edf5}.debt-metric-icon-new{display:grid;width:62px;height:62px;place-items:center;border-radius:18px;background:#eaf4ff;color:var(--debt-blue);font-size:1.6rem;font-weight:900}.debt-metric-new small{display:block;color:#6e8298;font-size:.78rem;font-weight:900;letter-spacing:.08em}.debt-metric-new strong{display:block;margin-top:5px;color:#d72432;font-size:2rem;line-height:1;letter-spacing:-.04em}.debt-metric-new p{margin:6px 0 0;color:#6c8197;font-size:.95rem}.debt-metric-count-new strong{color:var(--debt-blue)}
.debt-actions-blue{display:grid!important;grid-template-columns:1fr 1fr;gap:12px;width:100%}.debt-actions-blue .btn{min-height:56px;border-radius:16px;font-size:1.04rem;font-weight:900}.debt-add-blue{border:1.5px solid var(--debt-blue)!important;background:#fff!important;color:var(--debt-blue)!important}.debt-collect-blue{background:linear-gradient(135deg,#168cff,#066ee7)!important;color:#fff!important;box-shadow:0 8px 18px rgba(8,120,239,.18)!important}
.debt-search-panel-new{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px 14px!important;border:1px solid var(--debt-line)!important;border-radius:20px!important;background:#fff!important}.debt-search-panel-new .employee-search-box{margin:0!important}.debt-search-panel-new .employee-search-count{min-width:88px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:14px;background:#eaf4ff;color:var(--debt-blue);font-size:.92rem;font-weight:900}
.debt-list-head-new{align-items:center;margin:17px 2px 10px}.debt-list-head-new small{color:#607995;font-size:.78rem;font-weight:900;letter-spacing:.12em}.debt-list-head-new>span{color:#73869a;font-size:.88rem;font-weight:750}.debt-list-new{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}.debt-list-new .debtor{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:14px!important;align-items:center!important;min-height:92px;padding:15px 16px!important;border:1px solid var(--debt-line)!important;border-radius:18px!important;background:#fff!important;box-shadow:0 7px 22px rgba(24,64,99,.05)!important}.debt-list-new .debtor>div:first-child strong{color:#14283f!important;font-size:1.18rem!important;font-weight:900!important}.debt-list-new .debtor .muted{margin:5px 0 0!important;color:#72869b!important;font-size:.94rem!important}.debt-list-new .debtor>div:last-child{display:grid!important;grid-template-columns:auto auto!important;align-items:center!important;gap:12px!important}.debt-list-new .debtor>div:last-child>strong{color:#d72432!important;font-size:1.18rem!important;font-weight:900!important;white-space:nowrap}.debt-list-new .debtor .edit{min-width:92px!important;min-height:46px!important;border:1px solid #cbe1f4!important;border-radius:14px!important;background:#eaf4ff!important;color:#0878ef!important;font-size:.9rem!important;font-weight:900!important}
/* Thu nợ: toàn bộ action chính dùng AquaFlow Blue */
#payment-dialog .payment-enterprise-head h2{font-size:1.8rem!important;color:#10253e!important}.payment-customer-card{border-color:#d7e7f3!important}.payment-customer-balance strong{color:#d72432!important}.payment-mode-tabs button.active,.payment-method-tabs button.active{background:linear-gradient(135deg,#168cff,#066ee7)!important;color:#fff!important}.payment-enterprise-actions .btn.primary{background:linear-gradient(135deg,#168cff,#066ee7)!important;color:#fff!important;box-shadow:0 8px 18px rgba(8,120,239,.2)!important}.payment-order-heading label{color:#0878ef!important}.payment-order-total .payment-order-after{color:#0878ef!important}.payment-submit-summary strong{color:#0878ef!important}
@media(max-width:640px){.debt-page-head-new{align-items:flex-start;flex-direction:column}.debt-page-head-new h2{font-size:1.75rem}.debt-date-chip{width:100%;justify-content:flex-start}.debt-hero-new{padding:14px!important}.debt-hero-metrics-new{grid-template-columns:1fr}.debt-metric-new+.debt-metric-new{border-left:0;border-top:1px solid #e2edf5}.debt-metric-new{grid-template-columns:52px minmax(0,1fr);padding:14px}.debt-metric-icon-new{width:52px;height:52px;border-radius:15px;font-size:1.3rem}.debt-metric-new strong{font-size:1.65rem}.debt-actions-blue{grid-template-columns:1fr 1fr}.debt-actions-blue .btn{min-height:52px;font-size:.96rem}.debt-list-new .debtor{grid-template-columns:1fr!important;padding:14px!important}.debt-list-new .debtor>div:last-child{grid-template-columns:1fr auto!important}.debt-list-new .debtor>div:last-child>strong{font-size:1.12rem!important}.debt-list-new .debtor .edit{min-width:96px!important}.debt-list-head-new>span{font-size:.8rem}.payment-enterprise-head h2{font-size:1.55rem!important}.payment-enterprise-form{font-size:16px}.payment-amount-input input{font-size:1.35rem!important}.payment-mode-tabs button,.payment-method-tabs button{font-size:.9rem!important}}
/* v4.03.0 — Enterprise Blue Debt UI */
.debtor-name{border:0;background:transparent;padding:0;color:#14283f;font-size:1.12rem;font-weight:900;line-height:1.2;text-align:left;text-decoration:none;cursor:pointer}
.debtor-name:hover,.debtor-name:focus-visible{color:#0878ef;text-decoration:underline;text-underline-offset:4px}
.debt-detail-enterprise-dialog{width:min(720px,calc(100% - 28px));max-height:92dvh;border:0;border-radius:28px;padding:0;background:#fff;box-shadow:0 30px 90px rgba(15,39,67,.3)}
.debt-detail-enterprise-dialog::backdrop{background:rgba(19,43,68,.58);backdrop-filter:blur(4px)}
.debt-detail-enterprise-form{display:grid;gap:16px;padding:22px;background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)}
.debt-detail-enterprise-head{align-items:flex-start;padding-bottom:15px;border-bottom:1px solid #e5edf4}
.debt-detail-enterprise-head small{color:#0878ef;font-size:.82rem;font-weight:900;letter-spacing:.14em}
.debt-detail-enterprise-head h2{margin:4px 0 0;color:#10253e;font-size:1.9rem;line-height:1.08;letter-spacing:-.04em}
.debt-detail-enterprise-head p{margin:5px 0 0;color:#71839a;font-size:.95rem;font-weight:750}
.debt-detail-enterprise-head .icon-btn{width:44px;height:44px;border:2px solid #b8ddf7;border-radius:14px;background:#f4f8fb;color:#5f748b}
.debt-detail-summary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;padding:19px 20px;border:1px solid #d4e7f7;border-radius:20px;background:linear-gradient(135deg,#f3f9ff,#fff);color:#1d4f7c}
.debt-detail-summary>div:first-child{display:grid;gap:6px}.debt-detail-summary>div:first-child>span{color:#597895;font-size:1rem;font-weight:800}
.debt-detail-summary strong{color:#0878ef;font-size:2.05rem;line-height:1;letter-spacing:-.04em;white-space:nowrap}
.debt-detail-summary-meta{display:grid;gap:4px;min-width:120px;padding-left:18px;border-left:1px solid #d9e8f4;text-align:right}
.debt-detail-summary-meta span{color:#71869c;font-size:.72rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase}.debt-detail-summary-meta b{color:#29435f;font-size:1.05rem}
.debt-detail-list{display:grid;gap:12px}.debt-lot{padding:0;border:1px solid #dce8f2;border-radius:20px;background:#fff;overflow:hidden;box-shadow:0 8px 24px rgba(24,64,99,.05)}
.debt-lot-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:15px 16px;border-bottom:1px solid #e8eff5;background:linear-gradient(180deg,#fbfdff,#fff)}
.debt-lot-title{display:flex;align-items:center;gap:11px;min-width:0}.debt-lot-index{display:grid;width:36px;height:36px;place-items:center;flex:0 0 36px;border-radius:50%;background:#eaf4ff;color:#0878ef;font-weight:900;font-size:1rem}
.debt-lot-title>div{display:grid;gap:3px;min-width:0}.debt-lot-head time{color:#213951;font-size:1rem;font-weight:900}.debt-lot-title small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#71839a;font-size:.8rem;font-weight:800}
.debt-lot-balance{display:grid;gap:3px;text-align:right}.debt-lot-balance span{color:#8796a7;font-size:.75rem;font-weight:800}.debt-lot-balance strong{color:#d72432;font-size:1.08rem;white-space:nowrap}
.debt-lot-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:0;padding:14px 16px}.debt-lot-grid div{min-width:0;padding:12px;border:1px solid #edf2f6;border-radius:13px;background:#f8fafc}.debt-lot-grid span{display:block;color:#8291a1;font-size:.72rem;font-weight:850;letter-spacing:.03em}.debt-lot-grid strong{display:block;margin-top:4px;color:#263d56;font-size:.98rem;font-weight:900}
.debt-lot-note{margin:0 16px 12px;padding:10px 12px;border-radius:12px;background:#f3f8fd;color:#5f748b;font-size:.82rem}.debt-lot-actions{display:flex;justify-content:flex-end;margin:0;padding:0 16px 15px}
.debt-lot-actions .debt-lot-pay{min-width:160px;min-height:46px;border:1px solid #bcdcf5;border-radius:14px;background:#eaf4ff;color:#086fdf;font-size:.92rem;font-weight:900;box-shadow:none}.debt-lot-actions .debt-lot-pay:hover{background:#dfefff;border-color:#9fcef3}
.debt-detail-actions{position:sticky;bottom:-22px;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 -22px -22px;padding:15px 22px calc(15px + env(safe-area-inset-bottom));border-top:1px solid #e7eef4;background:rgba(255,255,255,.97);backdrop-filter:blur(14px)}
.debt-detail-actions .btn{min-height:56px;border-radius:16px;font-size:1rem;font-weight:900}.debt-detail-actions .btn.primary{background:linear-gradient(135deg,#168cff,#066ee7);color:#fff;box-shadow:0 8px 18px rgba(8,120,239,.2)}
@media(max-width:640px){.debt-detail-enterprise-dialog{inset:auto 0 0 0;width:100%;max-width:100%;max-height:calc(100dvh - 8px);margin:0;border-radius:28px 28px 0 0}.debt-detail-enterprise-form{gap:13px;padding:18px}.debt-detail-enterprise-head h2{font-size:1.65rem}.debt-detail-summary{padding:16px;border-radius:18px}.debt-detail-summary strong{font-size:1.7rem}.debt-detail-summary-meta{min-width:92px;padding-left:12px}.debt-lot-head{padding:13px}.debt-lot-grid{padding:12px 13px;gap:8px}.debt-lot-grid div{padding:10px}.debt-lot-actions{padding:0 13px 13px}.debt-lot-actions .debt-lot-pay{width:100%}.debt-detail-actions{bottom:-18px;margin:0 -18px -18px;padding-left:18px;padding-right:18px}}
@media(max-width:390px){.debt-detail-enterprise-form{padding:15px}.debt-detail-summary{grid-template-columns:1fr;gap:10px}.debt-detail-summary-meta{grid-template-columns:1fr auto;align-items:center;min-width:0;padding:10px 0 0;border-left:0;border-top:1px solid #d9e8f4;text-align:left}.debt-lot-grid{grid-template-columns:1fr 1fr}.debt-detail-actions{bottom:-15px;margin:0 -15px -15px;padding-left:15px;padding-right:15px}}

/* =========================================================
   v4.03.1 — Staff Debt Responsive Fix
   Fix xung đột giữa layout công nợ enterprise mới và CSS mobile nhân viên cũ.
   ========================================================= */
body.staff-mode #debts,
body[data-role="staff"] #debts{
  min-width:0!important;
  overflow-x:hidden!important;
}
body.staff-mode #debts .debt-page-head-new,
body[data-role="staff"] #debts .debt-page-head-new{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  align-items:start!important;
  gap:10px!important;
  margin-bottom:12px!important;
}
body.staff-mode #debts .debt-page-head-new>div,
body[data-role="staff"] #debts .debt-page-head-new>div{min-width:0!important}
body.staff-mode #debts .debt-page-head-new h2,
body[data-role="staff"] #debts .debt-page-head-new h2{
  margin-top:4px!important;
  font-size:1.72rem!important;
  line-height:1.08!important;
}
body.staff-mode #debts .debt-page-head-new p,
body[data-role="staff"] #debts .debt-page-head-new p{
  font-size:.94rem!important;
  line-height:1.4!important;
}
body.staff-mode #debts .debt-date-chip,
body[data-role="staff"] #debts .debt-date-chip{
  width:100%!important;
  min-height:46px!important;
  justify-content:flex-start!important;
  padding:0 14px!important;
  border-radius:15px!important;
  font-size:.9rem!important;
}

/* Quan trọng: không cho CSS staff cũ chia debt-hero thành cột 1fr + 98px. */
body.staff-mode #debts .debt-hero.debt-hero-new,
body[data-role="staff"] #debts .debt-hero.debt-hero-new{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  width:100%!important;
  min-width:0!important;
  min-height:0!important;
  align-items:stretch!important;
  gap:11px!important;
  padding:13px!important;
  border-color:var(--debt-line)!important;
  border-radius:20px!important;
  background:linear-gradient(180deg,#fbfdff,#fff)!important;
}
body.staff-mode #debts .debt-hero-metrics-new,
body[data-role="staff"] #debts .debt-hero-metrics-new{
  display:grid!important;
  grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)!important;
  width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
  border-radius:16px!important;
}
body.staff-mode #debts .debt-metric-new,
body[data-role="staff"] #debts .debt-metric-new{
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr)!important;
  gap:9px!important;
  min-width:0!important;
  padding:11px!important;
  align-items:center!important;
}
body.staff-mode #debts .debt-metric-new+.debt-metric-new,
body[data-role="staff"] #debts .debt-metric-new+.debt-metric-new{
  border-top:0!important;
  border-left:1px solid #e2edf5!important;
}
body.staff-mode #debts .debt-metric-icon-new,
body[data-role="staff"] #debts .debt-metric-icon-new{
  width:42px!important;
  height:42px!important;
  border-radius:13px!important;
  font-size:1.05rem!important;
}
body.staff-mode #debts .debt-metric-new>div,
body[data-role="staff"] #debts .debt-metric-new>div{min-width:0!important}
body.staff-mode #debts .debt-metric-new small,
body[data-role="staff"] #debts .debt-metric-new small{
  display:block!important;
  max-width:100%!important;
  color:#687f96!important;
  font-size:.61rem!important;
  line-height:1.28!important;
  letter-spacing:.045em!important;
  white-space:normal!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
}
body.staff-mode #debts .debt-metric-new strong,
body[data-role="staff"] #debts .debt-metric-new strong{
  max-width:100%!important;
  margin-top:4px!important;
  font-size:1.27rem!important;
  line-height:1.08!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  letter-spacing:-.035em!important;
}
body.staff-mode #debts .debt-metric-new p,
body[data-role="staff"] #debts .debt-metric-new p{
  margin:4px 0 0!important;
  font-size:.72rem!important;
  line-height:1.3!important;
  white-space:normal!important;
}
body.staff-mode #debts .debt-actions.debt-actions-blue,
body[data-role="staff"] #debts .debt-actions.debt-actions-blue{
  display:block!important;
  width:100%!important;
  min-width:0!important;
}
body.staff-mode #debts .debt-actions.debt-actions-blue .debt-collect-blue,
body[data-role="staff"] #debts .debt-actions.debt-actions-blue .debt-collect-blue{
  display:flex!important;
  width:100%!important;
  min-width:0!important;
  min-height:48px!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 14px!important;
  border-radius:14px!important;
  font-size:.92rem!important;
}

body.staff-mode #debts .debt-search-panel-new,
body[data-role="staff"] #debts .debt-search-panel-new{
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:8px!important;
  width:100%!important;
  min-width:0!important;
  padding:9px!important;
  border-radius:17px!important;
}
body.staff-mode #debts .debt-search-panel-new .employee-search-box,
body[data-role="staff"] #debts .debt-search-panel-new .employee-search-box{
  min-width:0!important;
  height:46px!important;
  border-radius:13px!important;
}
body.staff-mode #debts .debt-search-panel-new .employee-search-box input,
body[data-role="staff"] #debts .debt-search-panel-new .employee-search-box input{
  min-width:0!important;
  height:44px!important;
  font-size:.88rem!important;
}
body.staff-mode #debts .debt-search-panel-new .employee-search-count,
body[data-role="staff"] #debts .debt-search-panel-new .employee-search-count{
  min-width:68px!important;
  min-height:44px!important;
  padding:0 10px!important;
  border-radius:13px!important;
  font-size:.72rem!important;
}
body.staff-mode #debts .debt-list-head-new,
body[data-role="staff"] #debts .debt-list-head-new{
  gap:8px!important;
  margin:14px 2px 9px!important;
}
body.staff-mode #debts .debt-list-head-new small,
body[data-role="staff"] #debts .debt-list-head-new small{
  font-size:.66rem!important;
  line-height:1.35!important;
  letter-spacing:.09em!important;
}
body.staff-mode #debts .debt-list-head-new>span,
body[data-role="staff"] #debts .debt-list-head-new>span{
  flex:0 0 auto!important;
  font-size:.7rem!important;
  white-space:nowrap!important;
}
body.staff-mode #debts .debt-list-new,
body[data-role="staff"] #debts .debt-list-new{
  grid-template-columns:minmax(0,1fr)!important;
  gap:9px!important;
  width:100%!important;
  min-width:0!important;
}
body.staff-mode #debts .debt-list-new .debtor,
body[data-role="staff"] #debts .debt-list-new .debtor{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:9px!important;
  width:100%!important;
  min-width:0!important;
  min-height:80px!important;
  padding:11px 12px!important;
  border-radius:16px!important;
}
body.staff-mode #debts .debt-list-new .debtor>div:first-child,
body[data-role="staff"] #debts .debt-list-new .debtor>div:first-child{
  min-width:0!important;
  max-width:none!important;
}
body.staff-mode #debts .debt-list-new .debtor>div:first-child strong,
body[data-role="staff"] #debts .debt-list-new .debtor>div:first-child strong{
  display:block!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:.94rem!important;
}
body.staff-mode #debts .debt-list-new .debtor .muted,
body[data-role="staff"] #debts .debt-list-new .debtor .muted{
  margin-top:4px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:.72rem!important;
}
body.staff-mode #debts .debt-list-new .debtor>div:last-child,
body[data-role="staff"] #debts .debt-list-new .debtor>div:last-child{
  display:grid!important;
  grid-template-columns:auto!important;
  justify-items:end!important;
  gap:6px!important;
}
body.staff-mode #debts .debt-list-new .debtor>div:last-child>strong,
body[data-role="staff"] #debts .debt-list-new .debtor>div:last-child>strong{
  font-size:.86rem!important;
  white-space:nowrap!important;
}
body.staff-mode #debts .debt-list-new .debtor .edit,
body[data-role="staff"] #debts .debt-list-new .debtor .edit{
  min-width:80px!important;
  min-height:38px!important;
  padding:0 10px!important;
  border-radius:11px!important;
  background:#eaf4ff!important;
  color:#0878ef!important;
  font-size:.72rem!important;
}

@media(max-width:360px){
  body.staff-mode #debts .debt-hero-metrics-new,
  body[data-role="staff"] #debts .debt-hero-metrics-new{grid-template-columns:minmax(0,1fr)!important}
  body.staff-mode #debts .debt-metric-new+.debt-metric-new,
  body[data-role="staff"] #debts .debt-metric-new+.debt-metric-new{border-left:0!important;border-top:1px solid #e2edf5!important}
}

/* =========================================================
   v4.03.2 — Admin Debt Compact + Expense Submit Fix
   ========================================================= */

/* Admin/manager: thu gọn phần đầu tab Công nợ trên mobile để danh sách xuất hiện sớm hơn. */
@media(max-width:640px){
  body.management-mode #debts .debt-page-head-new{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:end!important;
    gap:8px 10px!important;
    margin:4px 2px 10px!important;
  }
  body.management-mode #debts .debt-page-head-new>div{min-width:0!important}
  body.management-mode #debts .debt-page-head-new small{
    font-size:.66rem!important;
    letter-spacing:.12em!important;
  }
  body.management-mode #debts .debt-page-head-new h2{
    margin:3px 0 2px!important;
    font-size:1.62rem!important;
    line-height:1.04!important;
  }
  body.management-mode #debts .debt-page-head-new p{
    grid-column:1/-1!important;
    margin:0!important;
    font-size:.86rem!important;
    line-height:1.3!important;
  }
  body.management-mode #debts .debt-date-chip{
    width:auto!important;
    min-width:0!important;
    min-height:38px!important;
    align-self:end!important;
    justify-content:center!important;
    padding:0 11px!important;
    border-radius:12px!important;
    font-size:.72rem!important;
  }
  body.management-mode #debts .debt-hero.debt-hero-new{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:10px!important;
    min-height:0!important;
    padding:11px!important;
    margin-bottom:10px!important;
    border-radius:19px!important;
  }
  body.management-mode #debts .debt-hero-metrics-new{
    display:grid!important;
    grid-template-columns:minmax(0,1.6fr) minmax(0,.9fr)!important;
    min-width:0!important;
    border-radius:15px!important;
  }
  body.management-mode #debts .debt-metric-new{
    display:grid!important;
    grid-template-columns:40px minmax(0,1fr)!important;
    gap:8px!important;
    min-width:0!important;
    padding:10px!important;
  }
  body.management-mode #debts .debt-metric-new+.debt-metric-new{
    border-top:0!important;
    border-left:1px solid #e2edf5!important;
  }
  body.management-mode #debts .debt-metric-icon-new{
    width:40px!important;
    height:40px!important;
    border-radius:12px!important;
    font-size:1rem!important;
  }
  body.management-mode #debts .debt-metric-new small{
    font-size:.58rem!important;
    line-height:1.25!important;
    letter-spacing:.045em!important;
    white-space:normal!important;
  }
  body.management-mode #debts .debt-metric-new strong{
    margin-top:3px!important;
    max-width:100%!important;
    font-size:1.25rem!important;
    line-height:1.06!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body.management-mode #debts .debt-metric-new p{
    margin:3px 0 0!important;
    font-size:.68rem!important;
    line-height:1.25!important;
  }
  body.management-mode #debts .debt-metric-total-new p{display:none!important}
  body.management-mode #debts .debt-actions-blue{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
  }
  body.management-mode #debts .debt-actions-blue .btn{
    min-height:44px!important;
    padding:0 10px!important;
    border-radius:13px!important;
    font-size:.82rem!important;
  }
  body.management-mode #debts .debt-search-panel-new{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:8px!important;
    min-height:0!important;
    padding:8px!important;
    margin-bottom:8px!important;
    border-radius:16px!important;
  }
  body.management-mode #debts .debt-search-panel-new .employee-search-box{
    min-width:0!important;
    height:44px!important;
    border-radius:12px!important;
  }
  body.management-mode #debts .debt-search-panel-new .employee-search-box input{
    min-width:0!important;
    height:42px!important;
    font-size:.84rem!important;
  }
  body.management-mode #debts .debt-search-panel-new .employee-search-count{
    min-width:66px!important;
    min-height:42px!important;
    padding:0 9px!important;
    border-radius:12px!important;
    font-size:.72rem!important;
  }
  body.management-mode #debts .debt-list-head-new{
    margin:10px 2px 7px!important;
    gap:8px!important;
  }
  body.management-mode #debts .debt-list-head-new small{
    font-size:.64rem!important;
    letter-spacing:.09em!important;
  }
  body.management-mode #debts .debt-list-head-new>span{
    font-size:.68rem!important;
    white-space:nowrap!important;
  }
  body.management-mode #debts .debt-list-new{gap:8px!important}
  body.management-mode #debts .debt-list-new .debtor{
    min-height:74px!important;
    padding:10px 11px!important;
    border-radius:15px!important;
  }
}

/* Phiếu chi enterprise: gọn, chữ rõ, không dùng validation step gây lỗi Safari/iPhone. */
.expense-enterprise-dialog{
  width:min(650px,calc(100% - 24px));
  max-height:94dvh;
  border:0;
  border-radius:26px;
  padding:0;
  background:#fff;
  box-shadow:0 30px 90px rgba(15,39,67,.28);
}
.expense-enterprise-dialog::backdrop{background:rgba(18,42,68,.54);backdrop-filter:blur(3px)}
.expense-enterprise-form{
  display:grid!important;
  gap:13px!important;
  padding:21px!important;
  background:linear-gradient(180deg,#fff 0,#fbfdff 100%);
}
.expense-enterprise-head{align-items:flex-start!important;padding-bottom:13px!important}
.expense-enterprise-head small{color:#0878ef!important;font-size:.72rem!important;font-weight:900!important;letter-spacing:.12em!important}
.expense-enterprise-head h2{margin:3px 0 0!important;color:#10253e!important;font-size:1.65rem!important;letter-spacing:-.035em!important}
.expense-enterprise-head p{margin:5px 0 0!important;color:#708399!important;font-size:.82rem!important;line-height:1.35!important}
.expense-enterprise-form>label,
.expense-enterprise-form #expense-payment-row,
.expense-enterprise-form #expense-funding-row{
  display:grid!important;
  gap:7px!important;
  color:#203750!important;
  font-size:.9rem!important;
  font-weight:850!important;
}
.expense-enterprise-form input,
.expense-enterprise-form select{
  min-height:50px!important;
  border:1px solid #cfe0ec!important;
  border-radius:14px!important;
  background:#fff!important;
  color:#14283f!important;
  font-size:1rem!important;
  font-weight:750!important;
}
.expense-enterprise-form input:focus,
.expense-enterprise-form select:focus{
  border-color:#4aa5f5!important;
  box-shadow:0 0 0 3px #dff1ff!important;
}
.expense-enterprise-form input:disabled,
.expense-enterprise-form select:disabled{opacity:1!important;color:#29445f!important;background:#f7fafc!important}
.expense-amount-box{
  display:grid;
  grid-template-columns:minmax(0,1fr) 52px;
  overflow:hidden;
  border:1px solid #b9d9ef;
  border-radius:15px;
  background:#fff;
}
.expense-amount-box input{
  min-width:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  font-size:1.32rem!important;
  font-weight:900!important;
  font-variant-numeric:tabular-nums;
}
.expense-amount-box b{
  display:grid;
  place-items:center;
  border-left:1px solid #dce8f1;
  background:#f7fbfe;
  color:#4e657c;
  font-size:1rem;
}
.expense-amount-label:focus-within .expense-amount-box{border-color:#168cf5;box-shadow:0 0 0 3px #dff1ff}
.expense-amount-label .field-help{color:#75899e!important;font-size:.76rem!important;font-weight:650!important;line-height:1.35!important}
.expense-amount-preview{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  align-items:center;
  min-height:30px;
  padding:0 10px;
  border-radius:10px;
  background:#eaf4ff;
  color:#0878ef;
  font-size:.78rem;
  font-weight:900;
}
.expense-funding-note{
  margin:0!important;
  padding:11px 12px!important;
  border:1px solid #d7e8f5!important;
  border-radius:13px!important;
  background:#f2f8fe!important;
  color:#5e768e!important;
  font-size:.76rem!important;
  line-height:1.4!important;
}
.expense-enterprise-actions{
  position:sticky;
  bottom:-21px;
  z-index:2;
  display:grid!important;
  grid-template-columns:1fr 1.25fr!important;
  gap:10px!important;
  margin:0 -21px -21px!important;
  padding:13px 21px calc(13px + env(safe-area-inset-bottom))!important;
  border-top:1px solid #e7eef4!important;
  background:rgba(255,255,255,.97)!important;
  backdrop-filter:blur(12px);
}
.expense-enterprise-actions .btn{min-height:52px!important;border-radius:15px!important;font-size:.95rem!important;font-weight:900!important}
.expense-enterprise-actions .btn.primary{background:linear-gradient(135deg,#168cff,#066ee7)!important;color:#fff!important;box-shadow:0 8px 18px rgba(8,120,239,.18)!important}
.expense-enterprise-actions .btn:disabled{opacity:.62!important;cursor:wait!important}

@media(max-width:640px){
  .expense-enterprise-dialog{
    inset:auto 0 0 0;
    width:100%;
    max-width:100%;
    max-height:calc(100dvh - 6px);
    margin:0;
    border-radius:27px 27px 0 0;
  }
  .expense-enterprise-form{gap:11px!important;padding:17px!important}
  .expense-enterprise-head h2{font-size:1.45rem!important}
  .expense-enterprise-head p{font-size:.76rem!important}
  .expense-enterprise-form>label,
  .expense-enterprise-form #expense-payment-row,
  .expense-enterprise-form #expense-funding-row{font-size:.86rem!important}
  .expense-enterprise-form input,
  .expense-enterprise-form select{min-height:48px!important;font-size:.96rem!important}
  .expense-amount-box input{font-size:1.24rem!important}
  .expense-enterprise-actions{
    bottom:-17px;
    margin:0 -17px -17px!important;
    padding-left:17px!important;
    padding-right:17px!important;
  }
}

@media(max-width:380px){
  body.management-mode #debts .debt-page-head-new{grid-template-columns:minmax(0,1fr)!important}
  body.management-mode #debts .debt-date-chip{justify-self:start!important}
  body.management-mode #debts .debt-metric-new strong{font-size:1.12rem!important}
  .expense-enterprise-actions{grid-template-columns:1fr 1fr!important}
}

/* v4.03.3 advisory + Android PWA */
.pwa-install-button{width:100%;min-height:48px;margin-top:14px;border:1px solid #0878ef;border-radius:14px;background:#eef7ff;color:#0878ef;font-weight:850;cursor:pointer}
.pwa-install-button:disabled{opacity:.6}
.pwa-install-note{display:block;margin-top:7px;color:#6e8298;text-align:center;font-size:.76rem;line-height:1.4}
.day-control-status.advisory{background:#fff7df!important;color:#a86600!important;border-color:#f2d58b!important}
.management-attention-cta.has-advisory{border-color:#f2d58b!important;background:linear-gradient(135deg,#fffaf0,#fff)!important}
.management-attention-cta.has-advisory .management-attention-icon{background:#fff1c7!important;color:#a86600!important}
#operations-attention.has-advisory{border-color:#f2d58b!important;background:linear-gradient(135deg,#fffaf0,#fff)!important}

.pwa-install-floating{position:fixed;z-index:80;right:16px;bottom:calc(88px + env(safe-area-inset-bottom));min-height:44px;padding:0 16px;border:1px solid #0878ef;border-radius:999px;background:#0878ef;color:#fff;font-size:.82rem;font-weight:900;box-shadow:0 10px 26px rgba(8,120,239,.24);cursor:pointer}
.pwa-install-floating:disabled{opacity:.65}
@media(min-width:760px){.pwa-install-floating{bottom:22px}}


/* v4.03.4 — AquaFlow Payroll Large Readability */
.payroll-status.changed{background:#fff7df!important;color:#9a6700!important}.enterprise-payroll-person.status-changed{border-color:#f3d28a!important}
.enterprise-payroll-center{border-radius:24px!important;padding:18px!important;background:linear-gradient(180deg,#f4faff 0,#fff 180px)!important}
.payroll-enterprise-head small{font-size:11px!important}.payroll-enterprise-head h2{font-size:27px!important}.payroll-enterprise-head .section-note{font-size:13px!important;line-height:1.5!important}
.payroll-enterprise-kpis{gap:10px!important}.payroll-enterprise-kpis article{min-height:92px!important;padding:13px 14px!important;border-radius:17px!important}.payroll-enterprise-kpis small{font-size:10px!important}.payroll-enterprise-kpis strong{font-size:21px!important}.payroll-enterprise-kpis span{font-size:11px!important}
.payroll-enterprise-note{font-size:12px!important;line-height:1.5!important;padding:11px 13px!important}
.enterprise-payroll-list{gap:14px!important}.enterprise-payroll-person{border-radius:20px!important}.enterprise-payroll-person-summary{grid-template-columns:44px minmax(0,1fr) auto!important;min-height:92px!important;gap:12px!important;padding-right:16px!important}.enterprise-payroll-rank{font-size:18px!important}
.enterprise-payroll-person-copy>strong{font-size:23px!important}.payroll-role-chip,.enterprise-payroll-person-copy .payroll-status{font-size:10px!important;padding:5px 8px!important}.enterprise-payroll-person-volume{display:none!important}.enterprise-payroll-person-total>strong{font-size:22px!important}.enterprise-payroll-person-total>small{font-size:10px!important}
.enterprise-payroll-person-body{gap:14px!important;padding:14px 16px 17px!important}.enterprise-payroll-person-kpis{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important}.enterprise-payroll-person-kpis span{padding:11px 7px!important;border-radius:13px!important}.enterprise-payroll-person-kpis small{font-size:9px!important}.enterprise-payroll-person-kpis b{font-size:15px!important}
.enterprise-payroll-role-split{gap:8px!important}.enterprise-payroll-role-split span{padding:10px 12px!important;font-size:12px!important}.enterprise-payroll-role-split b{font-size:13px!important}.enterprise-payroll-subhead small{font-size:10px!important}.enterprise-payroll-subhead strong{font-size:17px!important}.enterprise-payroll-subhead>span{font-size:10px!important}
.payroll-week-card,.payroll-sunday-card{border-radius:16px!important}.payroll-week-card>summary,.payroll-sunday-card>summary{min-height:68px!important;padding:12px 14px!important}.payroll-week-card>summary>span:first-child small{font-size:9px!important}.payroll-week-card>summary>span:first-child b,.payroll-sunday-card>summary b{font-size:13px!important}.payroll-week-summary-meta small{font-size:10px!important}.payroll-week-summary-meta strong,.payroll-sunday-card>summary>strong{font-size:17px!important}
.payroll-week-day{grid-template-columns:72px minmax(0,1fr) 118px!important;gap:10px!important;min-height:62px!important;padding:10px 12px!important}.payroll-week-date b{width:32px!important;height:32px!important;font-size:12px!important}.payroll-week-date small{font-size:10px!important}.payroll-week-volume b{font-size:13px!important}.payroll-week-volume small{font-size:10px!important;line-height:1.35!important}.payroll-week-day>strong{font-size:14px!important}.payroll-week-days>footer{padding:11px 12px!important}.payroll-week-days>footer span,.payroll-week-days>footer b{font-size:11px!important}.payroll-week-days>footer strong{font-size:15px!important}
.enterprise-payroll-reconcile>summary{font-size:12px!important;padding:4px 0!important}.enterprise-payroll-actions>small{font-size:11px!important}.enterprise-payroll-actions .btn{min-height:42px!important;font-size:12px!important}
@media(max-width:620px){
  #reports .enterprise-payroll-details{padding-left:6px!important;padding-right:6px!important}.enterprise-payroll-center{padding:13px!important;border-radius:20px!important}.payroll-enterprise-head h2{font-size:24px!important}.payroll-enterprise-head .section-note{font-size:12px!important}.payroll-enterprise-kpis{grid-template-columns:1fr 1fr!important}.payroll-enterprise-kpis article{min-height:82px!important}.payroll-enterprise-kpis article:nth-child(3){display:grid!important}.payroll-enterprise-kpis small{font-size:9px!important}.payroll-enterprise-kpis strong{font-size:18px!important}.payroll-enterprise-kpis span{font-size:10px!important}
  .enterprise-payroll-person-summary{grid-template-columns:38px minmax(0,1fr) auto!important;min-height:86px!important;padding-right:11px!important}.enterprise-payroll-rank{font-size:16px!important}.enterprise-payroll-person-copy>strong{font-size:21px!important}.payroll-role-chip,.enterprise-payroll-person-copy .payroll-status{font-size:9.5px!important}.enterprise-payroll-person-total>strong{font-size:19px!important}.enterprise-payroll-person-total>small{font-size:9px!important}.enterprise-payroll-person-body{padding:12px!important}
  .enterprise-payroll-person-kpis{grid-template-columns:1fr 1fr!important}.enterprise-payroll-person-kpis small{font-size:9px!important}.enterprise-payroll-person-kpis b{font-size:14px!important}.enterprise-payroll-role-split span{font-size:11px!important}.enterprise-payroll-role-split b{font-size:12px!important}.enterprise-payroll-subhead strong{font-size:16px!important}.enterprise-payroll-subhead>span{display:none!important}
  .payroll-week-card>summary,.payroll-sunday-card>summary{min-height:64px!important;padding:11px!important}.payroll-week-card>summary>span:first-child b,.payroll-sunday-card>summary b{font-size:12px!important}.payroll-week-summary-meta strong,.payroll-sunday-card>summary>strong{font-size:15px!important}.payroll-week-summary-meta small{font-size:9px!important}
  .payroll-week-day{grid-template-columns:64px minmax(0,1fr) 102px!important;gap:8px!important;min-height:60px!important;padding:9px!important}.payroll-week-date b{width:30px!important;height:30px!important;font-size:11px!important}.payroll-week-date small{font-size:9px!important}.payroll-week-volume b{font-size:12px!important}.payroll-week-volume small{font-size:9px!important}.payroll-week-day>strong{font-size:13px!important}.payroll-week-days>footer{grid-template-columns:1fr auto!important}.payroll-week-days>footer b{display:none!important}.payroll-week-days>footer span{font-size:10px!important}.payroll-week-days>footer strong{font-size:14px!important}
}

/* v4.03.5 — Customer bottle debt ledger */
.bottle-debt-page-head{align-items:flex-end;gap:16px}
.bottle-debt-page-head h2{margin:4px 0 2px;font-size:2rem;letter-spacing:-.04em;color:#10253e}
.bottle-debt-page-head p{margin:0;color:#71839a;font-size:.96rem}
.bottle-debt-date-chip{display:grid;grid-template-columns:auto minmax(150px,1fr);gap:10px;align-items:center;padding:8px 10px 8px 14px;border:1px solid #d9e7f2;border-radius:16px;background:#fff;color:#61788f;font-size:.8rem;font-weight:850}
.bottle-debt-date-chip input{height:42px;border:0;border-radius:11px;background:#f4f9fd;color:#173653;font-weight:800;padding:0 10px}
.bottle-debt-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 0}
.bottle-debt-kpis article{display:grid;grid-template-columns:54px minmax(0,1fr);gap:12px;align-items:center;min-height:116px;padding:15px;border:1px solid #dce8f2;border-radius:20px;background:linear-gradient(180deg,#fff,#fbfdff);box-shadow:0 8px 20px rgba(26,75,112,.04)}
.bottle-debt-kpi-icon{display:grid;width:54px;height:54px;place-items:center;border-radius:16px;background:#eaf4ff;color:#0878ef;font-size:1.35rem;font-weight:900}
.bottle-debt-kpi-icon.positive{background:#edf8ff;color:#0878ef}
.bottle-debt-kpi-icon.return{background:#eefaf6;color:#0b9b6d}
.bottle-debt-kpis small{display:block;color:#698099;font-size:.68rem;font-weight:900;letter-spacing:.07em;line-height:1.3}
.bottle-debt-kpis strong{display:block;margin-top:5px;color:#0d6fe8;font-size:1.55rem;letter-spacing:-.03em}
.bottle-debt-kpis p{margin:4px 0 0;color:#7a8c9f;font-size:.76rem;line-height:1.35}
.bottle-debt-toolbar{display:grid;grid-template-columns:auto minmax(260px,1fr);gap:12px;align-items:center;padding:12px;border:1px solid #dce8f2;border-radius:20px;background:#fff}
.bottle-debt-scope{display:flex;gap:7px}
.bottle-debt-scope button{min-height:44px;padding:0 14px;border:1px solid #d8e6f1;border-radius:13px;background:#f7fbfe;color:#506c86;font-size:.78rem;font-weight:850;cursor:pointer}
.bottle-debt-scope button.active{border-color:#1689f7;background:#eaf4ff;color:#0878ef}
.bottle-debt-search{margin:0!important}
.bottle-debt-list-head{align-items:end;margin:17px 0 10px}
.bottle-debt-list-head small{color:#0878ef;font-size:.72rem;font-weight:900;letter-spacing:.12em}
.bottle-debt-list-head h2{margin:4px 0 0;color:#17324e;font-size:1.25rem}
.bottle-debt-list-head>span{display:inline-flex;align-items:center;min-height:36px;padding:0 12px;border-radius:12px;background:#eaf4ff;color:#0878ef;font-size:.78rem;font-weight:850}
.bottle-debt-list{display:grid;gap:10px}
.bottle-debt-row{display:grid;grid-template-columns:46px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:14px 15px;border:1px solid #dce8f2;border-radius:18px;background:#fff;box-shadow:0 6px 18px rgba(20,60,92,.04)}
.bottle-debt-rank{display:grid;width:46px;height:46px;place-items:center;border-radius:50%;background:#eaf4ff;color:#0878ef;font-size:1.05rem;font-weight:900}
.bottle-debt-customer{min-width:0}
.bottle-debt-customer strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#122b46;font-size:1.04rem}
.bottle-debt-customer small{display:block;margin-top:3px;color:#6f8499;font-size:.82rem;font-weight:650}
.bottle-debt-customer p{margin:5px 0 0;color:#8393a3;font-size:.73rem;line-height:1.35}
.bottle-debt-status{text-align:right}
.bottle-debt-status strong{display:block;margin-top:4px;color:#0878ef;font-size:1.22rem;white-space:nowrap}
.bottle-debt-status small{display:block;color:#7c8ea1;font-size:.72rem;font-weight:750}
.bottle-debt-delta{display:inline-flex;align-items:center;min-height:25px;padding:0 8px;border-radius:9px;font-size:.68rem;font-weight:850;white-space:nowrap}
.bottle-debt-delta.increase{background:#fff0f1;color:#d92d39}
.bottle-debt-delta.decrease{background:#eefaf6;color:#0b986c}
.bottle-debt-delta.neutral{background:#f2f6f9;color:#75889b}
.bottle-debt-collect{min-height:42px!important;padding:0 12px!important;border:1px solid #cfe3f6!important;border-radius:12px!important;background:#edf6ff!important;color:#0878ef!important;font-size:.76rem!important;font-weight:850!important;white-space:nowrap}
.bottle-debt-help{margin:14px 0 0;padding:12px 14px;border:1px dashed #cfe0ee;border-radius:14px;background:#f8fbfd;color:#667c91;font-size:.78rem;line-height:1.5}
.bottle-debt-help strong{color:#274865}
.bottle-debt-dialog{width:min(620px,calc(100% - 24px))}
.bottle-debt-form{display:grid;gap:13px;padding:20px}
.bottle-debt-form .dialog-head h2{font-size:1.55rem}
.bottle-debt-form label{display:grid;gap:7px;color:#263b51;font-size:.82rem;font-weight:800}
.bottle-debt-form select,.bottle-debt-form input{height:48px;border-radius:13px}
.bottle-customer-balance-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 14px;border:1px solid #d8e8f4;border-radius:15px;background:#f4f9fe}
.bottle-customer-balance-card span{color:#688098;font-size:.78rem;font-weight:800}
.bottle-customer-balance-card strong{color:#0878ef;font-size:1.25rem}

@media(max-width:900px){
  .bottle-debt-kpis{grid-template-columns:1fr 1fr}
  .bottle-debt-toolbar{grid-template-columns:1fr}
}
@media(max-width:640px){
  .bottle-debt-page-head{align-items:stretch;flex-direction:column}
  .bottle-debt-page-head h2{font-size:1.7rem}
  .bottle-debt-page-head p{font-size:.88rem}
  .bottle-debt-date-chip{grid-template-columns:auto 1fr}
  .bottle-debt-kpis{gap:9px;margin:11px 0}
  .bottle-debt-kpis article{grid-template-columns:44px minmax(0,1fr);gap:9px;min-height:102px;padding:12px;border-radius:17px}
  .bottle-debt-kpi-icon{width:44px;height:44px;border-radius:13px;font-size:1.1rem}
  .bottle-debt-kpis small{font-size:.61rem}
  .bottle-debt-kpis strong{font-size:1.28rem}
  .bottle-debt-kpis p{font-size:.68rem}
  .bottle-debt-toolbar{padding:10px}
  .bottle-debt-scope{display:grid;grid-template-columns:1fr 1fr}
  .bottle-debt-scope button{padding:0 8px;font-size:.72rem}
  .bottle-debt-row{grid-template-columns:40px minmax(0,1fr) auto;grid-template-areas:"rank customer status" "rank action action";gap:9px;padding:12px}
  .bottle-debt-rank{grid-area:rank;width:40px;height:40px;font-size:.92rem}
  .bottle-debt-customer{grid-area:customer}
  .bottle-debt-status{grid-area:status}
  .bottle-debt-collect{grid-area:action;width:100%}
  .bottle-debt-status strong{font-size:1.05rem}
  .bottle-debt-delta{font-size:.62rem}
  .bottle-debt-dialog{inset:auto 0 0 0;width:100%;max-width:100%;margin:0;border-radius:26px 26px 0 0;max-height:calc(100dvh - 8px)}
  .bottle-debt-form{padding:17px}
}
@media(max-width:390px){
  .bottle-debt-kpis{grid-template-columns:1fr}
  .bottle-debt-row{grid-template-columns:36px minmax(0,1fr);grid-template-areas:"rank customer" "rank status" "action action"}
  .bottle-debt-status{text-align:left}
  .bottle-debt-delta{white-space:normal}
}

/* v4.03.7 Unified AquaFlow customer bottle debt */
.bottle-debt-page-head-unified{align-items:flex-end;margin-bottom:12px}
.bottle-debt-page-head-unified h2{font-size:2rem;line-height:1.05}
.bottle-debt-date-chip-compact{grid-template-columns:auto 150px;padding:7px 8px 7px 12px;border-radius:15px}
.bottle-debt-date-chip-compact input{height:38px}
.bottle-debt-overview-unified{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0}
.bottle-debt-primary-kpi{display:grid;grid-template-columns:58px minmax(0,1fr);gap:14px;align-items:center;min-height:112px;padding:17px 18px;border:1px solid #dce8f2;border-radius:22px;background:#fff;box-shadow:0 8px 22px rgba(26,75,112,.045)}
.bottle-debt-primary-kpi.debt{border-color:#f1d8dc;background:linear-gradient(180deg,#fff,#fffafb)}
.bottle-debt-primary-kpi.customers{border-color:#d4e6f8;background:linear-gradient(180deg,#fff,#fafdff)}
.bottle-debt-primary-kpi small{display:block;color:#6b8097;font-size:.76rem;font-weight:900;letter-spacing:.08em}
.bottle-debt-primary-kpi strong{display:block;margin-top:5px;color:#0878ef;font-size:1.65rem;line-height:1.05;letter-spacing:-.03em}
.bottle-debt-primary-kpi.debt strong{color:#d72533}
.bottle-debt-primary-kpi p{margin:5px 0 0;color:#7b8da0;font-size:.78rem}
.bottle-debt-day-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 12px}
.bottle-debt-day-strip>span{display:grid;grid-template-columns:1fr auto;grid-template-areas:"label value" "note value";gap:2px 10px;align-items:center;padding:10px 13px;border:1px solid #dce8f2;border-radius:15px;background:#f8fbfe}
.bottle-debt-day-strip small{grid-area:label;color:#6a8198;font-size:.68rem;font-weight:900;letter-spacing:.07em}
.bottle-debt-day-strip strong{grid-area:value;color:#0878ef;font-size:1rem;white-space:nowrap}
.bottle-debt-day-strip em{grid-area:note;color:#8b9aaa;font-size:.68rem;font-style:normal;font-weight:700}
.bottle-debt-day-strip>span.bottle-debt-excess-kpi{background:#f3fbf7;border-color:#cfeadd}
.bottle-debt-day-strip>span.bottle-debt-excess-kpi strong{color:#0b9567}

.bottle-debt-toolbar-unified{grid-template-columns:minmax(0,1fr) auto;padding:10px 11px}
.bottle-debt-filter-segment{display:grid;grid-template-columns:1fr 1fr;min-width:180px;padding:3px;border-radius:14px;background:#f2f7fb}
.bottle-debt-filter-segment button{border:0!important;background:transparent!important;min-height:40px;padding:0 12px!important}
.bottle-debt-filter-segment button.active{background:#0878ef!important;color:#fff!important;box-shadow:0 5px 12px rgba(8,120,239,.18)}
.bottle-debt-list-head-unified{margin-top:15px}
.bottle-debt-list-head-unified h2{font-size:1.08rem;margin-top:2px}
.bottle-debt-list-unified{gap:11px}
.bottle-debt-row-unified{grid-template-columns:46px minmax(0,1fr) auto;grid-template-areas:"rank customer status" "rank customer actions";gap:8px 12px;padding:14px 15px;border-radius:18px}
.bottle-debt-row-unified .bottle-debt-rank{grid-area:rank}
.bottle-debt-row-unified .bottle-debt-customer{grid-area:customer}
.bottle-debt-row-unified .bottle-debt-status{grid-area:status;align-self:start}
.bottle-debt-row-unified .bottle-debt-customer strong{font-size:1.1rem;color:#102b47}
.bottle-debt-row-unified .bottle-debt-customer small{font-size:.82rem}
.bottle-debt-row-unified .bottle-debt-customer p{margin:4px 0 7px;font-size:.76rem}
.bottle-debt-row-unified .bottle-debt-status strong{display:inline-flex;align-items:center;min-height:34px;padding:0 11px;border-radius:12px;background:#fff0f2;color:#cc2030;font-size:1.08rem}
.bottle-debt-row-unified .bottle-debt-status small{margin-top:3px}
.bottle-debt-row-actions{grid-area:actions;display:flex;justify-content:flex-end;gap:8px}
.bottle-debt-row-actions .btn{min-height:38px!important;padding:0 13px!important;border-radius:12px!important;font-size:.76rem!important;font-weight:850!important}
.bottle-debt-row-actions .bottle-debt-detail{border:1px solid #1689f7!important;background:#fff!important;color:#0878ef!important}
.bottle-debt-row-actions .bottle-debt-collect{border:1px solid #0878ef!important;background:linear-gradient(135deg,#128dff,#0878ef)!important;color:#fff!important;box-shadow:0 6px 14px rgba(8,120,239,.16)}
.bottle-debt-help-compact{padding:10px 12px;font-size:.72rem;margin-top:12px}
.bottle-debt-detail-dialog{width:min(680px,calc(100% - 24px));max-height:92dvh;border-radius:26px}
.bottle-debt-detail-shell{display:grid;gap:14px;padding:20px;background:linear-gradient(180deg,#fff,#fbfdff)}
.bottle-debt-detail-head h2{font-size:1.7rem;letter-spacing:-.035em}
.bottle-debt-detail-head p{margin:4px 0 0}
.bottle-debt-detail-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.bottle-debt-detail-summary article{padding:13px 14px;border:1px solid #dce8f2;border-radius:16px;background:#f8fbfe}
.bottle-debt-detail-summary small{display:block;color:#71859a;font-size:.67rem;font-weight:900;letter-spacing:.07em}
.bottle-debt-detail-summary strong{display:block;margin-top:5px;color:#0878ef;font-size:1.2rem}
.bottle-debt-detail-summary article:first-child{background:#fff7f8;border-color:#f2d9dd}
.bottle-debt-detail-summary article:first-child strong{color:#d72533}
.bottle-debt-detail-section{display:grid;gap:8px}
.bottle-debt-detail-section .section-head{margin:0}
.bottle-debt-detail-section h3{margin:2px 0 0;color:#17324e;font-size:1.05rem}
.bottle-debt-detail-history{display:grid;border:1px solid #dce8f2;border-radius:17px;overflow:hidden;background:#fff}
.bottle-debt-history-row{display:flex;justify-content:space-between;gap:12px;padding:12px 14px;border-top:1px solid #e6edf3}
.bottle-debt-history-row:first-child{border-top:0}
.bottle-debt-history-row>div{min-width:0;display:grid;gap:2px}
.bottle-debt-history-row strong{color:#17324e;font-size:.9rem}
.bottle-debt-history-row small{color:#708399;font-size:.78rem;font-weight:700}
.bottle-debt-history-row p{margin:2px 0 0;color:#8a99a8;font-size:.72rem;white-space:normal}
.bottle-debt-history-delta{align-self:center;display:inline-flex;align-items:center;min-height:30px;padding:0 9px;border-radius:10px;font-size:.74rem;font-weight:850;white-space:nowrap}
.bottle-debt-history-delta.increase{background:#fff0f2;color:#ce2232}
.bottle-debt-history-delta.decrease{background:#edf9f5;color:#0a9667}
.bottle-debt-history-delta.neutral{background:#f1f5f8;color:#74879a}
.bottle-debt-detail-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bottle-debt-detail-actions .btn{min-height:50px;border-radius:14px;font-weight:850}
.bottle-debt-detail-actions .btn.primary{background:linear-gradient(135deg,#128dff,#0878ef)}
@media(max-width:640px){
  .bottle-debt-page-head-unified{gap:10px}
  .bottle-debt-page-head-unified h2{font-size:1.7rem}
  .bottle-debt-date-chip-compact{grid-template-columns:auto minmax(0,1fr);width:100%}
  .bottle-debt-overview-unified{grid-template-columns:1fr 1fr;gap:9px;margin:10px 0}
  .bottle-debt-primary-kpi{grid-template-columns:42px minmax(0,1fr);gap:9px;min-height:90px;padding:12px;border-radius:17px}
  .bottle-debt-primary-kpi .bottle-debt-kpi-icon{width:42px;height:42px}
  .bottle-debt-primary-kpi small{font-size:.58rem;line-height:1.3}
  .bottle-debt-primary-kpi strong{font-size:1.22rem}
  .bottle-debt-primary-kpi p{font-size:.63rem}
  .bottle-debt-day-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .bottle-debt-day-strip>span{padding:9px 8px;grid-template-columns:1fr;min-width:0}
  .bottle-debt-day-strip small,.bottle-debt-day-strip strong,.bottle-debt-day-strip em{grid-area:auto}
  .bottle-debt-day-strip small{font-size:.61rem;line-height:1.25}
  .bottle-debt-day-strip strong{font-size:.9rem;overflow:hidden;text-overflow:ellipsis}
  .bottle-debt-day-strip em{font-size:.61rem;line-height:1.25}
  .bottle-debt-toolbar-unified{grid-template-columns:1fr;gap:8px}
  .bottle-debt-filter-segment{min-width:0;width:100%}
  .bottle-debt-row-unified{grid-template-columns:38px minmax(0,1fr) auto;grid-template-areas:"rank customer status" "rank customer status" "actions actions actions";gap:7px 9px;padding:12px}
  .bottle-debt-row-unified .bottle-debt-rank{width:38px;height:38px}
  .bottle-debt-row-unified .bottle-debt-customer strong{font-size:1rem}
  .bottle-debt-row-unified .bottle-debt-status strong{min-height:31px;padding:0 8px;font-size:.95rem}
  .bottle-debt-row-actions{justify-content:stretch}
  .bottle-debt-row-actions .btn{flex:1}
  .bottle-debt-detail-dialog{inset:auto 0 0 0;width:100%;max-width:100%;margin:0;border-radius:26px 26px 0 0;max-height:calc(100dvh - 8px)}
  .bottle-debt-detail-shell{padding:17px}
  .bottle-debt-detail-summary{grid-template-columns:1fr 1fr}
  .bottle-debt-detail-summary article:first-child{grid-column:1/-1}
}
@media(max-width:390px){
  .bottle-debt-overview-unified{grid-template-columns:1fr}
  .bottle-debt-primary-kpi{min-height:82px}
  .bottle-debt-row-unified{grid-template-columns:34px minmax(0,1fr);grid-template-areas:"rank customer" "rank status" "actions actions"}
  .bottle-debt-row-unified .bottle-debt-status{text-align:left}
}


/* v4.03.9 - reset chỉ số biến động vỏ */
.stock-ledger-reset-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:14px 0 4px}
.stock-ledger-reset-empty{min-height:44px;padding:0 16px;border:1px solid #f06a5f;border-radius:14px;background:#fff;color:#d93b32;font-weight:850;font-size:.92rem;cursor:pointer}
.stock-ledger-reset-empty:disabled{opacity:.55;cursor:not-allowed}
.stock-ledger-reset-row small{color:#73869b;font-size:.76rem;line-height:1.4}
#stock-ledger-reset-note.is-reset{color:#0878ef;font-weight:750}
@media(max-width:640px){.stock-ledger-reset-row{display:grid;grid-template-columns:1fr;gap:7px}.stock-ledger-reset-empty{width:100%}}

/* v4.04.0 — AquaFlow Expense Center */
#operation-expenses.expense-center-card{
  padding:20px!important;
  border:1px solid #d7e6f2!important;
  border-radius:26px!important;
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%)!important;
  box-shadow:0 14px 34px rgba(24,66,104,.06)!important;
}
.expense-center-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:16px}
.expense-center-head small{display:block;color:#0878ef;font-size:.75rem;font-weight:950;letter-spacing:.16em}
.expense-center-head h2{margin:4px 0 0;color:#10253f;font-size:2rem;line-height:1.05;letter-spacing:-.04em}
.expense-center-head p{margin:7px 0 0;color:#70839a;font-size:.95rem;line-height:1.4}
.expense-kpi-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid #dce8f2;border-radius:20px;background:#fff;overflow:hidden}
.expense-kpi{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:center;padding:15px 16px;min-width:0}
.expense-kpi+.expense-kpi{border-left:1px solid #e3edf4}
.expense-kpi-icon{display:grid;width:52px;height:52px;place-items:center;border-radius:50%;font-size:1.45rem;font-weight:900}
.expense-kpi.approved .expense-kpi-icon{background:#e4f8ed;color:#0ca96f}
.expense-kpi.pending .expense-kpi-icon{background:#fff4d9;color:#e99a00}
.expense-kpi.total .expense-kpi-icon{background:#eaf4ff;color:#0878ef}
.expense-kpi small{display:block;color:#607793;font-size:.8rem;font-weight:850}
.expense-kpi strong{display:block;margin-top:2px;color:#10253f;font-size:1.38rem;line-height:1.1;font-weight:950;letter-spacing:-.025em}
.expense-kpi.total strong{font-size:1.24rem;white-space:nowrap}
.expense-kpi em{display:block;margin-top:4px;color:#7a8da2;font-size:.78rem;font-style:normal;font-weight:700}
.expense-center-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:15px}
.expense-center-actions .btn{min-height:56px;border-radius:16px;font-size:1rem;font-weight:900}
.expense-center-actions .btn.secondary{border:1.5px solid #168cf5;background:#fff;color:#0878ef}
.expense-center-actions .btn.primary{background:linear-gradient(135deg,#0f86f5,#076ce9);box-shadow:0 10px 22px rgba(8,120,239,.18)}
.expense-filter-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}
.expense-filter-tabs button{min-height:48px;border:1px solid #d5e3ee;border-radius:16px;background:#fff;color:#5f7187;font-size:.9rem;font-weight:850;cursor:pointer}
.expense-filter-tabs button.active{border-color:#7abcf5;background:#eaf4ff;color:#0878ef;box-shadow:inset 0 0 0 1px #cce8ff}
.expense-card-list{display:grid;gap:12px}
.expense-entry-card{display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:14px;align-items:center;padding:15px 16px;border:1px solid #dce8f2;border-radius:20px;background:#fff;box-shadow:0 7px 20px rgba(25,66,103,.04)}
.expense-entry-card.cancelled,.expense-entry-card.rejected{opacity:.72;background:#fbfcfd}
.expense-entry-icon{display:grid;width:58px;height:58px;place-items:center;border-radius:50%;background:#eaf4ff;color:#0878ef;font-size:1.45rem;font-weight:900}
.expense-entry-card.cancelled .expense-entry-icon,.expense-entry-card.rejected .expense-entry-icon{background:#eef2f5;color:#71859a;filter:grayscale(.7)}
.expense-entry-main{min-width:0}
.expense-entry-main>strong{display:block;color:#10253f;font-size:1.12rem;line-height:1.2;font-weight:950;letter-spacing:-.02em}
.expense-entry-main small{display:flex;align-items:center;gap:7px;margin-top:5px;color:#6b8199;font-size:.86rem;line-height:1.25;font-weight:650}
.expense-entry-main small>span{display:inline-grid;width:18px;place-items:center;color:#65809a;font-weight:900}
.expense-entry-main p{margin:7px 0 0;color:#6c8096;font-size:.82rem;line-height:1.35}
.expense-entry-side{display:grid;justify-items:end;gap:8px;min-width:128px}
.expense-status{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 11px;border-radius:999px;font-size:.78rem;font-weight:900;white-space:nowrap}
.expense-status b{display:grid;width:18px;height:18px;place-items:center;border-radius:50%;font-size:.72rem}
.expense-status.approved{background:#e7f8ef;color:#0b9d68}.expense-status.approved b{background:#13b879;color:#fff}
.expense-status.pending{background:#fff3d9;color:#d88700}.expense-status.pending b{background:#efa300;color:#fff}
.expense-status.cancelled,.expense-status.rejected{background:#ffe9eb;color:#cf3441}.expense-status.cancelled b,.expense-status.rejected b{background:#e84b55;color:#fff}
.expense-entry-amount{color:#10253f;font-size:1.18rem;line-height:1;font-weight:950;font-variant-numeric:tabular-nums;white-space:nowrap}
.expense-entry-card.cancelled .expense-entry-amount,.expense-entry-card.rejected .expense-entry-amount{text-decoration:line-through;color:#708195}
.expense-card-actions{display:flex;gap:8px;justify-content:flex-end}
.expense-action{min-height:38px;padding:0 13px;border-radius:12px;font-size:.8rem;font-weight:900;cursor:pointer}
.expense-action.approve{border:1px solid #168cf5;background:#fff;color:#0878ef}
.expense-action.reject{border:0;background:#ffecee;color:#d53442}
.expense-card-closed{color:#7b8da0;font-size:.78rem;font-weight:850}
.expense-source-note{display:grid;grid-template-columns:38px minmax(0,1fr);gap:11px;align-items:start;margin-top:14px;padding:13px 14px;border:1px solid #bee0ff;border-radius:16px;background:linear-gradient(180deg,#edf7ff,#e8f4ff)}
.expense-source-note>span{display:grid;width:34px;height:34px;place-items:center;border-radius:50%;background:#0878ef;color:#fff;font-size:1rem;font-weight:900}
.expense-source-note strong{display:block;color:#0878ef;font-size:.9rem;font-weight:950}
.expense-source-note p{margin:4px 0 0;color:#627b94;font-size:.8rem;line-height:1.4}
@media(max-width:760px){
  #operation-expenses.expense-center-card{padding:16px!important;border-radius:22px!important}
  .expense-center-head h2{font-size:1.65rem}
  .expense-center-head p{font-size:.88rem}
  .expense-kpi-grid{grid-template-columns:1fr 1fr}
  .expense-kpi.total{grid-column:1/-1;border-left:0!important;border-top:1px solid #e3edf4}
  .expense-kpi:nth-child(2){border-left:1px solid #e3edf4}
  .expense-kpi{padding:13px 12px;grid-template-columns:44px minmax(0,1fr);gap:10px}
  .expense-kpi-icon{width:44px;height:44px;font-size:1.15rem}
  .expense-center-actions{grid-template-columns:1fr}
  .expense-filter-tabs{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .expense-filter-tabs button{min-height:44px;padding:0 7px;font-size:.8rem}
  .expense-entry-card{grid-template-columns:50px minmax(0,1fr);gap:11px;padding:13px}
  .expense-entry-icon{width:50px;height:50px;font-size:1.2rem}
  .expense-entry-side{grid-column:2;grid-row:2;display:grid;grid-template-columns:auto 1fr;align-items:center;justify-items:start;gap:8px 12px;min-width:0;width:100%}
  .expense-entry-amount{grid-column:1/-1;font-size:1.12rem}
  .expense-card-actions{justify-content:flex-start}
}
@media(max-width:420px){
  .expense-kpi-grid{grid-template-columns:1fr}
  .expense-kpi+.expense-kpi{border-left:0;border-top:1px solid #e3edf4}
  .expense-kpi.total{grid-column:auto}
  .expense-filter-tabs{grid-template-columns:1fr}
  .expense-filter-tabs button{width:100%}
  .expense-entry-card{grid-template-columns:44px minmax(0,1fr)}
  .expense-entry-icon{width:44px;height:44px}
  .expense-entry-main>strong{font-size:1.03rem}
}


/* v4.04.1 App branding */
.branding-enterprise-dialog{width:min(680px,calc(100% - 28px))}
.branding-enterprise-form{display:grid;gap:15px;padding:22px}
.branding-enterprise-head p{margin:4px 0 0;color:#70839b;font-size:.9rem}
.branding-preview{display:grid;grid-template-columns:66px minmax(0,1fr);gap:14px;align-items:center;padding:16px;border:1px solid #d9e7f2;border-radius:20px;background:linear-gradient(180deg,#f8fbff,#fff)}
.branding-preview-logo{display:grid;width:66px;height:66px;place-items:center;border-radius:19px;background:linear-gradient(145deg,#23b8ff,#315cf4);color:#fff;font-size:1.8rem;font-weight:950;box-shadow:0 10px 22px rgba(8,120,239,.18)}
.branding-preview>div{display:grid;gap:3px;min-width:0}.branding-preview small{color:#0878ef;font-size:.72rem;font-weight:900;letter-spacing:.13em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.branding-preview strong{color:#122744;font-size:1.35rem;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.branding-preview span{color:#73869b;font-size:.84rem;font-weight:700}
.branding-enterprise-form>label{display:grid;gap:7px;color:#26394f;font-size:13px;font-weight:850}.branding-enterprise-form>label input{height:50px;border-radius:14px}.branding-enterprise-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.branding-enterprise-actions .btn{min-height:52px;border-radius:15px;font-weight:850}
@media(max-width:640px){.branding-enterprise-dialog{inset:auto 0 0 0;width:100%;max-width:100%;margin:0;border-radius:28px 28px 0 0;max-height:calc(100dvh - 8px)}.branding-enterprise-form{padding:18px}.branding-preview{grid-template-columns:56px minmax(0,1fr);padding:14px}.branding-preview-logo{width:56px;height:56px;border-radius:16px;font-size:1.55rem}.branding-preview strong{font-size:1.15rem}}

/* v4.04.2 Expense action cleanup */
.expense-center-actions.expense-center-actions-single{grid-template-columns:1fr!important}
.expense-center-actions.expense-center-actions-single .btn{width:100%;background:linear-gradient(135deg,#0f86f5,#076ce9);color:#fff;border:0;box-shadow:0 10px 22px rgba(8,120,239,.18)}


/* =========================================================
   v4.04.3 — Debt Dialog Responsive Sync
   Compact AquaFlow debt collection/detail dialogs for Safari/Android.
   ========================================================= */
.payment-enterprise-dialog,
.debt-detail-enterprise-dialog{
  overflow:hidden!important;
}
.payment-enterprise-form,
.debt-detail-enterprise-form{
  max-height:inherit;
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
}
.payment-submit-summary{display:none!important}
.payment-order-amount-wrap{
  display:grid;
  grid-template-columns:minmax(0,1fr) 42px;
  min-width:0;
  border:1px solid #cfdfec;
  border-radius:11px;
  overflow:hidden;
  background:#fff;
}
.payment-order-amount-wrap .payment-order-amount{
  width:100%!important;
  height:40px!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  text-align:right;
}
.payment-order-amount-wrap>b{
  display:grid;
  place-items:center;
  border-left:1px solid #dce8f1;
  background:#f7fbfe;
  color:#526a82;
  font-size:.78rem;
  font-weight:900;
}

@media(max-width:640px){
  .payment-enterprise-dialog{
    inset:auto 0 0 0!important;
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - 66px)!important;
    margin:0 0 66px!important;
    border-radius:24px 24px 0 0!important;
  }
  .payment-enterprise-form{
    gap:10px!important;
    padding:15px!important;
    max-height:calc(100dvh - 66px)!important;
  }
  .payment-enterprise-head{
    padding-bottom:10px!important;
    border-bottom:1px solid #e5edf4;
  }
  #payment-dialog .payment-enterprise-head small{
    font-size:.68rem!important;
    letter-spacing:.12em!important;
  }
  #payment-dialog .payment-enterprise-head h2{
    margin-top:2px!important;
    font-size:1.5rem!important;
    line-height:1.05!important;
  }
  #payment-dialog .payment-enterprise-head p{
    margin-top:4px!important;
    max-width:92%;
    font-size:.76rem!important;
    line-height:1.3!important;
  }
  #payment-dialog .payment-enterprise-head .icon-btn{
    width:44px!important;
    height:44px!important;
    border-radius:13px!important;
  }
  .payment-customer-select{
    display:grid!important;
    gap:6px!important;
    font-size:.8rem!important;
  }
  .payment-customer-select select{
    min-height:46px!important;
    padding:0 12px!important;
    border-radius:12px!important;
    font-size:.86rem!important;
  }
  .payment-customer-card{
    grid-template-columns:44px minmax(0,1fr) auto!important;
    gap:9px!important;
    padding:10px 12px!important;
    border-radius:15px!important;
  }
  .payment-customer-avatar{width:44px!important;height:44px!important;font-size:1.05rem!important}
  .payment-customer-copy strong{font-size:.9rem!important}
  .payment-customer-copy small{font-size:.76rem!important}
  .payment-customer-copy p{font-size:.67rem!important}
  .payment-customer-balance{min-width:112px!important;padding-left:9px!important}
  .payment-customer-balance span{font-size:.66rem!important}
  .payment-customer-balance strong{font-size:.96rem!important}
  .payment-mode-tabs,.payment-method-tabs{border-radius:12px!important}
  .payment-mode-tabs button,.payment-method-tabs button{
    min-height:44px!important;
    padding:0 8px!important;
    font-size:.8rem!important;
  }
  .payment-amount-section label{gap:6px!important;font-size:.8rem!important}
  .payment-amount-input{grid-template-columns:1fr 44px!important;border-radius:12px!important}
  .payment-amount-input input{height:48px!important;padding:0 12px!important;font-size:1.08rem!important}
  .payment-method-section{gap:6px!important;font-size:.8rem!important}
  .payment-order-panel{border-radius:14px!important;overflow:hidden!important}
  .payment-order-heading{padding:9px 10px!important}
  .payment-order-heading strong{font-size:.84rem!important}
  .payment-order-heading small{font-size:.66rem!important}
  .payment-order-heading label{font-size:.72rem!important}
  #payment-order-list{
    max-height:210px;
    overflow:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  .payment-order-row{
    grid-template-columns:30px minmax(0,1fr) 112px!important;
    grid-template-areas:"select identity remaining" "select amount amount"!important;
    min-height:0!important;
    gap:6px 8px!important;
    padding:9px 10px!important;
  }
  .payment-order-total{display:none!important}
  .payment-order-identity b{font-size:.78rem!important}
  .payment-order-identity small{font-size:.7rem!important}
  .payment-order-remaining{font-size:.76rem!important}
  .payment-order-amount-wrap{grid-area:amount;grid-template-columns:minmax(0,1fr) 38px;border-radius:10px}
  .payment-order-amount-wrap .payment-order-amount{height:38px!important;font-size:.8rem!important}
  .payment-meta-grid{grid-template-columns:1fr 1fr!important;gap:8px!important}
  .payment-meta-grid label{font-size:.72rem!important}
  .payment-meta-grid input{min-height:44px!important;padding:0 10px!important;font-size:.8rem!important}
  .payment-enterprise-actions{
    bottom:-15px!important;
    grid-template-columns:1fr 1.35fr!important;
    gap:9px!important;
    margin:0 -15px -15px!important;
    padding:10px 15px calc(10px + env(safe-area-inset-bottom))!important;
    border-top:1px solid #e5edf4!important;
    background:rgba(255,255,255,.98)!important;
  }
  .payment-enterprise-actions .btn{
    min-height:48px!important;
    border-radius:13px!important;
    font-size:.88rem!important;
  }

  .debt-detail-enterprise-dialog{
    inset:auto 0 0 0!important;
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - 66px)!important;
    margin:0 0 66px!important;
    border-radius:24px 24px 0 0!important;
  }
  .debt-detail-enterprise-form{
    gap:10px!important;
    padding:15px!important;
    max-height:calc(100dvh - 66px)!important;
  }
  .debt-detail-enterprise-head{padding-bottom:10px!important}
  .debt-detail-enterprise-head small{font-size:.68rem!important}
  .debt-detail-enterprise-head h2{font-size:1.5rem!important}
  .debt-detail-enterprise-head p{font-size:.78rem!important}
  .debt-detail-enterprise-head .icon-btn{width:42px!important;height:42px!important;border-radius:12px!important}
  .debt-detail-summary{
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:10px!important;
    padding:12px 14px!important;
    border-radius:15px!important;
  }
  .debt-detail-summary>div:first-child>span{font-size:.76rem!important}
  .debt-detail-summary strong{font-size:1.35rem!important}
  .debt-detail-summary-meta{min-width:90px!important;padding-left:10px!important}
  .debt-detail-summary-meta span{font-size:.6rem!important}
  .debt-detail-summary-meta b{font-size:.86rem!important}
  .debt-detail-list{gap:9px!important}
  .debt-lot{border-radius:15px!important}
  .debt-lot-head{gap:8px!important;padding:10px 11px!important}
  .debt-lot-index{width:30px!important;height:30px!important;flex-basis:30px!important;font-size:.82rem!important}
  .debt-lot-head time{font-size:.82rem!important}
  .debt-lot-title small{font-size:.69rem!important}
  .debt-lot-balance span{font-size:.64rem!important}
  .debt-lot-balance strong{font-size:.88rem!important}
  .debt-lot-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important;padding:9px 10px!important}
  .debt-lot-grid div{padding:8px!important;border-radius:10px!important}
  .debt-lot-grid span{font-size:.59rem!important}
  .debt-lot-grid strong{font-size:.78rem!important}
  .debt-lot-note{margin:0 10px 8px!important;padding:8px 9px!important;font-size:.7rem!important}
  .debt-lot-actions{padding:0 10px 10px!important}
  .debt-lot-actions .debt-lot-pay{width:100%!important;min-height:42px!important;border-radius:11px!important;font-size:.82rem!important}
  .debt-detail-actions{
    bottom:-15px!important;
    gap:9px!important;
    margin:0 -15px -15px!important;
    padding:10px 15px calc(10px + env(safe-area-inset-bottom))!important;
  }
  .debt-detail-actions .btn{min-height:48px!important;border-radius:13px!important;font-size:.86rem!important}
}

@media(max-width:390px){
  .payment-enterprise-dialog,.debt-detail-enterprise-dialog{max-height:calc(100dvh - 58px)!important;margin-bottom:58px!important}
  .payment-enterprise-form,.debt-detail-enterprise-form{max-height:calc(100dvh - 58px)!important;padding:12px!important}
  .payment-customer-card{grid-template-columns:40px minmax(0,1fr)!important}
  .payment-customer-avatar{width:40px!important;height:40px!important}
  .payment-customer-balance{grid-column:1/-1!important;display:flex!important;align-items:center!important;justify-content:space-between!important;padding:7px 0 0!important;border-left:0!important;border-top:1px solid #e3edf4!important;text-align:left!important}
  .payment-customer-balance strong{margin:0!important}
  .payment-meta-grid{grid-template-columns:1fr!important}
  #payment-order-list{max-height:185px}
  .payment-enterprise-actions,.debt-detail-actions{margin-left:-12px!important;margin-right:-12px!important;margin-bottom:-12px!important;padding-left:12px!important;padding-right:12px!important}
}

@media (display-mode: standalone) and (max-width:640px){
  .payment-enterprise-dialog,.debt-detail-enterprise-dialog{
    max-height:calc(100dvh - 8px)!important;
    margin-bottom:0!important;
  }
  .payment-enterprise-form,.debt-detail-enterprise-form{max-height:calc(100dvh - 8px)!important}
}

/* v4.04.4 — Delivery closed-day guard */
.delivery-date-lock{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border:1px solid #ffd1d4;border-radius:16px;background:#fff6f6;color:#8f2730}
.delivery-date-lock>div{display:grid;gap:3px;min-width:0}
.delivery-date-lock strong{font-size:.95rem;color:#be2633}
.delivery-date-lock span{font-size:.82rem;line-height:1.35;color:#86555a}
.delivery-date-lock .btn{min-height:42px;white-space:nowrap;border-color:#ef9ca4;color:#b72a35;background:#fff}
#delivery-submit:disabled{opacity:.48;cursor:not-allowed;filter:grayscale(.15)}
@media(max-width:640px){
  .delivery-date-lock{align-items:stretch;flex-direction:column}
  .delivery-date-lock .btn{width:100%}
}


/* v4.04.6 — Expense Top Compact */
#operations > #operation-expenses.expense-center-card{
  margin:12px 0 16px!important;
  padding:16px!important;
  border-radius:22px!important;
}
#operations > #operation-expenses .expense-center-head{margin-bottom:11px}
#operations > #operation-expenses .expense-center-head h2{font-size:1.7rem}
#operations > #operation-expenses .expense-center-head p{margin-top:4px;font-size:.86rem}
#operations > #operation-expenses .expense-kpi-grid{border-radius:16px}
#operations > #operation-expenses .expense-kpi{grid-template-columns:40px minmax(0,1fr);gap:9px;padding:11px 12px}
#operations > #operation-expenses .expense-kpi-icon{width:40px;height:40px;font-size:1.05rem}
#operations > #operation-expenses .expense-kpi small{font-size:.72rem}
#operations > #operation-expenses .expense-kpi strong{font-size:1.08rem}
#operations > #operation-expenses .expense-kpi.total strong{font-size:1.06rem}
#operations > #operation-expenses .expense-kpi em{margin-top:2px;font-size:.72rem}
#operations > #operation-expenses .expense-center-actions{margin-top:11px}
#operations > #operation-expenses .expense-center-actions .btn{min-height:48px;border-radius:14px;font-size:.95rem}
#operations > #operation-expenses .expense-filter-tabs{gap:7px;margin:10px 0}
#operations > #operation-expenses .expense-filter-tabs button{min-height:40px;border-radius:13px;font-size:.8rem}
#operations > #operation-expenses .expense-card-list{gap:9px}
#operations > #operation-expenses .expense-entry-card{grid-template-columns:46px minmax(0,1fr) auto;gap:10px;padding:11px 12px;border-radius:16px}
#operations > #operation-expenses .expense-entry-icon{width:46px;height:46px;font-size:1.08rem}
#operations > #operation-expenses .expense-entry-main>strong{font-size:1rem}
#operations > #operation-expenses .expense-entry-main small{gap:5px;margin-top:3px;font-size:.77rem}
#operations > #operation-expenses .expense-entry-main p{margin-top:4px;font-size:.74rem}
#operations > #operation-expenses .expense-entry-side{gap:5px;min-width:104px}
#operations > #operation-expenses .expense-status{min-height:27px;padding:0 8px;font-size:.7rem}
#operations > #operation-expenses .expense-status b{width:16px;height:16px;font-size:.64rem}
#operations > #operation-expenses .expense-entry-amount{font-size:1rem}
#operations > #operation-expenses .expense-action{min-height:32px;padding:0 10px;border-radius:10px;font-size:.72rem}
#operations > #operation-expenses .expense-source-note{grid-template-columns:30px minmax(0,1fr);gap:8px;margin-top:10px;padding:10px 11px;border-radius:13px}
#operations > #operation-expenses .expense-source-note>span{width:28px;height:28px;font-size:.85rem}
#operations > #operation-expenses .expense-source-note strong{font-size:.8rem}
#operations > #operation-expenses .expense-source-note p{margin-top:2px;font-size:.72rem;line-height:1.3}

@media(max-width:760px){
  #operations > #operation-expenses.expense-center-card{padding:13px!important;border-radius:19px!important}
  #operations > #operation-expenses .expense-center-head{margin-bottom:9px}
  #operations > #operation-expenses .expense-center-head h2{font-size:1.48rem}
  #operations > #operation-expenses .expense-center-head p{font-size:.8rem}
  #operations > #operation-expenses .expense-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  #operations > #operation-expenses .expense-kpi.total{grid-column:auto!important;border-top:0!important;border-left:1px solid #e3edf4!important}
  #operations > #operation-expenses .expense-kpi:nth-child(2){border-left:1px solid #e3edf4!important}
  #operations > #operation-expenses .expense-kpi{grid-template-columns:32px minmax(0,1fr)!important;gap:7px;padding:9px 8px}
  #operations > #operation-expenses .expense-kpi-icon{width:32px;height:32px;font-size:.9rem}
  #operations > #operation-expenses .expense-kpi small{font-size:.64rem;line-height:1.1}
  #operations > #operation-expenses .expense-kpi strong{font-size:.96rem;margin-top:1px}
  #operations > #operation-expenses .expense-kpi.total strong{font-size:.9rem;white-space:nowrap}
  #operations > #operation-expenses .expense-kpi em{font-size:.64rem;white-space:nowrap}
  #operations > #operation-expenses .expense-center-actions{grid-template-columns:1fr!important;margin-top:9px}
  #operations > #operation-expenses .expense-center-actions .btn{min-height:44px;font-size:.9rem}
  #operations > #operation-expenses .expense-filter-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px;margin:9px 0}
  #operations > #operation-expenses .expense-filter-tabs button{width:auto!important;min-height:38px;padding:0 5px;font-size:.74rem}
  #operations > #operation-expenses .expense-entry-card{grid-template-columns:42px minmax(0,1fr) auto!important;gap:9px;padding:10px}
  #operations > #operation-expenses .expense-entry-icon{width:42px;height:42px;font-size:1rem}
  #operations > #operation-expenses .expense-entry-side{grid-column:3!important;grid-row:1!important;display:grid!important;grid-template-columns:1fr!important;justify-items:end!important;align-self:center!important;min-width:96px;width:auto!important;gap:5px}
  #operations > #operation-expenses .expense-entry-amount{grid-column:auto!important;font-size:.96rem}
  #operations > #operation-expenses .expense-card-actions{justify-content:flex-end!important;gap:5px}
  #operations > #operation-expenses .expense-entry-main>strong{font-size:.98rem}
  #operations > #operation-expenses .expense-entry-main small{font-size:.73rem}
}

@media(max-width:420px){
  #operations > #operation-expenses .expense-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  #operations > #operation-expenses .expense-kpi+.expense-kpi{border-top:0!important}
  #operations > #operation-expenses .expense-kpi{grid-template-columns:1fr!important;justify-items:center;text-align:center;gap:4px;padding:8px 4px}
  #operations > #operation-expenses .expense-kpi-icon{width:30px;height:30px}
  #operations > #operation-expenses .expense-kpi small{font-size:.59rem}
  #operations > #operation-expenses .expense-kpi strong{font-size:.9rem}
  #operations > #operation-expenses .expense-kpi.total strong{font-size:.82rem}
  #operations > #operation-expenses .expense-kpi em{font-size:.6rem}
  #operations > #operation-expenses .expense-filter-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  #operations > #operation-expenses .expense-filter-tabs button{font-size:.69rem}
  #operations > #operation-expenses .expense-entry-card{grid-template-columns:38px minmax(0,1fr) auto!important;gap:7px;padding:9px}
  #operations > #operation-expenses .expense-entry-icon{width:38px;height:38px}
  #operations > #operation-expenses .expense-entry-main>strong{font-size:.92rem}
  #operations > #operation-expenses .expense-entry-main small{font-size:.67rem}
  #operations > #operation-expenses .expense-entry-side{min-width:88px}
  #operations > #operation-expenses .expense-status{font-size:.64rem;padding:0 6px}
  #operations > #operation-expenses .expense-entry-amount{font-size:.88rem}
  #operations > #operation-expenses .expense-action{min-height:29px;padding:0 8px;font-size:.66rem}
  #operations > #operation-expenses .expense-source-note p{font-size:.67rem}
}

/* v4.04.6 — Operations Top Actions + unified bottle/full reset */
#operations > .operations-top-actions{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
  margin:8px 0 12px!important;
}
#operations > .operations-top-actions .operations-command{
  min-height:64px;
  padding:8px 9px;
  border-radius:15px;
  grid-template-columns:30px minmax(0,1fr);
  column-gap:8px;
}
#operations > .operations-top-actions .operations-command>span{
  width:30px;
  height:30px;
  border-radius:9px;
  font-size:.92rem;
}
#operations > .operations-top-actions .operations-command strong{
  font-size:.78rem;
  line-height:1.12;
}
#operations > .operations-top-actions .operations-command small{
  font-size:.61rem;
  line-height:1.15;
}
#operations > .operations-top-actions .operations-command.neutral>span{
  background:#f1f5f9;
  color:#557189;
}
#operations .stock-ledger-reset-empty{
  border-color:#f06a5f;
  color:#cf3a31;
  background:#fff;
}
@media(max-width:760px){
  #operations > .operations-top-actions{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:5px!important;
    margin:6px 0 9px!important;
  }
  #operations > .operations-top-actions .operations-command{
    min-height:55px;
    padding:6px 4px;
    grid-template-columns:1fr;
    grid-template-rows:24px auto;
    gap:3px;
    place-items:center;
    text-align:center;
    border-radius:12px;
  }
  #operations > .operations-top-actions .operations-command>span{
    grid-row:auto;
    width:24px;
    height:24px;
    border-radius:7px;
    font-size:.74rem;
  }
  #operations > .operations-top-actions .operations-command strong{
    font-size:.66rem;
    line-height:1.06;
    white-space:normal;
  }
  #operations > .operations-top-actions .operations-command small{display:none}
}
@media(max-width:390px){
  #operations > .operations-top-actions{gap:4px!important}
  #operations > .operations-top-actions .operations-command strong{font-size:.61rem}
  #operations > .operations-top-actions .operations-command{padding-left:2px;padding-right:2px}
}

/* =========================================================
   v4.04.7 — Debt payment order row layout fix
   Prevents iOS Safari from breaking the per-order amount field.
   ========================================================= */
#payment-dialog .payment-order-row-v4047{
  display:grid!important;
  grid-template-columns:34px minmax(0,1fr)!important;
  grid-template-areas:none!important;
  align-items:start!important;
  gap:10px!important;
  padding:12px!important;
}
#payment-dialog .payment-order-row-v4047 .payment-order-select{
  grid-area:auto!important;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding-top:5px;
}
#payment-dialog .payment-order-main{
  min-width:0;
  display:grid;
  gap:8px;
}
#payment-dialog .payment-order-top{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:start;
}
#payment-dialog .payment-order-row-v4047 .payment-order-identity,
#payment-dialog .payment-order-row-v4047 .payment-order-remaining,
#payment-dialog .payment-order-row-v4047 .payment-order-total,
#payment-dialog .payment-order-row-v4047 .payment-order-amount-wrap{
  grid-area:auto!important;
}
#payment-dialog .payment-order-row-v4047 .payment-order-identity{
  display:grid;
  gap:2px;
  min-width:0;
}
#payment-dialog .payment-order-row-v4047 .payment-order-identity b{
  color:#18324c;
  font-size:.88rem!important;
  line-height:1.15;
}
#payment-dialog .payment-order-row-v4047 .payment-order-identity small{
  color:#73879a;
  font-size:.76rem!important;
}
#payment-dialog .payment-order-row-v4047 .payment-order-remaining{
  display:grid;
  gap:2px;
  min-width:112px;
  text-align:right!important;
  white-space:nowrap;
}
#payment-dialog .payment-order-row-v4047 .payment-order-remaining::before{content:none!important}
#payment-dialog .payment-order-row-v4047 .payment-order-remaining small{
  color:#8798a9;
  font-size:.66rem;
  font-weight:750;
}
#payment-dialog .payment-order-row-v4047 .payment-order-remaining strong{
  color:#db2b38;
  font-size:.88rem;
  font-weight:900;
}
#payment-dialog .payment-order-meta{
  display:flex!important;
  flex-wrap:wrap;
  gap:5px 12px;
  color:#6e8296;
  font-size:.68rem!important;
}
#payment-dialog .payment-order-meta span{white-space:nowrap}
#payment-dialog .payment-order-meta .payment-order-after{
  color:#0878ef;
  font-weight:800;
}
#payment-dialog .payment-order-collect{
  display:grid;
  grid-template-columns:auto minmax(120px,220px);
  align-items:center;
  justify-content:end;
  gap:8px;
  margin:0;
  color:#60758a;
  font-size:.7rem;
  font-weight:800;
}
#payment-dialog .payment-order-amount-wrap{
  display:flex!important;
  align-items:stretch;
  min-width:0;
  width:100%;
  height:42px;
  border:1px solid #cfdfea;
  border-radius:11px;
  overflow:hidden;
  background:#fff;
}
#payment-dialog .payment-order-amount-wrap .payment-order-amount{
  flex:1 1 auto;
  min-width:0;
  width:100%!important;
  height:40px!important;
  margin:0!important;
  padding:0 12px!important;
  border:0!important;
  border-radius:0!important;
  background:#fff!important;
  box-shadow:none!important;
  color:#14283e;
  font-size:.9rem!important;
  font-weight:900!important;
  text-align:right!important;
  appearance:textfield;
  -moz-appearance:textfield;
}
#payment-dialog .payment-order-amount-wrap .payment-order-amount::-webkit-outer-spin-button,
#payment-dialog .payment-order-amount-wrap .payment-order-amount::-webkit-inner-spin-button{
  margin:0;
  -webkit-appearance:none;
}
#payment-dialog .payment-order-amount-wrap>b{
  flex:0 0 42px;
  display:grid;
  place-items:center;
  border-left:1px solid #dbe7f0;
  background:#f7fbfe;
  color:#526a82;
  font-size:.8rem;
  font-weight:900;
}
@media(max-width:640px){
  #payment-dialog #payment-order-list{max-height:230px!important}
  #payment-dialog .payment-order-row-v4047{grid-template-columns:30px minmax(0,1fr)!important;gap:8px!important;padding:10px!important}
  #payment-dialog .payment-order-meta{display:none!important}
  #payment-dialog .payment-order-collect{grid-template-columns:92px minmax(0,1fr);justify-content:stretch}
  #payment-dialog .payment-order-amount-wrap{height:44px}
  #payment-dialog .payment-order-amount-wrap .payment-order-amount{height:42px!important;font-size:.92rem!important}
  #payment-dialog .payment-order-amount-wrap>b{flex-basis:40px}
}
@media(max-width:390px){
  #payment-dialog .payment-order-row-v4047 .payment-order-remaining{min-width:96px}
  #payment-dialog .payment-order-row-v4047 .payment-order-remaining strong{font-size:.82rem}
  #payment-dialog .payment-order-collect{grid-template-columns:80px minmax(0,1fr)}
}


/* v4.04.7.1 — Live Command hotfix: đồng bộ giao hàng trực tiếp */
.aquaflow-overview .overview-day-readiness.has-recorded-deliveries,
.overview-day-readiness.has-recorded-deliveries{
  background:linear-gradient(135deg,#075fd3 0%,#0a7fee 52%,#39aef8 100%)!important;
}
.aquaflow-overview .overview-day-readiness.has-recorded-deliveries .overview-readiness-progress,
.overview-day-readiness.has-recorded-deliveries .overview-readiness-progress{
  background:rgba(255,255,255,.18)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.26)!important;
}
.aquaflow-overview .overview-day-readiness.has-recorded-deliveries .overview-readiness-progress:before,
.overview-day-readiness.has-recorded-deliveries .overview-readiness-progress:before{
  background:linear-gradient(145deg,rgba(21,131,235,.96),rgba(45,166,246,.94))!important;
}


/* =========================================================
   v4.04.7.2 — iOS Safari Input Zoom Fix
   Safari tự phóng trang khi focus input có font-size < 16px.
   Giữ khả năng pinch-zoom/accessibility; chỉ chuẩn hóa form controls.
   ========================================================= */
@media (max-width: 768px) {
  body.unified-shell dialog :is(input, select, textarea),
  body.unified-shell #order-dialog :is(input, select, textarea),
  body.unified-shell #delivery-dialog :is(input, select, textarea),
  body.unified-shell #payment-dialog :is(input, select, textarea),
  body.unified-shell #expense-dialog :is(input, select, textarea),
  body.unified-shell #receipt-dialog :is(input, select, textarea),
  body.unified-shell #debt-dialog :is(input, select, textarea),
  body.staff-mode dialog :is(input, select, textarea),
  body.management-mode dialog :is(input, select, textarea) {
    font-size: 16px !important;
  }

  /* Search fields trong popup cũng phải >=16px, nếu không iPhone vẫn zoom. */
  body.unified-shell #order-dialog .order-customer-search-box input,
  body.unified-shell #delivery-dialog .delivery-customer-search-box input,
  body.unified-shell #payment-dialog .payment-customer-select select,
  body.unified-shell #payment-dialog .payment-meta-grid input {
    font-size: 16px !important;
  }

  /* Các ô số quan trọng giữ chữ lớn, rõ sau khi bỏ auto zoom. */
  body.unified-shell #order-dialog input[type="number"],
  body.unified-shell #delivery-dialog input[type="number"],
  body.unified-shell #payment-dialog input[type="number"],
  body.unified-shell #expense-dialog input[type="number"] {
    font-size: 17px !important;
  }
}


/* =========================================================
   v4.04.7.3 — Admin debt typography + staff debt detail fix
   ========================================================= */
@media(max-width:640px){
  /* Admin: giảm nhẹ cỡ chữ danh sách công nợ, giữ chữ rõ nhưng bớt nặng/chiếm chỗ. */
  body.management-mode #debts .debt-list-new .debtor{
    gap:10px!important;
    min-height:68px!important;
    padding:10px 12px!important;
  }
  body.management-mode #debts .debt-list-new .debtor>div:first-child strong{
    font-size:1.02rem!important;
    line-height:1.18!important;
  }
  body.management-mode #debts .debt-list-new .debtor .muted{
    margin-top:4px!important;
    font-size:.82rem!important;
    line-height:1.25!important;
  }
  body.management-mode #debts .debt-list-new .debtor>div:last-child{
    gap:8px!important;
  }
  body.management-mode #debts .debt-list-new .debtor>div:last-child>strong{
    font-size:1rem!important;
    line-height:1.1!important;
  }
  body.management-mode #debts .debt-list-new .debtor .edit{
    min-width:82px!important;
    min-height:40px!important;
    padding:0 11px!important;
    border-radius:12px!important;
    font-size:.8rem!important;
  }

  /* Nhân viên: popup chi tiết nợ không để phần nội dung cũ trượt ẩn dưới header sticky. */
  body.staff-mode #debt-detail-dialog,
  body[data-role="staff"] #debt-detail-dialog{
    scroll-padding-top:92px!important;
  }
  body.staff-mode #debt-detail-dialog .debt-detail-enterprise-head,
  body[data-role="staff"] #debt-detail-dialog .debt-detail-enterprise-head{
    top:-18px!important;
    z-index:20!important;
  }
  body.staff-mode #debt-detail-dialog .debt-detail-summary,
  body[data-role="staff"] #debt-detail-dialog .debt-detail-summary{
    scroll-margin-top:96px!important;
  }
}


/* =========================================================
   v4.04.7.4 — Staff Debt Modal Bottom-Safe Fix
   Sửa popup Thu nợ trên app nhân viên bị mất phần Ngày thu/Ghi chú/nút lưu
   do footer xếp dọc + thanh tab mobile chiếm vùng đáy.
   ========================================================= */
@media(max-width:640px){
  body.unified-shell.staff-mode #payment-dialog.payment-enterprise-dialog{
    /* Chừa đúng vùng cho bottom navigation của app nhân viên. */
    max-height:calc(100dvh - 84px - env(safe-area-inset-bottom))!important;
    margin:0 0 calc(76px + env(safe-area-inset-bottom))!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-form{
    max-height:calc(100dvh - 84px - env(safe-area-inset-bottom))!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-padding-bottom:82px!important;
  }

  /* Danh sách đơn tự cuộn, không đẩy phần Ngày thu/Ghi chú ra khỏi màn hình. */
  body.unified-shell.staff-mode #payment-dialog #payment-order-list{
    max-height:min(190px,25dvh)!important;
    overflow-y:auto!important;
  }

  /* Footer luôn 2 nút một hàng trên nhân viên, kể cả iPhone hẹp <=430px. */
  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-actions{
    position:sticky!important;
    bottom:0!important;
    z-index:8!important;
    display:grid!important;
    grid-template-columns:minmax(0,.82fr) minmax(0,1.35fr)!important;
    gap:8px!important;
    margin:2px -15px -15px!important;
    padding:9px 15px calc(9px + env(safe-area-inset-bottom))!important;
    background:rgba(255,255,255,.985)!important;
    box-shadow:0 -8px 22px rgba(20,54,79,.08)!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-actions .btn{
    min-width:0!important;
    min-height:46px!important;
    padding-inline:9px!important;
    font-size:.84rem!important;
    white-space:nowrap!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-meta-grid{
    position:relative!important;
    z-index:1!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
    padding-bottom:2px!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-meta-grid input{
    min-width:0!important;
    width:100%!important;
  }
}

@media(max-width:390px){
  body.unified-shell.staff-mode #payment-dialog.payment-enterprise-dialog{
    max-height:calc(100dvh - 80px - env(safe-area-inset-bottom))!important;
    margin-bottom:calc(72px + env(safe-area-inset-bottom))!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-form{
    max-height:calc(100dvh - 80px - env(safe-area-inset-bottom))!important;
    padding:12px!important;
  }

  body.unified-shell.staff-mode #payment-dialog #payment-order-list{
    max-height:min(170px,23dvh)!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-actions{
    grid-template-columns:minmax(0,.78fr) minmax(0,1.4fr)!important;
    margin-left:-12px!important;
    margin-right:-12px!important;
    margin-bottom:-12px!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }
}

/* PWA standalone vẫn phải chừa bottom navigation của app nhân viên. */
@media (display-mode: standalone) and (max-width:640px){
  body.unified-shell.staff-mode #payment-dialog.payment-enterprise-dialog{
    max-height:calc(100dvh - 82px - env(safe-area-inset-bottom))!important;
    margin-bottom:calc(74px + env(safe-area-inset-bottom))!important;
  }
  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-form{
    max-height:calc(100dvh - 82px - env(safe-area-inset-bottom))!important;
  }
}


/* =========================================================
   v4.04.7.6 — Staff Debt Fullscreen Dialog
   Popup Ghi thu nợ trên app nhân viên chiếm toàn bộ viewport.
   Header/footer cố định; phần nội dung giữa cuộn độc lập.
   ========================================================= */
@media(max-width:640px){
  body.unified-shell.staff-mode #payment-dialog.payment-enterprise-dialog,
  body.staff-mode #payment-dialog.payment-enterprise-dialog,
  body[data-role="staff"] #payment-dialog.payment-enterprise-dialog{
    position:fixed!important;
    inset:0!important;
    width:100dvw!important;
    max-width:none!important;
    height:100dvh!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-form,
  body.staff-mode #payment-dialog .payment-enterprise-form,
  body[data-role="staff"] #payment-dialog .payment-enterprise-form{
    display:flex!important;
    flex-direction:column!important;
    gap:0!important;
    width:100%!important;
    height:100dvh!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:linear-gradient(180deg,#fff 0,#f9fcff 100%)!important;
  }

  /* Header luôn ở đầu màn hình. */
  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-head,
  body.staff-mode #payment-dialog .payment-enterprise-head,
  body[data-role="staff"] #payment-dialog .payment-enterprise-head{
    position:sticky!important;
    top:0!important;
    z-index:30!important;
    flex:0 0 auto!important;
    margin:0!important;
    padding:calc(14px + env(safe-area-inset-top)) 16px 13px!important;
    border-bottom:1px solid #dce8f1!important;
    background:rgba(255,255,255,.985)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-head h2,
  body.staff-mode #payment-dialog .payment-enterprise-head h2,
  body[data-role="staff"] #payment-dialog .payment-enterprise-head h2{
    font-size:1.48rem!important;
    line-height:1.05!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-head p,
  body.staff-mode #payment-dialog .payment-enterprise-head p,
  body[data-role="staff"] #payment-dialog .payment-enterprise-head p{
    margin-top:4px!important;
    font-size:.78rem!important;
    line-height:1.28!important;
  }

  /* Tất cả trường nội dung cuộn ở vùng giữa. */
  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-form > :not(.payment-enterprise-head):not(.payment-enterprise-actions),
  body.staff-mode #payment-dialog .payment-enterprise-form > :not(.payment-enterprise-head):not(.payment-enterprise-actions),
  body[data-role="staff"] #payment-dialog .payment-enterprise-form > :not(.payment-enterprise-head):not(.payment-enterprise-actions){
    flex:0 0 auto!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-form{
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    scroll-padding-top:100px!important;
    scroll-padding-bottom:92px!important;
    padding-bottom:0!important;
  }

  /* Khoảng cách nội dung khi form dùng chính nó làm scroller. */
  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-form > :not(.payment-enterprise-head):not(.payment-enterprise-actions){
    margin-left:14px!important;
    margin-right:14px!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-form > .payment-customer-select{
    margin-top:12px!important;
  }

  /* Danh sách đơn không cần quá cao; vẫn cuộn riêng khi có nhiều đơn. */
  body.unified-shell.staff-mode #payment-dialog #payment-order-list{
    max-height:min(230px,28dvh)!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-meta-grid{
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
    padding-bottom:10px!important;
  }

  /* Footer cố định ở đáy viewport, che toàn bộ bottom navigation bên dưới. */
  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-actions,
  body.staff-mode #payment-dialog .payment-enterprise-actions,
  body[data-role="staff"] #payment-dialog .payment-enterprise-actions{
    position:sticky!important;
    bottom:0!important;
    z-index:40!important;
    display:grid!important;
    grid-template-columns:minmax(0,.82fr) minmax(0,1.35fr)!important;
    gap:9px!important;
    flex:0 0 auto!important;
    margin:0!important;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom))!important;
    border-top:1px solid #dce8f1!important;
    background:rgba(255,255,255,.985)!important;
    box-shadow:0 -10px 26px rgba(20,54,79,.10)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-actions .btn{
    min-height:48px!important;
    min-width:0!important;
    padding:10px 8px!important;
    font-size:.88rem!important;
    white-space:nowrap!important;
  }

  /* Không để thanh tab nhân viên nổi phía trên popup fullscreen. */
  body.unified-shell.staff-mode:has(#payment-dialog[open]) .staff-bottom-nav,
  body.unified-shell.staff-mode:has(#payment-dialog[open]) .mobile-bottom-nav,
  body.unified-shell.staff-mode:has(#payment-dialog[open]) nav.bottom-nav{
    visibility:hidden!important;
    pointer-events:none!important;
  }
}

@media(max-width:390px){
  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-head{
    padding-left:12px!important;
    padding-right:12px!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-form > :not(.payment-enterprise-head):not(.payment-enterprise-actions){
    margin-left:12px!important;
    margin-right:12px!important;
  }

  body.unified-shell.staff-mode #payment-dialog #payment-order-list{
    max-height:min(205px,26dvh)!important;
  }

  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-actions{
    grid-template-columns:minmax(0,.78fr) minmax(0,1.42fr)!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }
}


/* =========================================================
   v4.04.7.6 — Assistant Viewer / Phụ xe chỉ xem
   ========================================================= */
.assistant-viewer-dashboard{
  display:grid;
  gap:16px;
  padding:2px 0 24px;
}
.assistant-viewer-title,
.assistant-section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
}
.assistant-viewer-title small,
.assistant-section-head small{
  color:#0878ef;
  font-weight:900;
  letter-spacing:.16em;
}
.assistant-viewer-title h2{
  margin:4px 0 2px;
  font-size:1.8rem;
  line-height:1.08;
  color:#10243d;
}
.assistant-viewer-title p,
.assistant-section-head p{
  margin:0;
  color:#72869c;
}
.assistant-viewer-badge{
  padding:9px 13px;
  border:1px solid #cfe3f5;
  border-radius:999px;
  background:#eef7ff;
  color:#0878ef;
  font-weight:900;
  white-space:nowrap;
}
.assistant-today-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.assistant-kpi{
  min-width:0;
  padding:18px;
  border:1px solid #d4e6f4;
  border-radius:22px;
  background:#fff;
  box-shadow:0 10px 26px rgba(44,91,128,.07);
}
.assistant-kpi small{
  display:block;
  margin-bottom:8px;
  color:#70859b;
  font-weight:900;
  letter-spacing:.09em;
}
.assistant-kpi strong{
  display:block;
  font-size:1.65rem;
  line-height:1.08;
  color:#10243d;
}
.assistant-kpi span{
  display:block;
  margin-top:7px;
  color:#6f8498;
  font-weight:700;
}
.assistant-kpi-primary{
  border-color:#8dc7fa;
  background:linear-gradient(145deg,#f6fbff,#eaf5ff);
}
.assistant-kpi-primary strong{color:#0878ef}
.assistant-kpi-salary{
  border-color:#a8e1cd;
  background:linear-gradient(145deg,#f7fffc,#ecfbf5);
}
.assistant-kpi-salary strong{color:#079566}
.assistant-today-work,
.assistant-week-payroll{
  padding:18px;
  border:1px solid #d3e5f3;
  border-radius:24px;
  background:#fff;
  box-shadow:0 10px 28px rgba(44,91,128,.06);
}
.assistant-section-head h3{
  margin:3px 0;
  font-size:1.28rem;
  color:#10243d;
}
.assistant-section-head > span,
.assistant-section-head > strong{
  padding:8px 12px;
  border-radius:999px;
  background:#eef7ff;
  color:#0878ef;
  font-weight:900;
}
.assistant-today-list,
.assistant-week-days-list{
  display:grid;
  gap:8px;
  margin-top:14px;
}
.assistant-work-row,
.assistant-week-row{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  min-width:0;
  padding:13px;
  border:1px solid #deebf5;
  border-radius:17px;
  background:#fbfdff;
}
.assistant-work-index{
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border-radius:12px;
  background:#e8f4ff;
  color:#0878ef;
  font-weight:900;
}
.assistant-work-row div,
.assistant-week-row div{min-width:0}
.assistant-work-row strong,
.assistant-week-row strong{
  display:block;
  color:#17304b;
  font-size:1rem;
}
.assistant-work-row small,
.assistant-week-row small{
  display:block;
  margin-top:3px;
  color:#74889c;
}
.assistant-work-row b,
.assistant-week-row b{
  color:#0878ef;
  font-size:1rem;
  white-space:nowrap;
}
.assistant-empty{
  padding:18px;
  border-radius:16px;
  background:#f5f8fb;
  color:#788a9b;
  text-align:center;
  font-weight:700;
}
.assistant-week-summary{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin:14px 0 4px;
}
.assistant-week-summary span{
  padding:10px;
  border-radius:14px;
  background:#f3f8fc;
  text-align:center;
}
.assistant-week-summary b{
  display:block;
  color:#17304b;
  font-size:1.08rem;
}
.assistant-week-summary small{
  color:#7c8fa1;
  font-size:.72rem;
}
.assistant-week-day{
  display:grid;
  place-items:center;
  width:54px;
  min-height:50px;
  border-radius:14px;
  background:#edf7ff;
  color:#0878ef;
  font-weight:900;
}
.assistant-week-day small{
  margin-top:1px;
  color:#6686a1;
  font-size:.64rem;
}
.assistant-week-row.is-today{
  border-color:#7fc3ff;
  background:#f2f9ff;
}
.assistant-week-row.is-empty{
  opacity:.64;
}
.assistant-readonly-note{
  margin:0;
  padding:13px 15px;
  border-radius:16px;
  background:#f5f8fb;
  color:#6e8193;
  font-size:.86rem;
  line-height:1.45;
}

/* Phụ xe chỉ có một dashboard: không hiển thị menu chức năng hay phần nghiệp vụ khác. */
body.assistant-viewer-mode .tabs{
  display:none!important;
}
body.assistant-viewer-mode #overview > :not(#assistant-viewer-dashboard){
  display:none!important;
}
body.assistant-viewer-mode #assistant-viewer-dashboard{
  display:grid!important;
}
body.assistant-viewer-mode .header .customer-add{
  display:none!important;
}
body.assistant-viewer-mode .shell{
  padding-bottom:max(20px,env(safe-area-inset-bottom))!important;
}

@media(max-width:640px){
  body.assistant-viewer-mode .shell{
    padding:10px 12px calc(16px + env(safe-area-inset-bottom))!important;
  }
  body.assistant-viewer-mode .header{
    margin-bottom:14px!important;
  }
  body.assistant-viewer-mode .header .brand h1{
    font-size:1.25rem!important;
  }
  body.assistant-viewer-mode #overview{
    padding-bottom:0!important;
  }
  .assistant-viewer-dashboard{
    gap:12px;
  }
  .assistant-viewer-title h2{
    font-size:1.55rem;
  }
  .assistant-viewer-badge{
    max-width:42%;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .assistant-today-grid{
    gap:9px;
  }
  .assistant-kpi{
    padding:14px;
    border-radius:18px;
  }
  .assistant-kpi small{
    font-size:.68rem;
    letter-spacing:.06em;
  }
  .assistant-kpi strong{
    font-size:1.38rem;
  }
  .assistant-today-work,
  .assistant-week-payroll{
    padding:14px;
    border-radius:20px;
  }
  .assistant-work-row,
  .assistant-week-row{
    gap:9px;
    padding:11px;
  }
  .assistant-week-day{
    width:46px;
    min-height:46px;
  }
  .assistant-work-row b,
  .assistant-week-row b{
    font-size:.9rem;
  }
}

@media(max-width:390px){
  .assistant-today-grid{
    grid-template-columns:1fr 1fr;
  }
  .assistant-kpi strong{
    font-size:1.22rem;
  }
  .assistant-week-row{
    grid-template-columns:auto minmax(0,1fr);
  }
  .assistant-week-row > b{
    grid-column:2;
    justify-self:start;
  }
}

/* v4.04.7.9 — Giá bình riêng theo khách */
.customer-price-field{padding:12px 13px;border:1px solid #d7e6f2;border-radius:16px;background:#f8fbfe}
.customer-price-field input{margin-top:7px;font-weight:800}
.customer-price-field .field-help{display:block;margin-top:6px;color:#74899d;font-size:.78rem;line-height:1.35}


/* v4.04.7.10 — Customer Archive */
.compact-customer-card.is-archived{
  opacity:.76;
  border-style:dashed;
  background:#f7f9fb;
}
.compact-customer-card.is-archived .customer-compact-summary strong{
  color:#66798c;
}
.customer-archive-link{
  color:#c55252!important;
}
.customer-insight-card-actions .btn.danger{
  border-color:#f0c8c8;
  background:#fff5f5;
  color:#bc3d3d;
}


/* v4.04.7.11 — Order Reconcile */
.order-complete-existing{
  border-color:#8fc9f7!important;
  background:#edf7ff!important;
  color:#0878ef!important;
  font-weight:900!important;
}
.order-card-actions{
  flex-wrap:wrap;
}


/* 4.06.0 — Company bottle pool + late-entry receipt workflow */
#receipt-dialog .receipt-entry-audit{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#receipt-dialog .receipt-entry-audit span{display:grid;gap:4px;padding:10px 12px;border:1px solid #dfeaf2;border-radius:12px;background:#fff}
#receipt-dialog .receipt-entry-audit small{font-size:.58rem;font-weight:900;letter-spacing:.07em;color:#71879a}
#receipt-dialog .receipt-entry-audit strong{font-size:.82rem;color:#173651;font-variant-numeric:tabular-nums}
#receipt-dialog .receipt-company-pool-preview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
#receipt-dialog .receipt-company-pool-preview span{display:grid;gap:5px;min-height:72px;align-content:center;padding:11px 12px;border:1px solid #dfe9f0;border-radius:14px;background:#fff}
#receipt-dialog .receipt-company-pool-preview span.after{background:#f4f9ff;border-color:#cfe1f1}
#receipt-dialog .receipt-company-pool-preview small{font-size:.55rem;font-weight:900;letter-spacing:.06em;color:#71879a;line-height:1.25}
#receipt-dialog .receipt-company-pool-preview strong{font-size:1.12rem;color:#173651;line-height:1.1}
#receipt-dialog .receipt-company-pool-preview strong.positive{color:#07865f}
#receipt-dialog .receipt-company-pool-preview strong.negative{color:#cc3340}
#receipt-dialog .receipt-company-pool-status{margin:0;padding:11px 13px;border-radius:13px;font-size:.72rem;font-weight:800;line-height:1.45;background:#eef7ff;color:#37647f}
#receipt-dialog .receipt-company-pool-status.is-short{background:#fff1f2;color:#b42332;border:1px solid #f4d1d5}
#receipt-dialog .receipt-company-pool-status.is-held{background:#eef9f4;color:#087454;border:1px solid #cde9dc}
#receipt-dialog .receipt-company-pool-status.is-balanced{background:#f2f7fb;color:#527084;border:1px solid #dae6ee}
@media(max-width:560px){
  #receipt-dialog .receipt-entry-audit{grid-template-columns:1fr 1fr;gap:6px}
  #receipt-dialog .receipt-entry-audit span{padding:8px 9px}
  #receipt-dialog .receipt-entry-audit small{font-size:.50rem}
  #receipt-dialog .receipt-entry-audit strong{font-size:.70rem}
  #receipt-dialog .receipt-company-pool-preview{grid-template-columns:1fr 1fr;gap:6px}
  #receipt-dialog .receipt-company-pool-preview span{min-height:62px;padding:9px}
  #receipt-dialog .receipt-company-pool-preview span.after{grid-column:1/-1}
  #receipt-dialog .receipt-company-pool-preview small{font-size:.50rem}
  #receipt-dialog .receipt-company-pool-preview strong{font-size:1rem}
  #receipt-dialog .receipt-company-pool-status{font-size:.66rem;padding:9px 10px}
}

/* v4.06.1 — Compact company receipt + split Phước/Pull vehicle stock */
#receipt-dialog.receipt-enterprise-dialog{width:min(700px,calc(100% - 18px))}
#receipt-dialog form{gap:8px!important}
#receipt-dialog .dialog-head{padding-bottom:9px!important;margin-bottom:0!important}
#receipt-dialog .receipt-form-section{gap:7px!important;padding:9px 10px!important;border-radius:13px!important}
#receipt-dialog .receipt-main-compact h3,#receipt-dialog .receipt-bottle-compact h3,#receipt-dialog .receipt-finance-section h3{font-size:.84rem!important}
#receipt-dialog .receipt-party-grid,#receipt-dialog .receipt-date-compact{grid-template-columns:1fr 1fr!important;gap:7px!important}
#receipt-dialog label{gap:4px!important}
#receipt-dialog label>input,#receipt-dialog label>select{min-height:42px!important;padding:8px 10px!important}
#receipt-dialog .receipt-entry-audit-compact{gap:5px!important}
#receipt-dialog .receipt-entry-audit-compact span{min-height:43px;padding:6px 8px!important;border-radius:10px!important}
#receipt-dialog .receipt-entry-audit-compact small{font-size:.47rem!important}
#receipt-dialog .receipt-entry-audit-compact strong{font-size:.67rem!important}
#receipt-dialog .receipt-section-title-row{display:flex;align-items:end;justify-content:space-between;gap:8px}
#receipt-dialog .receipt-section-title-row small{font-size:.60rem!important;line-height:1.25}
#receipt-dialog .receipt-quantity-grid{gap:6px!important}
#receipt-dialog .receipt-quantity-field input{min-height:48px!important;font-size:1.16rem!important;font-weight:900!important;text-align:center}
#receipt-dialog .receipt-balance-strip{display:grid;grid-template-columns:1fr 1fr;gap:6px}
#receipt-dialog .receipt-balance-strip>span{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:38px;padding:7px 9px;border:1px solid #dce8f1;border-radius:10px;background:#fff;color:#62798d;font-size:.65rem;font-weight:800}
#receipt-dialog .receipt-balance-strip strong,#receipt-dialog .receipt-balance-strip b{color:#174e73;font-size:.72rem}
#receipt-dialog .receipt-hidden-delta{display:none!important}
#receipt-dialog .receipt-company-pool-status{padding:7px 9px!important;border-radius:10px!important;font-size:.62rem!important;line-height:1.35!important}
#receipt-dialog .receipt-vehicle-balance-preview{display:grid;grid-template-columns:auto auto;align-items:center;gap:2px 8px;padding:7px 9px;border:1px solid #cfe1f1;border-radius:10px;background:#f4f9ff;color:#55738a}
#receipt-dialog .receipt-vehicle-balance-preview>span{font-size:.60rem;font-weight:850;text-transform:uppercase;letter-spacing:.04em}
#receipt-dialog .receipt-vehicle-balance-preview>strong{justify-self:end;color:#0878ef;font-size:.76rem}
#receipt-dialog .receipt-vehicle-balance-preview>small{grid-column:1/-1;font-size:.59rem;line-height:1.3}
#receipt-dialog .receipt-empty-stock-state{padding:7px 9px!important;border-radius:10px!important;gap:3px!important}
#receipt-dialog .receipt-empty-stock-state>span{font-size:.65rem!important}
#receipt-dialog .receipt-empty-stock-state>small{font-size:.58rem!important;line-height:1.3!important}
#receipt-dialog .receipt-pack-optional-control{margin:0!important}
#receipt-dialog .receipt-pack-toggle{padding:8px 9px!important;border-radius:11px!important}
#receipt-dialog .receipt-pack-toggle small{display:none}
#receipt-dialog .receipt-payment-choice{padding:7px 9px!important;border-radius:10px!important}
#receipt-dialog .receipt-payment-choice>div:first-child span{display:none}
#receipt-dialog .receipt-payment-shortcuts button{min-height:34px!important;padding:0 10px!important}
#receipt-dialog .receipt-payment-fields{grid-template-columns:1fr 1fr!important;gap:6px!important}
#receipt-dialog .receipt-money-summary{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important}
#receipt-dialog .receipt-money-summary .due{grid-column:auto!important}
#receipt-dialog .receipt-money-summary span{min-height:52px!important;padding:6px 8px!important;border-radius:10px!important}
#receipt-dialog .receipt-money-summary small{font-size:.47rem!important}
#receipt-dialog .receipt-money-summary strong{font-size:.82rem!important}
#receipt-dialog .receipt-breakdown{padding:6px 8px!important;font-size:.60rem!important}
#receipt-dialog .field-help{font-size:.58rem!important;line-height:1.25!important}
#receipt-dialog .dialog-actions{padding-top:7px!important}
#receipt-dialog .dialog-actions .btn{min-height:44px!important}

.vehicle-split-summary .vehicle-person-stock{border-left:4px solid #2788eb!important;background:linear-gradient(145deg,#edf6ff,#f8fbff)!important}
.vehicle-split-summary .vehicle-person-stock small{font-weight:900!important;letter-spacing:.05em!important;color:#4d718f!important}
.vehicle-split-summary .vehicle-person-stock strong{font-size:1.28rem!important;color:#164e7a!important}
.vehicle-split-summary .vehicle-person-stock em{font-size:.62rem;font-style:normal;font-weight:750;color:#71889b}
.supplier-defective-action{border-color:#f0d3ad!important;background:#fff8ed!important;color:#9a5d12!important;font-weight:850!important}
#supplier-defective-dialog .supplier-defective-preview{display:grid;gap:3px;padding:11px 12px;border:1px solid #f0dcc2;border-radius:13px;background:#fff9ef;color:#6d7e8e}
#supplier-defective-dialog .supplier-defective-preview span{font-size:.62rem;font-weight:850;letter-spacing:.05em;text-transform:uppercase}
#supplier-defective-dialog .supplier-defective-preview strong{font-size:1rem;color:#9a5d12}
#supplier-defective-dialog .supplier-defective-preview small{font-size:.68rem;line-height:1.35}

@media(max-width:560px){
  #receipt-dialog.receipt-enterprise-dialog{width:calc(100% - 8px)!important;max-height:96dvh!important}
  #receipt-dialog form{padding:10px 10px max(8px,env(safe-area-inset-bottom))!important}
  #receipt-dialog .dialog-head h2{font-size:1.16rem!important}
  #receipt-dialog .receipt-party-grid,#receipt-dialog .receipt-date-compact{grid-template-columns:1fr 1fr!important}
  #receipt-dialog .receipt-party-grid label,#receipt-dialog .receipt-date-compact label{font-size:.64rem!important}
  #receipt-dialog .receipt-party-grid select,#receipt-dialog .receipt-date-compact input{font-size:.82rem!important}
  #receipt-dialog .receipt-money-summary{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  #receipt-dialog .receipt-money-summary .due{grid-column:auto!important}
  #receipt-dialog .receipt-payment-fields{grid-template-columns:1fr 1fr!important}
  #receipt-dialog .receipt-company-pool-status{margin:0!important}
  #receipt-dialog>form>label:last-of-type input{min-height:42px!important}
  .vehicle-split-summary{grid-template-columns:1fr 1fr!important}
  .vehicle-split-summary>span{min-height:112px!important}
  .vehicle-split-summary .vehicle-person-stock strong{font-size:1.16rem!important}
}
#receipt-dialog .receipt-late-return-toggle{display:flex;align-items:flex-start;gap:8px;padding:7px 9px;border:1px dashed #c7dceb;border-radius:10px;background:#f7fbfe;color:#516f87;cursor:pointer}
#receipt-dialog .receipt-late-return-toggle input{width:18px!important;height:18px!important;min-height:18px!important;margin:1px 0 0!important;padding:0!important;accent-color:#0878ef;flex:0 0 auto}
#receipt-dialog .receipt-late-return-toggle span{display:grid;gap:1px}
#receipt-dialog .receipt-late-return-toggle strong{font-size:.68rem;color:#174e73}
#receipt-dialog .receipt-late-return-toggle small{font-size:.58rem;line-height:1.3;color:#71879a}
#receipt-dialog .receipt-late-return-toggle:has(input:checked){border-style:solid;border-color:#a9d2ef;background:#eef8ff}

/* 4.06.1.2 — Tự cân bình giao vượt số nhận bằng quỹ vỏ công ty giữ */
.inventory-auto-balance{display:grid;gap:4px;margin-top:10px;padding:11px 12px;border:1px solid #bfe9d7;border-radius:13px;background:#f0fbf6;color:#0b7758;font-size:.83rem;line-height:1.4}
.inventory-auto-balance span{color:#3f685d}.inventory-auto-balance b{color:#0b7758}


/* 4.06.1.3 — Nợ cũ + thu nợ cũ gọn trong Giao hàng */
#delivery-dialog .delivery-payment-v40613{gap:8px}
#delivery-dialog .delivery-debt-strip{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:7px;align-items:stretch}
#delivery-dialog .delivery-old-debt-row{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:54px;border:1px solid #d9e4ef;border-radius:13px;background:#fff;padding:8px 10px;color:#5e7185;text-align:left}
#delivery-dialog .delivery-old-debt-row span{display:grid;gap:2px}#delivery-dialog .delivery-old-debt-row small{font-size:9px;font-weight:900;letter-spacing:.12em;color:#75899c}#delivery-dialog .delivery-old-debt-row strong{font-size:15px;color:#496279}#delivery-dialog .delivery-old-debt-row b{font-size:22px;line-height:1;color:#8ba0b4;transition:transform .16s ease}#delivery-dialog .delivery-old-debt-row[aria-expanded="true"] b{transform:rotate(90deg)}
#delivery-dialog .delivery-old-debt-row.has-debt{border-color:#f1c5c8;background:#fff7f7}#delivery-dialog .delivery-old-debt-row.has-debt small,#delivery-dialog .delivery-old-debt-row.has-debt strong{color:#c23a43}#delivery-dialog .delivery-old-debt-row:disabled{opacity:.62;cursor:default}
#delivery-dialog .delivery-payment-totals{display:grid;grid-template-columns:1fr 1fr;gap:6px}#delivery-dialog .delivery-payment-totals>span{display:grid;align-content:center;gap:2px;min-width:0;border:1px solid #d9e7f2;border-radius:13px;background:#f7fbff;padding:7px 9px}#delivery-dialog .delivery-payment-totals small{font-size:8.5px;font-weight:900;letter-spacing:.08em;color:#71869a;white-space:nowrap}#delivery-dialog .delivery-payment-totals strong{font-size:13px;color:#173a5d;white-space:nowrap}#delivery-dialog .delivery-payment-totals>span:last-child{background:#edf6ff;border-color:#cfe5fb}#delivery-dialog .delivery-payment-totals>span:last-child strong{color:#0878ef}
#delivery-dialog .delivery-payment-shortcuts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:min(270px,100%)}
#delivery-dialog .delivery-old-debt-panel{display:grid;gap:7px;padding:8px;border:1px solid #f0ccd0;border-radius:12px;background:#fff9f9}#delivery-dialog .delivery-old-debt-panel.is-edit-disabled{opacity:.62;pointer-events:none}#delivery-dialog .delivery-old-debt-fields{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:7px;align-items:end}#delivery-dialog .delivery-old-debt-fields label{gap:5px;font-size:10px;color:#647b8f}#delivery-dialog .delivery-old-debt-fields :is(input,select){height:43px;min-height:43px;font-size:14px;font-weight:800}#delivery-dialog .delivery-old-debt-after{display:flex;justify-content:space-between;align-items:center;border-top:1px dashed #e8c8cb;padding-top:6px;color:#7b5a5e;font-size:11px}#delivery-dialog .delivery-old-debt-after strong{color:#16835f;font-size:13px}
#delivery-dialog .delivery-payment-after{padding:6px 8px;border-radius:10px;background:#f3f8fc;color:#667d90;font-size:10px;line-height:1.35;text-align:center}#delivery-dialog .delivery-payment-after b{color:#173b5e}
@media(max-width:430px){#delivery-dialog .delivery-debt-strip{grid-template-columns:.8fr 1.2fr;gap:5px}#delivery-dialog .delivery-old-debt-row{min-height:49px;padding:6px 8px;border-radius:11px}#delivery-dialog .delivery-old-debt-row small{font-size:7.5px}#delivery-dialog .delivery-old-debt-row strong{font-size:12px}#delivery-dialog .delivery-payment-totals{gap:4px}#delivery-dialog .delivery-payment-totals>span{padding:5px 6px;border-radius:10px}#delivery-dialog .delivery-payment-totals small{font-size:7px;letter-spacing:.04em}#delivery-dialog .delivery-payment-totals strong{font-size:10.5px}body.unified-shell #delivery-dialog .delivery-payment-shortcuts{width:100%!important;grid-template-columns:repeat(3,1fr)!important}body.unified-shell #delivery-dialog .delivery-payment-shortcuts button{min-width:0!important;padding:0 4px!important;font-size:8.8px!important}#delivery-dialog .delivery-old-debt-fields{grid-template-columns:1.08fr .92fr;gap:5px}#delivery-dialog .delivery-old-debt-fields :is(input,select){height:40px;min-height:40px;font-size:13px}}

/* 4.06.1.5 — Mobile payment header width fix */
@media (max-width:560px){
  body.unified-shell #delivery-dialog .delivery-payment-head,
  body.management-mode #delivery-dialog .delivery-payment-head,
  body.staff-mode #delivery-dialog .delivery-payment-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    align-items:stretch!important;
    gap:6px!important;
    width:100%!important;
    min-width:0!important;
  }
  #delivery-dialog .delivery-payment-head>div:first-child{
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    width:100%!important;
    min-width:0!important;
    writing-mode:horizontal-tb!important;
  }
  #delivery-dialog .delivery-payment-head>div:first-child small,
  #delivery-dialog .delivery-payment-head>div:first-child strong{
    display:block!important;
    width:auto!important;
    min-width:0!important;
    white-space:nowrap!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    writing-mode:horizontal-tb!important;
  }
  #delivery-dialog .delivery-payment-head>div:first-child small{flex:0 0 auto!important}
  #delivery-dialog .delivery-payment-head>div:first-child strong{overflow:hidden!important;text-overflow:ellipsis!important}
  body.unified-shell #delivery-dialog .delivery-payment-shortcuts,
  body.management-mode #delivery-dialog .delivery-payment-shortcuts,
  body.staff-mode #delivery-dialog .delivery-payment-shortcuts{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
  }
  #delivery-dialog .delivery-payment-shortcuts button{
    width:100%!important;
    min-width:0!important;
    min-height:34px!important;
    padding:0 5px!important;
    white-space:nowrap!important;
    font-size:10px!important;
  }
}

/* AquaFlow v4.06.1.8 · hợp nhất khách hàng */
.customer-lifecycle-links{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:6px}
.customer-merge-link{color:#0b73d9!important}
.customer-merged-badge{display:inline-flex;align-items:center;min-height:40px;padding:9px 12px;border-radius:12px;background:#eef8ff;color:#0b69c7;font-weight:800;font-size:13px;line-height:1.25}
.customer-merge-dialog{width:min(720px,calc(100vw - 24px));max-height:min(88vh,820px);border:0;border-radius:24px;padding:0;overflow:hidden}
.customer-merge-form{padding:0;max-height:min(88vh,820px);overflow:auto;background:#fff}
.customer-merge-head{position:sticky;top:0;z-index:3;background:#fff;border-bottom:1px solid #dbe8f4;padding:20px 22px 16px}
.customer-merge-head p{margin:5px 0 0;color:#6d8197;font-size:14px}
.customer-merge-flow{display:grid;grid-template-columns:minmax(0,1fr) 38px minmax(0,1.25fr);align-items:stretch;gap:10px;padding:18px 20px 10px}
.customer-merge-card,.customer-merge-target{border:1px solid #d8e6f3;border-radius:18px;background:#f7fbff;padding:14px;min-width:0}
.customer-merge-card small,.customer-merge-result-head small{display:block;color:#5880a4;font-size:11px;font-weight:900;letter-spacing:.12em;margin-bottom:6px}
.customer-merge-card strong{display:block;color:#112c47;font-size:18px;line-height:1.2}
.customer-merge-card span{display:block;margin-top:7px;color:#6f8397;font-size:13px;line-height:1.35;overflow-wrap:anywhere}
.customer-merge-arrow{display:flex;align-items:center;justify-content:center;color:#1684eb;font-size:26px;font-weight:900}
.customer-merge-target{display:flex;flex-direction:column;gap:7px;color:#345671;font-weight:800}
.customer-merge-target select{width:100%;min-width:0;font-size:16px}
.customer-merge-target small{color:#7890a5;font-weight:500;line-height:1.3}
.customer-merge-preview{margin:8px 20px 12px;padding:16px;border:1px solid #cfe4f8;border-radius:18px;background:#f3f9ff}
.customer-merge-preview>p{margin:0;color:#678097}
.customer-merge-result-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.customer-merge-result-head strong{font-size:18px;color:#0b6fd0;text-align:right}
.customer-merge-result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.customer-merge-result-grid span{display:flex;flex-direction:column;gap:4px;padding:10px;border-radius:13px;background:#fff;border:1px solid #deebf6;min-width:0}
.customer-merge-result-grid small{color:#6e8498;font-size:11px;font-weight:800}
.customer-merge-result-grid strong{color:#173650;font-size:15px;overflow-wrap:anywhere}
.customer-merge-transfer-line,.customer-merge-profile-line{margin:12px 0 0;color:#5f7890;font-size:13px;line-height:1.45}
.customer-merge-confirm,.customer-merge-note{margin-left:20px!important;margin-right:20px!important}
.customer-merge-dialog .dialog-actions{position:sticky;bottom:0;background:#fff;border-top:1px solid #dbe8f4;padding:14px 20px calc(14px + env(safe-area-inset-bottom));z-index:3}
@media(max-width:640px){
  .customer-merge-dialog{width:calc(100vw - 16px);max-height:94vh;border-radius:22px}
  .customer-merge-form{max-height:94vh}
  .customer-merge-flow{grid-template-columns:1fr;padding:14px 16px 8px}
  .customer-merge-arrow{height:22px;transform:rotate(90deg)}
  .customer-merge-preview{margin:8px 16px 12px;padding:14px}
  .customer-merge-result-grid{grid-template-columns:1fr 1fr}
  .customer-merge-result-grid span:first-child{grid-column:1/-1}
  .customer-merge-confirm,.customer-merge-note{margin-left:16px!important;margin-right:16px!important}
  .customer-merge-dialog .dialog-actions{padding-left:16px;padding-right:16px}
  .customer-lifecycle-links{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .customer-lifecycle-links .compact-detail-link{width:100%;text-align:center}
}

/* AquaFlow v4.06.1.9 · popup hợp nhất khách full màn hình trên mobile */
.customer-merge-form{display:flex;flex-direction:column}
.customer-merge-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.customer-merge-dialog .dialog-actions{flex:0 0 auto}
@media(max-width:640px){
  .customer-merge-dialog{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    max-width:none!important;
    height:100dvh!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    border-radius:0!important;
    overflow:hidden!important;
  }
  .customer-merge-dialog::backdrop{background:rgba(16,39,63,.38)}
  .customer-merge-form{
    width:100%!important;
    height:100dvh!important;
    max-height:none!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
    padding:0!important;
  }
  .customer-merge-head{
    position:relative!important;
    top:auto!important;
    flex:0 0 auto!important;
    padding:calc(14px + env(safe-area-inset-top)) 16px 12px!important;
    min-height:0!important;
  }
  .customer-merge-head h2{font-size:22px!important;line-height:1.15!important;margin:4px 0 0!important}
  .customer-merge-head p{font-size:13px!important;line-height:1.35!important;margin-top:4px!important}
  .customer-merge-head .icon-btn{flex:0 0 44px!important;width:44px!important;height:44px!important}
  .customer-merge-body{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding-bottom:14px!important;
  }
  .customer-merge-dialog .dialog-actions{
    position:relative!important;
    bottom:auto!important;
    flex:0 0 auto!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)!important;
    gap:10px!important;
    padding:10px 16px calc(10px + env(safe-area-inset-bottom))!important;
    background:#fff!important;
    box-shadow:0 -10px 24px rgba(19,59,94,.08)!important;
  }
  .customer-merge-dialog .dialog-actions .btn{width:100%!important;min-width:0!important;min-height:48px!important;margin:0!important}
}


/* AquaFlow v4.06.1.10 · full-screen mobile workflows
   Ghi đơn giao · Tạo đơn mới · Thêm/Sửa khách hàng */
@media (max-width:760px){
  #customer-dialog,
  #order-dialog.aquaflow-order-dialog,
  #delivery-dialog{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#fff!important;
    box-shadow:none!important;
  }
  #customer-dialog::backdrop,
  #order-dialog::backdrop,
  #delivery-dialog::backdrop{background:rgba(16,39,63,.38)!important}

  #customer-dialog #customer-form,
  #order-dialog #order-form,
  #delivery-dialog #delivery-form{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    display:flex!important;
    flex-direction:column!important;
    gap:13px!important;
    margin:0!important;
    padding:0 16px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    background:#fff!important;
  }

  #customer-dialog .dialog-head,
  #order-dialog .dialog-head,
  #delivery-dialog .dialog-head{
    position:sticky!important;
    top:0!important;
    z-index:100!important;
    flex:0 0 auto!important;
    width:auto!important;
    min-height:92px!important;
    margin:0 -16px!important;
    padding:calc(15px + env(safe-area-inset-top)) 16px 14px!important;
    align-items:flex-start!important;
    border-bottom:1px solid #dbe7f1!important;
    background:rgba(255,255,255,.985)!important;
    backdrop-filter:blur(16px)!important;
    -webkit-backdrop-filter:blur(16px)!important;
    box-shadow:0 3px 12px rgba(26,66,100,.035)!important;
  }
  #customer-dialog .dialog-head>div,
  #order-dialog .dialog-head>div,
  #delivery-dialog .dialog-head>div{min-width:0!important;padding-top:2px!important}
  #customer-dialog .dialog-head small,
  #order-dialog .dialog-head small,
  #delivery-dialog .dialog-head small{
    display:block!important;
    color:#0878ef!important;
    font-size:.68rem!important;
    font-weight:900!important;
    letter-spacing:.16em!important;
    line-height:1.2!important;
  }
  #customer-dialog .dialog-head h2,
  #order-dialog .dialog-head h2,
  #delivery-dialog .dialog-head h2{
    margin:5px 0 0!important;
    color:#132941!important;
    font-size:1.52rem!important;
    line-height:1.08!important;
    letter-spacing:-.03em!important;
  }
  #order-dialog .dialog-head .muted{
    margin:6px 0 0!important;
    max-width:calc(100vw - 92px)!important;
    color:#71859a!important;
    font-size:.76rem!important;
    line-height:1.35!important;
  }
  #customer-dialog .icon-btn,
  #order-dialog .icon-btn,
  #delivery-dialog .icon-btn{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    flex:0 0 48px!important;
    display:grid!important;
    place-items:center!important;
    border:4px solid #b9e1ff!important;
    border-radius:16px!important;
    background:#f5f9fc!important;
    color:#60768a!important;
    font-size:1.9rem!important;
    line-height:1!important;
  }

  #customer-dialog label,
  #order-dialog label,
  #delivery-dialog label{font-size:.9rem!important;line-height:1.22!important;gap:7px!important}
  #customer-dialog :is(input,select,textarea),
  #order-dialog :is(input,select,textarea),
  #delivery-dialog :is(input,select,textarea){
    min-height:52px!important;
    height:52px!important;
    border-radius:14px!important;
    padding-inline:13px!important;
    font-size:1rem!important;
  }
  #customer-dialog input::placeholder,
  #order-dialog input::placeholder,
  #delivery-dialog input::placeholder{color:#a2a8af!important;font-weight:700!important}

  /* Keep frequent delivery fields compact in two columns, as in the AquaFlow mockup. */
  #delivery-dialog .two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:8px!important}
  #delivery-dialog .delivery-payroll-note{margin-top:-4px!important}
  #delivery-dialog .delivery-option-strip{gap:8px!important}
  #delivery-dialog .delivery-option-chip{min-height:46px!important;border-radius:14px!important;font-size:.78rem!important}
  #delivery-dialog .bottle-company-preview{min-height:54px!important;border-radius:14px!important;padding:10px 12px!important;font-size:.78rem!important}
  #delivery-dialog .total.delivery-total-card{min-height:92px!important;border-radius:18px!important;padding:14px!important}
  #delivery-dialog .delivery-total-card>div:first-child strong{font-size:1.7rem!important}
  #delivery-dialog .delivery-debt-strip{gap:8px!important}
  #delivery-dialog .delivery-old-debt-row{min-height:64px!important;border-radius:15px!important}
  #delivery-dialog .delivery-payment-totals>span{min-height:64px!important;border-radius:15px!important;padding:9px 10px!important}
  #delivery-dialog .delivery-payment-section{border-radius:18px!important;padding:12px!important;gap:9px!important}
  #delivery-dialog .delivery-payment-head{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important}
  #delivery-dialog .delivery-payment-head>div:first-child{display:flex!important;align-items:baseline!important;gap:8px!important;min-width:0!important}
  #delivery-dialog .delivery-payment-head>div:first-child span{display:none!important}
  #delivery-dialog .delivery-payment-head small{font-size:.72rem!important;white-space:nowrap!important}
  #delivery-dialog .delivery-payment-head strong{font-size:1rem!important;white-space:nowrap!important}
  #delivery-dialog .delivery-payment-shortcuts{width:100%!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
  #delivery-dialog .delivery-payment-shortcuts button{min-height:42px!important;border-radius:12px!important;font-size:.76rem!important}
  #delivery-dialog .delivery-payment-fields{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)!important;gap:8px!important}

  /* Order entry becomes a clean single-column planning workflow. */
  #order-dialog #order-form>.two.transaction-datetime,
  #order-dialog #order-form>.two:not(.transaction-datetime){grid-template-columns:1fr!important;gap:13px!important}
  #order-dialog .aquaflow-line-items .two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:8px!important}
  #order-dialog .aquaflow-line-items{
    margin-top:2px!important;
    padding:16px!important;
    border-radius:20px!important;
    background:#f8fbfe!important;
  }
  #order-dialog .aquaflow-line-items .section-head{margin:0 0 12px!important}
  #order-dialog .aquaflow-line-items .section-head small{font-size:.68rem!important}
  #order-dialog .aquaflow-line-items .section-head h3{font-size:1.35rem!important}
  #order-dialog .order-customer-search-box{min-height:54px!important;border-radius:14px!important}
  #order-dialog .order-customer-search-box input{height:52px!important;min-height:52px!important;font-size:1rem!important}
  #order-dialog .aquaflow-order-total{border-radius:18px!important}

  /* Customer editor follows the same full-page language. */
  #customer-dialog .customer-price-field,
  #customer-dialog .legacy-bottle-box{
    border:1px solid #d5e6f4!important;
    border-radius:20px!important;
    background:#f8fbfe!important;
    padding:14px!important;
  }
  #customer-dialog .legacy-bottle-box{display:grid!important;gap:12px!important}
  #customer-dialog .legacy-bottle-box>small{color:#0878ef!important;font-size:.72rem!important;font-weight:900!important;letter-spacing:.14em!important}
  #customer-dialog .legacy-bottle-box .two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:8px!important}
  #customer-dialog .field-help,
  #customer-dialog .helper-note{font-size:.76rem!important;line-height:1.4!important}

  #customer-dialog .dialog-actions,
  #order-dialog .dialog-actions,
  #delivery-dialog .dialog-actions{
    position:sticky!important;
    bottom:0!important;
    z-index:100!important;
    flex:0 0 auto!important;
    display:grid!important;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr)!important;
    gap:10px!important;
    width:auto!important;
    margin:auto -16px 0!important;
    padding:12px 16px calc(12px + env(safe-area-inset-bottom))!important;
    border-top:1px solid #dbe7f1!important;
    background:rgba(255,255,255,.985)!important;
    backdrop-filter:blur(16px)!important;
    -webkit-backdrop-filter:blur(16px)!important;
    box-shadow:0 -8px 24px rgba(20,54,79,.07)!important;
  }
  #customer-dialog .dialog-actions .btn,
  #order-dialog .dialog-actions .btn,
  #delivery-dialog .dialog-actions .btn{
    min-width:0!important;
    width:100%!important;
    min-height:54px!important;
    border-radius:15px!important;
    margin:0!important;
    font-size:1rem!important;
  }

  #customer-dialog #customer-form>:nth-last-child(2),
  #order-dialog #order-form>:nth-last-child(2),
  #delivery-dialog #delivery-form>:nth-last-child(2){margin-bottom:4px!important}
}


/* AquaFlow v4.06.1.11 · fixed confirm/cancel actions for Admin + Staff
   Ghi đơn giao · Tạo đơn mới · Thêm/Sửa khách hàng */
@media (max-width:760px){
  /* Shared action dock: always visible while the form body scrolls. */
  #customer-dialog .workflow-fixed-actions,
  #order-dialog .workflow-fixed-actions,
  #delivery-dialog .workflow-fixed-actions{
    position:sticky!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    z-index:220!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)!important;
    gap:10px!important;
    width:auto!important;
    min-height:78px!important;
    margin:auto -16px 0!important;
    padding:11px 16px calc(11px + env(safe-area-inset-bottom))!important;
    border-top:1px solid #d7e5f0!important;
    background:rgba(255,255,255,.99)!important;
    box-shadow:0 -12px 30px rgba(17,54,84,.10)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
  }
  #customer-dialog .workflow-fixed-actions .btn,
  #order-dialog .workflow-fixed-actions .btn,
  #delivery-dialog .workflow-fixed-actions .btn{
    width:100%!important;
    min-width:0!important;
    height:56px!important;
    min-height:56px!important;
    margin:0!important;
    padding:0 12px!important;
    border-radius:16px!important;
    font-size:1rem!important;
    font-weight:850!important;
    white-space:nowrap!important;
  }

  /* Employee mode used to turn dialogs back into bottom sheets. Override it last
     so staff sees the same full-screen AquaFlow workflow as Admin. */
  body.staff-mode #customer-dialog,
  body.staff-mode #order-dialog.aquaflow-order-dialog,
  body.staff-mode #delivery-dialog,
  body[data-role="staff"] #customer-dialog,
  body[data-role="staff"] #order-dialog.aquaflow-order-dialog,
  body[data-role="staff"] #delivery-dialog{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#fff!important;
    box-shadow:none!important;
  }
  body.staff-mode #customer-dialog #customer-form,
  body.staff-mode #order-dialog #order-form,
  body.staff-mode #delivery-dialog #delivery-form,
  body[data-role="staff"] #customer-dialog #customer-form,
  body[data-role="staff"] #order-dialog #order-form,
  body[data-role="staff"] #delivery-dialog #delivery-form{
    width:100%!important;
    height:100dvh!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0 16px!important;
    display:flex!important;
    flex-direction:column!important;
    gap:13px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
  }
  body.staff-mode #customer-dialog .dialog-head,
  body.staff-mode #order-dialog .dialog-head,
  body.staff-mode #delivery-dialog .dialog-head,
  body[data-role="staff"] #customer-dialog .dialog-head,
  body[data-role="staff"] #order-dialog .dialog-head,
  body[data-role="staff"] #delivery-dialog .dialog-head{
    position:sticky!important;
    top:0!important;
    z-index:210!important;
    width:auto!important;
    margin:0 -16px!important;
    padding:calc(15px + env(safe-area-inset-top)) 16px 14px!important;
    border-bottom:1px solid #dbe7f1!important;
    background:rgba(255,255,255,.99)!important;
  }
  body.staff-mode #customer-dialog .workflow-fixed-actions,
  body.staff-mode #order-dialog .workflow-fixed-actions,
  body.staff-mode #delivery-dialog .workflow-fixed-actions,
  body[data-role="staff"] #customer-dialog .workflow-fixed-actions,
  body[data-role="staff"] #order-dialog .workflow-fixed-actions,
  body[data-role="staff"] #delivery-dialog .workflow-fixed-actions{
    position:sticky!important;
    bottom:0!important;
    z-index:220!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)!important;
    margin:auto -16px 0!important;
    padding:11px 16px calc(11px + env(safe-area-inset-bottom))!important;
  }

  /* Keep enough scroll breathing room immediately above the action dock. */
  #customer-dialog #customer-form>:nth-last-child(2),
  #order-dialog #order-form>:nth-last-child(2),
  #delivery-dialog #delivery-form>:nth-last-child(2){
    margin-bottom:10px!important;
  }
}

@supports(height:100svh){
  @media (max-width:760px){
    body.staff-mode #customer-dialog,
    body.staff-mode #order-dialog.aquaflow-order-dialog,
    body.staff-mode #delivery-dialog,
    body[data-role="staff"] #customer-dialog,
    body[data-role="staff"] #order-dialog.aquaflow-order-dialog,
    body[data-role="staff"] #delivery-dialog{
      height:100svh!important;
      max-height:100svh!important;
    }
    body.staff-mode #customer-dialog #customer-form,
    body.staff-mode #order-dialog #order-form,
    body.staff-mode #delivery-dialog #delivery-form,
    body[data-role="staff"] #customer-dialog #customer-form,
    body[data-role="staff"] #order-dialog #order-form,
    body[data-role="staff"] #delivery-dialog #delivery-form{
      height:100svh!important;
    }
  }
}


/* AquaFlow v4.06.1.12 · Receipt Fullscreen Actions
   Nhận hàng tại công ty / Nhận chuyến mới · Admin + Staff */
@media (max-width:760px){
  #receipt-dialog.receipt-enterprise-dialog,
  body.staff-mode #receipt-dialog.receipt-enterprise-dialog,
  body[data-role="staff"] #receipt-dialog.receipt-enterprise-dialog{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#fff!important;
    box-shadow:none!important;
  }
  #receipt-dialog::backdrop{background:rgba(16,39,63,.38)!important}

  #receipt-dialog #receipt-form,
  body.staff-mode #receipt-dialog #receipt-form,
  body[data-role="staff"] #receipt-dialog #receipt-form{
    width:100%!important;
    height:100dvh!important;
    min-height:0!important;
    max-height:none!important;
    display:flex!important;
    flex-direction:column!important;
    gap:10px!important;
    margin:0!important;
    padding:0 16px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    background:#fff!important;
  }

  #receipt-dialog .dialog-head,
  body.staff-mode #receipt-dialog .dialog-head,
  body[data-role="staff"] #receipt-dialog .dialog-head{
    position:sticky!important;
    top:0!important;
    z-index:210!important;
    flex:0 0 auto!important;
    width:auto!important;
    min-height:92px!important;
    margin:0 -16px!important;
    padding:calc(15px + env(safe-area-inset-top)) 16px 14px!important;
    align-items:flex-start!important;
    border-bottom:1px solid #dbe7f1!important;
    background:rgba(255,255,255,.99)!important;
    box-shadow:0 3px 12px rgba(26,66,100,.035)!important;
    backdrop-filter:blur(16px)!important;
    -webkit-backdrop-filter:blur(16px)!important;
  }
  #receipt-dialog .dialog-head>div{min-width:0!important;padding-top:2px!important}
  #receipt-dialog .dialog-head small{
    display:block!important;
    color:#0878ef!important;
    font-size:.68rem!important;
    font-weight:900!important;
    letter-spacing:.16em!important;
    line-height:1.2!important;
  }
  #receipt-dialog .dialog-head h2{
    margin:5px 0 0!important;
    color:#132941!important;
    font-size:1.52rem!important;
    line-height:1.08!important;
    letter-spacing:-.03em!important;
  }
  #receipt-dialog .icon-btn{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    flex:0 0 48px!important;
    display:grid!important;
    place-items:center!important;
    border:4px solid #b9e1ff!important;
    border-radius:16px!important;
    background:#f5f9fc!important;
    color:#60768a!important;
    font-size:1.9rem!important;
    line-height:1!important;
  }

  /* Keep receipt body compact while making it part of the same AquaFlow workflow. */
  #receipt-dialog .receipt-form-section{flex:0 0 auto!important}
  #receipt-dialog .receipt-party-grid,
  #receipt-dialog .receipt-date-compact,
  #receipt-dialog .receipt-quantity-grid,
  #receipt-dialog .receipt-payment-fields{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}

  #receipt-dialog .workflow-fixed-actions,
  body.staff-mode #receipt-dialog .workflow-fixed-actions,
  body[data-role="staff"] #receipt-dialog .workflow-fixed-actions{
    position:sticky!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    z-index:220!important;
    flex:0 0 auto!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1.45fr)!important;
    gap:10px!important;
    width:auto!important;
    min-height:78px!important;
    margin:auto -16px 0!important;
    padding:11px 16px calc(11px + env(safe-area-inset-bottom))!important;
    border-top:1px solid #d7e5f0!important;
    background:rgba(255,255,255,.99)!important;
    box-shadow:0 -12px 30px rgba(17,54,84,.10)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
  }
  #receipt-dialog .workflow-fixed-actions .btn{
    width:100%!important;
    min-width:0!important;
    height:56px!important;
    min-height:56px!important;
    margin:0!important;
    padding:0 10px!important;
    border-radius:16px!important;
    font-size:.98rem!important;
    font-weight:850!important;
    white-space:nowrap!important;
  }
  #receipt-dialog #receipt-form>:nth-last-child(2){margin-bottom:10px!important}
}

@supports(height:100svh){
  @media (max-width:760px){
    #receipt-dialog.receipt-enterprise-dialog,
    body.staff-mode #receipt-dialog.receipt-enterprise-dialog,
    body[data-role="staff"] #receipt-dialog.receipt-enterprise-dialog,
    #receipt-dialog #receipt-form,
    body.staff-mode #receipt-dialog #receipt-form,
    body[data-role="staff"] #receipt-dialog #receipt-form{
      height:100svh!important;
      max-height:100svh!important;
    }
  }
}


/* AquaFlow v4.06.1.13 · Thu tất cả hiển thị tổng thanh toán */
#delivery-paid[readonly] {
  background: #f1f8ff;
  font-weight: 800;
  color: #0b6fdc;
}
#delivery-paid-label { display:block; }


/* AquaFlow v4.06.1.14 · Nợ lại = nợ toàn bộ tiền đơn, không tự thu cọc */

/* AquaFlow v4.06.1.17 · Company Empty Offset Fix
   Giữ nguyên Global Fullscreen Dialog Standard của v4.06.1.16.

   AquaFlow v4.06.1.16 · Global Fullscreen Dialog Standard
   Chuẩn hóa toàn bộ popup mobile còn lại: header + action dock cố định,
   chỉ phần nội dung giữa cuộn. Các workflow đã chuẩn hóa ở 4.06.1.9–1.12
   được giữ nguyên để không thay đổi bố cục đã duyệt. */
@media (max-width:760px){
  dialog.af-global-fullscreen-dialog{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#fff!important;
    box-shadow:none!important;
  }
  dialog.af-global-fullscreen-dialog::backdrop{
    background:rgba(16,39,63,.38)!important;
  }

  dialog.af-global-fullscreen-dialog > .af-global-dialog-scroll{
    position:relative!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:100dvh!important;
    max-height:100dvh!important;
    min-height:0!important;
    margin:0!important;
    padding:
      calc(var(--af-dialog-head-h, 104px) + 14px)
      16px
      calc(var(--af-dialog-actions-h, 82px) + 14px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    background:#fff!important;
    scrollbar-gutter:stable!important;
  }

  dialog.af-global-fullscreen-dialog .af-global-dialog-head{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    z-index:420!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:calc(15px + env(safe-area-inset-top)) 16px 14px!important;
    border-bottom:1px solid #dbe7f1!important;
    background:rgba(255,255,255,.99)!important;
    box-shadow:0 4px 16px rgba(22,59,89,.055)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
  }
  dialog.af-global-fullscreen-dialog .af-global-dialog-head>div{
    min-width:0!important;
  }
  dialog.af-global-fullscreen-dialog .af-global-dialog-head small{
    color:#0878ef!important;
    font-weight:900!important;
    letter-spacing:.15em!important;
  }
  dialog.af-global-fullscreen-dialog .af-global-dialog-head h2{
    color:#132941!important;
    line-height:1.08!important;
    letter-spacing:-.025em!important;
  }
  dialog.af-global-fullscreen-dialog .af-global-dialog-head .icon-btn{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    flex:0 0 48px!important;
    display:grid!important;
    place-items:center!important;
    border:4px solid #b9e1ff!important;
    border-radius:16px!important;
    background:#f5f9fc!important;
    color:#60768a!important;
    font-size:1.9rem!important;
    line-height:1!important;
  }

  dialog.af-global-fullscreen-dialog .af-global-dialog-actions{
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    z-index:430!important;
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)!important;
    align-items:stretch!important;
    gap:10px!important;
    width:100%!important;
    min-height:78px!important;
    margin:0!important;
    padding:11px 16px calc(11px + env(safe-area-inset-bottom))!important;
    border-top:1px solid #d7e5f0!important;
    background:rgba(255,255,255,.99)!important;
    box-shadow:0 -12px 30px rgba(17,54,84,.10)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
  }
  dialog.af-global-fullscreen-dialog .af-global-dialog-actions > :only-child{
    grid-column:1 / -1!important;
  }
  dialog.af-global-fullscreen-dialog .af-global-dialog-actions > :is(button,.btn),
  dialog.af-global-fullscreen-dialog .af-global-dialog-actions > div > :is(button,.btn){
    width:100%!important;
    min-width:0!important;
    height:56px!important;
    min-height:56px!important;
    margin:0!important;
    padding:0 12px!important;
    border-radius:16px!important;
    font-size:1rem!important;
    font-weight:850!important;
    white-space:nowrap!important;
  }
  dialog.af-global-fullscreen-dialog .af-global-dialog-actions > div{
    min-width:0!important;
    display:flex!important;
  }

  /* Tránh footer global của trang hoặc style staff cũ ghi đè action dock. */
  body.staff-mode dialog.af-global-fullscreen-dialog,
  body[data-role="staff"] dialog.af-global-fullscreen-dialog{
    inset:0!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    border-radius:0!important;
  }
  body.staff-mode dialog.af-global-fullscreen-dialog .af-global-dialog-actions,
  body[data-role="staff"] dialog.af-global-fullscreen-dialog .af-global-dialog-actions{
    position:fixed!important;
    bottom:0!important;
    margin:0!important;
  }
}

@supports(height:100svh){
  @media (max-width:760px){
    dialog.af-global-fullscreen-dialog,
    dialog.af-global-fullscreen-dialog > .af-global-dialog-scroll,
    body.staff-mode dialog.af-global-fullscreen-dialog,
    body[data-role="staff"] dialog.af-global-fullscreen-dialog{
      height:100svh!important;
      max-height:100svh!important;
    }
  }
}

/* v4.06.1.18 — Employee settlement moved from Operations to Overview */
#overview #admin-handover.overview-employee-settlement{margin:12px 0 14px}
#overview #admin-handover .section-head{margin-bottom:8px}
#overview #admin-handover .section-head h2{margin:0;font-size:20px}
#overview #admin-handover .section-head small{color:#0878ef;font-weight:900;letter-spacing:.14em}
@media(max-width:700px){
  #overview #admin-handover.overview-employee-settlement{padding:12px;border-radius:17px}
  #overview #admin-handover .enterprise-card-tag{display:none}
  #overview #admin-handover .section-head h2{font-size:17px}
  #overview #admin-handover .section-head small{font-size:9px}
}


/* =========================================================
   AquaFlow v4.06.1.19 — Payment Save + Staff Debt Detail Fix
   - Chi tiết công nợ: header/footer thật sự nằm ngoài vùng cuộn.
   - Footer Hủy / Thu nợ luôn thấy trên Safari/PWA, cả app nhân viên.
   ========================================================= */
.debt-detail-scroll-body{display:contents}

@media(max-width:760px){
  #debt-detail-dialog.debt-detail-enterprise-dialog,
  body.staff-mode #debt-detail-dialog.debt-detail-enterprise-dialog,
  body[data-role="staff"] #debt-detail-dialog.debt-detail-enterprise-dialog{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  #debt-detail-dialog .debt-detail-enterprise-form,
  body.staff-mode #debt-detail-dialog .debt-detail-enterprise-form,
  body[data-role="staff"] #debt-detail-dialog .debt-detail-enterprise-form{
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:column!important;
    gap:0!important;
    width:100%!important;
    height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  #debt-detail-dialog .debt-detail-enterprise-head,
  body.staff-mode #debt-detail-dialog .debt-detail-enterprise-head,
  body[data-role="staff"] #debt-detail-dialog .debt-detail-enterprise-head{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    flex:0 0 auto!important;
    margin:0!important;
    padding:calc(14px + env(safe-area-inset-top)) 16px 14px!important;
    border-bottom:1px solid #dce8f1!important;
    background:rgba(255,255,255,.99)!important;
    box-shadow:0 4px 14px rgba(18,54,83,.055)!important;
    z-index:5!important;
  }

  #debt-detail-dialog .debt-detail-scroll-body,
  body.staff-mode #debt-detail-dialog .debt-detail-scroll-body,
  body[data-role="staff"] #debt-detail-dialog .debt-detail-scroll-body{
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    align-content:start!important;
    gap:12px!important;
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding:14px 16px 18px!important;
    scroll-padding-bottom:18px!important;
  }

  #debt-detail-dialog .debt-detail-actions,
  body.staff-mode #debt-detail-dialog .debt-detail-actions,
  body[data-role="staff"] #debt-detail-dialog .debt-detail-actions{
    position:relative!important;
    inset:auto!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    flex:0 0 auto!important;
    z-index:10!important;
    display:grid!important;
    grid-template-columns:minmax(0,.82fr) minmax(0,1.35fr)!important;
    gap:10px!important;
    width:100%!important;
    margin:0!important;
    padding:10px 16px calc(10px + env(safe-area-inset-bottom))!important;
    border-top:1px solid #dce8f1!important;
    background:rgba(255,255,255,.99)!important;
    box-shadow:0 -10px 26px rgba(20,54,79,.10)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
  }

  #debt-detail-dialog .debt-detail-actions .btn{
    width:100%!important;
    min-width:0!important;
    min-height:54px!important;
    margin:0!important;
    border-radius:16px!important;
    font-size:.96rem!important;
    font-weight:900!important;
    white-space:nowrap!important;
  }

  body:has(#debt-detail-dialog[open]) :is(.staff-bottom-nav,.mobile-bottom-nav,nav.bottom-nav){
    visibility:hidden!important;
    pointer-events:none!important;
  }
}

@supports(height:100svh){
  @media(max-width:760px){
    #debt-detail-dialog.debt-detail-enterprise-dialog,
    #debt-detail-dialog .debt-detail-enterprise-form{
      height:100svh!important;
      max-height:100svh!important;
    }
  }
}


/* ==========================================================================
   AquaFlow v4.06.1.20 — Android Responsive Parity
   One fluid mobile contract for staff UI across Android/iPhone widths.
   - Never collapse command/KPI tiles to a single stacked column at 360/370px.
   - Prevent Android text autosizing from changing grid geometry.
   - Keep every grid child shrinkable so system font/display scaling cannot push
     the second column off-screen.
   ========================================================================== */
html{
  -webkit-text-size-adjust:100%!important;
  text-size-adjust:100%!important;
}
body[data-role="staff"],body.staff-mode{
  width:100%!important;
  min-width:0!important;
  overflow-x:hidden!important;
}
body.staff-mode :is(.staff-command-bar,.staff-money-primary,.staff-money-grid,.staff-day-kpis,.staff-reconcile-strip,.staff-detail-ledger,.employee-search-panel,.delivery-page-head,.customer-month-compact,.debt-hero,.entry-values)>*,
body[data-role="staff"] :is(.staff-command-bar,.staff-money-primary,.staff-money-grid,.staff-day-kpis,.staff-reconcile-strip,.staff-detail-ledger,.employee-search-panel,.delivery-page-head,.customer-month-compact,.debt-hero,.entry-values)>*{
  min-width:0!important;
  max-width:100%!important;
}
body.staff-mode :is(.staff-command strong,.staff-command small,.staff-money-primary strong,.staff-money-primary small,.staff-day-kpis strong,.staff-day-kpis small),
body[data-role="staff"] :is(.staff-command strong,.staff-command small,.staff-money-primary strong,.staff-money-primary small,.staff-day-kpis strong,.staff-day-kpis small){
  overflow-wrap:normal!important;
  word-break:normal!important;
}

@media(max-width:760px){
  /* Same two-column command center on 320–760 CSS px. */
  body.staff-mode .staff-command-bar,
  body[data-role="staff"] .staff-command-bar{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
  }
  body.staff-mode .staff-command,
  body[data-role="staff"] .staff-command{
    width:100%!important;
    min-width:0!important;
    min-height:58px!important;
    grid-template-columns:clamp(30px,9vw,36px) minmax(0,1fr)!important;
    gap:clamp(6px,2vw,9px)!important;
    padding:8px clamp(7px,2.2vw,10px)!important;
    border-radius:15px!important;
  }
  body.staff-mode .staff-command-icon,
  body[data-role="staff"] .staff-command-icon{
    width:clamp(30px,9vw,36px)!important;
    height:clamp(30px,9vw,36px)!important;
    min-width:0!important;
  }
  body.staff-mode .staff-command strong,
  body[data-role="staff"] .staff-command strong{
    font-size:clamp(11.5px,3.35vw,14px)!important;
    line-height:1.15!important;
  }
  body.staff-mode .staff-command small,
  body[data-role="staff"] .staff-command small{
    font-size:clamp(9.5px,2.75vw,12px)!important;
    line-height:1.2!important;
  }

  /* Preserve the iPhone-style information density on narrow Android devices. */
  body.staff-mode .staff-money-primary,
  body[data-role="staff"] .staff-money-primary,
  body.staff-mode .staff-money-grid,
  body[data-role="staff"] .staff-money-grid,
  body.staff-mode .staff-day-kpis,
  body[data-role="staff"] .staff-day-kpis,
  body.staff-mode .staff-reconcile-strip,
  body[data-role="staff"] .staff-reconcile-strip{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }
  body.staff-mode .staff-money-primary article:last-child,
  body[data-role="staff"] .staff-money-primary article:last-child{
    grid-column:1/-1!important;
  }

  /* Undo the legacy <=370px one-column fallbacks. */
  body.staff-mode #overview>.toolbar,
  body[data-role="staff"] #overview>.toolbar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(108px,35vw)!important;
    gap:8px!important;
  }
  body.staff-mode #overview>.toolbar input,
  body[data-role="staff"] #overview>.toolbar input{
    width:100%!important;
    max-width:none!important;
  }
  body.staff-mode .staff-shift-hero,
  body[data-role="staff"] .staff-shift-hero{
    display:flex!important;
    gap:9px!important;
  }
  body.staff-mode .staff-shift-readiness,
  body[data-role="staff"] .staff-shift-readiness{
    display:flex!important;
    align-items:flex-start!important;
    gap:8px!important;
  }
  body.staff-mode .staff-shift-checks,
  body[data-role="staff"] .staff-shift-checks{
    max-width:44%!important;
    justify-content:flex-end!important;
  }
  body.staff-mode .delivery-page-head,
  body[data-role="staff"] .delivery-page-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:8px!important;
  }
  body.staff-mode .delivery-create-button,
  body[data-role="staff"] .delivery-create-button{
    width:auto!important;
    min-width:clamp(104px,31vw,128px)!important;
  }
  body.staff-mode .employee-search-panel,
  body[data-role="staff"] .employee-search-panel{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:7px!important;
  }
  body.staff-mode .employee-search-count,
  body[data-role="staff"] .employee-search-count{
    justify-self:end!important;
  }
  body.staff-mode .debt-hero,
  body[data-role="staff"] .debt-hero{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:8px!important;
  }
  body.staff-mode .debt-hero .btn,
  body[data-role="staff"] .debt-hero .btn{
    width:auto!important;
    min-width:clamp(96px,29vw,126px)!important;
  }
  body.staff-mode .customer-month-compact,
  body[data-role="staff"] .customer-month-compact{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(108px,35vw)!important;
    gap:8px!important;
  }
  body.staff-mode .customer-month-compact>div,
  body[data-role="staff"] .customer-month-compact>div{
    grid-column:1!important;
    grid-row:1!important;
    width:auto!important;
  }
  body.staff-mode .customer-month-compact input,
  body[data-role="staff"] .customer-month-compact input{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
  }
  body.staff-mode #delivery-list .entry-values,
  body[data-role="staff"] #delivery-list .entry-values{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
  }
  body.staff-mode #delivery-list .entry-values .products,
  body[data-role="staff"] #delivery-list .entry-values .products{
    grid-column:1/-1!important;
  }
}

/* Very small Android logical widths still keep two columns; only spacing shrinks. */
@media(max-width:340px){
  body.staff-mode .shell,body[data-role="staff"] .shell{padding-left:7px!important;padding-right:7px!important}
  body.staff-mode .staff-command-bar,body[data-role="staff"] .staff-command-bar{gap:6px!important}
  body.staff-mode .staff-command,body[data-role="staff"] .staff-command{padding:7px 6px!important;gap:5px!important}
  body.staff-mode .staff-shift-checks,body[data-role="staff"] .staff-shift-checks{max-width:40%!important}
}

/* ========================================================================== 
   AquaFlow v4.06.1.21 — Android Order Detail Action Dock Fix
   Order detail may expose three actions at once (Đóng / Giao / Hoàn thành).
   The global two-slot footer is not enough on narrow Android viewports, so
   the primary action group becomes a real shrinkable grid. On compact phones
   the completion action moves to a full-width second row instead of clipping.
   ========================================================================== */
@media(max-width:760px){
  #order-detail-dialog.af-global-fullscreen-dialog .order-detail-actions{
    grid-template-columns:minmax(0,.78fr) minmax(0,1.72fr)!important;
    align-items:stretch!important;
    gap:8px!important;
  }
  #order-detail-dialog.af-global-fullscreen-dialog #order-detail-primary{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
  }
  #order-detail-dialog.af-global-fullscreen-dialog .order-detail-actions .btn{
    min-width:0!important;
    max-width:100%!important;
    padding-inline:clamp(8px,2.3vw,12px)!important;
    font-size:clamp(12px,3.45vw,16px)!important;
    line-height:1.1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}

/* Narrow Android / large system-display sizes: keep two actions on row one,
   move the longest action to its own row. ResizeObserver in app.js measures
   the taller dock and automatically gives the scroll body enough bottom pad. */
@media(max-width:480px){
  #order-detail-dialog.af-global-fullscreen-dialog .order-detail-actions{
    grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)!important;
    grid-auto-rows:56px!important;
  }
  #order-detail-dialog.af-global-fullscreen-dialog #order-detail-primary{
    display:contents!important;
  }
  #order-detail-dialog.af-global-fullscreen-dialog #order-detail-primary > .btn:last-child{
    grid-column:1 / -1!important;
    width:100%!important;
  }
  #order-detail-dialog.af-global-fullscreen-dialog .order-detail-actions .btn{
    font-size:clamp(12px,3.7vw,15px)!important;
    text-overflow:clip!important;
  }
}

/* ========================================================================== 
   AquaFlow v4.06.1.22 — Compact Vehicle Stock Command Card
   Tồn theo xe được gom thành card AquaFlow mật độ cao: mỗi tài xế chỉ còn
   một hàng thông tin + một hàng thao tác; ba nút luôn cùng hàng trên mobile.
   ========================================================================== */
#operations #vehicle-stock-summary{
  margin-top:12px;
  padding:14px 16px 13px;
  border:1px solid #d9e7f3;
  border-radius:20px;
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
  box-shadow:0 8px 26px rgba(30,83,126,.045);
}
#operations .af-vehicle-stock-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding-bottom:11px;
  border-bottom:1px solid #e2ebf3;
}
#operations .af-vehicle-stock-heading>div{min-width:0}
#operations .af-vehicle-stock-heading small{
  display:block;
  margin-bottom:2px;
  color:#0878ef;
  font-size:10.5px;
  font-weight:950;
  letter-spacing:.14em;
}
#operations .af-vehicle-stock-heading h3{
  margin:0;
  color:#173651;
  font-size:20px;
  line-height:1.15;
  font-weight:950;
}
#operations .af-vehicle-count{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:48px;
  height:30px;
  padding:0 10px;
  border-radius:999px;
  background:#eef6ff;
  color:#0878ef;
  font-size:11px;
  font-weight:900;
}
#operations .af-vehicle-driver-list{display:grid;gap:0}
#operations .af-vehicle-driver-card{
  display:grid;
  gap:10px;
  padding:13px 0;
  border-bottom:1px solid #e4edf4;
}
#operations .af-vehicle-driver-main{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  min-width:0;
}
#operations .af-vehicle-driver-identity{
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:center;
  gap:10px;
  min-width:0;
}
#operations .af-vehicle-driver-avatar{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:13px;
  background:linear-gradient(145deg,#eef7ff,#e7f3ff);
  color:#0878ef;
  font-size:14px;
  font-weight:950;
  box-shadow:inset 0 0 0 1px #d9eafb;
}
#operations .af-vehicle-driver-identity strong{
  display:block;
  color:#10243b;
  font-size:16px;
  line-height:1.15;
  font-weight:950;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#operations .af-vehicle-driver-identity small{
  display:block;
  margin-top:3px;
  color:#71869a;
  font-size:11.5px;
  line-height:1.2;
  font-weight:720;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#operations .af-vehicle-driver-stock{
  min-width:0;
  text-align:right;
}
#operations .af-vehicle-driver-stock strong{
  display:block;
  color:#10243b;
  font-size:16px;
  line-height:1.15;
  font-weight:950;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
#operations .af-vehicle-driver-stock small{
  display:block;
  margin-top:3px;
  color:#6d8297;
  font-size:11.5px;
  line-height:1.15;
  font-weight:780;
  white-space:nowrap;
}
#operations .af-vehicle-driver-actions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  width:100%;
}
#operations .af-vehicle-action{
  width:100%;
  min-width:0;
  min-height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:7px 8px;
  border:1px solid #d9e8f5!important;
  border-radius:13px!important;
  background:#eef7ff!important;
  color:#0878ef!important;
  font-size:12.5px!important;
  line-height:1!important;
  font-weight:900!important;
  white-space:nowrap;
}
#operations .af-vehicle-action>span{
  display:grid;
  place-items:center;
  width:20px;
  height:20px;
  border-radius:7px;
  color:#0878ef;
  font-size:13px;
  font-weight:950;
}
#operations .af-vehicle-team-total{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:12px;
  padding:10px 12px;
  border-radius:14px;
  background:linear-gradient(135deg,#f3f9ff,#eef7ff);
  color:#4f6d87;
}
#operations .af-vehicle-team-total span{
  display:flex;
  align-items:center;
  gap:7px;
  font-size:12px;
  font-weight:850;
}
#operations .af-vehicle-team-total span b{
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  border-radius:8px;
  background:#fff;
  color:#0878ef;
  font-size:12px;
}
#operations .af-vehicle-team-total strong{
  color:#10243b;
  font-size:15px;
  font-weight:950;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}

/* Đồng bộ Sổ biến động với card AquaFlow mới và giảm chiều cao khi đóng. */
body.unified-shell #operations #operation-stock-ledger.stock-ledger-card{
  border-radius:20px!important;
  border-color:#d9e7f3!important;
  box-shadow:0 8px 26px rgba(30,83,126,.04)!important;
}
body.unified-shell #operations .stock-ledger-summary{
  padding:14px 16px 12px!important;
}
body.unified-shell #operations .stock-ledger-title>small{
  color:#0878ef!important;
  font-size:10.5px!important;
  letter-spacing:.14em!important;
  font-weight:950!important;
}
body.unified-shell #operations .stock-ledger-title>h2{
  font-size:20px!important;
  line-height:1.15!important;
}
body.unified-shell #operations .stock-ledger-glance{
  margin-top:10px!important;
  border-radius:14px!important;
}
body.unified-shell #operations .stock-ledger-glance>span{
  min-height:52px!important;
  padding:7px 10px!important;
}
body.unified-shell #operations .stock-ledger-glance strong{font-size:17px!important}
body.unified-shell #operations .stock-ledger-collapse-hint{display:none!important}

@media(max-width:560px){
  #operations #vehicle-stock-summary{
    margin-top:10px;
    padding:12px 12px 11px;
    border-radius:18px;
  }
  #operations .af-vehicle-stock-heading{padding-bottom:9px}
  #operations .af-vehicle-stock-heading small{font-size:9.5px}
  #operations .af-vehicle-stock-heading h3{font-size:18px}
  #operations .af-vehicle-count{height:28px;min-width:44px;padding:0 8px;font-size:10.5px}
  #operations .af-vehicle-driver-card{gap:8px;padding:11px 0}
  #operations .af-vehicle-driver-main{gap:8px}
  #operations .af-vehicle-driver-identity{grid-template-columns:34px minmax(0,1fr);gap:8px}
  #operations .af-vehicle-driver-avatar{width:34px;height:34px;border-radius:11px;font-size:12px}
  #operations .af-vehicle-driver-identity strong{font-size:15px}
  #operations .af-vehicle-driver-identity small{font-size:10.5px}
  #operations .af-vehicle-driver-stock strong{font-size:15px}
  #operations .af-vehicle-driver-stock small{font-size:10.5px}
  #operations .af-vehicle-driver-actions{gap:6px}
  #operations .af-vehicle-action{min-height:38px;padding:6px 5px;font-size:clamp(10.5px,3.1vw,12px)!important;gap:4px}
  #operations .af-vehicle-action>span{width:17px;height:17px;font-size:11px}
  #operations .af-vehicle-team-total{margin-top:10px;padding:9px 10px}
  #operations .af-vehicle-team-total span{font-size:11px}
  #operations .af-vehicle-team-total strong{font-size:14px}
  body.unified-shell #operations .stock-ledger-summary{padding:12px 12px 10px!important}
  body.unified-shell #operations .stock-ledger-title>small{font-size:9.5px!important}
  body.unified-shell #operations .stock-ledger-title>h2{font-size:18px!important}
  body.unified-shell #operations .stock-ledger-glance>span{min-height:49px!important;padding:6px 7px!important}
  body.unified-shell #operations .stock-ledger-glance small{font-size:9px!important}
  body.unified-shell #operations .stock-ledger-glance strong{font-size:16px!important}
}

@media(max-width:340px){
  #operations .af-vehicle-driver-main{grid-template-columns:minmax(0,1fr) auto}
  #operations .af-vehicle-driver-identity small{max-width:118px}
  #operations .af-vehicle-driver-stock strong{font-size:13.5px}
  #operations .af-vehicle-driver-stock small{font-size:9.5px}
  #operations .af-vehicle-action{font-size:10px!important;gap:2px;padding-inline:3px}
  #operations .af-vehicle-action>span{display:none}
}

/* ========================================================================== 
   AquaFlow v4.06.1.23 — Staff Shift Layout + Settlement Readability
   - Mobile staff shift readiness is a true single-column card so long
     Vietnamese text can never be squeezed into a vertical character strip.
   - Overview employee settlement typography is larger/clearer after the
     block was moved from Operations to Overview in v4.06.1.18.
   ========================================================================== */
@media(max-width:760px){
  body.staff-mode #staff-shift-readiness.staff-shift-readiness,
  body[data-role="staff"] #staff-shift-readiness.staff-shift-readiness{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    align-items:stretch!important;
    gap:10px!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    padding:12px!important;
  }
  body.staff-mode #staff-shift-readiness>div,
  body[data-role="staff"] #staff-shift-readiness>div{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
  }
  body.staff-mode #staff-shift-readiness :is(small,strong,p,span),
  body[data-role="staff"] #staff-shift-readiness :is(small,strong,p,span){
    writing-mode:horizontal-tb!important;
    text-orientation:mixed!important;
    word-break:normal!important;
    overflow-wrap:break-word!important;
    white-space:normal!important;
  }
  body.staff-mode #staff-shift-readiness>div:first-child strong,
  body[data-role="staff"] #staff-shift-readiness>div:first-child strong{
    display:block!important;
    font-size:clamp(15px,4.2vw,18px)!important;
    line-height:1.25!important;
  }
  body.staff-mode #staff-shift-readiness>div:first-child p,
  body[data-role="staff"] #staff-shift-readiness>div:first-child p{
    margin:5px 0 0!important;
    font-size:clamp(12px,3.35vw,14px)!important;
    line-height:1.45!important;
    color:#718498!important;
  }
  body.staff-mode #staff-shift-readiness .staff-shift-checks,
  body[data-role="staff"] #staff-shift-readiness .staff-shift-checks{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    justify-items:stretch!important;
    max-width:none!important;
    gap:7px!important;
  }
  body.staff-mode #staff-shift-readiness .staff-shift-checks span,
  body[data-role="staff"] #staff-shift-readiness .staff-shift-checks span{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:36px!important;
    padding:7px 8px!important;
    border-radius:12px!important;
    text-align:center!important;
    font-size:clamp(11px,3.1vw,13px)!important;
    line-height:1.25!important;
  }
  body.staff-mode #staff-shift-readiness .staff-shift-actions,
  body[data-role="staff"] #staff-shift-readiness .staff-shift-actions{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    justify-items:stretch!important;
    gap:6px!important;
    min-width:0!important;
    width:100%!important;
  }
  body.staff-mode #staff-shift-readiness .staff-shift-actions .btn,
  body[data-role="staff"] #staff-shift-readiness .staff-shift-actions .btn{
    width:100%!important;
    min-width:0!important;
    min-height:48px!important;
    font-size:clamp(14px,3.8vw,16px)!important;
  }
  body.staff-mode #staff-shift-readiness .staff-shift-actions small,
  body[data-role="staff"] #staff-shift-readiness .staff-shift-actions small{
    max-width:none!important;
    text-align:left!important;
    font-size:clamp(11px,3vw,13px)!important;
    line-height:1.4!important;
  }
}

/* Overview settlement: larger typography, still responsive on 320–430 CSS px. */
#overview #admin-handover.overview-employee-settlement .section-head small{
  font-size:11px!important;
  line-height:1.25!important;
}
#overview #admin-handover.overview-employee-settlement .section-head h2{
  font-size:22px!important;
  line-height:1.18!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-hero>small{
  font-size:11px!important;
  line-height:1.25!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-hero>strong{
  font-size:30px!important;
  line-height:1.08!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-hero span{
  font-size:11.5px!important;
  line-height:1.25!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-hero b{
  font-size:13px!important;
  line-height:1.2!important;
}
#overview #admin-handover.overview-employee-settlement .employee-settlement-card>header strong{
  font-size:18px!important;
  line-height:1.2!important;
}
#overview #admin-handover.overview-employee-settlement .employee-settlement-card>header small{
  font-size:12.5px!important;
  line-height:1.3!important;
}
#overview #admin-handover.overview-employee-settlement .employee-settlement-card>header>b{
  font-size:14px!important;
  line-height:1.2!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-mini-grid small{
  font-size:10px!important;
  line-height:1.2!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-mini-grid strong{
  font-size:13px!important;
  line-height:1.25!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-detail>summary{
  font-size:14px!important;
  line-height:1.25!important;
  min-height:42px!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-detail>div{
  font-size:13.5px!important;
  line-height:1.55!important;
}

@media(max-width:430px){
  #overview #admin-handover.overview-employee-settlement{padding:13px!important}
  #overview #admin-handover.overview-employee-settlement .section-head h2{font-size:21px!important}
  #overview #admin-handover.overview-employee-settlement .settlement-hero{padding:13px!important}
  #overview #admin-handover.overview-employee-settlement .settlement-hero>strong{font-size:29px!important}
  #overview #admin-handover.overview-employee-settlement .settlement-hero span{font-size:11px!important;padding:8px 7px!important}
  #overview #admin-handover.overview-employee-settlement .settlement-hero b{font-size:12.5px!important}
  #overview #admin-handover.overview-employee-settlement .employee-settlement-card>header{padding:11px 11px 8px!important}
  #overview #admin-handover.overview-employee-settlement .employee-settlement-card>header strong{font-size:17px!important}
  #overview #admin-handover.overview-employee-settlement .employee-settlement-card>header small{font-size:12px!important}
  #overview #admin-handover.overview-employee-settlement .employee-settlement-card>header>b{font-size:13px!important;max-width:48%!important}
  #overview #admin-handover.overview-employee-settlement .settlement-mini-grid{gap:5px!important;padding:0 8px 9px!important}
  #overview #admin-handover.overview-employee-settlement .settlement-mini-grid span{padding:8px 4px!important}
  #overview #admin-handover.overview-employee-settlement .settlement-mini-grid small{font-size:9.5px!important}
  #overview #admin-handover.overview-employee-settlement .settlement-mini-grid strong{font-size:clamp(11.5px,3.2vw,13px)!important}
  #overview #admin-handover.overview-employee-settlement .settlement-detail>summary{font-size:13.5px!important}
  #overview #admin-handover.overview-employee-settlement .settlement-detail>div{font-size:13px!important;line-height:1.55!important}
}

@media(max-width:340px){
  body.staff-mode #staff-shift-readiness .staff-shift-checks,
  body[data-role="staff"] #staff-shift-readiness .staff-shift-checks{
    grid-template-columns:minmax(0,1fr)!important;
  }
  #overview #admin-handover.overview-employee-settlement .settlement-mini-grid small{font-size:9px!important}
  #overview #admin-handover.overview-employee-settlement .settlement-mini-grid strong{font-size:11.5px!important}
}


/* ========================================================================== 
   AquaFlow v4.06.1.25 — Operations Stock Ledger Visual Refresh
   - Redesign “Hàng & vỏ trong ngày” to match the approved AquaFlow visual.
   - Keep all ledger calculations, filters and reset behavior unchanged.
   ========================================================================== */
body.unified-shell #operations #operation-stock-ledger.stock-ledger-card{
  overflow:hidden!important;
  border:1px solid #d8e7f4!important;
  border-radius:24px!important;
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%)!important;
  box-shadow:0 12px 34px rgba(38,92,132,.07)!important;
}
body.unified-shell #operations .stock-ledger-summary{
  padding:20px 20px 16px!important;
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%)!important;
}
body.unified-shell #operations .stock-ledger-summary-top{gap:12px!important}
body.unified-shell #operations .stock-ledger-title>small{
  color:#0878ef!important;
  font-size:11px!important;
  font-weight:950!important;
  letter-spacing:.18em!important;
}
body.unified-shell #operations .stock-ledger-title>h2{
  margin-top:4px!important;
  color:#10243b!important;
  font-size:25px!important;
  font-weight:950!important;
  letter-spacing:-.035em!important;
}
body.unified-shell #operations .stock-ledger-summary-actions .enterprise-card-tag{display:none!important}
body.unified-shell #operations .stock-ledger-chevron{
  width:44px!important;
  height:44px!important;
  border-radius:15px!important;
  border:1px solid #cfe2f4!important;
  background:#f5faff!important;
  color:#0878ef!important;
  font-size:25px!important;
  box-shadow:none!important;
}
body.unified-shell #operations .stock-ledger-glance{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  margin-top:17px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
body.unified-shell #operations .stock-ledger-glance>span{
  position:relative!important;
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  align-items:center!important;
  column-gap:9px!important;
  min-width:0!important;
  min-height:76px!important;
  padding:11px 12px!important;
  border:1px solid #d7e7f4!important;
  border-radius:17px!important;
  background:#f3f8ff!important;
  overflow:hidden!important;
}
body.unified-shell #operations .stock-ledger-glance>span+span:before{display:grid!important}
body.unified-shell #operations .stock-ledger-glance>span:before{
  grid-column:1!important;
  grid-row:1/3!important;
  display:grid!important;
  place-items:center!important;
  width:38px!important;
  height:38px!important;
  border-radius:12px!important;
  background:#dcecff!important;
  color:#0878ef!important;
  font-size:20px!important;
  font-weight:950!important;
  content:"⇢"!important;
}
body.unified-shell #operations .stock-ledger-glance>span:nth-child(2){background:#effbf6!important;border-color:#d1efe0!important}
body.unified-shell #operations .stock-ledger-glance>span:nth-child(2):before{content:"↗"!important;background:#dff7ec!important;color:#078b68!important}
body.unified-shell #operations .stock-ledger-glance>span:nth-child(3){background:#fff4f5!important;border-color:#f6d7da!important}
body.unified-shell #operations .stock-ledger-glance>span:nth-child(3):before{content:"↘"!important;background:#ffe1e4!important;color:#cf2635!important}
body.unified-shell #operations .stock-ledger-glance small{
  grid-column:2!important;
  margin:0!important;
  color:#657f99!important;
  font-size:11px!important;
  font-weight:850!important;
  line-height:1.15!important;
}
body.unified-shell #operations .stock-ledger-glance strong{
  grid-column:2!important;
  margin:2px 0 0!important;
  color:#10243b!important;
  font-size:22px!important;
  font-weight:950!important;
  line-height:1.05!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums!important;
}
body.unified-shell #operations .stock-ledger-glance>span:nth-child(2) strong{color:#087b5c!important}
body.unified-shell #operations .stock-ledger-glance>span:nth-child(3) strong{color:#b4212e!important}
body.unified-shell #operations .stock-ledger-body{
  padding:16px 20px 20px!important;
  border-top:1px solid #e3edf6!important;
  background:#fff!important;
}
body.unified-shell #operations .stock-ledger-note{
  margin:0 0 13px!important;
  color:#71869a!important;
  font-size:14px!important;
  line-height:1.48!important;
}
body.unified-shell #operations .stock-ledger-filters{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
  margin:0 0 13px!important;
}
body.unified-shell #operations .stock-ledger-filter{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  min-width:0!important;
  min-height:47px!important;
  padding:0 10px!important;
  border:1px solid #d3e2ef!important;
  border-radius:15px!important;
  background:#fff!important;
  color:#314b65!important;
  font-size:13px!important;
  font-weight:900!important;
  box-shadow:none!important;
  white-space:nowrap!important;
}
body.unified-shell #operations .stock-ledger-filter:before{
  display:inline-grid!important;
  place-items:center!important;
  width:22px!important;
  height:22px!important;
  color:#56738e!important;
  font-size:15px!important;
  font-weight:900!important;
  content:"▦"!important;
}
body.unified-shell #operations .stock-ledger-filter[data-ledger-filter="delivery"]:before{content:"◎"!important}
body.unified-shell #operations .stock-ledger-filter[data-ledger-filter="receipt"]:before{content:"◇"!important}
body.unified-shell #operations .stock-ledger-filter[data-ledger-filter="adjustment"]:before{content:"☷"!important}
body.unified-shell #operations .stock-ledger-filter span{display:none!important}
body.unified-shell #operations .stock-ledger-filter.active{
  border-color:#0878ef!important;
  background:linear-gradient(135deg,#0878ef,#3f88ed)!important;
  color:#fff!important;
  box-shadow:0 9px 22px rgba(8,120,239,.18)!important;
}
body.unified-shell #operations .stock-ledger-filter.active:before{color:#fff!important}
body.unified-shell #operations .stock-ledger-reset-row{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:9px!important;
  margin:0 0 15px!important;
}
body.unified-shell #operations .stock-ledger-reset-empty{
  width:100%!important;
  min-height:54px!important;
  padding:0 16px!important;
  border:1px solid #ef6a67!important;
  border-radius:17px!important;
  background:linear-gradient(180deg,#fffafa,#fff6f6)!important;
  color:#ca302e!important;
  font-size:15px!important;
  font-weight:950!important;
  box-shadow:none!important;
}
body.unified-shell #operations .stock-ledger-reset-row small{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  min-height:44px!important;
  margin:0!important;
  padding:9px 12px!important;
  border:1px solid #d4e7fb!important;
  border-radius:14px!important;
  background:#f0f7ff!important;
  color:#567692!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1.35!important;
}
body.unified-shell #operations .stock-ledger-reset-row small:before{
  flex:0 0 24px!important;
  display:grid!important;
  place-items:center!important;
  width:24px!important;
  height:24px!important;
  border-radius:999px!important;
  background:#2d7be8!important;
  color:#fff!important;
  content:"i"!important;
  font-size:14px!important;
  font-weight:950!important;
  font-style:normal!important;
}
body.unified-shell #operations #stock-ledger-reset-note.is-reset{color:#2471c4!important}
body.unified-shell #operations #stock-ledger-list{overflow:visible!important}
body.unified-shell #operations .stock-ledger-rows{display:grid!important;gap:10px!important}
body.unified-shell #operations #stock-ledger-list .stock-ledger-row{
  display:grid!important;
  grid-template-columns:44px minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
  min-height:76px!important;
  margin:0!important;
  padding:11px 12px!important;
  border:1px solid #d9e7f3!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 6px 18px rgba(35,82,118,.045)!important;
}
body.unified-shell #operations #stock-ledger-list .stock-ledger-row:hover{border-color:#c6ddec!important;background:#fbfdff!important}
body.unified-shell #operations .stock-ledger-row-icon{
  display:grid!important;
  place-items:center!important;
  width:42px!important;
  height:42px!important;
  border-radius:13px!important;
  background:#e9f3ff!important;
  color:#0878ef!important;
  font-size:18px!important;
  font-weight:950!important;
}
body.unified-shell #operations .stock-ledger-receipt .stock-ledger-row-icon{background:#e2f7ee!important;color:#078b68!important}
body.unified-shell #operations .stock-ledger-adjustment .stock-ledger-row-icon{background:#fff3dd!important;color:#bd6b08!important}
body.unified-shell #operations .stock-ledger-main{display:grid!important;gap:5px!important;min-width:0!important}
body.unified-shell #operations .stock-ledger-main-line{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  min-width:0!important;
}
body.unified-shell #operations .stock-ledger-type{
  flex:0 0 auto!important;
  min-width:0!important;
  min-height:29px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 9px!important;
  border-radius:999px!important;
  background:#edf5ff!important;
  color:#0878ef!important;
  font-size:11px!important;
  font-weight:900!important;
  line-height:1!important;
  white-space:nowrap!important;
}
body.unified-shell #operations .stock-ledger-receipt .stock-ledger-type{background:#e8f8f1!important;color:#078b68!important}
body.unified-shell #operations .stock-ledger-adjustment .stock-ledger-type{background:#fff3df!important;color:#b76807!important}
body.unified-shell #operations .stock-ledger-main strong{
  min-width:0!important;
  overflow:hidden!important;
  color:#10243b!important;
  font-size:17px!important;
  font-weight:950!important;
  line-height:1.2!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
body.unified-shell #operations .stock-ledger-main small{
  min-width:0!important;
  overflow:hidden!important;
  color:#3c79ca!important;
  font-size:13px!important;
  font-weight:800!important;
  line-height:1.25!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
body.unified-shell #operations .stock-ledger-receipt .stock-ledger-main small{color:#168765!important}
body.unified-shell #operations .stock-ledger-adjustment .stock-ledger-main small{color:#a9630d!important}
body.unified-shell #operations .stock-ledger-tail{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  flex:0 0 auto!important;
  color:#0878ef!important;
}
body.unified-shell #operations #stock-ledger-list .stock-ledger-row time{
  color:#0878ef!important;
  font-size:13px!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
body.unified-shell #operations .stock-ledger-tail i{
  color:#7292af!important;
  font-size:24px!important;
  font-style:normal!important;
  line-height:1!important;
}
@media(max-width:640px){
  body.unified-shell #operations #operation-stock-ledger.stock-ledger-card{border-radius:20px!important}
  body.unified-shell #operations .stock-ledger-summary{padding:15px 14px 13px!important}
  body.unified-shell #operations .stock-ledger-title>small{font-size:10px!important}
  body.unified-shell #operations .stock-ledger-title>h2{font-size:21px!important}
  body.unified-shell #operations .stock-ledger-chevron{width:38px!important;height:38px!important;border-radius:13px!important;font-size:22px!important}
  body.unified-shell #operations .stock-ledger-glance{gap:7px!important;margin-top:13px!important}
  body.unified-shell #operations .stock-ledger-glance>span{
    grid-template-columns:30px minmax(0,1fr)!important;
    column-gap:7px!important;
    min-height:66px!important;
    padding:8px 8px!important;
    border-radius:14px!important;
  }
  body.unified-shell #operations .stock-ledger-glance>span:before{width:30px!important;height:30px!important;border-radius:10px!important;font-size:16px!important}
  body.unified-shell #operations .stock-ledger-glance small{font-size:9.5px!important}
  body.unified-shell #operations .stock-ledger-glance strong{font-size:17px!important}
  body.unified-shell #operations .stock-ledger-body{padding:13px 13px 15px!important}
  body.unified-shell #operations .stock-ledger-note{font-size:12.5px!important;margin-bottom:11px!important}
  body.unified-shell #operations .stock-ledger-filters{gap:6px!important;margin-bottom:11px!important}
  body.unified-shell #operations .stock-ledger-filter{min-height:43px!important;padding:0 6px!important;font-size:11.5px!important;gap:4px!important;border-radius:13px!important}
  body.unified-shell #operations .stock-ledger-filter:before{width:17px!important;height:17px!important;font-size:12px!important}
  body.unified-shell #operations .stock-ledger-reset-empty{min-height:49px!important;font-size:13.5px!important;border-radius:14px!important}
  body.unified-shell #operations .stock-ledger-reset-row small{min-height:40px!important;padding:8px 10px!important;font-size:11px!important}
  body.unified-shell #operations #stock-ledger-list .stock-ledger-row{
    grid-template-columns:38px minmax(0,1fr) auto!important;
    gap:8px!important;
    min-height:70px!important;
    padding:9px 10px!important;
    border-radius:15px!important;
  }
  body.unified-shell #operations .stock-ledger-row-icon{width:36px!important;height:36px!important;border-radius:11px!important;font-size:15px!important}
  body.unified-shell #operations .stock-ledger-main-line{gap:6px!important}
  body.unified-shell #operations .stock-ledger-type{min-height:25px!important;padding:0 7px!important;font-size:10.5px!important}
  body.unified-shell #operations .stock-ledger-main strong{font-size:15.5px!important}
  body.unified-shell #operations .stock-ledger-main small{font-size:12px!important}
  body.unified-shell #operations #stock-ledger-list .stock-ledger-row time{font-size:11.5px!important}
  body.unified-shell #operations .stock-ledger-tail i{font-size:21px!important}
}
@media(max-width:370px){
  body.unified-shell #operations .stock-ledger-glance>span{grid-template-columns:1fr!important;grid-template-rows:auto auto!important;text-align:center!important;place-items:center!important;gap:2px!important}
  body.unified-shell #operations .stock-ledger-glance>span:before{display:none!important}
  body.unified-shell #operations .stock-ledger-glance small,body.unified-shell #operations .stock-ledger-glance strong{grid-column:1!important}
  body.unified-shell #operations .stock-ledger-filter:before{display:none!important}
  body.unified-shell #operations .stock-ledger-filter{font-size:10.5px!important}
  body.unified-shell #operations #stock-ledger-list .stock-ledger-row{grid-template-columns:34px minmax(0,1fr) auto!important;gap:7px!important;padding-inline:8px!important}
  body.unified-shell #operations .stock-ledger-row-icon{width:32px!important;height:32px!important}
  body.unified-shell #operations .stock-ledger-main-line{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important}
  body.unified-shell #operations .stock-ledger-main strong{font-size:14.5px!important}
  body.unified-shell #operations .stock-ledger-main small{font-size:11.5px!important}
}

/* ========================================================================== 
   AquaFlow v4.06.1.26 — Stock Ledger Filter Reliability
   - Bộ lọc thao tác trực tiếp trên từng nút, không phụ thuộc event delegation.
   - Ép ẩn row bằng class + !important để ổn định trên Safari/Chrome/PWA.
   ========================================================================== */
body.unified-shell #operations .stock-ledger-filter{
  cursor:pointer!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
body.unified-shell #operations #stock-ledger-list .stock-ledger-row.is-filtered-out,
body.unified-shell #operations #stock-ledger-list .stock-ledger-row[hidden]{
  display:none!important;
}

/* v4.06.1.28 — corrected physical empty-return KPI + gross excess/shortage */
.bottle-debt-flow-card{display:grid;grid-template-columns:52px minmax(0,1fr);gap:13px;align-items:center;margin:0 0 12px;padding:12px 14px;border:1px solid #d7e8f5;border-radius:18px;background:linear-gradient(180deg,#fff,#f9fcff);box-shadow:0 6px 18px rgba(24,83,128,.035)}
.bottle-debt-flow-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:#eaf8f1;color:#0a9864;font-size:1.2rem;font-weight:900}
.bottle-debt-flow-card small{display:block;color:#6b8198;font-size:.7rem;font-weight:900;letter-spacing:.08em}
.bottle-debt-flow-card strong{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-top:3px;color:#17334d;font-size:1.06rem}
.bottle-debt-flow-card b{font-size:1.15rem;color:#0a9864}
.bottle-debt-flow-card b#bottle-debt-flow-shortage{color:#0878ef}
.bottle-debt-flow-card i{color:#8da0b2;font-style:normal}
.bottle-debt-flow-card em{display:block;margin-top:3px;color:#8193a5;font-size:.72rem;font-style:normal}
@media (max-width:560px){.bottle-debt-day-strip{grid-template-columns:1fr 1fr}.bottle-debt-day-strip>span.bottle-debt-excess-kpi{display:none}.bottle-debt-flow-card{grid-template-columns:44px minmax(0,1fr);padding:10px 11px}.bottle-debt-flow-icon{width:42px;height:42px;border-radius:13px}.bottle-debt-flow-card strong{font-size:.94rem;gap:6px}.bottle-debt-flow-card b{font-size:1.02rem}}

/* ========================================================================== 
   AquaFlow v4.06.1.32 — Staff Shift Action Dock
   iOS Safari can position fixed descendants of <dialog> below its visual
   viewport. This dialog therefore uses a real three-row flex layout: header,
   independently scrollable body and an in-flow action dock above safe-area.
   ========================================================================== */
#staff-shift-dialog .staff-shift-dialog-body{
  display:grid;
  gap:15px;
  min-width:0;
}

@media(max-width:760px){
  #staff-shift-dialog.staff-shift-enterprise-dialog,
  body.staff-mode #staff-shift-dialog.staff-shift-enterprise-dialog,
  body[data-role="staff"] #staff-shift-dialog.staff-shift-enterprise-dialog{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    max-width:100vw!important;
    height:var(--af-staff-shift-height,100dvh)!important;
    max-height:var(--af-staff-shift-height,100dvh)!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#fff!important;
    box-shadow:none!important;
  }

  #staff-shift-dialog #staff-shift-form.staff-shift-enterprise-form,
  body.staff-mode #staff-shift-dialog #staff-shift-form.staff-shift-enterprise-form,
  body[data-role="staff"] #staff-shift-dialog #staff-shift-form.staff-shift-enterprise-form{
    display:flex!important;
    flex-direction:column!important;
    gap:0!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:linear-gradient(180deg,#fff 0,#fbfdff 100%)!important;
  }

  #staff-shift-dialog .staff-shift-enterprise-head,
  body.staff-mode #staff-shift-dialog .staff-shift-enterprise-head,
  body[data-role="staff"] #staff-shift-dialog .staff-shift-enterprise-head{
    position:relative!important;
    inset:auto!important;
    z-index:3!important;
    flex:0 0 auto!important;
    width:100%!important;
    margin:0!important;
    padding:calc(14px + env(safe-area-inset-top)) 16px 13px!important;
    border-bottom:1px solid #dbe7f1!important;
    background:rgba(255,255,255,.99)!important;
    box-shadow:0 4px 16px rgba(22,59,89,.055)!important;
  }
  #staff-shift-dialog .staff-shift-enterprise-head>div{min-width:0!important}
  #staff-shift-dialog .staff-shift-enterprise-head h2{
    color:#132941!important;
    font-size:clamp(1.35rem,6vw,1.7rem)!important;
    line-height:1.08!important;
    letter-spacing:-.025em!important;
  }
  #staff-shift-dialog .staff-shift-enterprise-head .icon-btn{
    display:grid!important;
    flex:0 0 48px!important;
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    place-items:center!important;
    border:4px solid #b9e1ff!important;
    border-radius:16px!important;
    background:#f5f9fc!important;
    color:#60768a!important;
    font-size:1.9rem!important;
    line-height:1!important;
  }

  #staff-shift-dialog .staff-shift-dialog-body{
    display:grid!important;
    flex:1 1 auto!important;
    align-content:start!important;
    gap:15px!important;
    min-width:0!important;
    min-height:0!important;
    padding:17px 16px 24px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-padding-bottom:24px!important;
  }
  #staff-shift-dialog .staff-shift-dialog-summary{margin:0!important}
  #staff-shift-dialog :is(#staff-shift-declared-cash,#staff-shift-close-note){scroll-margin-bottom:96px}

  #staff-shift-dialog .staff-shift-enterprise-actions,
  body.staff-mode #staff-shift-dialog .staff-shift-enterprise-actions,
  body[data-role="staff"] #staff-shift-dialog .staff-shift-enterprise-actions{
    position:relative!important;
    inset:auto!important;
    z-index:4!important;
    display:grid!important;
    grid-template-columns:minmax(0,.82fr) minmax(0,1.35fr)!important;
    align-items:stretch!important;
    gap:10px!important;
    flex:0 0 auto!important;
    width:100%!important;
    min-height:78px!important;
    margin:0!important;
    padding:10px 16px max(12px,env(safe-area-inset-bottom))!important;
    border-top:1px solid #d7e5f0!important;
    background:rgba(255,255,255,.99)!important;
    box-shadow:0 -12px 30px rgba(17,54,84,.10)!important;
    visibility:visible!important;
    opacity:1!important;
    transform:none!important;
  }
  #staff-shift-dialog .staff-shift-enterprise-actions .btn{
    width:100%!important;
    min-width:0!important;
    min-height:54px!important;
    margin:0!important;
    padding:0 10px!important;
    border-radius:15px!important;
    font-size:clamp(.86rem,3.8vw,1rem)!important;
    font-weight:850!important;
    line-height:1.15!important;
    white-space:normal!important;
  }

  body.staff-shift-dialog-open .tabs{
    visibility:hidden!important;
    pointer-events:none!important;
  }
}

@supports not (height:100dvh){
  @media(max-width:760px){
    #staff-shift-dialog.staff-shift-enterprise-dialog{
      height:var(--af-staff-shift-height,100vh)!important;
      max-height:var(--af-staff-shift-height,100vh)!important;
    }
  }
}

/* Authoritative delivery selectors outrank legacy role/mobile rules. */
body #delivery-dialog.aquaflow-delivery-dialog .delivery-step-card label,
body #delivery-dialog.aquaflow-delivery-dialog .delivery-note-field{
  gap:5px!important;
  font-size:11.5px!important;
}
body #delivery-dialog.aquaflow-delivery-dialog .delivery-step-card :is(input:not([type="hidden"]),select:not(.delivery-customer-hidden),textarea),
body #delivery-dialog.aquaflow-delivery-dialog .delivery-note-field input{
  height:44px!important;
  min-height:44px!important;
  border-radius:12px!important;
  padding-inline:10px!important;
  font-size:16px!important;
}
body #delivery-dialog.aquaflow-delivery-dialog .delivery-customer-stage .delivery-customer-picker-compact .delivery-customer-search-box input{
  height:42px!important;
  min-height:42px!important;
  border:0!important;
  padding-inline:7px!important;
  font-size:16px!important;
}
body #delivery-dialog.aquaflow-delivery-dialog .delivery-extra-stage .delivery-pack-row{
  padding:8px!important;
  border-radius:12px!important;
}
body #delivery-dialog.aquaflow-delivery-dialog .delivery-extra-stage .delivery-pack-row .pack-size-title{
  margin:0!important;
}
body #delivery-dialog.aquaflow-delivery-dialog .delivery-extra-stage .delivery-pack-row .product-pack{
  gap:7px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
body #delivery-dialog.aquaflow-delivery-dialog .delivery-settlement-stage .delivery-payment-safe{
  gap:7px!important;
  padding:9px 0 0!important;
  border:0!important;
  border-top:1px solid #e1eaf2!important;
  border-radius:0!important;
  background:transparent!important;
}
body #delivery-dialog.aquaflow-delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
}
body #delivery-dialog.aquaflow-delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button{
  min-height:46px!important;
  border-radius:12px!important;
  padding:5px 7px!important;
}
body #delivery-dialog.aquaflow-delivery-dialog .delivery-payment-safe .delivery-payment-fields :is(input,select),
body #delivery-dialog.aquaflow-delivery-dialog .delivery-payment-safe .delivery-old-debt-fields :is(input,select){
  height:44px!important;
  min-height:44px!important;
  border-radius:11px!important;
  font-size:16px!important;
}

/* ==========================================================================
   AquaFlow v4.06.1.33 — Safe Delivery Payment
   Tách hoàn toàn tiền đơn và nợ cũ. Luồng chính chỉ còn Thu đủ đơn/Nợ lại;
   thu nợ cũ là thao tác riêng, mặc định 0đ và có xác nhận trước khi lưu.
   ========================================================================== */
#delivery-dialog .delivery-payment-safe{
  display:grid!important;
  gap:10px!important;
  padding:13px!important;
  border:1px solid #cfe3f3!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#fbfdff 0%,#f7fbfe 100%)!important;
  box-shadow:none!important;
}
#delivery-dialog .delivery-payment-safe-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-width:0;
}
#delivery-dialog .delivery-payment-safe-head>div{display:grid;gap:2px;min-width:0}
#delivery-dialog .delivery-payment-safe-head small{
  color:#0878ef;
  font-size:10px;
  font-weight:950;
  letter-spacing:.13em;
}
#delivery-dialog .delivery-payment-safe-head strong{
  color:#102b47;
  font-size:22px;
  font-weight:950;
  line-height:1.08;
  font-variant-numeric:tabular-nums;
}
#delivery-dialog .delivery-payment-safe-head>span{
  flex:0 0 auto;
  min-height:29px;
  display:inline-flex;
  align-items:center;
  border:1px solid #bfe8d5;
  border-radius:999px;
  background:#edf9f4;
  padding:0 10px;
  color:#087755;
  font-size:10px;
  font-weight:900;
  white-space:nowrap;
}

#delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
  width:100%!important;
  max-width:none!important;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button{
  display:grid!important;
  place-items:center!important;
  align-content:center!important;
  gap:2px!important;
  min-width:0!important;
  min-height:54px!important;
  border:1px solid #cbddea!important;
  border-radius:14px!important;
  background:#fff!important;
  padding:7px 9px!important;
  color:#385873!important;
  box-shadow:none!important;
  white-space:normal!important;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button strong{
  color:inherit;
  font-size:14px;
  font-weight:950;
  line-height:1.15;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button small{
  color:#7a8fa2;
  font-size:9.5px;
  font-weight:750;
  line-height:1.2;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button[data-paid="full"].is-active{
  border-color:#0878ef!important;
  background:linear-gradient(135deg,#168cff,#0878ef)!important;
  color:#fff!important;
  box-shadow:0 7px 17px rgba(8,120,239,.18)!important;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button[data-paid="full"].is-active small{color:#e5f3ff!important}
#delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button[data-paid="0"].is-active{
  border-color:#e5b76f!important;
  background:#fff6e8!important;
  color:#955a0d!important;
  box-shadow:inset 0 0 0 1px rgba(183,110,13,.05)!important;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button[data-paid="0"].is-active small{color:#a4773d!important}

#delivery-dialog .delivery-payment-safe .delivery-payment-fields{
  display:grid!important;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)!important;
  gap:8px!important;
  align-items:end!important;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-fields label,
#delivery-dialog .delivery-payment-safe .delivery-old-debt-fields label{
  gap:5px!important;
  color:#405b73!important;
  font-size:12px!important;
  font-weight:850!important;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-fields :is(input,select),
#delivery-dialog .delivery-payment-safe .delivery-old-debt-fields :is(input,select){
  width:100%!important;
  min-width:0!important;
  height:49px!important;
  min-height:49px!important;
  border-radius:13px!important;
  padding-inline:11px!important;
  font-size:16px!important;
  font-weight:850!important;
}

#delivery-dialog .delivery-old-debt-safe-card{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(120px,.72fr);
  align-items:center;
  gap:9px;
  min-width:0;
  padding:10px;
  border:1px solid #f0c4c7;
  border-radius:15px;
  background:linear-gradient(135deg,#fff8f8,#fffdfd);
}
#delivery-dialog .delivery-old-debt-safe-card>div{display:grid;gap:2px;min-width:0}
#delivery-dialog .delivery-old-debt-safe-card small{
  color:#ba3640;
  font-size:9px;
  font-weight:950;
  letter-spacing:.1em;
}
#delivery-dialog .delivery-old-debt-safe-card strong{
  color:#c63843;
  font-size:18px;
  font-weight:950;
  line-height:1.1;
  font-variant-numeric:tabular-nums;
}
#delivery-dialog .delivery-old-debt-safe-card>div>span{
  color:#8b6d70;
  font-size:9.5px;
  line-height:1.25;
}
#delivery-dialog .delivery-old-debt-row{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  min-width:0!important;
  min-height:46px!important;
  border:1px solid #df9da2!important;
  border-radius:12px!important;
  background:#fff!important;
  padding:7px 8px!important;
  color:#b42e39!important;
  font-size:11px!important;
  font-weight:950!important;
  line-height:1.2!important;
  text-align:center!important;
}
#delivery-dialog .delivery-old-debt-row b{
  flex:0 0 auto;
  color:#bd5961!important;
  font-size:18px!important;
  line-height:1!important;
  transition:transform .16s ease;
}
#delivery-dialog .delivery-old-debt-row.is-open{
  border-color:#d98e94!important;
  background:#fff0f1!important;
}
#delivery-dialog .delivery-old-debt-row.is-open b{transform:rotate(90deg)}

#delivery-dialog .delivery-payment-safe .delivery-old-debt-panel{
  display:grid;
  gap:9px;
  padding:10px;
  border:1px solid #eab5b9;
  border-radius:15px;
  background:#fff8f8;
  box-shadow:inset 0 0 0 1px rgba(207,45,56,.025);
}
#delivery-dialog .delivery-old-debt-warning{
  display:grid;
  gap:2px;
  margin:0;
  padding:8px 9px;
  border-radius:11px;
  background:#ffedef;
  color:#8d3138;
}
#delivery-dialog .delivery-old-debt-warning strong{font-size:11.5px;line-height:1.25}
#delivery-dialog .delivery-old-debt-warning span{font-size:9.5px;line-height:1.35}
#delivery-dialog .delivery-payment-safe .delivery-old-debt-fields{
  display:grid!important;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)!important;
  gap:8px!important;
  align-items:end!important;
}
#delivery-dialog .delivery-old-debt-fill-all{
  width:100%;
  min-height:41px;
  border:1px dashed #d98f96;
  border-radius:11px;
  background:#fff;
  color:#a8353f;
  font-size:11px;
  font-weight:900;
}
#delivery-dialog .delivery-old-debt-after{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  border-top:1px dashed #e8c0c3!important;
  padding-top:7px!important;
  color:#7d5c60!important;
  font-size:11px!important;
}
#delivery-dialog .delivery-old-debt-after strong{color:#087b59!important;font-size:13px!important}

#delivery-dialog .delivery-payment-review{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
  padding:6px;
  border:1px solid #d5e5f1;
  border-radius:14px;
  background:#fff;
}
#delivery-dialog .delivery-payment-review>span{
  display:grid;
  align-content:center;
  gap:2px;
  min-width:0;
  min-height:45px;
  padding:6px 7px;
  border-radius:10px;
  background:#f5f9fc;
}
#delivery-dialog .delivery-payment-review small{
  color:#71869a;
  font-size:8px;
  font-weight:950;
  letter-spacing:.07em;
  white-space:nowrap;
}
#delivery-dialog .delivery-payment-review strong{
  min-width:0;
  overflow:hidden;
  color:#173b5e;
  font-size:clamp(11px,3.2vw,14px);
  font-weight:950;
  line-height:1.15;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
#delivery-dialog .delivery-payment-review .delivery-review-total{
  background:#eaf6ff;
}
#delivery-dialog .delivery-payment-review .delivery-review-total strong{color:#0878ef}
#delivery-dialog .delivery-payment-review.has-old-debt-payment{
  border-color:#e9bd83;
  background:#fffaf2;
}
#delivery-dialog .delivery-payment-review.has-old-debt-payment>span:nth-child(2){
  background:#fff0f1;
}
#delivery-dialog .delivery-payment-review.has-old-debt-payment>span:nth-child(2) strong{color:#c63742}
#delivery-dialog .delivery-payment-review.has-old-debt-payment .delivery-review-total{
  background:#fff3dd;
}
#delivery-dialog .delivery-payment-review.has-old-debt-payment .delivery-review-total strong{color:#a86008}

#delivery-dialog .delivery-payment-safe .delivery-payment-after{
  padding:7px 8px!important;
  border-radius:10px!important;
  background:#eef5fa!important;
  color:#60778b!important;
  font-size:10.5px!important;
  line-height:1.35!important;
  text-align:center!important;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-after b{color:#173b5e!important}
#delivery-dialog .delivery-payment-safe .delivery-payment-hint{
  display:block!important;
  margin:0!important;
  color:#59768f!important;
  font-size:10.5px!important;
  font-weight:750!important;
  line-height:1.4!important;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-hint.old-debt-warning{
  border:1px solid #edc88f;
  border-radius:10px;
  background:#fff6e8;
  padding:7px 8px;
  color:#9a5a0c!important;
  font-weight:900!important;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-hint.negative{color:#c52f3b!important}

@media(max-width:430px){
  body.unified-shell #delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts,
  body.management-mode #delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts,
  body.staff-mode #delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #delivery-dialog .delivery-payment-safe{gap:8px!important;padding:10px!important;border-radius:16px!important}
  #delivery-dialog .delivery-payment-safe-head strong{font-size:20px}
  #delivery-dialog .delivery-payment-safe-head>span{min-height:27px;padding-inline:8px;font-size:8.5px}
  #delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts{gap:6px!important}
  #delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button{min-height:50px!important;padding:5px 7px!important}
  #delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button strong{font-size:12.5px}
  #delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button small{font-size:8.5px}
  #delivery-dialog .delivery-payment-safe .delivery-payment-fields,
  #delivery-dialog .delivery-payment-safe .delivery-old-debt-fields{gap:6px!important}
  #delivery-dialog .delivery-payment-safe .delivery-payment-fields label,
  #delivery-dialog .delivery-payment-safe .delivery-old-debt-fields label{font-size:10.5px!important}
  #delivery-dialog .delivery-payment-safe .delivery-payment-fields :is(input,select),
  #delivery-dialog .delivery-payment-safe .delivery-old-debt-fields :is(input,select){height:46px!important;min-height:46px!important;font-size:15px!important}
  #delivery-dialog .delivery-old-debt-safe-card{grid-template-columns:minmax(0,1fr) minmax(112px,.72fr);gap:6px;padding:8px}
  #delivery-dialog .delivery-old-debt-safe-card strong{font-size:16px}
  #delivery-dialog .delivery-old-debt-safe-card>div>span{font-size:8.5px}
  #delivery-dialog .delivery-old-debt-row{min-height:43px!important;padding-inline:6px!important;font-size:10px!important}
  #delivery-dialog .delivery-payment-safe .delivery-old-debt-panel{gap:7px;padding:8px}
  #delivery-dialog .delivery-payment-review{gap:4px;padding:4px}
  #delivery-dialog .delivery-payment-review>span{min-height:42px;padding:5px}
  #delivery-dialog .delivery-payment-review small{font-size:7px}
  #delivery-dialog .delivery-payment-review strong{font-size:clamp(10.5px,3vw,12.5px)}
  #delivery-dialog .delivery-payment-safe .delivery-payment-after,
  #delivery-dialog .delivery-payment-safe .delivery-payment-hint{font-size:9.5px!important}
}

/* ==========================================================================
   AquaFlow v4.06.1.34 — Compact Enterprise Delivery Workflow
   Một shell cố định, một vùng cuộn, bốn bước rõ ràng; giảm chiều cao và bỏ
   các lớp trình bày trùng lặp trong Ghi đơn giao.
   ========================================================================== */
#delivery-dialog.aquaflow-delivery-dialog{
  width:min(680px,calc(100% - 24px));
  max-height:min(94dvh,940px);
  overflow:hidden!important;
  border:1px solid #d4e2ed;
  border-radius:24px;
  background:#f4f8fb;
}
body #delivery-dialog.aquaflow-delivery-dialog #delivery-form{
  display:flex!important;
  flex-direction:column!important;
  gap:0!important;
  width:100%!important;
  height:min(94dvh,940px)!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  background:#f4f8fb!important;
}
body #delivery-dialog.aquaflow-delivery-dialog .delivery-enterprise-head{
  position:relative!important;
  inset:auto!important;
  z-index:20!important;
  flex:0 0 auto!important;
  align-items:center!important;
  width:100%!important;
  min-height:76px!important;
  margin:0!important;
  padding:14px 16px 12px!important;
  border-bottom:1px solid #d5e4ef!important;
  background:rgba(255,255,255,.985)!important;
  box-shadow:0 3px 14px rgba(27,68,102,.045)!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
}
#delivery-dialog .delivery-enterprise-head>div{display:grid;gap:2px;padding:0!important}
#delivery-dialog .delivery-enterprise-head small{
  color:#0878ef!important;
  font-size:10px!important;
  font-weight:900!important;
  letter-spacing:.13em!important;
  line-height:1.15!important;
}
#delivery-dialog .delivery-enterprise-head h2{
  margin:2px 0 0!important;
  color:#122d48!important;
  font-size:23px!important;
  line-height:1.08!important;
  letter-spacing:-.025em!important;
}
body #delivery-dialog.aquaflow-delivery-dialog .delivery-enterprise-head .icon-btn{
  display:grid!important;
  place-items:center!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  flex:0 0 42px!important;
  border:2px solid #b9ddf7!important;
  border-radius:13px!important;
  background:#f3f9fd!important;
  color:#5d7489!important;
  font-size:25px!important;
  line-height:1!important;
}

#delivery-dialog .delivery-form-scroll{
  flex:1 1 auto;
  display:grid;
  align-content:start;
  gap:10px;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:12px;
  background:#f4f8fb;
  scrollbar-gutter:stable;
}
#delivery-dialog .delivery-form-scroll>.is-hidden,
#delivery-dialog .delivery-form-scroll .is-hidden{display:none!important}

#delivery-dialog .delivery-step-card{
  display:grid;
  gap:9px;
  min-width:0;
  padding:11px;
  border:1px solid #d8e5ef;
  border-radius:17px;
  background:#fff;
  box-shadow:0 3px 12px rgba(29,69,100,.035);
}
#delivery-dialog .delivery-step-head{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  padding-bottom:7px;
  border-bottom:1px solid #e5edf4;
}
#delivery-dialog .delivery-step-head>span{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  flex:0 0 28px;
  border-radius:9px;
  background:#e8f5ff;
  color:#0878ef;
  font-size:10px;
  font-weight:950;
  font-variant-numeric:tabular-nums;
}
#delivery-dialog .delivery-step-head>div{display:grid;gap:1px;min-width:0}
#delivery-dialog .delivery-step-head strong{
  color:#173652;
  font-size:14px;
  font-weight:900;
  line-height:1.2;
}
#delivery-dialog .delivery-step-head small{
  color:#73889b;
  font-size:9.5px;
  font-weight:650;
  letter-spacing:0;
  line-height:1.25;
}

#delivery-dialog .delivery-step-card label,
#delivery-dialog .delivery-note-field{
  gap:5px!important;
  color:#38536b!important;
  font-size:11.5px!important;
  font-weight:850!important;
  line-height:1.18!important;
}
#delivery-dialog .delivery-step-card :is(input:not([type="hidden"]),select:not(.delivery-customer-hidden),textarea),
#delivery-dialog .delivery-note-field input{
  width:100%!important;
  min-width:0!important;
  height:44px!important;
  min-height:44px!important;
  border:1px solid #c8dbe9!important;
  border-radius:12px!important;
  background:#fff!important;
  padding:0 10px!important;
  color:#142f49!important;
  font-size:16px!important;
  font-weight:800!important;
  line-height:1.1!important;
  box-shadow:none!important;
}
#delivery-dialog .delivery-step-card :is(input:not([type="hidden"]),select:not(.delivery-customer-hidden),textarea):focus,
#delivery-dialog .delivery-note-field input:focus{
  border-color:#399ff1!important;
  box-shadow:0 0 0 3px #dff1ff!important;
}
#delivery-dialog .delivery-step-card .two{gap:7px!important}

#delivery-dialog .delivery-customer-stage .delivery-customer-picker{
  gap:7px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
#delivery-dialog .delivery-customer-search-box{
  height:44px!important;
  min-height:44px!important;
  border-radius:12px!important;
}
#delivery-dialog .delivery-customer-search-box input{
  height:42px!important;
  min-height:42px!important;
  border:0!important;
  padding-inline:7px!important;
  background:transparent!important;
  box-shadow:none!important;
}
#delivery-dialog .delivery-customer-selected{
  min-height:52px!important;
  padding:7px 9px!important;
  border-radius:12px!important;
  background:#edf7ff!important;
}
#delivery-dialog .delivery-customer-selected .avatar{
  width:36px!important;
  height:36px!important;
  border-radius:10px!important;
}
#delivery-dialog .delivery-customer-selected strong{font-size:13px!important}
#delivery-dialog .delivery-customer-selected small{font-size:9.5px!important}
#delivery-dialog .delivery-change-customer{
  min-height:36px!important;
  border-radius:10px!important;
  padding:0 11px!important;
  font-size:11px!important;
}

#delivery-dialog .delivery-return-row{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  align-items:end;
  gap:7px;
}
#delivery-dialog .delivery-return-row .bottle-company-preview{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:6px!important;
  min-height:44px!important;
  margin:0!important;
  padding:7px 9px!important;
  border:0!important;
  border-radius:12px!important;
  background:#edf6fc!important;
  color:#60788d!important;
  font-size:9.5px!important;
  line-height:1.25!important;
}
#delivery-dialog .delivery-return-row .bottle-company-preview strong{
  color:#173b5e!important;
  font-size:11px!important;
  white-space:nowrap!important;
}
#delivery-dialog .delivery-assignment-row{margin-top:1px}
#delivery-dialog .delivery-payroll-note{
  margin:-2px 1px 0!important;
  color:#7b8fa1!important;
  font-size:9.5px!important;
  line-height:1.25!important;
}

#delivery-dialog .delivery-extra-stage{gap:8px}
#delivery-dialog .delivery-option-strip{gap:6px!important}
#delivery-dialog .delivery-option-chip{
  min-height:40px!important;
  border-radius:11px!important;
  padding:0 5px!important;
  background:#f7fafc!important;
  color:#526e85!important;
  font-size:10.5px!important;
}
#delivery-dialog .delivery-option-chip span{gap:4px!important}
#delivery-dialog .delivery-option-chip span::before{
  width:17px!important;
  height:17px!important;
  flex-basis:17px!important;
  border-radius:5px!important;
  font-size:12px!important;
}
#delivery-dialog .delivery-option-chip:has(input:checked){
  border-color:#71baf1!important;
  background:#eaf6ff!important;
  color:#0878ef!important;
  box-shadow:inset 0 0 0 1px rgba(8,120,239,.07)!important;
}
#delivery-dialog .delivery-option-chip:has(input:checked) span::before{
  border-color:#0878ef!important;
  background:#0878ef!important;
}
#delivery-dialog .delivery-inline-option{
  display:grid;
  grid-template-columns:minmax(0,1fr) 112px;
  align-items:end;
  gap:8px;
  padding:8px 9px!important;
  border:1px solid #efc9cc!important;
  border-radius:12px!important;
  background:#fff8f8!important;
}
#delivery-dialog .delivery-inline-option>div{display:grid;gap:2px;align-self:center}
#delivery-dialog .delivery-inline-option>div strong{color:#9f3540;font-size:11px}
#delivery-dialog .delivery-inline-option>div small{color:#8f6b6f;font-size:9px;line-height:1.25}

#delivery-dialog .delivery-extra-stage .pack-fields{
  display:grid;
  gap:7px;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
#delivery-dialog .delivery-pack-row{
  display:grid!important;
  grid-template-columns:56px minmax(0,1fr)!important;
  align-items:end!important;
  gap:7px!important;
  margin:0!important;
  padding:8px!important;
  border:1px solid #cce7ee!important;
  border-radius:12px!important;
  background:#f4fbfc!important;
}
#delivery-dialog .delivery-pack-row+.delivery-pack-row{margin:0!important}
#delivery-dialog .delivery-pack-row .pack-size-title{
  display:grid!important;
  place-items:center!important;
  align-self:stretch!important;
  min-height:44px!important;
  border-radius:9px!important;
  background:#e5f6fa!important;
  color:#0878ae!important;
  font-size:10px!important;
  letter-spacing:.05em!important;
}
#delivery-dialog .delivery-pack-row .product-pack{
  display:grid!important;
  grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)!important;
  gap:7px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}

#delivery-dialog .delivery-extra-stage .deposit-block{
  display:grid;
  gap:7px!important;
  padding:8px!important;
  border:1px solid #bfe4d6!important;
  border-radius:12px!important;
  background:#f2fbf7!important;
}
#delivery-dialog .delivery-option-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
#delivery-dialog .delivery-option-panel-head .deposit-title{
  color:#087957!important;
  font-size:10px!important;
  letter-spacing:.09em!important;
}
#delivery-dialog .delivery-option-panel-head small{color:#68877b;font-size:9px}
#delivery-dialog .delivery-deposit-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
}
#delivery-dialog .delivery-deposit-grid label{font-size:9.5px!important}
#delivery-dialog .deposit-preview{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:5px!important;
}
#delivery-dialog .deposit-preview>span{
  display:grid!important;
  align-content:center!important;
  gap:1px!important;
  min-width:0!important;
  min-height:36px!important;
  padding:5px 6px!important;
  border-radius:9px!important;
  background:#fff!important;
  color:#71877d!important;
  font-size:8px!important;
  text-align:center!important;
}
#delivery-dialog .deposit-preview strong{
  overflow:hidden!important;
  color:#145f4a!important;
  font-size:9.5px!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

#delivery-dialog .delivery-settlement-stage{gap:8px}
#delivery-dialog .delivery-settlement-stage .delivery-total-card{
  min-height:68px!important;
  margin:0!important;
  padding:9px 10px!important;
  border-radius:13px!important;
  background:linear-gradient(135deg,#edf8ff,#f8fcff)!important;
}
#delivery-dialog .delivery-settlement-stage .delivery-total-card>div:first-child strong{
  margin-top:2px!important;
  font-size:21px!important;
  line-height:1.05!important;
}
#delivery-dialog .delivery-settlement-stage .delivery-total-card small{font-size:9px!important}
#delivery-dialog .delivery-settlement-stage .delivery-goods-note{font-size:9px!important}
#delivery-dialog .delivery-settlement-stage #delivery-breakdown{
  max-width:54%;
  font-size:9.5px!important;
  line-height:1.35!important;
}
#delivery-dialog .delivery-deposit-payment-note{
  margin:0!important;
  padding:6px 8px!important;
  border-radius:9px!important;
  font-size:9px!important;
  line-height:1.3!important;
}

#delivery-dialog .delivery-settlement-stage .delivery-payment-safe{
  gap:7px!important;
  margin:0!important;
  padding:9px 0 0!important;
  border:0!important;
  border-top:1px solid #e1eaf2!important;
  border-radius:0!important;
  background:transparent!important;
}
#delivery-dialog .delivery-payment-safe-head small{font-size:9px!important}
#delivery-dialog .delivery-payment-safe-head strong{font-size:19px!important}
#delivery-dialog .delivery-payment-safe-head>span{
  min-height:26px!important;
  padding:0 8px!important;
  font-size:8.5px!important;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts{gap:6px!important}
#delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button{
  min-height:46px!important;
  border-radius:12px!important;
  padding:5px 7px!important;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button strong{font-size:12px!important}
#delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts button small{font-size:8px!important}
#delivery-dialog .delivery-payment-safe .delivery-payment-fields,
#delivery-dialog .delivery-payment-safe .delivery-old-debt-fields{gap:6px!important}
#delivery-dialog .delivery-payment-safe .delivery-payment-fields label,
#delivery-dialog .delivery-payment-safe .delivery-old-debt-fields label{font-size:10px!important}
#delivery-dialog .delivery-payment-safe .delivery-payment-fields :is(input,select),
#delivery-dialog .delivery-payment-safe .delivery-old-debt-fields :is(input,select){
  height:44px!important;
  min-height:44px!important;
  border-radius:11px!important;
  font-size:16px!important;
}
#delivery-dialog .delivery-old-debt-safe-card{
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:7px!important;
  padding:7px 8px!important;
  border-radius:12px!important;
}
#delivery-dialog .delivery-old-debt-safe-card small{font-size:8px!important}
#delivery-dialog .delivery-old-debt-safe-card strong{font-size:15px!important}
#delivery-dialog .delivery-old-debt-safe-card>div>span{font-size:8px!important}
#delivery-dialog .delivery-old-debt-row{
  min-width:112px!important;
  min-height:39px!important;
  border-radius:10px!important;
  padding:5px 7px!important;
  font-size:9.5px!important;
}
#delivery-dialog .delivery-payment-safe .delivery-old-debt-panel{
  gap:7px!important;
  padding:8px!important;
  border-radius:12px!important;
}
#delivery-dialog .delivery-old-debt-warning{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:7px!important;
  padding:6px 8px!important;
  border-radius:9px!important;
}
#delivery-dialog .delivery-old-debt-warning strong{font-size:9.5px!important}
#delivery-dialog .delivery-old-debt-warning span{font-size:8px!important;text-align:right}
#delivery-dialog .delivery-old-debt-tools{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);
  align-items:stretch;
  gap:6px;
}
#delivery-dialog .delivery-old-debt-fill-all{
  min-height:36px!important;
  border-radius:9px!important;
  font-size:9px!important;
}
#delivery-dialog .delivery-old-debt-tools .delivery-old-debt-after{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:4px!important;
  min-width:0!important;
  min-height:36px!important;
  margin:0!important;
  padding:5px 7px!important;
  border:0!important;
  border-radius:9px!important;
  background:#fff!important;
  color:#7a5b5e!important;
  font-size:8.5px!important;
}
#delivery-dialog .delivery-old-debt-tools .delivery-old-debt-after strong{font-size:10px!important;white-space:nowrap!important}
#delivery-dialog .delivery-payment-review{
  gap:4px!important;
  padding:4px!important;
  border-radius:12px!important;
}
#delivery-dialog .delivery-payment-review>span{
  min-height:39px!important;
  padding:4px 5px!important;
  border-radius:8px!important;
}
#delivery-dialog .delivery-payment-review small{font-size:7px!important}
#delivery-dialog .delivery-payment-review strong{font-size:11.5px!important}
#delivery-dialog .delivery-payment-safe .delivery-payment-after{
  padding:5px 7px!important;
  border-radius:8px!important;
  font-size:9px!important;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-hint{
  margin:0!important;
  padding:0 1px!important;
  font-size:9px!important;
  line-height:1.3!important;
}
#delivery-dialog .delivery-payment-safe .delivery-payment-hint.old-debt-warning{
  padding:6px 7px!important;
  border-radius:9px!important;
}
#delivery-dialog .delivery-payment-result-legacy{display:none!important}

#delivery-dialog .delivery-note-field{
  display:grid;
  gap:5px;
  padding:9px 10px;
  border:1px solid #d8e5ef;
  border-radius:14px;
  background:#fff;
}
body #delivery-dialog.aquaflow-delivery-dialog .workflow-fixed-actions{
  position:relative!important;
  inset:auto!important;
  z-index:20!important;
  flex:0 0 auto!important;
  display:grid!important;
  grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)!important;
  gap:9px!important;
  width:100%!important;
  min-height:70px!important;
  margin:0!important;
  padding:9px 12px max(9px,env(safe-area-inset-bottom))!important;
  border-top:1px solid #d5e4ef!important;
  background:rgba(255,255,255,.99)!important;
  box-shadow:0 -8px 24px rgba(20,54,79,.07)!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
}
body #delivery-dialog.aquaflow-delivery-dialog .workflow-fixed-actions .btn{
  width:100%!important;
  min-width:0!important;
  height:50px!important;
  min-height:50px!important;
  margin:0!important;
  border-radius:13px!important;
  padding:0 10px!important;
  font-size:14px!important;
  font-weight:900!important;
  white-space:nowrap!important;
}

@media(max-width:760px){
  #delivery-dialog.aquaflow-delivery-dialog{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog #delivery-form{
    width:100%!important;
    height:100dvh!important;
    max-height:100dvh!important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-enterprise-head{
    min-height:70px!important;
    padding:calc(9px + env(safe-area-inset-top)) 12px 9px!important;
  }
  #delivery-dialog .delivery-enterprise-head h2{font-size:21px!important}
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-enterprise-head .icon-btn{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    flex-basis:40px!important;
  }
  #delivery-dialog .delivery-form-scroll{gap:8px;padding:9px 10px 12px}
  #delivery-dialog .delivery-step-card{gap:8px;padding:9px;border-radius:15px}
  #delivery-dialog .delivery-step-head{padding-bottom:6px}
  #delivery-dialog .delivery-payroll-note{display:none!important}
  #delivery-dialog .delivery-payment-safe .delivery-payment-shortcuts{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body #delivery-dialog.aquaflow-delivery-dialog .workflow-fixed-actions{
    min-height:68px!important;
    padding:8px 10px max(8px,env(safe-area-inset-bottom))!important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .workflow-fixed-actions .btn{
    height:50px!important;
    min-height:50px!important;
  }
}

@media(max-width:360px){
  #delivery-dialog .delivery-return-row{grid-template-columns:1fr}
  #delivery-dialog .delivery-deposit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #delivery-dialog .delivery-deposit-grid label:last-child{grid-column:1/-1}
  #delivery-dialog .delivery-old-debt-safe-card{grid-template-columns:1fr!important}
  #delivery-dialog .delivery-old-debt-row{width:100%!important}
}

@supports not (height:100dvh){
  @media(max-width:760px){
    #delivery-dialog.aquaflow-delivery-dialog,
    body #delivery-dialog.aquaflow-delivery-dialog #delivery-form{
      height:100vh!important;
      max-height:100vh!important;
    }
  }
}

/* =========================================================
   v4.06.1.36 — Debt collection: show every outstanding order
   Mobile/staff dialogs use the form as the single scroll container.
   Removes the nested height cap that made only ~1 order visible on iPhone.
   ========================================================= */
@media(max-width:640px){
  #payment-dialog #payment-order-list,
  body.unified-shell.staff-mode #payment-dialog #payment-order-list,
  body.staff-mode #payment-dialog #payment-order-list,
  body[data-role="staff"] #payment-dialog #payment-order-list{
    max-height:none!important;
    height:auto!important;
    overflow:visible!important;
    overscroll-behavior:auto!important;
    -webkit-overflow-scrolling:auto!important;
  }

  /* Keep every debt order inside one continuous, easy-to-scan list. */
  #payment-dialog .payment-order-panel{
    overflow:hidden!important;
  }

  #payment-dialog .payment-order-row-v4047{
    min-height:0!important;
    padding:10px 11px!important;
  }

  #payment-dialog .payment-order-row-v4047 + .payment-order-row-v4047{
    border-top:1px solid #e3edf5!important;
  }

  /* Make the list compact enough for customers with many outstanding orders. */
  #payment-dialog .payment-order-main{gap:6px!important}
  #payment-dialog .payment-order-top{gap:8px!important}
  #payment-dialog .payment-order-collect{
    grid-template-columns:88px minmax(0,1fr)!important;
    gap:7px!important;
  }
  #payment-dialog .payment-order-amount-wrap{height:40px!important}
  #payment-dialog .payment-order-amount-wrap .payment-order-amount{height:38px!important}

  /* The fullscreen payment form remains the only vertical scroller. */
  body.unified-shell.staff-mode #payment-dialog .payment-enterprise-form,
  body.staff-mode #payment-dialog .payment-enterprise-form,
  body[data-role="staff"] #payment-dialog .payment-enterprise-form{
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-padding-bottom:96px!important;
  }
}

@media(max-width:390px){
  #payment-dialog #payment-order-list,
  body.unified-shell.staff-mode #payment-dialog #payment-order-list,
  body.staff-mode #payment-dialog #payment-order-list,
  body[data-role="staff"] #payment-dialog #payment-order-list{
    max-height:none!important;
  }
  #payment-dialog .payment-order-collect{
    grid-template-columns:78px minmax(0,1fr)!important;
  }
}

/* =========================================================
   v4.06.1.39 — Vehicle receipt reconciliation
   Admin/manager mobile used a height-constrained CSS grid. The order panel
   could shrink and clip rows even after removing the list's max-height.
   Use a non-shrinking flex flow so every outstanding order stays in the
   document flow and the payment form is the single vertical scroller.
   ========================================================= */
@media(max-width:640px){
  body.unified-shell.admin-mode #payment-dialog.payment-enterprise-dialog,
  body.unified-shell.manager-mode #payment-dialog.payment-enterprise-dialog{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    border-radius:0!important;
    overflow:hidden!important;
  }

  body.unified-shell.admin-mode #payment-dialog .payment-enterprise-form,
  body.unified-shell.manager-mode #payment-dialog .payment-enterprise-form{
    display:flex!important;
    flex-direction:column!important;
    gap:10px!important;
    width:100%!important;
    height:100dvh!important;
    max-height:100dvh!important;
    padding:15px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-padding-bottom:88px!important;
  }

  body.unified-shell.admin-mode #payment-dialog .payment-enterprise-form > *,
  body.unified-shell.manager-mode #payment-dialog .payment-enterprise-form > *{
    flex:0 0 auto!important;
  }

  body.unified-shell.admin-mode #payment-dialog .payment-order-panel,
  body.unified-shell.manager-mode #payment-dialog .payment-order-panel{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }

  body.unified-shell.admin-mode #payment-dialog #payment-order-list,
  body.unified-shell.manager-mode #payment-dialog #payment-order-list{
    display:block!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    overscroll-behavior:auto!important;
    -webkit-overflow-scrolling:auto!important;
  }

  body.unified-shell.admin-mode #payment-dialog .payment-order-row-v4047,
  body.unified-shell.manager-mode #payment-dialog .payment-order-row-v4047{
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
  }

  body.unified-shell.admin-mode #payment-dialog .payment-meta-grid,
  body.unified-shell.manager-mode #payment-dialog .payment-meta-grid{
    flex:0 0 auto!important;
  }

  body.unified-shell.admin-mode #payment-dialog .payment-enterprise-actions,
  body.unified-shell.manager-mode #payment-dialog .payment-enterprise-actions{
    position:sticky!important;
    bottom:-15px!important;
    z-index:12!important;
    flex:0 0 auto!important;
  }
}

@media(max-width:390px){
  body.unified-shell.admin-mode #payment-dialog.payment-enterprise-dialog,
  body.unified-shell.manager-mode #payment-dialog.payment-enterprise-dialog,
  body.unified-shell.admin-mode #payment-dialog .payment-enterprise-form,
  body.unified-shell.manager-mode #payment-dialog .payment-enterprise-form{
    height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
  }

  body.unified-shell.admin-mode #payment-dialog #payment-order-list,
  body.unified-shell.manager-mode #payment-dialog #payment-order-list{
    max-height:none!important;
  }
}


/* =========================================================
   v4.06.1.40 — Staff receipt history / own receipts
   ========================================================= */
.staff-receipt-panel{display:grid;gap:14px}
.staff-receipt-head{align-items:flex-start}
.staff-receipt-head p{margin:4px 0 0;color:var(--muted,#667085);font-size:13px;line-height:1.45}
.staff-receipt-filter{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:5px;background:#f2f6fb;border:1px solid #dbe7f3;border-radius:14px}
.staff-receipt-filter button{min-height:42px;border:0;border-radius:10px;background:transparent;color:#49647d;font:inherit;font-weight:800;padding:8px 9px;display:flex;align-items:center;justify-content:center;gap:6px}
.staff-receipt-filter button b{min-width:20px;height:20px;border-radius:999px;background:#e3edf7;display:inline-grid;place-items:center;font-size:11px}
.staff-receipt-filter button.active{background:#fff;color:#086fd6;box-shadow:0 2px 9px rgba(40,77,111,.09)}
.staff-receipt-filter button.active b{background:#e7f2ff;color:#0878ef}
.staff-receipt-unreconciled-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 14px;border:1px solid #f1c66d;background:#fff9ec;border-radius:14px}
.staff-receipt-unreconciled-banner>div{display:grid;gap:3px;min-width:0}
.staff-receipt-unreconciled-banner small{font-size:10px;font-weight:900;letter-spacing:.08em;color:#a25b00}
.staff-receipt-unreconciled-banner strong{font-size:15px;color:#7a4300}
.staff-receipt-unreconciled-banner span{font-size:12px;line-height:1.4;color:#7a5b28}
.staff-receipt-list{display:grid;gap:9px}
.staff-receipt-card{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;border:1px solid #dbe7f3;background:#fff;border-radius:14px;padding:13px 14px;box-shadow:0 2px 8px rgba(35,67,96,.04)}
.staff-receipt-card.late{border-color:#c9dff7;background:#fbfdff}
.staff-receipt-card-main{display:grid;gap:5px;min-width:0;flex:1}
.staff-receipt-card-id{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:10px;font-weight:900;letter-spacing:.06em;color:#6b7f91}
.staff-receipt-card-id time{letter-spacing:0;font-weight:700;color:#8393a1}
.staff-receipt-card-main>strong{font-size:15px;color:#17324a}
.staff-receipt-physical{display:flex;gap:7px;flex-wrap:wrap}
.staff-receipt-physical span{display:inline-flex;align-items:baseline;gap:4px;border-radius:9px;padding:6px 8px;background:#eff7ff;color:#315c7f;font-size:12px;font-weight:700}
.staff-receipt-physical span:last-child{background:#f2f8f4;color:#37694b}
.staff-receipt-physical b{font-size:17px;color:#0878ef}
.staff-receipt-physical span:last-child b{color:#16834c}
.staff-receipt-card-main small{color:#74879a;font-size:11px;line-height:1.4}
.staff-receipt-note{font-style:italic}
.staff-receipt-card-state{display:grid;justify-items:end;gap:6px;flex:0 0 auto}
.staff-receipt-card-state>span{border-radius:999px;padding:5px 8px;font-size:10px;font-weight:900;white-space:nowrap}
.staff-receipt-card-state>span.ok{background:#eaf8ef;color:#17733f}
.staff-receipt-card-state>span.late{background:#eaf3ff;color:#0b67c4}
.staff-receipt-card-state small{font-size:10px;color:#8a9aa7}
.staff-receipt-empty{display:grid;gap:4px;padding:16px;border:1px dashed #cfdeea;border-radius:14px;background:#f9fbfd;color:#526b80}
.staff-receipt-empty.good{border-style:solid;border-color:#cfe8d7;background:#f4fbf6;color:#267044}
.staff-receipt-empty strong{font-size:14px}
.staff-receipt-empty span{font-size:12px;line-height:1.45}
.staff-receipt-readonly-note{display:block;color:#7b8e9f;font-size:11px;line-height:1.45}
@media (max-width:640px){
  .staff-receipt-panel{padding:14px!important}
  .staff-receipt-head{display:grid!important;grid-template-columns:1fr auto;gap:10px}
  .staff-receipt-head p{grid-column:1/-1}
  .staff-receipt-filter{gap:4px}
  .staff-receipt-filter button{font-size:11px;padding:7px 5px}
  .staff-receipt-unreconciled-banner{align-items:stretch;flex-direction:column}
  .staff-receipt-unreconciled-banner .btn{width:100%;min-height:42px}
  .staff-receipt-card{padding:12px;gap:8px}
  .staff-receipt-card-state>small{display:none}
}


/* =========================================================
   v4.06.1.43 — Bottle debt delivered KPI
   ========================================================= */
.bottle-debt-day-strip>span.bottle-debt-delivered-kpi{background:linear-gradient(180deg,#f4f9ff,#edf6ff);border-color:#cfe3f7}
.bottle-debt-day-strip>span.bottle-debt-delivered-kpi strong{color:#0878ef}
@media (max-width:560px){
  .bottle-debt-day-strip{grid-template-columns:1fr 1fr}
  .bottle-debt-day-strip>span.bottle-debt-delivered-kpi{grid-column:1/-1;grid-template-columns:1fr auto;grid-template-areas:"label value" "note value";padding:10px 12px}
  .bottle-debt-day-strip>span.bottle-debt-delivered-kpi small{grid-area:label}
  .bottle-debt-day-strip>span.bottle-debt-delivered-kpi strong{grid-area:value;font-size:1.05rem;overflow:visible}
  .bottle-debt-day-strip>span.bottle-debt-delivered-kpi em{grid-area:note}
}

/* Cảnh báo tuổi nợ và hạn mức: chỉ bổ sung tín hiệu, không thay đổi số dư. */
.debtor.has-debt-risk{border-color:#f0d3b5}
.debtor-risk-badges{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.debt-risk-badge{display:inline-flex;align-items:center;min-height:22px;padding:2px 7px;border-radius:999px;font-size:.68rem;font-weight:850;line-height:1.2}
.debt-risk-badge.aging{background:#fff4df;color:#a35e03}
.debt-risk-badge.overdue{background:#fff0f1;color:#b52b38}
.debt-risk-badge.limit{background:#fbeef5;color:#9a2e68}
.debt-detail-risk{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:0 0 2px}
.debt-detail-risk.is-hidden{display:none}
.debt-detail-risk-card{display:grid;gap:4px;min-width:0;padding:12px 13px;border:1px solid #ead8bb;border-radius:15px;background:#fffaf2}
.debt-detail-risk-card small{color:#9a650c;font-size:.64rem;font-weight:900;letter-spacing:.075em}
.debt-detail-risk-card strong{color:#7d4c00;font-size:1.08rem;line-height:1.15}
.debt-detail-risk-card span{color:#7d6b4f;font-size:.75rem;line-height:1.35}
.debt-detail-risk-card.overdue{border-color:#f0c9cf;background:#fff6f6}
.debt-detail-risk-card.overdue small,.debt-detail-risk-card.overdue strong{color:#b22936}
.debt-detail-risk-card.overdue span{color:#8d5960}
.debt-detail-risk-card.limit{border-color:#ead0e1;background:#fff7fc}
.debt-detail-risk-card.limit small,.debt-detail-risk-card.limit strong{color:#9a2e68}
.debt-detail-risk-card.limit span{color:#825a73}
@media(max-width:420px){
  .debtor-risk-badges{gap:4px}
  .debt-risk-badge{font-size:.62rem}
  .debt-detail-risk{grid-template-columns:1fr}
}

/* 4.06.1.51 — Ứng lương phụ xe */
.payroll-advance-ledger{margin:10px 12px 2px;padding:10px;border:1px solid #d9e8f2;border-radius:14px;background:#f8fbfd}
.payroll-advance-title,.payroll-advance-row{display:flex;align-items:center;gap:10px}.payroll-advance-title{justify-content:space-between;padding:2px 2px 8px;color:#49677d;font-weight:850}.payroll-advance-row{padding:9px 2px;border-top:1px solid #e4edf3}.payroll-advance-row>span{min-width:0;flex:1}.payroll-advance-row strong,.payroll-advance-row small{display:block}.payroll-advance-row small{margin-top:3px;color:#7a8d9c;font-size:.74rem}.payroll-advance-row>b{white-space:nowrap;color:#ad6b08}.payroll-advance-cancel{min-height:34px;padding:0 10px;border:1px solid #efc4c4;border-radius:10px;background:#fff6f6;color:#a13d3d;font-weight:850;cursor:pointer}.payroll-advance-cancel:disabled{opacity:.55;cursor:not-allowed}
.enterprise-payroll-role-split{flex-wrap:wrap}.enterprise-payroll-role-split>span{flex:1 1 150px}
@media(max-width:640px){.payroll-advance-row{align-items:flex-start;flex-wrap:wrap}.payroll-advance-row>span{flex-basis:calc(100% - 100px)}.payroll-advance-cancel{width:100%}}

/* 4.06.1.51 — duyệt yêu cầu ứng lương */
.payroll-advance-title em{font-style:normal;color:#a56809;background:#fff0cf;border-radius:999px;padding:3px 7px;font-size:.68rem}
.payroll-advance-row{align-items:flex-start}
.payroll-advance-row.status-pending{background:#fffaf1}.payroll-advance-row.status-rejected,.payroll-advance-row.status-cancelled{opacity:.75}
.payroll-advance-status{display:inline-block;margin-left:5px;padding:2px 6px;border-radius:999px;font-style:normal;font-size:.63rem;font-weight:900;background:#eaf8f2;color:#087a5b;vertical-align:1px}
.status-pending .payroll-advance-status{background:#fff0cf;color:#9b650b}.status-rejected .payroll-advance-status,.status-cancelled .payroll-advance-status{background:#fde8e8;color:#a33f3f}
.payroll-advance-actions{display:flex;flex:0 0 auto;gap:6px;align-items:center}
.payroll-advance-approve,.payroll-advance-reject{min-height:34px;padding:0 10px;border-radius:10px;font-weight:850;cursor:pointer}.payroll-advance-approve{border:1px solid #b9dfd2;background:#effaf6;color:#08745a}.payroll-advance-reject{border:1px solid #efc4c4;background:#fff6f6;color:#a13d3d}.payroll-advance-approve:disabled,.payroll-advance-reject:disabled{opacity:.55;cursor:not-allowed}
.payroll-pending-sum{background:#fff8e8!important;border-color:#efdcb5!important;color:#9a650b!important}
@media(max-width:640px){.payroll-advance-row>span{flex-basis:100%}.payroll-advance-row>b{margin-left:auto}.payroll-advance-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.payroll-advance-actions:empty{display:none}.payroll-advance-approve,.payroll-advance-reject,.payroll-advance-cancel{width:100%}}

/* v4.06.1.61 — iOS Safari: input <16px causes automatic page zoom on focus. */
#debts #debt-list-search,
#bottle-debts #bottle-debt-search,
#debt-list-search,
#bottle-debt-search{
  font-size:16px!important;
  line-height:1.25!important;
  -webkit-text-size-adjust:100%;
}
@media (max-width: 760px){
  body.management-mode #debts .debt-search-panel-new .employee-search-box input,
  body.staff-mode #debts .debt-search-panel-new .employee-search-box input,
  body[data-role="staff"] #debts .debt-search-panel-new .employee-search-box input{
    font-size:16px!important;
  }
}

/* v4.06.1.63 — hướng dẫn Nhận chuyến mới, giảm nhập nhầm */
#receipt-dialog .receipt-trip-guide{margin:0 16px 12px;padding:14px 15px;border:1px solid #b9dcff;border-radius:18px;background:#f1f8ff;color:#1d405f}
#receipt-dialog .receipt-trip-guide.is-hidden{display:none!important}
#receipt-dialog .receipt-trip-guide-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
#receipt-dialog .receipt-trip-guide-head small{display:block;color:#0878ef;font-size:.72rem;font-weight:900;letter-spacing:.13em}
#receipt-dialog .receipt-trip-guide-head strong{display:block;font-size:1.05rem;color:#17344e;margin-top:2px}
#receipt-dialog .receipt-trip-guide-head>span{padding:7px 9px;border-radius:999px;background:#fff;color:#587088;font-size:.78rem;font-weight:800;white-space:nowrap}
#receipt-dialog .receipt-trip-guide p{margin:0 0 10px;line-height:1.45;font-size:.9rem}
#receipt-dialog .receipt-trip-quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#receipt-dialog .receipt-trip-quick-actions button{min-height:44px;border:1px solid #bdd9f3;border-radius:13px;background:#fff;color:#22506f;font-weight:800;font:inherit}
#receipt-dialog .receipt-trip-quick-actions button:disabled{opacity:.48}
@media(max-width:560px){#receipt-dialog .receipt-trip-guide{margin:0 8px 10px;padding:12px}#receipt-dialog .receipt-trip-guide-head{align-items:flex-start}#receipt-dialog .receipt-trip-guide-head>span{font-size:.72rem}.receipt-trip-quick-actions{gap:6px!important}}


/* AquaFlow v4.07.1 — đối soát ca + lưu an toàn */
.staff-shift-auto-checks{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
}
.staff-shift-auto-checks span,
.staff-shift-dialog-checks span{
  display:flex;
  align-items:center;
  min-height:38px;
  padding:8px 10px;
  border:1px solid #dbe7f4;
  border-radius:12px;
  background:#f8fbff;
  color:#52657b;
  font-size:12px;
  font-weight:800;
  line-height:1.25;
}
.staff-shift-auto-checks span.is-ok{background:#f2fbf7;border-color:#cdebdc;color:#157252}
.staff-shift-auto-checks span.is-warning{background:#fff8ec;border-color:#f2d5a4;color:#9a5f0b}
.staff-shift-dialog-checks{
  display:grid;
  gap:8px;
  margin:10px 0 14px;
}
.staff-shift-dialog-checks span{min-height:34px}
.staff-shift-difference{
  margin:10px 0 14px;
  padding:12px 14px;
  border:1px solid #d7e5f5;
  border-radius:14px;
  background:#f8fbff;
}
.staff-shift-difference small{display:block;font-size:10px;letter-spacing:.12em;font-weight:900;color:#7890aa}
.staff-shift-difference strong{display:block;margin-top:4px;font-size:20px;color:#173653}
.staff-shift-difference p{margin:4px 0 0;font-size:12px;line-height:1.35;color:#61758c}
.staff-shift-difference.is-ok{background:#f2fbf7;border-color:#cdebdc}
.staff-shift-difference.is-ok strong{color:#137153}
.staff-shift-difference.is-warning{background:#fff8ec;border-color:#efc980}
.staff-shift-difference.is-warning strong{color:#9a5f0b}
.mutation-state{
  position:fixed;
  left:50%;
  bottom:calc(88px + env(safe-area-inset-bottom));
  transform:translateX(-50%);
  z-index:10050;
  max-width:min(92vw,560px);
  padding:10px 14px;
  border-radius:999px;
  background:#173653;
  color:#fff;
  box-shadow:0 10px 30px rgba(25,58,91,.22);
  font-size:12px;
  font-weight:800;
  text-align:center;
}
.mutation-state.is-saving{background:#2369b7}
.mutation-state.is-saved{background:#14745a}
.mutation-state.is-offline{background:#9a5f0b}
.mutation-state.is-hidden{display:none!important}
@media (max-width:760px){
  .staff-shift-auto-checks{grid-template-columns:1fr}
  .mutation-state{bottom:calc(104px + env(safe-area-inset-bottom));border-radius:14px}
}


/* AquaFlow v4.07.1 — Unified Inventory Ledger */
.inventory-ledger-status{display:flex;gap:10px;justify-content:space-between;align-items:center;margin:10px 0 14px;padding:11px 13px;border:1px solid rgba(37,99,235,.16);border-radius:14px;background:rgba(239,246,255,.72)}
.inventory-ledger-status span{display:flex;flex-direction:column;gap:2px}.inventory-ledger-status b{font-size:13px}.inventory-ledger-status small{font-size:11px;opacity:.72}.inventory-ledger-status span:last-child{text-align:right}
#inventory-ledger-rebuild{white-space:nowrap}
@media(max-width:720px){.inventory-ledger-status{align-items:flex-start;flex-direction:column}.inventory-ledger-status span:last-child{text-align:left}.inventory-card-tools{gap:6px;flex-wrap:wrap}}

/* v4.08.0 — Continuous Vehicle Ledger / Giao nhận tại công ty */
#receipt-dialog .receipt-trip-quick-actions{grid-template-columns:repeat(3,minmax(0,1fr))}
#receipt-dialog .receipt-trip-quick-actions button{padding:8px 10px;line-height:1.2}
#receipt-dialog .receipt-actual-empty-reconcile{margin-top:10px;padding:12px;border:1px solid #b8d7ef;border-radius:14px;background:#fff;display:grid;grid-template-columns:1fr 1.4fr;gap:10px}
#receipt-dialog .receipt-actual-empty-reconcile.is-hidden{display:none!important}
#receipt-dialog .receipt-actual-empty-reconcile label{display:grid;gap:6px;font-weight:800;color:#244c6a}
#receipt-dialog .receipt-actual-empty-reconcile input{min-height:46px;border:1px solid #c6dbea;border-radius:12px;padding:0 12px;font:inherit;font-size:16px!important;background:#fff;color:#153a5c;box-sizing:border-box}
#receipt-dialog .receipt-actual-empty-reconcile small{grid-column:1/-1;color:#617a90;line-height:1.4}
.staff-command-company-handoff{border-color:#9dcdf7!important;background:linear-gradient(180deg,#f5fbff,#eaf6ff)!important}
.v4080-legacy-trip-control{display:none!important}
@media(max-width:560px){#receipt-dialog .receipt-trip-quick-actions{grid-template-columns:1fr 1fr}#receipt-dialog .receipt-trip-quick-actions #receipt-empty-actual-toggle{grid-column:1/-1}#receipt-dialog .receipt-actual-empty-reconcile{grid-template-columns:1fr}}

/* v4.09.0 — Event-Sourced Operations Core / reconciliation queue */
.inventory-reconciliation-queue{margin:10px 0 14px}.inventory-reconciliation-queue details,.inventory-reconciliation-ok{border:1px solid rgba(15,61,117,.12);border-radius:14px;background:rgba(248,251,255,.92);padding:10px 12px}.inventory-reconciliation-queue summary{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;font-weight:800;color:#173b67}.inventory-reconciliation-queue summary b{font-size:12px;padding:4px 8px;border-radius:999px;background:#fff3cd;color:#7a5700}.inventory-reconciliation-list{display:grid;gap:8px;margin-top:10px}.inventory-reconciliation-case{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px;border:1px solid rgba(217,138,0,.16);background:#fff;border-radius:12px}.inventory-reconciliation-case>div{display:grid;gap:2px;min-width:0}.inventory-reconciliation-case small{font-size:11px;color:#73849a}.inventory-reconciliation-case strong{font-size:14px;color:#16395f}.inventory-reconciliation-case span{font-size:12px;color:#51657c}.inventory-case-state{flex:0 0 auto!important;font-size:10px!important;font-weight:800!important;letter-spacing:.04em;color:#8a5d00!important;background:#fff4cf;padding:5px 7px;border-radius:999px}.inventory-reconciliation-foot{display:block;margin-top:9px;color:#6b7c91;line-height:1.45}.inventory-reconciliation-ok{display:flex;align-items:center;gap:10px}.inventory-reconciliation-ok>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#e8f7ee;color:#166534;font-weight:900}.inventory-reconciliation-ok>div{display:grid;gap:2px}.inventory-reconciliation-ok strong{color:#1c4d38}.inventory-reconciliation-ok small{color:#6d7f75}@media(max-width:700px){.inventory-reconciliation-case{align-items:flex-start;flex-direction:column}.inventory-case-state{align-self:flex-start}}


/* AquaFlow v4.09.3 — Compact Staff Handoff
   Continuous Vehicle Ledger remains authoritative in backend; technical ledger labels are hidden from staff UI. */
#receipt-dialog .receipt-trip-guide-compact{
  margin:0 10px 8px!important;
  padding:10px 11px!important;
  border-radius:15px!important;
}
#receipt-dialog .receipt-trip-guide-compact .receipt-trip-guide-head{
  margin:0 0 5px!important;
  justify-content:flex-end!important;
}
#receipt-dialog .receipt-trip-guide-compact .receipt-trip-guide-head>strong{
  display:inline-flex!important;
  align-items:center!important;
  min-height:32px!important;
  padding:5px 10px!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#587088!important;
  font-size:.74rem!important;
  font-weight:850!important;
  line-height:1.15!important;
  white-space:nowrap!important;
}
#receipt-dialog .receipt-trip-guide-compact>p{
  margin:0 0 7px!important;
  font-size:.73rem!important;
  line-height:1.32!important;
}
#receipt-dialog .receipt-trip-guide-compact .receipt-trip-quick-actions{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:6px!important;
}
#receipt-dialog .receipt-trip-guide-compact .receipt-trip-quick-actions button{
  min-height:48px!important;
  padding:6px 7px!important;
  border-radius:12px!important;
  font-size:.71rem!important;
  line-height:1.18!important;
}
#receipt-dialog .receipt-trip-guide-compact .receipt-actual-empty-reconcile{
  margin-top:7px!important;
}
#receipt-dialog .receipt-company-pool-compact{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:10px;
  padding:8px 10px;
  border:1px solid #d6e8df;
  border-radius:11px;
  background:#f1faf6;
}
#receipt-dialog .receipt-company-pool-compact:has(.is-short){border-color:#f0cfd3;background:#fff4f5}
#receipt-dialog .receipt-company-pool-compact:has(.is-balanced){border-color:#dbe7ef;background:#f5f9fc}
#receipt-dialog .receipt-company-held-delta{
  display:block!important;
  margin:0!important;
  padding-right:10px;
  border-right:1px solid #cfe2d7;
  color:#18845f;
  font-size:1.12rem!important;
  font-weight:900!important;
  line-height:1.1!important;
  white-space:nowrap;
}
#receipt-dialog .receipt-company-held-delta.negative{color:#c53242}
#receipt-dialog .receipt-company-held-delta:not(.positive):not(.negative){color:#527084}
#receipt-dialog .receipt-company-pool-compact .receipt-company-pool-status{
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  font-size:.62rem!important;
  line-height:1.3!important;
}
body.staff-mode #receipt-dialog .receipt-vehicle-balance-preview,
body[data-role="staff"] #receipt-dialog .receipt-vehicle-balance-preview{
  display:none!important;
}
body.staff-mode #receipt-dialog .receipt-empty-stock-state:not(.is-short),
body[data-role="staff"] #receipt-dialog .receipt-empty-stock-state:not(.is-short){
  display:none!important;
}
@media(max-width:560px){
  #receipt-dialog .receipt-trip-guide-compact{margin:0 6px 7px!important;padding:9px!important}
  #receipt-dialog .receipt-trip-guide-compact .receipt-trip-guide-head>strong{font-size:.69rem!important;min-height:29px!important;padding:4px 8px!important}
  #receipt-dialog .receipt-trip-guide-compact>p{font-size:.68rem!important;margin-bottom:6px!important}
  #receipt-dialog .receipt-trip-guide-compact .receipt-trip-quick-actions button{min-height:46px!important;padding:5px 4px!important;font-size:.66rem!important}
  #receipt-dialog .receipt-bottle-section{gap:6px!important}
  #receipt-dialog .receipt-bottle-section .receipt-section-title-row small{display:none!important}
  #receipt-dialog .receipt-company-pool-compact{gap:8px;padding:7px 8px!important}
  #receipt-dialog .receipt-company-held-delta{font-size:1rem!important;padding-right:8px}
  #receipt-dialog .receipt-company-pool-compact .receipt-company-pool-status{font-size:.58rem!important}
}


/* AquaFlow v4.09.4 — Continuous Ledger Return Visual
   Match the approved staff return-handoff layout while keeping the ledger engine unchanged. */
#receipt-dialog .receipt-trip-guide-compact{
  margin:0 10px 9px!important;
  padding:13px 14px 14px!important;
  border:1px solid #9fcdf8!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#f3f9ff 0%,#eef7ff 100%)!important;
}
#receipt-dialog .receipt-trip-guide-compact .receipt-trip-guide-head{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin:0 0 9px!important;
}
#receipt-dialog .receipt-ledger-title{display:grid;gap:4px;min-width:0}
#receipt-dialog .receipt-ledger-title small{
  display:block;
  margin:0;
  color:#287be8;
  font-size:.66rem;
  font-weight:950;
  letter-spacing:.16em;
  line-height:1.1;
}
#receipt-dialog .receipt-ledger-title h3{
  margin:0!important;
  color:#173553!important;
  font-size:1.04rem!important;
  font-weight:900!important;
  line-height:1.08!important;
}
#receipt-dialog .receipt-trip-guide-compact .receipt-trip-guide-head>strong{
  min-height:34px!important;
  padding:6px 11px!important;
  border:0!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.94)!important;
  color:#5d7189!important;
  font-size:.72rem!important;
  font-weight:900!important;
  line-height:1.15!important;
  box-shadow:0 1px 0 rgba(25,76,121,.03)!important;
}
#receipt-dialog .receipt-trip-guide-compact>p{
  margin:0 0 10px!important;
  color:#294d70!important;
  font-size:.78rem!important;
  line-height:1.38!important;
}
#receipt-dialog .receipt-trip-guide-compact .receipt-trip-quick-actions{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:7px!important;
}
#receipt-dialog .receipt-trip-guide-compact .receipt-trip-quick-actions button{
  min-height:61px!important;
  padding:8px 7px!important;
  border:1px solid #c8dbec!important;
  border-radius:14px!important;
  background:#fff!important;
  color:#1f486e!important;
  font-size:.76rem!important;
  font-weight:800!important;
  line-height:1.25!important;
}
#receipt-dialog .receipt-trip-guide-compact .receipt-trip-quick-actions button:first-child{
  border-color:#2580ef!important;
  color:#1262c9!important;
  font-weight:900!important;
}
#receipt-dialog .receipt-bottle-compact{
  padding:12px 13px!important;
  border:1px solid #d6e3ec!important;
  border-radius:18px!important;
  background:#fbfdff!important;
}
#receipt-dialog .receipt-bottle-compact .receipt-section-title-row h3{
  color:#183652!important;
  font-size:1rem!important;
  font-weight:900!important;
}
#receipt-dialog .receipt-bottle-compact .receipt-section-title-row small{
  display:block!important;
  margin-top:2px!important;
  color:#71869a!important;
  font-size:.68rem!important;
  line-height:1.25!important;
}
#receipt-dialog .receipt-bottle-compact .receipt-quantity-grid{gap:8px!important}
#receipt-dialog .receipt-bottle-compact .receipt-quantity-field{
  padding:9px 10px 10px!important;
  border:1px solid #d6e4ee!important;
  border-radius:14px!important;
  background:#f9fcff!important;
  color:#5d7184!important;
}
#receipt-dialog .receipt-bottle-compact .receipt-quantity-field:nth-child(2){
  border-color:#cfe7d8!important;
  background:#f7fcf9!important;
}
#receipt-dialog .receipt-bottle-compact .receipt-quantity-field input{
  min-height:54px!important;
  border-color:#caddeb!important;
  border-radius:12px!important;
  background:#fff!important;
  font-size:1.35rem!important;
  font-weight:900!important;
}
#receipt-dialog .receipt-balance-strip{
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
}
#receipt-dialog .receipt-balance-strip>span{
  min-height:54px!important;
  padding:9px 10px!important;
  border-radius:12px!important;
  font-size:.68rem!important;
  line-height:1.25!important;
}
#receipt-dialog .receipt-balance-strip strong,#receipt-dialog .receipt-balance-strip b{font-size:.78rem!important}
#receipt-dialog .receipt-company-pool-compact{
  gap:11px!important;
  padding:10px 12px!important;
  border-color:#c8e4d5!important;
  border-radius:12px!important;
  background:#effaf4!important;
}
#receipt-dialog .receipt-company-held-delta{
  padding-right:12px!important;
  font-size:1.22rem!important;
}
#receipt-dialog .receipt-company-pool-compact .receipt-company-pool-status{
  color:#217653!important;
  font-size:.65rem!important;
  font-weight:750!important;
  line-height:1.35!important;
}
@media(max-width:560px){
  #receipt-dialog .receipt-trip-guide-compact{margin:0 6px 8px!important;padding:12px 11px!important}
  #receipt-dialog .receipt-trip-guide-compact .receipt-trip-guide-head{gap:7px!important;margin-bottom:7px!important}
  #receipt-dialog .receipt-ledger-title small{font-size:.61rem!important;letter-spacing:.14em!important}
  #receipt-dialog .receipt-ledger-title h3{font-size:.98rem!important}
  #receipt-dialog .receipt-trip-guide-compact .receipt-trip-guide-head>strong{font-size:.66rem!important;padding:5px 8px!important;min-height:31px!important}
  #receipt-dialog .receipt-trip-guide-compact>p{font-size:.72rem!important;margin-bottom:8px!important}
  #receipt-dialog .receipt-trip-guide-compact .receipt-trip-quick-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
  #receipt-dialog .receipt-trip-guide-compact .receipt-trip-quick-actions #receipt-empty-actual-toggle{grid-column:auto!important}
  #receipt-dialog .receipt-trip-guide-compact .receipt-trip-quick-actions button{min-height:58px!important;padding:6px 4px!important;font-size:.69rem!important}
  #receipt-dialog .receipt-bottle-section{gap:8px!important}
  #receipt-dialog .receipt-bottle-section .receipt-section-title-row small{display:block!important}
  #receipt-dialog .receipt-bottle-compact{padding:11px 10px!important}
  #receipt-dialog .receipt-bottle-compact .receipt-quantity-field{padding:8px!important}
  #receipt-dialog .receipt-bottle-compact .receipt-quantity-field input{min-height:52px!important;font-size:1.25rem!important}
  #receipt-dialog .receipt-balance-strip>span{min-height:50px!important;padding:8px!important;font-size:.64rem!important}
  #receipt-dialog .receipt-company-pool-compact{gap:8px!important;padding:9px 10px!important}
  #receipt-dialog .receipt-company-held-delta{font-size:1.12rem!important;padding-right:9px!important}
  #receipt-dialog .receipt-company-pool-compact .receipt-company-pool-status{font-size:.61rem!important}
}

/* Unconfirmed requests: in normal flow, never covering order actions. */
.recovery-panel{margin:16px 0;padding:14px;border:1px solid #d6a756;border-radius:14px;background:#fffaf0;color:#273b50}
.recovery-panel[hidden]{display:none}
.recovery-panel summary{font-weight:700;cursor:pointer;font-size:16px}
.recovery-panel>p,.recovery-row p{font-size:14px;line-height:1.5}
.recovery-row{border-top:1px solid #eadcc3;padding:12px 0;display:flex;gap:8px;flex-wrap:wrap}
.recovery-row p{flex-basis:100%;margin:0 0 4px;overflow-wrap:anywhere}
.recovery-row button{white-space:normal;min-height:44px;font-size:14px}


/* ========================================================================== 
   AquaFlow v4.13.1 — Staff UI Fix
   - Khóa cột tiền để VND không bị bẻ dòng (vd. 1.460.000 ₫).
   - Đồng bộ Kết ca + Chi phí sang ngôn ngữ thiết kế AquaFlow.
   - Giữ thao tác một tay, mật độ thông tin vừa phải trên 320–430 CSS px.
   ========================================================================== */
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift{
  position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:9px!important;
  width:100%!important;
  min-width:0!important;
  margin-top:10px!important;
  padding:15px!important;
  overflow:hidden!important;
  border:1px solid #d5e5f3!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%)!important;
  box-shadow:0 10px 28px rgba(19,61,104,.065)!important;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift::before,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:linear-gradient(180deg,var(--af-primary,#0878ef),#39a9ff);
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift>div:first-child,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift>div:first-child{
  padding-left:2px!important;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift>div:first-child>small,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift>div:first-child>small{
  color:var(--af-primary,#0878ef)!important;
  font-size:10px!important;
  font-weight:950!important;
  letter-spacing:.16em!important;
  line-height:1.1!important;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift>div:first-child>strong,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift>div:first-child>strong{
  margin-top:5px!important;
  color:var(--af-ink,#10243b)!important;
  font-size:clamp(18px,5.2vw,23px)!important;
  font-weight:900!important;
  line-height:1.15!important;
  letter-spacing:-.025em!important;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift>div:first-child>p,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift>div:first-child>p{
  margin:6px 0 0!important;
  color:var(--af-muted,#6e8296)!important;
  font-size:clamp(12px,3.35vw,14px)!important;
  line-height:1.42!important;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift .staff-shift-checks,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift .staff-shift-checks{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:7px!important;
  width:100%!important;
  max-width:none!important;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift .staff-shift-checks span,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift .staff-shift-checks span{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  min-height:44px!important;
  padding:8px 9px!important;
  border:1px solid #e2ebf3!important;
  border-radius:14px!important;
  background:#f4f8fc!important;
  color:#4f6a82!important;
  text-align:center!important;
  font-size:clamp(11px,3.05vw,13px)!important;
  font-weight:850!important;
  line-height:1.25!important;
  white-space:normal!important;
  overflow-wrap:break-word!important;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift .staff-shift-auto-checks,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift .staff-shift-auto-checks{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:6px!important;
  margin-top:1px!important;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift .staff-shift-auto-checks span,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift .staff-shift-auto-checks span{
  position:relative!important;
  min-height:42px!important;
  padding:9px 11px 9px 35px!important;
  border-radius:13px!important;
  font-size:clamp(11.5px,3.2vw,13.5px)!important;
  line-height:1.25!important;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift .staff-shift-auto-checks span::before,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift .staff-shift-auto-checks span::before{
  content:"";
  position:absolute;
  left:11px;
  top:50%;
  width:14px;
  height:14px;
  transform:translateY(-50%);
  border-radius:50%;
  background:#dce9f5;
  box-shadow:inset 0 0 0 4px #f7fbff;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift .staff-shift-auto-checks span.is-ok::before,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift .staff-shift-auto-checks span.is-ok::before{
  background:var(--af-success,#07966f);
  box-shadow:inset 0 0 0 4px #effaf5;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift .staff-shift-auto-checks span.is-warning::before,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift .staff-shift-auto-checks span.is-warning::before{
  background:var(--af-warning,#d47a0a);
  box-shadow:inset 0 0 0 4px #fff8ee;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift .staff-shift-actions,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift .staff-shift-actions{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:7px!important;
  width:100%!important;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift .staff-shift-actions .btn,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift .staff-shift-actions .btn{
  width:100%!important;
  min-height:50px!important;
  border:0!important;
  border-radius:15px!important;
  background:linear-gradient(135deg,var(--af-primary,#0878ef),#1e9cff)!important;
  color:#fff!important;
  box-shadow:0 8px 18px rgba(8,120,239,.18)!important;
  font-size:clamp(14px,3.9vw,16px)!important;
  font-weight:900!important;
  letter-spacing:-.01em!important;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift .staff-shift-actions .btn:disabled,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift .staff-shift-actions .btn:disabled{
  box-shadow:none!important;
  opacity:.52!important;
}
body.staff-mode #staff-shift-readiness.aquaflow-staff-shift .staff-shift-actions small,
body[data-role="staff"] #staff-shift-readiness.aquaflow-staff-shift .staff-shift-actions small{
  color:#71869a!important;
  font-size:clamp(10.5px,2.95vw,12.5px)!important;
  font-weight:700!important;
  line-height:1.4!important;
  letter-spacing:0!important;
  text-align:left!important;
}

body.staff-mode #staff-expense-panel.aquaflow-staff-expenses,
body[data-role="staff"] #staff-expense-panel.aquaflow-staff-expenses{
  margin:12px 0 14px!important;
  padding:15px!important;
  overflow:hidden!important;
  border:1px solid #d8e5f0!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 10px 28px rgba(19,61,104,.055)!important;
}
body.staff-mode #staff-expense-panel.aquaflow-staff-expenses .section-head,
body[data-role="staff"] #staff-expense-panel.aquaflow-staff-expenses .section-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin:0!important;
}
body.staff-mode #staff-expense-panel.aquaflow-staff-expenses .section-head>div,
body[data-role="staff"] #staff-expense-panel.aquaflow-staff-expenses .section-head>div{min-width:0!important}
body.staff-mode #staff-expense-panel.aquaflow-staff-expenses .section-head small,
body[data-role="staff"] #staff-expense-panel.aquaflow-staff-expenses .section-head small{
  color:var(--af-primary,#0878ef)!important;
  font-size:9.5px!important;
  font-weight:950!important;
  letter-spacing:.16em!important;
}
body.staff-mode #staff-expense-panel.aquaflow-staff-expenses .section-head h2,
body[data-role="staff"] #staff-expense-panel.aquaflow-staff-expenses .section-head h2{
  margin-top:5px!important;
  font-size:clamp(18px,5vw,22px)!important;
  line-height:1.1!important;
}
body.staff-mode #staff-expense-panel.aquaflow-staff-expenses .section-head .btn,
body[data-role="staff"] #staff-expense-panel.aquaflow-staff-expenses .section-head .btn{
  flex:none!important;
  min-height:42px!important;
  padding:0 13px!important;
  border-color:#cfe0ed!important;
  border-radius:13px!important;
  background:#fff!important;
  color:#24445f!important;
  box-shadow:none!important;
  font-size:clamp(11.5px,3.2vw,13px)!important;
  font-weight:850!important;
  white-space:nowrap!important;
}
body.staff-mode #staff-expense-panel.aquaflow-staff-expenses .staff-expense-details,
body[data-role="staff"] #staff-expense-panel.aquaflow-staff-expenses .staff-expense-details{
  margin-top:10px!important;
  border:1px solid #e0e9f1!important;
  border-radius:16px!important;
  background:#fbfdff!important;
  overflow:hidden!important;
}
body.staff-mode #staff-expense-panel.aquaflow-staff-expenses .staff-expense-details>summary,
body[data-role="staff"] #staff-expense-panel.aquaflow-staff-expenses .staff-expense-details>summary{
  min-height:48px!important;
  padding:14px 15px!important;
  border-radius:0!important;
  background:#f5f9fc!important;
  color:#506a80!important;
  font-size:clamp(12px,3.35vw,14px)!important;
  font-weight:850!important;
}
body.staff-mode #staff-expense-panel.aquaflow-staff-expenses #staff-expense-list,
body[data-role="staff"] #staff-expense-panel.aquaflow-staff-expenses #staff-expense-list{
  display:grid!important;
  gap:8px!important;
  padding:8px!important;
}
body.staff-mode .aquaflow-expense-row,
body[data-role="staff"] .aquaflow-expense-row{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) max-content!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
  padding:12px!important;
  border:1px solid #e2eaf2!important;
  border-radius:14px!important;
  background:#fff!important;
}
body.staff-mode .aquaflow-expense-row .staff-expense-copy,
body[data-role="staff"] .aquaflow-expense-row .staff-expense-copy{
  display:grid!important;
  gap:5px!important;
  min-width:0!important;
}
body.staff-mode .aquaflow-expense-row .staff-expense-title-line,
body[data-role="staff"] .aquaflow-expense-row .staff-expense-title-line{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  min-width:0!important;
  flex-wrap:wrap!important;
}
body.staff-mode .aquaflow-expense-row .staff-expense-title,
body[data-role="staff"] .aquaflow-expense-row .staff-expense-title{
  min-width:0!important;
  color:var(--af-ink,#10243b)!important;
  font-size:clamp(14px,4vw,17px)!important;
  font-weight:900!important;
  line-height:1.2!important;
  overflow-wrap:anywhere!important;
}
body.staff-mode .aquaflow-expense-row .af-expense-status,
body[data-role="staff"] .aquaflow-expense-row .af-expense-status{
  flex:none!important;
  padding:4px 7px!important;
  border-radius:999px!important;
  background:#edf4fb!important;
  color:#577085!important;
  font-size:10px!important;
  font-weight:900!important;
  line-height:1.1!important;
  white-space:nowrap!important;
}
body.staff-mode .aquaflow-expense-row .af-expense-status.positive,
body[data-role="staff"] .aquaflow-expense-row .af-expense-status.positive{background:#eaf8f3!important;color:#087b5d!important}
body.staff-mode .aquaflow-expense-row .af-expense-status.negative,
body[data-role="staff"] .aquaflow-expense-row .af-expense-status.negative{background:#fff0f2!important;color:#c83243!important}
body.staff-mode .aquaflow-expense-row .staff-expense-meta,
body[data-role="staff"] .aquaflow-expense-row .staff-expense-meta{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:2px!important;
  min-width:0!important;
  color:#678096!important;
  font-size:clamp(10.5px,3vw,12px)!important;
  font-weight:700!important;
  line-height:1.35!important;
  letter-spacing:0!important;
}
body.staff-mode .aquaflow-expense-row .staff-expense-review,
body[data-role="staff"] .aquaflow-expense-row .staff-expense-review{flex-basis:100%!important;color:#778b9e!important}
body.staff-mode .aquaflow-expense-row .staff-expense-side,
body[data-role="staff"] .aquaflow-expense-row .staff-expense-side{
  display:grid!important;
  justify-items:end!important;
  align-content:center!important;
  gap:6px!important;
  flex:none!important;
  min-width:max-content!important;
  max-width:none!important;
}
body.staff-mode .aquaflow-expense-row .staff-expense-amount,
body[data-role="staff"] .aquaflow-expense-row .staff-expense-amount{
  display:block!important;
  width:max-content!important;
  max-width:none!important;
  color:var(--af-ink,#10243b)!important;
  font-size:clamp(14px,4vw,17px)!important;
  font-weight:950!important;
  line-height:1.1!important;
  letter-spacing:-.02em!important;
  white-space:nowrap!important;
  word-break:keep-all!important;
  overflow-wrap:normal!important;
  font-variant-numeric:tabular-nums!important;
}
body.staff-mode .aquaflow-expense-row .mini-danger,
body[data-role="staff"] .aquaflow-expense-row .mini-danger{min-height:30px!important;padding:0 9px!important;border-radius:9px!important;font-size:10px!important}

@media(max-width:370px){
  body.staff-mode #staff-expense-panel.aquaflow-staff-expenses,
  body[data-role="staff"] #staff-expense-panel.aquaflow-staff-expenses{padding:12px!important}
  body.staff-mode #staff-expense-panel.aquaflow-staff-expenses .section-head .btn,
  body[data-role="staff"] #staff-expense-panel.aquaflow-staff-expenses .section-head .btn{padding:0 10px!important;font-size:11px!important}
  body.staff-mode .aquaflow-expense-row,
  body[data-role="staff"] .aquaflow-expense-row{gap:7px!important;padding:10px!important}
  body.staff-mode .aquaflow-expense-row .staff-expense-amount,
  body[data-role="staff"] .aquaflow-expense-row .staff-expense-amount{font-size:13.5px!important}
}

/* AquaFlow v4.14.1 — Enterprise Hybrid Trip / Continuous Vehicle Ledger */
.receipt-trip-quick-actions button.is-selected{
  border-color:#1687e8!important;
  background:#eef8ff!important;
  color:#075f9f!important;
  box-shadow:0 0 0 2px rgba(22,135,232,.08)!important;
}
.staff-shift-empty-reconcile{
  display:grid;gap:10px;padding:12px;border:1px solid #d8e8f4;border-radius:16px;background:linear-gradient(180deg,#fbfdff,#f5faff)
}
.staff-shift-empty-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.staff-shift-empty-head>div{display:grid;gap:2px}.staff-shift-empty-head small{font-size:10px;font-weight:900;letter-spacing:.08em;color:#0878ef}.staff-shift-empty-head strong{font-size:20px;color:#173b59}.staff-shift-empty-head>span{padding:5px 8px;border-radius:999px;background:#eaf5ff;color:#3074a8;font-size:10px;font-weight:800;white-space:nowrap}
.staff-shift-empty-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.staff-shift-empty-options label{position:relative;margin:0!important;cursor:pointer}.staff-shift-empty-options input{position:absolute;opacity:0;pointer-events:none}
.staff-shift-empty-options label>span{display:grid;gap:3px;min-height:72px;padding:10px 11px;border:1px solid #dbe6ee;border-radius:13px;background:#fff;transition:.15s ease}
.staff-shift-empty-options label>span b{font-size:13px;color:#23445f}.staff-shift-empty-options label>span small{font-size:10px;line-height:1.35;color:#718496;font-weight:600}
.staff-shift-empty-options label.is-selected>span{border-color:#1687e8;background:#eef8ff;box-shadow:0 0 0 2px rgba(22,135,232,.08)}
.staff-shift-empty-options label.is-selected>span b{color:#075f9f}
.staff-shift-empty-return{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding-top:2px}.staff-shift-empty-return.is-hidden{display:none!important}
.staff-shift-empty-return label{margin:0!important}.staff-shift-empty-return input,.staff-shift-empty-return select{min-width:0;width:100%}
.staff-shift-empty-quick{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px}.staff-shift-empty-quick small{font-size:10px;color:#60778b;text-align:right}
#staff-shift-empty-note{margin:0!important;font-size:10px!important;line-height:1.4!important;color:#61798d!important}
@media(max-width:560px){
  .staff-shift-empty-reconcile{padding:10px;border-radius:14px}
  .staff-shift-empty-options{grid-template-columns:1fr 1fr}
  .staff-shift-empty-options label>span{min-height:68px;padding:9px}
  .staff-shift-empty-return{grid-template-columns:1fr}
  .staff-shift-empty-quick{grid-column:auto;align-items:flex-start;flex-direction:column}.staff-shift-empty-quick small{text-align:left}
}

/* AquaFlow v4.14.1 — Enterprise Hybrid Trip / Continuous Vehicle Ledger */
.staff-trip-enterprise-rule,
.staff-shift-enterprise-rule,
.staff-trip-stock-snapshot {
  border: 1px solid rgba(30, 99, 175, .16);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(239,247,255,.96), rgba(255,255,255,.98));
  padding: 14px 16px;
}
.staff-trip-enterprise-rule strong,
.staff-shift-enterprise-rule strong { display:block; font-size: 15px; line-height: 1.25; color:#0f4f8a; }
.staff-trip-enterprise-rule p,
.staff-shift-enterprise-rule p { margin:6px 0 0; font-size:13px; line-height:1.45; color:#52657a; }
.staff-trip-stock-snapshot { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.staff-trip-stock-snapshot small { display:block; font-size:11px; font-weight:800; letter-spacing:.08em; color:#64778c; }
.staff-trip-stock-snapshot strong { display:block; margin-top:3px; font-size:18px; white-space:nowrap; color:#15314d; }
.staff-trip-stock-snapshot > span { flex:0 0 auto; border-radius:999px; padding:6px 9px; background:#e8f5ed; color:#277245; font-size:11px; font-weight:800; }
.staff-trip-soft-note { display:grid; gap:7px; }
.staff-trip-soft-note input { width:100%; }
@media (max-width: 520px) {
  .staff-trip-stock-snapshot { align-items:flex-start; }
  .staff-trip-stock-snapshot strong { font-size:16px; }
}

/* v4.14.1 Enterprise shift reconciliation */
.staff-shift-empty-actual{display:grid;gap:6px;margin-top:10px;font-weight:800;color:#27445f}
.staff-shift-empty-actual input{min-height:46px;font-size:16px}
.staff-shift-empty-difference{display:grid;gap:2px;margin-top:9px;padding:10px 12px;border-radius:13px;border:1px solid #d6e2ee;background:#f8fbfd}
.staff-shift-empty-difference small{font-size:10px;letter-spacing:.08em;font-weight:900;color:#667f95}
.staff-shift-empty-difference strong{font-size:17px;color:#17344e}
.staff-shift-empty-difference p{margin:0;font-size:12px;line-height:1.4;color:#60788d}
.staff-shift-empty-difference.is-ok{border-color:#cde8d5;background:#f4fbf6}
.staff-shift-empty-difference.is-ok strong{color:#267044}
.staff-shift-empty-difference.is-alert{border-color:#f1ccb8;background:#fff8f3}
.staff-shift-empty-difference.is-alert strong{color:#b55222}

/* ========================================================================== 
   AquaFlow v4.14.1 — Admin settlement mobile UI fix
   - Keep VND amounts fully readable (no ellipsis)
   - Use a 2×2 KPI grid on phones instead of squeezing four columns
   - Give employee metadata its own row below the name/balance badge
   - Improve settlement hero contrast
   ========================================================================== */
#overview #admin-handover.overview-employee-settlement .settlement-hero>small{
  color:#fff!important;
  opacity:.92!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-hero b{
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums;
}
#overview #admin-handover.overview-employee-settlement .settlement-mini-grid strong{
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums;
}
#overview #admin-handover.overview-employee-settlement .employee-settlement-card>header>b{
  white-space:nowrap!important;
  max-width:none!important;
  font-variant-numeric:tabular-nums;
}

@media(max-width:600px){
  #overview #admin-handover.overview-employee-settlement .employee-settlement-card>header{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:start!important;
    column-gap:10px!important;
    row-gap:5px!important;
  }
  #overview #admin-handover.overview-employee-settlement .employee-settlement-card>header>div{
    display:contents!important;
  }
  #overview #admin-handover.overview-employee-settlement .employee-settlement-card>header>div>strong{
    grid-column:1!important;
    grid-row:1!important;
    min-width:0!important;
  }
  #overview #admin-handover.overview-employee-settlement .employee-settlement-card>header>b{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:end!important;
    max-width:min(58vw,220px)!important;
    text-align:right!important;
  }
  #overview #admin-handover.overview-employee-settlement .employee-settlement-card>header>div>small{
    grid-column:1 / -1!important;
    grid-row:2!important;
    min-width:0!important;
    white-space:normal!important;
  }
  #overview #admin-handover.overview-employee-settlement .settlement-mini-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    padding:0 10px 10px!important;
  }
  #overview #admin-handover.overview-employee-settlement .settlement-mini-grid span{
    min-height:72px!important;
    padding:10px 9px!important;
    align-content:center!important;
    border:1px solid #e6eef5!important;
    border-radius:14px!important;
  }
  #overview #admin-handover.overview-employee-settlement .settlement-mini-grid small{
    font-size:10.5px!important;
    line-height:1.15!important;
  }
  #overview #admin-handover.overview-employee-settlement .settlement-mini-grid strong{
    font-size:clamp(14px,4vw,17px)!important;
    line-height:1.2!important;
    letter-spacing:-.015em!important;
  }
}

@media(max-width:360px){
  #overview #admin-handover.overview-employee-settlement .employee-settlement-card>header>b{
    max-width:56vw!important;
    font-size:12px!important;
  }
  #overview #admin-handover.overview-employee-settlement .settlement-mini-grid strong{
    font-size:13.5px!important;
  }
}

/* ========================================================================== 
   AquaFlow v4.15.6 — Settlement salary / driver role clarity
   - Show effective role (Tài xế / Phụ xe) beside employee name
   - Use role-specific salary label instead of generic, duplicated wording
   - Keep the detail line compact and readable on iPhone widths
   ========================================================================== */
#overview #admin-handover.overview-employee-settlement .employee-settlement-card>header small{
  display:flex!important;
  align-items:center!important;
  gap:5px!important;
  flex-wrap:wrap!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-role-label{
  color:#0878ef!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
  white-space:nowrap!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-role-stats{
  color:#718196!important;
  font-weight:750!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-role-stats::before{
  content:"·";
  margin-right:5px;
  color:#9aabba;
}
#overview #admin-handover.overview-employee-settlement .settlement-salary-kpi small{
  color:#0878ef!important;
  letter-spacing:.035em!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-salary-detail{
  padding:8px 10px!important;
  border-radius:11px!important;
  background:#f2f8ff!important;
  color:#45647f!important;
}
#overview #admin-handover.overview-employee-settlement .settlement-salary-detail b{
  color:#153f61!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums;
}
@media(max-width:600px){
  #overview #admin-handover.overview-employee-settlement .employee-settlement-card>header>div>small{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:4px!important;
  }
  #overview #admin-handover.overview-employee-settlement .settlement-role-stats::before{margin-right:4px}
  #overview #admin-handover.overview-employee-settlement .settlement-salary-kpi small{
    font-size:10px!important;
    line-height:1.15!important;
  }
}


/* AquaFlow v4.15.6 — Expense monthly history & approval audit */
.expense-month-panel{margin-top:14px;padding:15px 16px;border:1px solid #d7e6f2;border-radius:18px;background:linear-gradient(180deg,#f8fbff,#eef7ff)}
.expense-month-head{display:flex;align-items:center;justify-content:space-between;gap:14px}
.expense-month-head>div{min-width:0}
.expense-month-head small{display:block;color:#0878ef;font-size:.7rem;font-weight:950;letter-spacing:.14em}
.expense-month-head strong{display:block;margin-top:3px;color:#15324d;font-size:1.15rem;font-weight:950}
.expense-month-head span{display:block;margin-top:3px;color:#71859b;font-size:.76rem}
.expense-month-picker{display:grid;gap:4px;min-width:132px;color:#607891;font-size:.7rem;font-weight:850}
.expense-month-picker input{min-height:42px;padding:0 10px;border:1px solid #cbddea;border-radius:12px;background:#fff;color:#17344f;font-weight:850;font-size:.82rem}
.expense-month-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:12px;border:1px solid #d8e6f0;border-radius:15px;background:#fff;overflow:hidden}
.expense-month-kpis>div{padding:11px 12px;min-width:0}
.expense-month-kpis>div+div{border-left:1px solid #e2edf4}
.expense-month-kpis small{display:block;color:#6c8298;font-size:.67rem;font-weight:900;letter-spacing:.05em}
.expense-month-kpis strong{display:block;margin-top:3px;color:#102a44;font-size:1.05rem;line-height:1.15;font-weight:950;white-space:nowrap;font-variant-numeric:tabular-nums}
.expense-month-kpis span{display:block;margin-top:3px;color:#7b8ea1;font-size:.68rem;font-weight:700}
.expense-month-category{margin-top:10px}
.expense-month-category-title{margin-bottom:5px;color:#46637d;font-size:.72rem;font-weight:900}
.expense-month-category-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 0;border-top:1px dashed #d9e6ef}
.expense-month-category-row span{color:#5d758c;font-size:.76rem;font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.expense-month-category-row strong{color:#163750;font-size:.78rem;font-weight:900;white-space:nowrap;font-variant-numeric:tabular-nums}
.expense-month-category-empty{padding:8px 0;color:#8091a2;font-size:.74rem}
.expense-approval-history{margin-top:12px;border:1px solid #d8e6f0;border-radius:18px;background:#fff;overflow:hidden}
.expense-approval-history>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px;padding:0 14px;color:#294760;font-size:.84rem;font-weight:900;cursor:pointer;list-style:none}
.expense-approval-history>summary::-webkit-details-marker{display:none}
.expense-approval-history>summary:after{content:"⌄";color:#6c8499;font-size:1rem}
.expense-approval-history>summary b{margin-left:auto;display:grid;min-width:24px;height:24px;padding:0 6px;place-items:center;border-radius:999px;background:#eaf4ff;color:#0878ef;font-size:.7rem}
.expense-approval-history[open]>summary{border-bottom:1px solid #e3edf4}
.expense-approval-history-row{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;padding:11px 13px;border-bottom:1px solid #edf2f6}
.expense-approval-history-row:last-child{border-bottom:0}
.expense-history-icon{display:grid;width:34px;height:34px;place-items:center;border-radius:50%;font-weight:950}
.expense-approval-history-row.approved .expense-history-icon{background:#e5f8ee;color:#0b9c68}
.expense-approval-history-row.rejected .expense-history-icon{background:#ffecee;color:#d23843}
.expense-approval-history-row strong{display:block;color:#17344e;font-size:.8rem;font-weight:900}
.expense-approval-history-row small{display:block;margin-top:3px;color:#71859a;font-size:.68rem;line-height:1.3}
.expense-approval-history-row p{margin:5px 0 0;color:#657b90;font-size:.7rem}
@media(max-width:640px){
  .expense-month-head{align-items:stretch;flex-direction:column}
  .expense-month-picker{width:100%;grid-template-columns:1fr 1.2fr;align-items:center}
  .expense-month-picker input{width:100%}
  .expense-month-kpis{grid-template-columns:1fr 1fr}
  .expense-month-kpis>div:nth-child(3){grid-column:1/-1;border-left:0;border-top:1px solid #e2edf4}
}
@media(max-width:420px){
  .expense-month-kpis{grid-template-columns:1fr}
  .expense-month-kpis>div:nth-child(3){grid-column:auto;border-top:1px solid #e2edf4}
  .expense-month-kpis>div+div{border-left:0;border-top:1px solid #e2edf4}
  .expense-month-picker{grid-template-columns:1fr}
}

/* AquaFlow v4.15.6 compact lists — admin and staff share the same one-line delivery rows. */
#deliveries .staff-delivery-list-compact {
  display: grid;
  gap: 7px;
}
#deliveries .staff-delivery-compact {
  overflow: clip;
  border: 1px solid #d8e5ee;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 3px 12px rgba(25,62,91,.04);
  content-visibility: auto;
  contain-intrinsic-size: auto 62px;
}
#deliveries .staff-delivery-compact > summary {
  display: grid;
  grid-template-columns: 32px minmax(0,1fr) auto 16px;
  min-height: 58px;
  align-items: center;
  gap: 8px;
  padding: 7px 9px;
  list-style: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
#deliveries .staff-delivery-compact > summary::-webkit-details-marker { display: none; }
#deliveries .staff-delivery-number {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 9px;
  background: #eaf5ff;
  color: #0878ef;
  font-size: .78rem;
  font-weight: 900;
}
#deliveries .staff-delivery-main,
#deliveries .staff-delivery-money { min-width: 0; }
#deliveries .staff-delivery-main { display: grid; gap: 2px; }
#deliveries .staff-delivery-main > strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #163149;
  font-size: .86rem;
  line-height: 1.2;
}
#deliveries .staff-delivery-main > small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #71879a;
  font-size: .67rem;
  line-height: 1.25;
  letter-spacing: 0;
}
#deliveries .staff-delivery-money {
  display: grid;
  justify-items: end;
  gap: 1px;
  text-align: right;
  white-space: nowrap;
}
#deliveries .staff-delivery-money > strong { color: #12304a; font-size: .76rem; line-height: 1.2; }
#deliveries .staff-delivery-money > small { font-size: .62rem; font-weight: 800; line-height: 1.2; letter-spacing: 0; }
#deliveries .staff-delivery-chevron {
  color: #7d91a3;
  font-size: 1.2rem;
  transition: transform .16s ease;
}
#deliveries .staff-delivery-compact[open] .staff-delivery-chevron { transform: rotate(90deg); }
#deliveries .staff-delivery-compact[open] > summary { background: #f8fbfe; }
#deliveries .staff-delivery-expanded {
  display: grid;
  gap: 8px;
  border-top: 1px solid #e6eef4;
  padding: 9px 10px 10px 49px;
}
#deliveries .staff-delivery-facts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
#deliveries .staff-delivery-facts > span {
  display: grid;
  gap: 2px;
  min-width: 0;
  border-radius: 9px;
  background: #f5f9fc;
  padding: 6px 7px;
}
#deliveries .staff-delivery-facts > span.wide { grid-column: 1/-1; }
#deliveries .staff-delivery-facts small { color: #7990a3; font-size: .61rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
#deliveries .staff-delivery-facts b { overflow-wrap: anywhere; color: #213c53; font-size: .71rem; }
#deliveries .staff-delivery-note { margin: 0; color: #657b8d; font-size: .7rem; line-height: 1.4; }
#deliveries .staff-delivery-actions { display: flex; justify-content: flex-end; gap: 6px; }
#deliveries .staff-delivery-actions .edit,
#deliveries .staff-delivery-actions .delete { min-height: 32px; padding: 4px 10px; font-size: .69rem; }
#deliveries .staff-delivery-compact.cancelled { opacity: .62; }

@media (max-width: 980px) {
  #deliveries .delivery-page-head { margin-bottom: 7px; padding: 2px 0; }
  #deliveries .delivery-page-head > div > small,
  #deliveries .delivery-page-head > div > p { display: none; }
  #deliveries .delivery-page-head h2 { font-size: 18px; margin: 0; }
  #deliveries .delivery-create-button { min-height: 38px; padding: 0 11px; font-size: 12px; }
  #deliveries .employee-search-panel { gap: 6px; margin-bottom: 8px; padding: 6px; border-radius: 14px; }
  #deliveries .employee-search-box { min-height: 40px; border-radius: 11px; }
  body.af-enterprise #deliveries .employee-search-box input { min-height: 38px !important; height: 38px !important; font-size: 14px; }
  #deliveries .employee-search-count { min-width: 58px; min-height: 38px; padding: 6px 8px; font-size: .68rem; }
}

@media (max-width: 430px) {
  #deliveries .staff-delivery-compact > summary {
    grid-template-columns: 30px minmax(0,1fr) auto 14px;
    min-height: 54px;
    gap: 6px;
    padding: 6px 7px;
  }
  #deliveries .staff-delivery-number { width: 28px; height: 28px; border-radius: 8px; font-size: .73rem; }
  #deliveries .staff-delivery-main > strong { font-size: .82rem; }
  #deliveries .staff-delivery-main > small { max-width: 46vw; font-size: .63rem; }
  #deliveries .staff-delivery-money > strong { font-size: .71rem; }
  #deliveries .staff-delivery-money > small { font-size: .59rem; }
  #deliveries .staff-delivery-expanded { padding-left: 43px; }
}

/* 4.15.6 compact-ui-v4 — iOS/Safari search focus zoom fix.
   Safari automatically zooms focused form controls when their rendered font is below 16px.
   Keep the compact control height, but never render mobile form text below 16px. */
@media (max-width: 980px) {
  body.af-enterprise #deliveries .employee-search-box input,
  body.staff-mode #deliveries .employee-search-box input,
  body[data-role="staff"] #deliveries .employee-search-box input,
  body.management-mode #deliveries .employee-search-box input {
    font-size: 16px !important;
    -webkit-text-size-adjust: 100%;
  }
}

/* ========================================================================== 
   AquaFlow v4.15.6 readable-ui-v5 — Mobile readability + Order Detail popup fix
   - iOS: use dynamic viewport for fullscreen order detail; never leave backdrop gaps
   - Remove Safari scrollbar-gutter artifacts that can expose curved/black side gaps
   - Increase Delivery list and Order Detail typography without returning to oversized cards
   ========================================================================== */
@media (max-width: 760px) {
  #order-detail-dialog.af-global-fullscreen-dialog {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    max-width: none !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    background: #fff !important;
    transform: none !important;
    clip-path: none !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }
  #order-detail-dialog.af-global-fullscreen-dialog > .af-global-dialog-scroll {
    width: 100% !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    border-radius: 0 !important;
    background: #fff !important;
    scrollbar-gutter: auto !important;
    overscroll-behavior-y: contain !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  #order-detail-dialog.af-global-fullscreen-dialog .af-global-dialog-head,
  #order-detail-dialog.af-global-fullscreen-dialog .af-global-dialog-actions {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
  }
  #order-detail-dialog .order-detail-head small {
    font-size: 11px !important;
    letter-spacing: .14em !important;
  }
  #order-detail-dialog .order-detail-head h2 {
    margin-top: 5px !important;
    font-size: 24px !important;
    line-height: 1.15 !important;
  }
  #order-detail-dialog .order-detail-head .muted {
    margin: 8px 0 0 !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
  }
  #order-detail-dialog .order-detail-content {
    gap: 12px !important;
    overflow: visible !important;
  }
  #order-detail-dialog .order-detail-customer {
    grid-template-columns: 52px minmax(0,1fr) !important;
    gap: 12px !important;
    padding: 14px !important;
    border-radius: 17px !important;
  }
  #order-detail-dialog .order-detail-avatar {
    width: 52px !important;
    height: 52px !important;
    border-radius: 15px !important;
    font-size: 19px !important;
  }
  #order-detail-dialog .order-detail-customer strong { font-size: 18px !important; line-height: 1.25 !important; }
  #order-detail-dialog .order-detail-customer span,
  #order-detail-dialog .order-detail-customer small { font-size: 13px !important; line-height: 1.35 !important; }
  #order-detail-dialog .order-detail-call {
    grid-column: 1 / -1 !important;
    min-height: 44px !important;
    font-size: 14px !important;
  }
  #order-detail-dialog .order-detail-kpis { gap: 8px !important; }
  #order-detail-dialog .order-detail-kpis span {
    min-height: 76px !important;
    align-content: center !important;
    gap: 6px !important;
    padding: 11px 12px !important;
    border-radius: 14px !important;
  }
  #order-detail-dialog .order-detail-kpis small {
    font-size: 10.5px !important;
    line-height: 1.2 !important;
  }
  #order-detail-dialog .order-detail-kpis strong {
    font-size: 15px !important;
    line-height: 1.25 !important;
  }
  #order-detail-dialog .order-detail-section {
    padding: 14px !important;
    border-radius: 16px !important;
  }
  #order-detail-dialog .order-detail-section-head small { font-size: 10px !important; }
  #order-detail-dialog .order-detail-section-head strong { font-size: 17px !important; }
  #order-detail-dialog .order-detail-products > div {
    grid-template-columns: minmax(0,1fr) auto !important;
    gap: 6px 12px !important;
    padding: 11px 0 !important;
  }
  #order-detail-dialog .order-detail-products span { font-size: 14px !important; }
  #order-detail-dialog .order-detail-products strong { font-size: 13px !important; }
  #order-detail-dialog .order-detail-products b { grid-column: 2 !important; font-size: 14px !important; }
  #order-detail-dialog .order-detail-total { font-size: 14px !important; padding-top: 12px !important; }
  #order-detail-dialog .order-detail-total strong { font-size: 22px !important; }
  #order-detail-dialog .order-detail-people { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  #order-detail-dialog .order-detail-people span { padding: 10px !important; font-size: 11px !important; }
  #order-detail-dialog .order-detail-people strong { font-size: 14px !important; line-height: 1.3 !important; }
  #order-detail-dialog .order-detail-note,
  #order-detail-dialog .order-detail-failure { font-size: 13px !important; line-height: 1.5 !important; }
  #order-detail-dialog.af-global-fullscreen-dialog .order-detail-actions .btn {
    font-size: 15px !important;
    min-height: 54px !important;
  }
}

@media (max-width: 980px) {
  /* Giao hàng: giữ gọn nhưng tăng chữ và vùng chạm. */
  #deliveries .delivery-page-head {
    min-height: 76px !important;
    padding: 10px 12px !important;
    border-radius: 18px !important;
  }
  #deliveries .delivery-page-head h2 { font-size: 23px !important; line-height: 1.15 !important; }
  #deliveries .delivery-create-button { min-height: 44px !important; padding: 0 14px !important; font-size: 14px !important; }
  #deliveries .employee-search-panel { gap: 8px !important; padding: 8px !important; border-radius: 16px !important; }
  #deliveries .employee-search-box { min-height: 48px !important; height: 48px !important; }
  body.af-enterprise #deliveries .employee-search-box input,
  body.staff-mode #deliveries .employee-search-box input,
  body[data-role="staff"] #deliveries .employee-search-box input,
  body.management-mode #deliveries .employee-search-box input {
    min-height: 46px !important;
    height: 46px !important;
    font-size: 16px !important;
  }
  #deliveries .employee-search-box > span { font-size: 21px !important; }
  #deliveries .employee-search-count {
    min-width: 66px !important;
    min-height: 46px !important;
    padding: 8px 10px !important;
    font-size: 13px !important;
  }
  #deliveries .staff-delivery-list-compact { gap: 9px !important; }
  #deliveries .staff-delivery-compact { border-radius: 16px !important; contain-intrinsic-size: auto 74px !important; }
  #deliveries .staff-delivery-compact > summary {
    grid-template-columns: 38px minmax(0,1fr) auto 16px !important;
    min-height: 72px !important;
    gap: 9px !important;
    padding: 9px 10px !important;
  }
  #deliveries .staff-delivery-number {
    width: 36px !important;
    height: 36px !important;
    border-radius: 10px !important;
    font-size: 14px !important;
  }
  #deliveries .staff-delivery-main { gap: 4px !important; }
  #deliveries .staff-delivery-main > strong { font-size: 16px !important; line-height: 1.2 !important; }
  #deliveries .staff-delivery-main > small { max-width: 48vw !important; font-size: 12.5px !important; line-height: 1.25 !important; }
  #deliveries .staff-delivery-money { gap: 3px !important; }
  #deliveries .staff-delivery-money > strong { font-size: 15px !important; line-height: 1.2 !important; }
  #deliveries .staff-delivery-money > small { font-size: 11px !important; line-height: 1.2 !important; }
  #deliveries .staff-delivery-chevron { font-size: 20px !important; }
  #deliveries .staff-delivery-expanded { gap: 10px !important; padding: 11px 11px 12px 57px !important; }
  #deliveries .staff-delivery-facts small { font-size: 10px !important; }
  #deliveries .staff-delivery-facts b { font-size: 13px !important; }
  #deliveries .staff-delivery-note { font-size: 12.5px !important; }
  #deliveries .staff-delivery-actions .edit,
  #deliveries .staff-delivery-actions .delete { min-height: 40px !important; font-size: 12px !important; }
}

@media (max-width: 390px) {
  #order-detail-dialog .order-detail-people { grid-template-columns: 1fr !important; }
  #deliveries .staff-delivery-main > small { max-width: 43vw !important; }
}

/* =========================================================
   v4.15.6 FAST-SMOOTH — mobile rendering / scrolling budget
   ========================================================= */
@media(max-width:980px){
  #order-list>.aquaflow-order-card,
  #delivery-list .entry,
  #delivery-list .staff-delivery-compact,
  #debt-list>.debtor,
  #customer-list>.customer-card,
  #bottle-debt-list>*{
    content-visibility:auto;
    contain-intrinsic-size:auto 84px;
  }
  body.unified-shell .tabs{
    background:#fff!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  body.unified-shell :is(.customer-search-panel,.employee-search-panel,.order-filter-panel){
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  dialog::backdrop{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  dialog,.af-global-dialog-scroll,.delivery-form-scroll{
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
  }
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}


/* =========================================================
   v4.15.6 — Thanh toán nhiều phiếu công ty trong một lần
   ========================================================= */
.supplier-payment-picker{display:grid;gap:9px;border:1px solid #d2e2ee;border-radius:18px;background:#f8fbfd;padding:11px}
.supplier-payment-picker-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.supplier-payment-picker-head>div:first-child{display:grid;gap:2px;min-width:0}
.supplier-payment-picker-head small{color:#0878ef;font-size:10px;font-weight:900;letter-spacing:.09em}
.supplier-payment-picker-head strong{color:#193851;font-size:13px}
.supplier-payment-picker-head>div:last-child{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.supplier-payment-picker-action{min-height:34px;border:1px solid #bfdbef;border-radius:10px;background:#eaf5ff;padding:0 10px;color:#0874dd;font-size:11px;font-weight:850;cursor:pointer}
.supplier-payment-picker-action.muted-action{background:#fff;color:#60778c}
.supplier-payment-receipt-list{display:grid;gap:6px;max-height:270px;overflow:auto;overscroll-behavior:contain;padding-right:2px}
.supplier-payment-receipt-option{display:grid!important;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:62px;border:1px solid #dbe7ef;border-radius:13px;background:#fff;padding:8px 9px!important;color:#18364f!important;cursor:pointer}
.supplier-payment-receipt-option.is-selected{border-color:#79bdf4;background:#f1f8ff;box-shadow:0 0 0 2px rgba(8,120,239,.07)}
.supplier-payment-receipt-option input{width:20px!important;height:20px!important;min-height:20px!important;margin:0;accent-color:#0878ef}
.supplier-payment-receipt-check{display:none}
.supplier-payment-receipt-copy{display:grid;gap:3px;min-width:0}
.supplier-payment-receipt-copy strong{font-size:14px;color:#173650}
.supplier-payment-receipt-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#6d8296;font-size:11px;font-weight:650}
.supplier-payment-receipt-due{display:grid;justify-items:end;gap:2px;white-space:nowrap;text-align:right}
.supplier-payment-receipt-due small{color:#8a9aaa;font-size:8px;font-weight:900;letter-spacing:.07em}
.supplier-payment-receipt-due strong{color:#c92a35;font-size:13px}
.supplier-payment-receipt-empty{padding:22px 10px;text-align:center;color:#72879a;font-size:12px}
.supplier-payment-amount-help{display:block;margin:-3px 1px 1px;color:#6b8194;font-size:11px;line-height:1.4}
#supplier-payment-amount[readonly]{background:#f2f7fb;color:#173650;cursor:default}
#supplier-payment-submit:disabled,.supplier-fill-due:disabled{opacity:.48;cursor:not-allowed}
@media(max-width:560px){
  .supplier-payment-picker{padding:9px;border-radius:15px}
  .supplier-payment-picker-head{align-items:flex-start}
  .supplier-payment-picker-head>div:last-child{gap:4px}
  .supplier-payment-picker-action{min-height:32px;padding:0 8px;font-size:10px}
  .supplier-payment-receipt-list{max-height:236px}
  .supplier-payment-receipt-option{grid-template-columns:20px minmax(0,1fr) auto;min-height:58px;padding:7px 8px!important;gap:7px}
  .supplier-payment-receipt-option input{width:18px!important;height:18px!important;min-height:18px!important}
  .supplier-payment-receipt-check{display:none}
  .supplier-payment-receipt-copy strong{font-size:13px}
  .supplier-payment-receipt-copy small{font-size:10px}
  .supplier-payment-receipt-due strong{font-size:12px}
}


/* v4.15.6 — Expense date clarity: ngày chi luôn nổi bật, gồm cả chi phí Admin nhập trực tiếp */
.expense-history-title{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.expense-history-title strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.expense-history-title time{flex:0 0 auto;border:1px solid #cfe1ef;border-radius:999px;background:#f4f9fd;padding:4px 8px;color:#1c5b8e;font-size:.68rem;font-weight:900;font-variant-numeric:tabular-nums}
.expense-approval-history-row .expense-history-money{margin-top:5px;color:#183c5b;font-size:.72rem;font-weight:850}
.expense-approval-history-row .expense-history-event{margin-top:4px;color:#6d8194;font-size:.68rem;line-height:1.4}
@media(max-width:560px){
  .expense-approval-history-row{grid-template-columns:30px minmax(0,1fr);gap:9px;padding:10px 11px}
  .expense-history-icon{width:30px;height:30px}
  .expense-history-title{align-items:flex-start}
  .expense-history-title time{padding:3px 7px;font-size:.64rem}
}

.expense-entry-date{display:flex!important;align-items:center;gap:5px;color:#5e7890!important;font-variant-numeric:tabular-nums}
.expense-entry-date b{color:#274d6d;font-weight:900}

/* 4.15.6 — Nhân viên sửa nhanh / yêu cầu chỉnh phiếu nhận hàng */
.staff-receipt-edit-action{min-height:31px;padding:6px 9px;border:1px solid #b8d7f2;border-radius:9px;background:#eef7ff;color:#0878ef;font-size:10px;font-weight:900;white-space:nowrap}
.staff-receipt-edit-action.pending{border-color:#dce4eb;background:#f3f6f8;color:#718394}
.staff-receipt-request-pending{display:grid;gap:2px;margin-top:4px;padding:7px 9px;border-radius:10px;background:#fff8e8;border:1px solid #f3dfad;color:#7d6017}
.staff-receipt-request-pending strong{font-size:10px}.staff-receipt-request-pending span{font-size:10px;line-height:1.35}
.staff-receipt-request-rejected{display:block;margin-top:4px;color:#aa3d47!important}
.staff-receipt-edit-dialog{width:min(560px,calc(100% - 18px));border:0;border-radius:22px;padding:0;box-shadow:0 24px 80px rgba(20,51,77,.22)}
.staff-receipt-edit-form{display:grid;gap:13px;padding:18px;background:#fff}
.staff-receipt-edit-form textarea{width:100%;min-height:78px;resize:vertical}
.staff-receipt-edit-current{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.staff-receipt-edit-current span{display:grid;gap:3px;padding:10px;border-radius:12px;background:#f3f8fc;color:#688095;font-size:11px;font-weight:800}
.staff-receipt-edit-current strong{color:#173651;font-size:13px}
.staff-receipt-edit-error{padding:9px 11px;border-radius:10px;background:#fff1f1;color:#b72d38;font-size:12px;font-weight:750}
@media(max-width:640px){.staff-receipt-card{align-items:stretch}.staff-receipt-card-state{min-width:112px}.staff-receipt-edit-action{width:100%}.staff-receipt-edit-current{grid-template-columns:1fr 1fr}}

/* 4.15.6 — yêu cầu chỉnh sửa phiếu từ nhân viên */
.receipt-edit-request-banner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;margin:0 0 12px;padding:11px 12px;border:1px solid #f0d89d;border-radius:13px;background:#fff9e9;color:#715615}
.receipt-edit-request-banner>div:first-child{display:grid;gap:3px}.receipt-edit-request-banner small{font-size:.56rem;font-weight:950;letter-spacing:.07em;color:#a1760b}.receipt-edit-request-banner strong{font-size:.88rem;color:#5c4512}.receipt-edit-request-banner p{margin:0;font-size:.72rem;line-height:1.4}.receipt-edit-request-banner em{font-size:.66rem;font-style:normal;color:#806a31}
.receipt-edit-request-actions{display:flex;gap:6px}.receipt-edit-request-actions button{min-height:36px}
@media(max-width:640px){.receipt-edit-request-banner{grid-template-columns:1fr}.receipt-edit-request-actions{display:grid;grid-template-columns:1fr 1fr}.receipt-edit-request-actions button{width:100%}}

.receipt-edit-request-queue{margin-bottom:12px;border:1px solid #f0d89d!important;background:#fffdf6!important}.receipt-edit-request-queue>summary{color:#785b14!important}.receipt-edit-request-queue-body{display:grid;gap:8px;padding:10px}.receipt-edit-request-queue-body>article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px;border:1px solid #f0dfb2;border-radius:12px;background:#fff}.receipt-edit-request-queue-body>article>div:first-child{display:grid;gap:2px}.receipt-edit-request-queue-body small{font-size:.58rem;font-weight:900;color:#9a7416}.receipt-edit-request-queue-body strong{font-size:.82rem;color:#173651}.receipt-edit-request-queue-body span,.receipt-edit-request-queue-body em{font-size:.66rem;line-height:1.35;color:#6d7f8d}.receipt-edit-request-queue-body em{font-style:normal;color:#7c611c}.receipt-edit-request-queue-body>article>div:last-child{display:flex;gap:6px}@media(max-width:640px){.receipt-edit-request-queue-body>article{grid-template-columns:1fr}.receipt-edit-request-queue-body>article>div:last-child{display:grid;grid-template-columns:1fr 1fr}.receipt-edit-request-queue-body button{width:100%}}

/* v13 backup and tracking management */
.v13-management{margin:12px 0;padding:16px;border:1px solid #dce6ee;border-radius:16px;background:#f8fbff;min-width:0}
.v13-management summary{font-weight:800;cursor:pointer;padding:8px 0}
.v13-management p{overflow-wrap:anywhere;line-height:1.5}
.v13-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}
.v13-groups article{display:grid;gap:6px;background:white;border:1px solid #e0e8ee;border-radius:12px;padding:12px}
.v13-groups b{font-size:20px;color:#0878df}.v13-groups small{color:#52697b}
.v13-management input:not([type=checkbox]){width:100%;min-width:0;font-size:16px;min-height:44px}
.v13-management input[type=checkbox]{width:20px;height:20px;vertical-align:middle}
.v13-management .btn{min-height:44px;margin:8px 4px 0 0;white-space:normal}
.v13-device{padding:14px 0;border-bottom:1px solid #dce6ee;overflow-wrap:anywhere}
@media(max-width:360px){.v13-groups{grid-template-columns:1fr}}
/* Stable connection status: its space does not change between sync states. */
.sync-status { min-height: 44px; display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 4px 12px; color: #38604f; font-size: 12px; }
.sync-status span { min-width: 0; }
.sync-status button { flex-shrink: 0; min-height: 36px; border: 1px solid #cbdce5; border-radius: 8px; background: #fff; color: #145880; padding: 6px 12px; cursor: pointer; }
.sync-status button:disabled { opacity: .6; cursor: wait; }
.sync-status[data-state="offline"], .sync-status[data-state="error"] { color: #8c3a10; }
.sync-status[data-state="loading"], .sync-status[data-state="waiting"] { color: #4b6475; }
@media(max-width: 600px) { .sync-status { justify-content: space-between; } .sync-status button { min-height: 44px; } }
@media print { .sync-status { display: none !important; } }


/* v4.15.6 v16 — Admin mobile quick actions: compact 4-button rail */
@media (max-width:760px){
  body.management-mode #overview .management-command-center{
    display:block!important;
    margin:10px 0 12px!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  body.management-mode #overview .management-command-intro,
  body.management-mode #overview .management-attention-cta:not(.has-warning){display:none!important}
  body.management-mode #overview .management-command-actions.management-command-actions-four{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:7px!important;
  }
  body.management-mode #overview .management-command-actions-four .management-command{
    min-width:0!important;
    min-height:76px!important;
    padding:8px 3px 7px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    border:1px solid #d9e6f2!important;
    border-radius:17px!important;
    background:#fff!important;
    text-align:center!important;
    box-shadow:0 8px 20px rgba(18,56,89,.055)!important;
  }
  body.management-mode #overview .management-command-actions-four .management-command>span{
    display:grid!important;
    place-items:center!important;
    width:36px!important;
    height:36px!important;
    flex:0 0 36px!important;
    border-radius:12px!important;
    font-size:18px!important;
    font-weight:900!important;
    line-height:1!important;
  }
  body.management-mode #overview .management-command-actions-four .management-command strong{
    display:block!important;
    width:100%!important;
    color:#193852!important;
    font-size:10.5px!important;
    font-weight:900!important;
    line-height:1.12!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  body.management-mode #overview .management-command-actions-four .management-command small{display:none!important}
  body.management-mode #overview .management-command-actions-four .command-delivery{border-color:#c6defa!important;background:linear-gradient(180deg,#f8fbff,#eef6ff)!important}
  body.management-mode #overview .management-command-actions-four .command-delivery>span{background:#1678ef!important;color:#fff!important}
  body.management-mode #overview .management-command-actions-four .command-payment{border-color:#cae9dc!important;background:linear-gradient(180deg,#f8fdfb,#effaf5)!important}
  body.management-mode #overview .management-command-actions-four .command-payment>span{background:#0d9c69!important;color:#fff!important}
  body.management-mode #overview .management-command-actions-four .command-receipt{border-color:#d4e4f2!important;background:linear-gradient(180deg,#fbfdff,#f3f8fc)!important}
  body.management-mode #overview .management-command-actions-four .command-receipt>span{background:#e7f2fc!important;color:#2477b7!important}
  body.management-mode #overview .management-command-actions-four .command-expense{border-color:#f1dfca!important;background:linear-gradient(180deg,#fffdf9,#fff7ee)!important}
  body.management-mode #overview .management-command-actions-four .command-expense>span{background:#fff0df!important;color:#c76d13!important}
}
@media (max-width:390px){
  body.management-mode #overview .management-command-actions.management-command-actions-four{gap:5px!important}
  body.management-mode #overview .management-command-actions-four .management-command{min-height:72px!important;border-radius:15px!important}
  body.management-mode #overview .management-command-actions-four .management-command>span{width:33px!important;height:33px!important;flex-basis:33px!important;font-size:16px!important}
  body.management-mode #overview .management-command-actions-four .management-command strong{font-size:9.8px!important}
}

/* v4.15.6 v21 — Expense month redesign: cancelled expenses stay in audit only. */
#operations #operation-expenses .expense-month-panel-v2{
  margin-top:12px;
  padding:14px;
  border:1px solid #d9e7f2;
  border-radius:20px;
  background:#f8fbff;
  box-shadow:0 8px 24px rgba(21,57,96,.05);
}
#operations #operation-expenses .expense-month-panel-v2 .expense-month-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:12px;
}
#operations #operation-expenses .expense-month-panel-v2 .expense-month-head small{
  color:#0b7af0;
  font-size:.72rem;
  font-weight:950;
  letter-spacing:.13em;
}
#operations #operation-expenses .expense-month-panel-v2 .expense-month-head strong{
  margin-top:4px;
  color:#122f4b;
  font-size:1.35rem;
  line-height:1.12;
}
#operations #operation-expenses .expense-month-panel-v2 .expense-month-head>div>span{
  margin-top:5px;
  color:#778aa0;
  font-size:.74rem;
  line-height:1.35;
}
#operations #operation-expenses .expense-month-panel-v2 .expense-month-picker{
  min-width:160px;
  gap:5px;
}
#operations #operation-expenses .expense-month-panel-v2 .expense-month-picker input{
  min-height:44px;
  border-radius:13px;
  background:#fff;
}
#operations #operation-expenses .expense-month-kpis-v2{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);
  gap:10px;
  margin-top:12px;
  border:0;
  border-radius:0;
  background:transparent;
  overflow:visible;
}
#operations #operation-expenses .expense-month-kpis-v2>div{
  min-width:0;
  padding:13px 14px;
  border:1px solid #dbe7f0;
  border-radius:16px;
  background:#fff;
}
#operations #operation-expenses .expense-month-kpis-v2>div+div{border-left:1px solid #dbe7f0}
#operations #operation-expenses .expense-month-kpi-card.approved{
  border-color:#c8def9;
  background:linear-gradient(145deg,#edf6ff,#f8fbff);
}
#operations #operation-expenses .expense-month-kpi-card.pending{
  border-color:#f1ddb7;
  background:linear-gradient(145deg,#fff9eb,#fffdf8);
}
#operations #operation-expenses .expense-month-kpi-card small{
  display:block;
  color:#6e8297;
  font-size:.66rem;
  font-weight:950;
  letter-spacing:.08em;
}
#operations #operation-expenses .expense-month-kpi-card strong{
  display:block;
  margin-top:5px;
  color:#12314d;
  font-size:1.18rem;
  line-height:1.15;
  font-weight:950;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
#operations #operation-expenses .expense-month-kpi-card.approved strong{color:#0878ef}
#operations #operation-expenses .expense-month-kpi-card.pending strong{color:#9a6509}
#operations #operation-expenses .expense-month-kpi-card span{
  display:block;
  margin-top:4px;
  color:#77899c;
  font-size:.72rem;
  font-weight:750;
}
#operations #operation-expenses .expense-month-category{margin-top:13px}
#operations #operation-expenses .expense-month-category-title{
  margin:0 0 7px;
  color:#355872;
  font-size:.76rem;
  font-weight:950;
}
#operations #operation-expenses .expense-month-category-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
#operations #operation-expenses .expense-month-category-card{
  min-width:0;
  padding:10px 11px;
  border:1px solid #dce8f1;
  border-radius:14px;
  background:#fff;
}
#operations #operation-expenses .expense-month-category-card>div:first-child{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
}
#operations #operation-expenses .expense-month-category-card span{
  min-width:0;
  overflow:hidden;
  color:#5f7489;
  font-size:.72rem;
  font-weight:800;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#operations #operation-expenses .expense-month-category-card strong{
  flex:0 0 auto;
  color:#183a55;
  font-size:.75rem;
  font-weight:950;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
#operations #operation-expenses .expense-month-category-progress{
  height:5px;
  margin-top:8px;
  overflow:hidden;
  border-radius:999px;
  background:#edf3f8;
}
#operations #operation-expenses .expense-month-category-progress i{
  display:block;
  width:var(--expense-share,2%);
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#1584f6,#65b5ff);
}
#operations #operation-expenses .expense-month-category-card>small{
  display:block;
  margin-top:5px;
  color:#8998a8;
  font-size:.64rem;
  font-weight:700;
}
@media(max-width:760px){
  #operations #operation-expenses .expense-month-panel-v2{padding:12px;border-radius:18px}
  #operations #operation-expenses .expense-month-panel-v2 .expense-month-head{grid-template-columns:1fr;gap:9px}
  #operations #operation-expenses .expense-month-panel-v2 .expense-month-picker{grid-template-columns:auto minmax(0,1fr);align-items:center;min-width:0;width:100%}
  #operations #operation-expenses .expense-month-panel-v2 .expense-month-picker input{width:100%}
  #operations #operation-expenses .expense-month-kpis-v2{grid-template-columns:1.25fr .9fr;gap:8px}
  #operations #operation-expenses .expense-month-kpis-v2>div,
  #operations #operation-expenses .expense-month-kpis-v2>div:nth-child(3){grid-column:auto;border-top:1px solid #dbe7f0;border-left:1px solid #dbe7f0}
  #operations #operation-expenses .expense-month-kpi-card{padding:11px 10px}
  #operations #operation-expenses .expense-month-kpi-card strong{font-size:1rem}
  #operations #operation-expenses .expense-month-category-grid{grid-template-columns:1fr 1fr;gap:7px}
  #operations #operation-expenses .expense-month-category-card{padding:9px}
}
@media(max-width:360px){
  #operations #operation-expenses .expense-month-kpis-v2{grid-template-columns:1fr}
  #operations #operation-expenses .expense-month-category-grid{grid-template-columns:1fr}
}

/* v4.15.6 v22 — Expense monthly list: clear per-category rows + expandable transactions. */
#operations #operation-expenses .expense-month-category{margin-top:15px}
#operations #operation-expenses .expense-month-category-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin:0 2px 9px;
}
#operations #operation-expenses .expense-month-category-heading>div{min-width:0}
#operations #operation-expenses .expense-month-category-heading strong{
  display:block;
  color:#122f4b;
  font-size:.94rem;
  line-height:1.18;
  font-weight:950;
}
#operations #operation-expenses .expense-month-category-heading span{
  display:block;
  margin-top:3px;
  color:#7c8ea0;
  font-size:.66rem;
  font-weight:700;
}
#operations #operation-expenses .expense-month-category-heading>small{
  flex:0 0 auto;
  color:#6e8195;
  font-size:.7rem;
  font-weight:800;
  white-space:nowrap;
}
#operations #operation-expenses .expense-month-category-list{
  display:grid;
  gap:8px;
}
#operations #operation-expenses details.expense-month-category-item{
  border:1px solid #d9e7f2;
  border-radius:16px;
  background:#fff;
  box-shadow:0 6px 18px rgba(28,67,103,.035);
  overflow:hidden;
}
#operations #operation-expenses .expense-month-category-item>summary{
  display:grid;
  grid-template-columns:44px minmax(0,1fr) auto 18px;
  align-items:center;
  gap:11px;
  min-height:72px;
  padding:10px 12px;
  cursor:pointer;
  list-style:none;
  -webkit-tap-highlight-color:transparent;
}
#operations #operation-expenses .expense-month-category-item>summary::-webkit-details-marker{display:none}
#operations #operation-expenses .expense-month-category-icon{
  display:grid;
  width:44px;
  height:44px;
  place-items:center;
  border-radius:14px;
  background:linear-gradient(145deg,#eef6ff,#dfeeff);
  color:#0878ef;
  font-size:18px;
  font-weight:950;
}
#operations #operation-expenses .expense-month-category-copy{min-width:0}
#operations #operation-expenses .expense-month-category-copy>strong{
  display:block;
  overflow:hidden;
  color:#102d49;
  font-size:.82rem;
  line-height:1.2;
  font-weight:950;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#operations #operation-expenses .expense-month-category-copy>small{
  display:block;
  margin-top:4px;
  overflow:hidden;
  color:#71869a;
  font-size:.66rem;
  line-height:1.2;
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#operations #operation-expenses .expense-month-category-money{
  min-width:112px;
  text-align:right;
}
#operations #operation-expenses .expense-month-category-money>strong{
  display:block;
  color:#102d49;
  font-size:.82rem;
  line-height:1.15;
  font-weight:950;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
#operations #operation-expenses .expense-month-category-money>small{
  display:block;
  margin-top:5px;
  color:#788b9f;
  font-size:.62rem;
  font-weight:750;
  white-space:nowrap;
}
#operations #operation-expenses .expense-month-category-chevron{
  color:#60809a;
  font-size:1.45rem;
  font-weight:800;
  transform-origin:center;
  transition:transform .18s ease;
}
#operations #operation-expenses .expense-month-category-item[open] .expense-month-category-chevron{transform:rotate(90deg)}
#operations #operation-expenses .expense-month-category-item:nth-child(2n) .expense-month-category-icon{
  background:linear-gradient(145deg,#f0edff,#e4e0ff);
  color:#6555dc;
}
#operations #operation-expenses .expense-month-category-item:nth-child(3n) .expense-month-category-icon{
  background:linear-gradient(145deg,#eafaf3,#daf3e7);
  color:#0c9b67;
}
#operations #operation-expenses .expense-month-category-item:nth-child(4n) .expense-month-category-icon{
  background:linear-gradient(145deg,#fff5e9,#ffe8ce);
  color:#d27a11;
}
#operations #operation-expenses .expense-month-category-details{
  padding:0 12px 10px 67px;
  border-top:1px solid #edf3f7;
  background:#fbfdff;
}
#operations #operation-expenses .expense-month-category-detail-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:9px 0;
  border-bottom:1px dashed #dce8f1;
}
#operations #operation-expenses .expense-month-category-detail-row:last-child{border-bottom:0}
#operations #operation-expenses .expense-month-category-detail-row>div{min-width:0}
#operations #operation-expenses .expense-month-category-detail-row strong{
  display:block;
  overflow:hidden;
  color:#29465f;
  font-size:.7rem;
  line-height:1.3;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#operations #operation-expenses .expense-month-category-detail-row small{
  display:block;
  margin-top:3px;
  overflow:hidden;
  color:#8293a4;
  font-size:.62rem;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#operations #operation-expenses .expense-month-category-detail-row>b{
  color:#153550;
  font-size:.7rem;
  font-weight:950;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
@media(max-width:760px){
  #operations #operation-expenses .expense-month-category-heading{align-items:flex-end}
  #operations #operation-expenses .expense-month-category-heading span{display:none}
  #operations #operation-expenses .expense-month-category-item>summary{
    grid-template-columns:40px minmax(0,1fr) auto 14px;
    gap:9px;
    min-height:68px;
    padding:9px 10px;
  }
  #operations #operation-expenses .expense-month-category-icon{width:40px;height:40px;border-radius:13px;font-size:16px}
  #operations #operation-expenses .expense-month-category-copy>strong{font-size:.78rem}
  #operations #operation-expenses .expense-month-category-copy>small{font-size:.61rem}
  #operations #operation-expenses .expense-month-category-money{min-width:102px}
  #operations #operation-expenses .expense-month-category-money>strong{font-size:.76rem}
  #operations #operation-expenses .expense-month-category-money>small{font-size:.58rem}
  #operations #operation-expenses .expense-month-category-details{padding:0 10px 9px 59px}
}
@media(max-width:390px){
  #operations #operation-expenses .expense-month-category-item>summary{grid-template-columns:36px minmax(0,1fr) auto 12px;gap:7px;padding:8px}
  #operations #operation-expenses .expense-month-category-icon{width:36px;height:36px;border-radius:11px;font-size:14px}
  #operations #operation-expenses .expense-month-category-copy>small{display:none}
  #operations #operation-expenses .expense-month-category-money{min-width:94px}
  #operations #operation-expenses .expense-month-category-money>strong{font-size:.72rem}
  #operations #operation-expenses .expense-month-category-money>small{font-size:.55rem}
  #operations #operation-expenses .expense-month-category-details{padding-left:51px}
}


/* V30 — mobile performance/smoothness guardrails */
@media(max-width:980px){
  html{scroll-behavior:auto!important}
  :is(button,a,input,select,textarea,summary,[role="button"]){touch-action:manipulation}
  :is(
    #employee-settlement-list .employee-settlement-card,
    #expense-list .expense-entry-card,
    #staff-tracking-list .staff-tracking-card,
    #team .person-card,
    #operations .stock-ledger-row,
    #staff-receipt-list .staff-receipt-card,
    #audit-list > *,
    #backup-list > *
  ){
    content-visibility:auto;
    contain-intrinsic-size:auto 88px;
  }
  :is(
    body.unified-shell .header,
    body.unified-shell .tabs,
    .dialog-actions,
    .payment-enterprise-actions,
    .debt-detail-actions,
    .expense-enterprise-actions,
    .af-global-dialog-head,
    .af-global-dialog-actions
  ){
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
}

/* V30.8 — new-empty bottle dialog: keep action footer tappable above iOS safe area. */
@media(max-width:760px){
  #new-empty-bottles-dialog.af-global-fullscreen-dialog .af-global-dialog-actions,
  #new-empty-bottles-dialog .dialog-actions{
    pointer-events:auto!important;
    z-index:440!important;
    padding-bottom:max(14px,env(safe-area-inset-bottom,0px))!important;
  }
  #new-empty-bottles-dialog #new-empty-bottles-save{
    min-height:52px!important;
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
  }
}


/* V30.9 — reliable "Thêm vỏ mới" submit feedback inside the top-layer dialog. */
.new-empty-bottles-status{
  min-height:20px;
  margin:-4px 2px 0;
  color:#087a52;
  font-size:.82rem;
  line-height:1.4;
}
.new-empty-bottles-status:empty{display:none}
.new-empty-bottles-status.is-error{
  display:block;
  padding:9px 11px;
  border:1px solid #f2c2c7;
  border-radius:12px;
  background:#fff3f4;
  color:#b4232f;
}
@media(max-width:760px){
  #new-empty-bottles-dialog .dialog-actions{
    pointer-events:auto!important;
    isolation:isolate;
  }
  #new-empty-bottles-dialog #new-empty-bottles-save{
    position:relative;
    z-index:2;
    pointer-events:auto!important;
    -webkit-user-select:none;
    user-select:none;
  }
}

/* V31.6 — Debt header clean: the duplicate report-date chip was removed. */
@media(max-width:640px){body.management-mode #debts .debt-page-head-new{grid-template-columns:minmax(0,1fr)!important}}

/* ========================================================================== 
   AquaFlow V32.7 — UI FINAL POLISH
   Final visual pass after the stability / recovery / payment / notification
   releases.  No business rules are changed here: this layer only normalizes
   typography, mobile spacing, touch targets and viewport behavior.
   ========================================================================== */
body.unified-shell{
  --af-ui-title:24px;
  --af-ui-title-mobile:20px;
  --af-ui-radius:18px;
  --af-ui-control:44px;
}

/* One title rhythm across the main workspace tabs. */
body.unified-shell .view > :is(.page-head,.aquaflow-page-head){
  gap:12px!important;
  margin-bottom:12px!important;
}
body.unified-shell .view > :is(.page-head,.aquaflow-page-head) h2{
  margin:2px 0 0!important;
  color:#102a44!important;
  font-size:var(--af-ui-title)!important;
  line-height:1.14!important;
  letter-spacing:-.45px!important;
  font-weight:900!important;
}
body.unified-shell .view > :is(.page-head,.aquaflow-page-head) small{
  color:#0878ef!important;
  font-size:10px!important;
  line-height:1.2!important;
  letter-spacing:.12em!important;
  font-weight:900!important;
}
body.unified-shell .view > :is(.page-head,.aquaflow-page-head) :is(p,.section-note,.muted){
  margin-top:5px!important;
  color:#74879a!important;
  font-size:12px!important;
  line-height:1.42!important;
}
body.unified-shell .section-head h2{
  color:#15324d!important;
  font-size:19px!important;
  line-height:1.18!important;
  font-weight:900!important;
}

/* Keep interactive focus visible without changing pointer/touch appearance. */
body.unified-shell :is(button,a,summary,[role="button"]):focus-visible,
body.unified-shell :is(input,select,textarea):focus-visible{
  outline:3px solid rgba(8,120,239,.22)!important;
  outline-offset:2px!important;
}
body.unified-shell :is(button,a,summary,[role="button"]){
  -webkit-tap-highlight-color:transparent;
}

/* Local scrolling belongs to data regions, never to the whole page. */
body.unified-shell{
  overflow-x:hidden;
}
body.unified-shell :is(.system-tabs,.period-tabs,.order-filter-tabs,.expense-filter-tabs,.payment-mode-tabs,.payment-method-tabs){
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  overscroll-behavior-inline:contain;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
body.unified-shell :is(.system-tabs,.period-tabs,.order-filter-tabs,.expense-filter-tabs,.payment-mode-tabs,.payment-method-tabs)::-webkit-scrollbar{
  display:none;
}
body.unified-shell :is(.system-tabs,.period-tabs,.order-filter-tabs,.expense-filter-tabs,.payment-mode-tabs,.payment-method-tabs) button{
  white-space:nowrap;
}

@media(max-width:980px){
  /* Compact but readable app chrome. */
  body.unified-shell .shell{
    padding-left:10px!important;
    padding-right:10px!important;
  }
  body.unified-shell .header{
    min-height:66px!important;
    padding:8px 2px!important;
    padding-top:max(8px,env(safe-area-inset-top,0px))!important;
    gap:8px!important;
  }
  body.unified-shell .brand{
    gap:8px!important;
    min-width:0!important;
  }
  body.unified-shell .brand .logo{
    width:40px!important;
    height:40px!important;
    flex:0 0 40px!important;
    border-radius:12px!important;
    font-size:18px!important;
  }
  body.unified-shell .brand h1{
    max-width:48vw!important;
    margin-top:1px!important;
    font-size:16px!important;
    line-height:1.15!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body.unified-shell .brand small{
    font-size:8px!important;
    line-height:1.15!important;
  }
  body.unified-shell .account-button{
    min-height:40px!important;
    max-width:112px!important;
    padding:5px 9px!important;
    border-radius:12px!important;
  }
  body.unified-shell .account-button span{
    max-width:92px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  /* Bottom navigation remains stable while still allowing Admin to swipe. */
  body.unified-shell .tabs{
    scrollbar-width:none!important;
    overscroll-behavior-x:contain!important;
    scroll-padding-inline:8px!important;
    touch-action:pan-x!important;
  }
  body.unified-shell .tabs::-webkit-scrollbar{display:none!important}
  body.unified-shell .tabs .tab{
    min-height:56px!important;
  }
  body.unified-shell .tabs .tab-copy{
    font-size:9.8px!important;
    line-height:1.08!important;
  }
  body.unified-shell .tabs .tab-icon{
    font-size:18px!important;
  }

  body.unified-shell .view{margin-top:7px!important}
  body.unified-shell .view > :is(.page-head,.aquaflow-page-head){
    min-height:0!important;
    padding:7px 1px!important;
    align-items:center!important;
  }
  body.unified-shell .view > :is(.page-head,.aquaflow-page-head) h2{
    font-size:var(--af-ui-title-mobile)!important;
    letter-spacing:-.3px!important;
  }
  body.unified-shell .view > :is(.page-head,.aquaflow-page-head) :is(p,.section-note,.muted){
    font-size:11px!important;
  }
  body.unified-shell .section-head{
    min-height:42px!important;
    margin:14px 1px 8px!important;
  }
  body.unified-shell .section-head h2{font-size:17px!important}

  /* iOS Safari zooms focused controls below 16px. Make this universal so
     Search, date/time, money and dialog fields never enlarge the whole app. */
  body.unified-shell :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
    select,
    textarea
  ){
    font-size:16px!important;
    -webkit-text-size-adjust:100%;
  }
  body.unified-shell :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
    select
  ){
    min-height:var(--af-ui-control);
  }
  body.unified-shell textarea{line-height:1.42!important}

  /* Softer mobile surfaces reduce visual clutter and GPU shadow work. */
  body.unified-shell :is(
    .summary,.finance-card,.operation-card,.admin-handover,.overview-journal,
    .enterprise-control,.company-panel,.staff-settlement,.staff-workflow,
    .aquaflow-order-card,.staff-delivery-compact,.customer-card,.debtor
  ){
    box-shadow:0 4px 16px rgba(21,57,96,.045)!important;
  }

  body.unified-shell .system-tabs{
    gap:6px!important;
    padding-bottom:2px!important;
    scroll-snap-type:x proximity;
  }
  body.unified-shell .system-tabs button{
    min-height:40px!important;
    flex:0 0 auto!important;
    scroll-snap-align:start;
  }
}

@media(max-width:600px){
  /* Normal dialogs use almost all phone width while specialist fullscreen
     dialogs keep their stronger ID-scoped rules. */
  body.unified-shell dialog:not(#internal-chat):not(#chat-message-menu):not(#system-dialog):not(#customer-dialog):not(#customer-history-dialog):not(.af-ux-dialog){
    width:calc(100% - 8px)!important;
    max-width:none!important;
    max-height:calc(100dvh - max(8px,env(safe-area-inset-top,0px)))!important;
    margin:auto!important;
    border-radius:18px!important;
  }
  body.unified-shell dialog:not(#internal-chat):not(#chat-message-menu):not(#system-dialog):not(#customer-dialog):not(#customer-history-dialog):not(.af-ux-dialog) form{
    padding-left:14px!important;
    padding-right:14px!important;
  }
  body.unified-shell .dialog-head{
    align-items:center!important;
    gap:10px!important;
  }
  body.unified-shell .dialog-head h2{
    font-size:19px!important;
    line-height:1.18!important;
  }
  body.unified-shell .icon-btn{
    width:40px!important;
    height:40px!important;
    flex:0 0 40px!important;
  }
  body.unified-shell .dialog-actions{gap:8px!important}
  body.unified-shell .dialog-actions .btn{min-height:46px!important}
}

@media(max-width:370px){
  body.unified-shell .shell{padding-left:8px!important;padding-right:8px!important}
  body.unified-shell .brand h1{max-width:42vw!important;font-size:15px!important}
  body.unified-shell .account-button{max-width:96px!important;padding-inline:7px!important}
  body.unified-shell .account-button span{max-width:78px!important}
  body.unified-shell .tabs .tab-copy{font-size:9.2px!important}
}

/* ========================================================================== 
   AquaFlow V32.9 — DELIVERY QUANTITY + SCROLL STABILITY
   - Bottle / pack quantities are first-class visual data in each delivery row.
   - iOS/mobile delivery rows no longer use content-visibility virtualization;
     Safari can repaint those cards while scrolling and make the list flash.
   ========================================================================== */
#deliveries .staff-delivery-main{
  gap:4px;
}
#deliveries .staff-delivery-quantity-row{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  max-width:100%;
  overflow:hidden;
}
#deliveries .staff-delivery-qty{
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  gap:4px;
  min-height:25px;
  padding:2px 8px 2px 4px;
  border:1px solid #d9eafd;
  border-radius:999px;
  background:#f2f8ff;
  color:#0878ef;
  line-height:1;
  white-space:nowrap;
}
#deliveries .staff-delivery-qty-pack{
  border-color:#dfe8ff;
  background:#f4f7ff;
  color:#356dd9;
}
#deliveries .staff-delivery-qty-icon{
  display:grid;
  width:20px;
  height:20px;
  flex:0 0 20px;
  place-items:center;
  border-radius:7px;
  background:#fff;
  color:currentColor;
}
#deliveries .staff-delivery-qty-icon svg{
  display:block;
  width:17px;
  height:17px;
  fill:currentColor;
}
#deliveries .staff-delivery-qty b{
  color:#086fe2;
  font-size:.76rem;
  font-weight:950;
  font-variant-numeric:tabular-nums;
}
#deliveries .staff-delivery-qty-pack b{color:#2f66cf}
#deliveries .staff-delivery-qty>span:last-child{
  color:#5f7891;
  font-size:.64rem;
  font-weight:800;
}
#deliveries .staff-delivery-main > .staff-delivery-meta{
  display:block;
  overflow:hidden;
  color:#71879a;
  font-size:.64rem;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}

@media(max-width:980px){
  #deliveries .staff-delivery-compact,
  #delivery-list .staff-delivery-compact{
    /* content-visibility:auto caused visible card repaint/flash on iOS Safari. */
    content-visibility:visible!important;
    contain-intrinsic-size:none!important;
    overflow:hidden!important;
    transform:none!important;
    will-change:auto!important;
    backface-visibility:visible!important;
    -webkit-backface-visibility:visible!important;
  }
  #deliveries .staff-delivery-compact > summary{
    min-height:88px!important;
    align-items:center!important;
    padding-top:9px!important;
    padding-bottom:9px!important;
  }
  #deliveries .staff-delivery-main > strong{
    font-size:16px!important;
  }
  #deliveries .staff-delivery-main > .staff-delivery-meta{
    max-width:48vw!important;
    font-size:11.5px!important;
  }
  #deliveries .staff-delivery-qty{
    min-height:26px;
  }
  #deliveries .staff-delivery-qty b{
    font-size:13px;
  }
  #deliveries .staff-delivery-qty>span:last-child{
    font-size:11px;
  }
  #deliveries .staff-delivery-money > strong{
    font-size:15px!important;
    font-variant-numeric:tabular-nums;
  }
  #deliveries .staff-delivery-money > small{
    font-size:11px!important;
  }
}

@media(max-width:430px){
  #deliveries .staff-delivery-compact > summary{
    grid-template-columns:30px minmax(0,1fr) auto 14px!important;
    min-height:86px!important;
    gap:6px!important;
    padding:8px 7px!important;
  }
  #deliveries .staff-delivery-quantity-row{gap:4px}
  #deliveries .staff-delivery-qty{
    gap:3px;
    min-height:24px;
    padding:1px 6px 1px 3px;
  }
  #deliveries .staff-delivery-qty-icon{
    width:18px;
    height:18px;
    flex-basis:18px;
    border-radius:6px;
  }
  #deliveries .staff-delivery-qty-icon svg{width:15px;height:15px}
  #deliveries .staff-delivery-qty b{font-size:12px}
  #deliveries .staff-delivery-qty>span:last-child{font-size:10px}
  #deliveries .staff-delivery-main > .staff-delivery-meta{
    max-width:45vw!important;
    font-size:10.5px!important;
  }
  #deliveries .staff-delivery-money > strong{font-size:13.5px!important}
  #deliveries .staff-delivery-money > small{font-size:10px!important}
}

@media(max-width:365px){
  #deliveries .staff-delivery-qty{padding-right:5px}
  #deliveries .staff-delivery-qty-icon{width:17px;height:17px;flex-basis:17px}
  #deliveries .staff-delivery-qty-icon svg{width:14px;height:14px}
  #deliveries .staff-delivery-qty b{font-size:11.5px}
  #deliveries .staff-delivery-qty>span:last-child{font-size:9.5px}
  #deliveries .staff-delivery-main > .staff-delivery-meta{max-width:42vw!important}
}
/* V34.2.3 recovery check state */
.recovery-row-status{padding:8px 10px;border-radius:10px;background:#eef6ff;color:#185ea8;font-weight:700}
.recovery-row-status.pending{background:#fff7e8;color:#9a5b00}
.recovery-row-status.error{background:#fff0f1;color:#b4232f}
.recovery-row-status.checking{background:#eef6ff;color:#0b66d8}

/* V34.2.4 — Driver create-order permission */
.employee-order-create-row.is-disabled { opacity: .55; }
.employee-order-create-badge { display:inline-flex; align-items:center; margin-top:5px; padding:3px 8px; border-radius:999px; font-size:11px; font-weight:800; line-height:1.2; }
.employee-order-create-badge.on { color:#087a55; background:#e9fbf4; border:1px solid #b7ecd9; }
.employee-order-create-badge.off { color:#66788a; background:#f2f6f9; border:1px solid #dbe5ec; }
.staff-price-locked { background:#f4f7fa !important; color:#516579 !important; }
body.staff-mode .order-create-action { min-height:42px; padding-inline:14px; white-space:nowrap; }

/* V34.2.145 — physical collection of customer empties, separate from sales */
.staff-command-empty{background:linear-gradient(135deg,#e9f7f2,#f8fdfb)!important;border-color:#b9e6d2!important}
.staff-command-empty strong{color:#086b51}
.af-customer-toolbar{flex-wrap:wrap}
.af-customer-empty-dialog{width:min(510px,calc(100vw - 20px));max-width:calc(100vw - 20px);max-height:calc(100dvh - 24px)}
.af-customer-empty-dialog .af-standard-body{overflow-y:auto;overscroll-behavior:contain}
.af-customer-empty-dialog select,.af-customer-empty-dialog input{font-size:16px;max-width:100%}
.af-customer-empty-dialog .customer-empty-info{padding:9px 12px;margin:0 0 9px;border-radius:10px;background:#eff7fd;font-size:13px;color:#225776;line-height:1.55}
.af-customer-empty-dialog .customer-empty-history{padding:9px 0;border-top:1px solid #e2eaf0}
.af-customer-empty-dialog .customer-empty-history summary{cursor:pointer;font-weight:750}
.af-customer-empty-dialog .customer-empty-history-row{display:flex;align-items:start;gap:10px;flex-wrap:wrap;padding:11px 0;border-bottom:1px solid #e2eaf0}
.af-customer-empty-dialog .customer-empty-history-row>div{flex:1 1 180px;min-width:0}
.af-customer-empty-dialog .customer-empty-history-row small{display:block;font-size:12px;color:#64748b;margin-top:2px}
.af-customer-empty-dialog .customer-empty-history-row p{margin:4px 0;overflow-wrap:anywhere}
.af-customer-empty-dialog .dialog-actions{position:sticky;bottom:0;background:#fff;z-index:1}