/* nút */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:var(--tap);min-width:var(--tap);padding:0 var(--s4);border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font:inherit;font-weight:600;cursor:pointer;transition:background var(--t),border-color var(--t),transform var(--t);-webkit-tap-highlight-color:transparent}
.btn:hover{background:var(--surface-2)} .btn:active{transform:translateY(1px)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)} .btn.primary:hover{background:var(--accent-hover)}
.btn.danger{background:var(--surface);border-color:var(--err);color:var(--err)} .btn.danger:hover{background:var(--err-bg)} .dialog .btn.danger,dialog .btn.danger{background:var(--err-solid);border-color:var(--err-solid);color:#fff} .btn.ghost{background:transparent;border-color:transparent}
.btn[disabled],.btn[aria-disabled="true"],.btn[aria-busy="true"]{opacity:.6;cursor:not-allowed;pointer-events:none}
.btn .spin{width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.btn .spin{animation-duration:2s}}
/* biểu mẫu */
.field{display:block;margin-bottom:var(--s4)} .field>.lbl{display:block;font-weight:600;margin-bottom:var(--s1)} .field .hint{font-size:var(--fs-sm);color:var(--soft);margin-top:var(--s1)}
.input,select.input,textarea.input{width:100%;min-height:var(--tap);padding:var(--s2) var(--s3);border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font:inherit;font-size:max(16px,1rem)}
.input:focus{border-color:var(--focus)} .field.has-err .input{border-color:var(--err)} .field .err{display:block;color:var(--err);font-size:var(--fs-sm);margin-top:var(--s1)}
/* thẻ, huy hiệu, chip */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:var(--s4);box-shadow:var(--sh1)}
.badge{display:inline-flex;align-items:center;gap:var(--s1);padding:2px var(--s2);border-radius:999px;font-size:var(--fs-sm);font-weight:600;background:var(--surface-2);color:var(--soft)}
.badge.ok{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)} .badge.warn{background:var(--warn-bg);color:var(--warn)} .badge.err{background:var(--err-bg);color:var(--err)} .badge.info{background:var(--warn-bg);color:var(--warn)} .badge.todo{background:var(--accent-weak);color:var(--accent)}
.chip{display:inline-flex;align-items:center;gap:var(--s2);min-height:36px;padding:0 var(--s3);border-radius:999px;border:1px solid var(--line);background:var(--surface);font-size:var(--fs-sm);font-weight:600;color:var(--ink);cursor:default}
button.chip{cursor:pointer;min-height:var(--tap)} .chip .dot{width:10px;height:10px;border-radius:50%;background:var(--faint)}
.chip.ok .dot{background:var(--ok)} .chip.warn .dot{background:var(--warn)} .chip.err .dot{background:var(--err)}
/* thông báo trong ngữ cảnh */
.banner{display:flex;gap:var(--s3);align-items:flex-start;padding:var(--s3) var(--s4);border-radius:var(--r-sm);border:1px solid var(--line);background:var(--surface-2)}
.banner.warn{background:var(--warn-bg);border-color:var(--warn);color:var(--ink)} .banner.err{background:var(--err-bg);border-color:var(--err)} .banner.ok{background:var(--ok-bg);border-color:var(--ok)} .banner.info{background:var(--info-bg);border-color:var(--info)}
/* toast */
#toasts{position:fixed;left:var(--gutter);right:var(--gutter);bottom:calc(var(--nav-h) + var(--s3) + env(safe-area-inset-bottom));z-index:90;display:flex;flex-direction:column;gap:var(--s2);align-items:center;pointer-events:none}
@media (min-width:1024px) and (hover:hover) and (pointer:fine){#toasts{bottom:var(--s5);left:auto;right:var(--s5);align-items:flex-end}}
.toast{pointer-events:auto;max-width:480px;width:100%;padding:var(--s3) var(--s4);border-radius:var(--r-sm);background:var(--ink);color:var(--bg);box-shadow:var(--sh2);display:flex;gap:var(--s3);align-items:center}
.toast.ok{border-left:6px solid var(--ok)} .toast.warn{border-left:6px solid var(--warn)} .toast.err{border-left:6px solid var(--err)}
/* hộp thoại: ngăn trượt từ dưới trên điện thoại, giữa màn hình trên PC */
.scrim{position:fixed;inset:0;background:rgba(10,14,16,.55);z-index:80;display:flex;align-items:flex-end;justify-content:center}
.dialog{background:var(--surface);color:var(--ink);width:100%;max-height:92dvh;overflow:auto;border-radius:var(--r-lg) var(--r-lg) 0 0;padding:var(--s4) var(--gutter) calc(var(--s4) + env(safe-area-inset-bottom));box-shadow:var(--sh2)}
.dialog .actions{display:flex;gap:var(--s3);justify-content:flex-end;flex-wrap:wrap;margin-top:var(--s4)}
@media (min-width:600px){.scrim{align-items:center}.dialog{width:min(520px,92vw);border-radius:var(--r-lg);padding-bottom:var(--s4)}}
/* skeleton */
.skel{background:linear-gradient(90deg,var(--surface-2),var(--line),var(--surface-2));background-size:200% 100%;animation:sh 1.2s linear infinite;border-radius:var(--r-sm);min-height:1em}
@keyframes sh{to{background-position:-200% 0}} @media (prefers-reduced-motion:reduce){.skel{animation:none}}
.empty{text-align:center;padding:var(--s7) var(--s4);color:var(--soft)}

/* K7: ô nhập giữ nền biểu mẫu khi focus; ô ngày hiển thị đúng màu ở chế độ tối */
.input:focus{background:var(--surface);color:var(--ink)} input[type=date].input{color-scheme:light dark;-webkit-appearance:none;appearance:none;background:var(--surface);color:var(--ink)}
/* ô chọn có tìm kiếm nâng cao (combo.js) */
.combo{position:relative} .combo-list{position:absolute;left:0;right:0;top:100%;z-index:60;max-height:320px;overflow:auto;margin:2px 0 0;padding:0;list-style:none;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:0 8px 24px rgba(0,0,0,.16)}
.combo-list li[role=option]{padding:var(--s2) var(--s3);min-height:var(--tap);display:flex;flex-wrap:wrap;gap:0 var(--s2);align-items:center;cursor:pointer;border-top:1px solid var(--line)} .combo-list li[role=option]:first-child{border-top:0}
.combo-list li[aria-selected="true"]{background:var(--accent-weak)} .combo-n{padding:var(--s2) var(--s3);color:var(--soft);font-size:var(--fs-sm)} .combo mark{background:var(--warn-bg);color:inherit;border-radius:2px;padding:0 1px}
/* ===== tinh chỉnh thứ bậc & mật độ (nhập liệu dài giờ): nhãn nhẹ hơn giá trị ===== */
.field>.lbl{font-size:var(--fs-sm);font-weight:600;color:var(--soft);margin-bottom:var(--s1);letter-spacing:.01em}
.field.has-err>.lbl{color:var(--err)}
.input::placeholder{color:var(--faint)}
.input:hover:not([readonly]):not(:disabled){border-color:var(--faint)}
.input:focus,.input:focus-visible{outline:0;box-shadow:0 0 0 1px var(--focus)}
.input[readonly],.input:disabled{background:var(--surface-2);color:var(--soft)}
@media (min-width:1024px) and (pointer:fine){:root{--tap:40px} .main h2{font-size:1.125rem}}
input.input,select.input{height:var(--tap)}

/* ===== lịch chọn ngày (datepick.js) ===== */
.dp{display:flex;flex-direction:column;gap:var(--s2)} .dp-nav{display:flex;align-items:center;justify-content:space-between;gap:var(--s1)} .dp-title{flex:1;text-align:center}
.dp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px} .dp-wd{text-align:center;color:var(--soft);font-size:var(--fs-sm);font-weight:600;padding:4px 0}
.dp-d{min-height:var(--tap);border:1px solid transparent;background:transparent;color:var(--ink);border-radius:var(--r-sm);cursor:pointer;font:inherit} .dp-d:hover:not(:disabled){background:var(--surface-2)} .dp-d.out{color:var(--faint)} .dp-d.today{border-color:var(--accent)} .dp-d.on{background:var(--accent);color:#fff} .dp-d:disabled{opacity:.35;cursor:not-allowed}
.dialog.dp-dlg{width:min(360px,96vw);resize:both}
.combo-add{margin-left:var(--s2);min-height:32px;padding:0 var(--s3)}

/* ngăn / nút lọc đang chọn: nền nhạt + viền, KHÔNG dùng màu đặc của nút hành động (.btn.primary) */
.btn.primary[aria-selected="true"],.btn.primary[aria-pressed="true"],.btn.primary[aria-current]{background:var(--accent-weak);border-color:var(--accent);color:var(--accent);font-weight:700} .btn.primary[aria-selected="true"]:hover,.btn.primary[aria-pressed="true"]:hover,.btn.primary[aria-current]:hover{background:var(--accent-weak)}

/* Nút lệnh đã mở: đang xử lý = nền vàng nhạt; đã xong = nền xanh nhạt (không chỉ dựa vào màu: chữ nút đã ghi trạng thái) */
.btn.cmd-open.is-open{background:var(--warn-bg);border-color:var(--warn);color:var(--ink)}
.btn.cmd-open.is-done{background:var(--ok-bg);border-color:var(--ok);color:var(--ink)}

/* danh sách thả dạng bảng (combo có heads): mỗi cột một ô */

/* ===== bảng chọn kiểu A-Tools (combo.js) ===== */
.atp{position:fixed;z-index:400;box-sizing:border-box;background:#fff;color:#111;border:1px solid #7a7a7a;box-shadow:2px 3px 8px rgba(0,0,0,.35);font:12px/1.25 Tahoma,"Segoe UI",Arial,sans-serif;display:flex;flex-direction:column}
.atp[hidden]{display:none}
.atp-body{overflow:auto;background:#fff}
.atp-h,.atp-r{display:grid;grid-template-columns:var(--cg);min-width:0}
.atp-h{position:sticky;top:0;background:#e9e9e9;border-bottom:1px solid #a9a9a9;font-weight:400}
.atp-h span,.atp-r span{padding:2px 4px;border-right:1px solid #d4d4d4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.atp-r{cursor:default;border-bottom:1px solid #eee} .atp-r[aria-selected="true"]{background:#cde6f7}
.atp-no{padding:6px 8px;color:#555}
.atp-bar{display:flex;gap:2px;padding:2px;background:#f0f0f0;border-top:1px solid #a9a9a9}
.atp-sel{flex:1;min-width:0;font:inherit;height:20px;padding:0 2px;border:1px solid #8e8e8e;background:#fff}
.atp-st{display:flex;align-items:center;height:18px;padding:0 6px;background:#3fa34d;color:#fff;font-size:11px}
.atp-n{min-width:24px} .atp-c{flex:1;text-align:center}
@media (pointer:coarse){.atp{font-size:14px}.atp-r span,.atp-h span{padding:8px 6px}.atp-sel{height:32px}.atp-st{height:24px}}
.atp-h span{position:relative}.atp-rz{position:absolute;top:0;right:-3px;width:8px;height:100%;cursor:col-resize;z-index:2;touch-action:none}.atp-rz:hover{background:rgba(0,0,0,.15)}

/* Biểu mẫu Đề nghị xuất hóa đơn */
.dialog.dlg-wide{width:100%} @media (min-width:600px){.dialog.dlg-wide{width:min(860px,96vw)}}
.dxh-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3);padding:var(--s3);background:var(--bg,#f6f7f8);border:1px solid var(--line);border-radius:var(--r)}
.dxh-kv .lbl{display:block;font-size:var(--fs-sm);color:var(--soft);margin-bottom:2px} .dxh-kv strong{overflow-wrap:anywhere}
@media (min-width:700px){.dxh-meta{grid-template-columns:repeat(4,minmax(0,1fr))}}
.dxh-h{font-weight:700;margin-bottom:var(--s2)} .dxh-sec{display:block}
.dxh-form-tbl th.num,.dxh-form-tbl td.num{text-align:right} .dxh-form-tbl td .input{min-width:7rem;text-align:right}
.dxh-form-tbl tfoot td{font-weight:600;border-top:1px solid var(--line)} .dxh-form-tbl tfoot td:first-child{text-align:right} .dxh-form-tbl .dxh-all td{font-size:1.05em}
@media (max-width:699px){.dxh-form-tbl thead{display:none} .dxh-form-tbl,.dxh-form-tbl tbody,.dxh-form-tbl tr,.dxh-form-tbl td{display:block;width:100%}
 .dxh-form-tbl tbody tr{padding:var(--s2) 0;border-bottom:1px solid var(--line)} .dxh-form-tbl tbody td{border:0;display:flex;justify-content:space-between;align-items:center;gap:var(--s3);padding:var(--s1) var(--s3)}
 .dxh-form-tbl tbody td::before{content:attr(data-label);color:var(--soft);font-size:var(--fs-sm)} .dxh-form-tbl tbody td.dxh-it{display:block} .dxh-form-tbl tbody td.dxh-it::before{content:none}
 .dxh-form-tbl tfoot tr{display:flex;justify-content:space-between;padding:var(--s2) var(--s3)} .dxh-form-tbl tfoot td{display:inline;border:0;padding:0} .dxh-form-tbl tfoot td[colspan]{flex:1;text-align:left}}

.dxh-buyer{grid-template-columns:repeat(2,minmax(0,1fr))} .dxh-buyer .w2{grid-column:1/-1}
@media (min-width:700px){.dxh-buyer{grid-template-columns:repeat(3,minmax(0,1fr))} .dxh-buyer .w2{grid-column:span 3}}
/* v5.138 ô chọn nâng cao: chọn nhiều, ghim, hiện thêm, sắp xếp, tấm trượt trên điện thoại */
.atp-ck{display:flex;align-items:center;justify-content:center;padding:0 !important;cursor:pointer} .atp-cb{width:12px;height:12px;border:1px solid #6b6b6b;background:#fff;display:inline-block;border-radius:2px;position:relative}
.atp-cb.on{background:#1d6fb8;border-color:#1d6fb8} .atp-cb.on::after{content:"";position:absolute;left:3px;top:0;width:3px;height:7px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.atp-r.is-sel{background:#e3f1d9} .atp-r.is-sel[aria-selected="true"]{background:#cde6f7}
.atp-pin{cursor:pointer;color:#9a9a9a;margin-right:3px;font-weight:400} .atp-pin.on{color:#c58a00}
.atp-more{padding:5px 8px;color:#1d6fb8;cursor:pointer;text-align:center;background:#f7f7f7;border-top:1px solid #e1e1e1}
.atp-h span{cursor:pointer} .atp-h .atp-sorted{font-weight:700}
.atp-add{border:0;background:#fff;color:#1a6a2a;font:inherit;font-weight:700;padding:0 8px;height:100%;cursor:pointer;margin-left:6px;border-radius:2px}
.atp-sheet{border-radius:12px 12px 0 0;box-shadow:0 -4px 16px rgba(0,0,0,.3)}
@media (pointer:coarse){.atp-cb{width:22px;height:22px}.atp-cb.on::after{left:7px;top:2px;width:5px;height:11px}.atp-add{padding:0 12px;font-size:14px}.atp-more{padding:12px 8px;font-size:14px}.atp-r span{min-height:44px}}
.od-multi{flex:1 1 100%;width:100%;margin-top:var(--s2)}
/* v5.142: chọn hàng toàn màn hình trên điện thoại (combo.js openFS) */
html.atp-lock,html.atp-lock body{overflow:hidden}
.atp-fs{position:fixed;left:0;right:0;z-index:600;display:flex;flex-direction:column;background:var(--surface,#fff);color:var(--ink,#111);font-size:16px;overscroll-behavior:contain}
.atp-fs-top{display:flex;align-items:center;gap:8px;padding:6px 8px;padding-top:max(6px,env(safe-area-inset-top));border-bottom:1px solid var(--line,#ddd);min-height:52px}
.atp-fs-back{width:48px;height:48px;border:0;background:transparent;color:inherit;font-size:34px;line-height:1;border-radius:12px;cursor:pointer;flex:none}
.atp-fs-title{flex:1;min-width:0;font-weight:700;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.atp-fs-mode{flex:none;min-height:44px;padding:0 14px;border:1.5px solid var(--accent,#1d6fb8);background:transparent;color:var(--accent,#1d6fb8);font:inherit;font-weight:700;font-size:15px;border-radius:22px;cursor:pointer}
.atp-fs-mode[aria-pressed="true"]{background:var(--accent,#1d6fb8);color:#fff}
.atp-fs-search{position:relative;padding:10px 12px}
.atp-fs-q{width:100%;box-sizing:border-box;height:52px;padding:0 48px 0 16px;font:inherit;font-size:18px;border:2px solid var(--accent,#1d6fb8);border-radius:14px;background:var(--surface,#fff);color:inherit;-webkit-appearance:none;appearance:none}
.atp-fs-q::-webkit-search-cancel-button{display:none}
.atp-fs-x{position:absolute;right:16px;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;background:transparent;color:var(--soft,#666);font-size:28px;cursor:pointer}
.atp-fs-info{padding:0 16px 6px;color:var(--soft,#666);font-size:13px}
.atp-fs-list{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:0 10px 12px}
.atp-fs-r{display:flex;align-items:center;gap:12px;min-height:64px;padding:10px 12px;margin-bottom:8px;border:1px solid var(--line,#ddd);border-radius:14px;background:var(--surface,#fff);cursor:pointer;-webkit-tap-highlight-color:transparent}
.atp-fs-r:active{background:var(--surface-2,#eef4fa)}
.atp-fs-r.is-sel{border-color:var(--accent,#1d6fb8);background:var(--surface-2,#eaf3fb)}
.atp-fs-tx{flex:1;min-width:0}
.atp-fs-t1{font-weight:700;font-size:16px;overflow-wrap:anywhere}
.atp-fs-t2{font-size:15px;overflow-wrap:anywhere;margin-top:2px}
.atp-fs-t3{font-size:13px;color:var(--soft,#666);overflow-wrap:anywhere;margin-top:2px}
.atp-fs-ck{flex:none;width:28px;height:28px;border:2px solid var(--soft,#888);border-radius:50%;position:relative;box-sizing:border-box}
.atp-fs-ck.on{background:var(--accent,#1d6fb8);border-color:var(--accent,#1d6fb8)}
.atp-fs-ck.on::after{content:"";position:absolute;left:8px;top:3px;width:6px;height:12px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}
.atp-fs-pin{flex:none;width:44px;height:44px;border:0;background:transparent;color:var(--soft,#999);font-size:24px;cursor:pointer}
.atp-fs-pin.on{color:#c58a00}
.atp-fs-more{display:block;width:100%;min-height:52px;margin:4px 0;border:1.5px dashed var(--accent,#1d6fb8);background:transparent;color:var(--accent,#1d6fb8);font:inherit;font-weight:700;border-radius:14px;cursor:pointer}
.atp-fs-none{padding:24px 12px;text-align:center;color:var(--soft,#666)}
.atp-fs-none .btn{margin-top:12px;min-height:48px}
.atp-fs-add{flex:none;margin:8px 12px;margin-bottom:max(12px,env(safe-area-inset-bottom));min-height:56px;border:0;border-radius:14px;background:var(--accent,#1d6fb8);color:#fff;font:inherit;font-size:18px;font-weight:700;cursor:pointer}
.atp-fs-add[hidden]{display:none}
/* v5.143: khối Đóng gói thêm (dgoi.js) — cột chính, lựa chọn dạng thẻ, mỗi mã túi một thẻ */
.dg-box{gap:var(--s3)}
.dg-head h2{margin:0}
.dg-help{margin:0}
.dg-choice{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}
.dg-opt{position:relative;display:flex;align-items:center;gap:12px;min-height:64px;padding:10px 14px;border:2px solid var(--line,#ddd);border-radius:14px;cursor:pointer;background:var(--surface,#fff)}
.dg-opt.is-on{border-color:var(--accent,#1d6fb8);background:var(--surface-2,#eaf3fb)}
.dg-opt.is-off{cursor:default;opacity:.85}
.dg-radio{position:absolute;opacity:0;width:1px;height:1px}
.dg-radio:focus-visible+.dg-dot{outline:1.5px solid var(--accent,#1d6fb8);outline-offset:2px}
.dg-dot{flex:none;width:24px;height:24px;border:2px solid var(--soft,#888);border-radius:50%;box-sizing:border-box;position:relative}
.dg-opt.is-on .dg-dot{border-color:var(--accent,#1d6fb8)}
.dg-opt.is-on .dg-dot::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--accent,#1d6fb8)}
.dg-tx{display:flex;flex-direction:column;min-width:0}.dg-tx small{color:var(--soft,#666);font-size:var(--fs-sm,.85rem)}
.dg-lines{display:grid;gap:var(--s2)}
.dg-line{border:1px solid var(--line,#ddd);border-radius:14px;padding:12px;display:grid;gap:10px;background:var(--surface,#fff)}
.dg-ln-h{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline}.dg-ln-n{flex:1;min-width:0;overflow-wrap:anywhere}.dg-ln-q{color:var(--soft,#666);font-size:var(--fs-sm,.85rem)}
.dg-ln-b{display:grid;grid-template-columns:minmax(120px,200px) minmax(0,1fr);gap:var(--s3)}
.dg-f{display:grid;gap:4px;align-content:start}.dg-f>span{font-size:var(--fs-sm,.85rem);color:var(--soft,#666)}
.dg-f .input,.dg-f .combo{width:100%;box-sizing:border-box;min-height:44px}
.dg-need{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;padding:8px 10px;border-radius:10px;background:var(--surface-2,#f2f6fa);font-size:var(--fs-sm,.9rem)}
.dg-need b{color:var(--accent,#1d6fb8)}
.dg-actions{display:flex;justify-content:flex-end}.dg-actions .btn{min-height:48px;padding-inline:24px}
.dg-link{gap:6px}
@media (max-width:640px){.dg-choice{grid-template-columns:1fr}.dg-ln-b{grid-template-columns:1fr}.dg-actions .btn{width:100%}}
/* v5.145 — bảng chọn điện thoại: chip gợi ý, nút thêm mới, ghi chú ngữ cảnh */
.atp-fs-chips{display:flex;gap:8px;padding:0 12px 6px} .atp-fs-chip{min-height:40px;padding:0 14px;border-radius:20px;border:1px solid var(--line,#ccd);background:var(--card,#fff);font-size:14px} .atp-fs-chip.on{background:var(--primary,#0b5fff);border-color:var(--primary,#0b5fff);color:#fff}
.atp-fs-miss{margin:0 12px 6px;min-height:44px;border:1px dashed var(--line,#99a);background:none;border-radius:10px;font-size:15px;color:var(--link,#0a58ca)} .atp-fs-miss[hidden]{display:none}
.atp-fs-t4{font-size:13px;color:var(--soft,#666);margin-top:3px} .atp-fs-t4.hot{color:var(--ok,#0a7a3d)}
/* v5.146 — quét mã */
.atp-fs-search{display:flex;gap:8px;align-items:center} .atp-fs-search .atp-fs-q{flex:1 1 auto;min-width:0} .atp-fs-scan{flex:0 0 auto;min-height:48px;padding:0 14px;border-radius:10px;border:1px solid var(--primary,#0b5fff);background:var(--card,#fff);color:var(--primary,#0b5fff);font-weight:700;font-size:15px}
.scn{position:fixed;inset:0;z-index:2000;background:#0b0f14;color:#fff;display:flex;flex-direction:column;overflow:hidden}
.scn-top{display:flex;align-items:center;gap:8px;padding:8px 10px;padding-top:calc(8px + env(safe-area-inset-top,0px))} .scn-title{flex:1;font-weight:700;font-size:1.05rem} .scn-back{min-width:44px;min-height:44px;background:none;border:0;color:#fff;font-size:28px} .scn-torch{min-height:44px;background:#1f2933;color:#fff;border-color:#3b4754} .scn-torch[aria-pressed=true]{background:#f5b301;color:#000}
.scn-cam{position:relative;flex:0 0 38vh;min-height:220px;background:#000;overflow:hidden} .scn-v{width:100%;height:100%;object-fit:cover}
.scn-frame{position:absolute;inset:14% 18%;border:3px solid rgba(255,255,255,.85);border-radius:16px;box-shadow:0 0 0 9999px rgba(0,0,0,.35);pointer-events:none}
.scn-st{padding:10px 14px;font-size:15px;color:#d8e0e8;min-height:44px} .scn-st.ok{color:#6ee7a0;font-weight:700} .scn-st.err{color:#ff9b9b;font-weight:700}
.scn-in{display:flex;gap:8px;padding:0 12px 8px} .scn-man{flex:1;min-width:0;min-height:48px}
.scn-panel{flex:1;overflow:auto;padding:0 12px calc(12px + env(safe-area-inset-bottom,0px));background:var(--bg,#f6f7f9);color:var(--ink,#111)} .scn-panel:empty{display:none}
.scn-list{display:flex;flex-direction:column;gap:8px;padding-top:10px} .scn-it{display:flex;align-items:center;gap:10px;background:var(--card,#fff);border:1px solid var(--line,#dde);border-radius:10px;padding:8px 10px} .scn-itx{flex:1;min-width:0} .scn-n{font-weight:700;font-size:1.1rem} .scn-ok{min-height:52px;font-size:1.05rem;position:sticky;bottom:0}
.scn-cnt{display:flex;flex-direction:column;gap:10px;padding-top:12px} .scn-cnt .input{min-height:56px;font-size:1.25rem;text-align:right}
/* v5.148 bảng chọn: góc kéo co giãn + cột đang chọn */
.atp-grip{position:absolute;right:0;bottom:0;width:16px;height:16px;cursor:nwse-resize;touch-action:none;z-index:3;background:linear-gradient(135deg,transparent 0 45%,rgba(255,255,255,.95) 45% 52%,transparent 52% 64%,rgba(255,255,255,.95) 64% 71%,transparent 71% 83%,rgba(255,255,255,.95) 83% 90%,transparent 90%)}
.atp-grip:hover{background-color:rgba(0,0,0,.15)} .atp-sheet .atp-grip{display:none}
.atp-st{padding-right:20px}
.atp-h span.atp-ac{background:#cfe2f3;font-weight:700} .atp-r span.atp-ac{background:rgba(29,111,184,.09);font-weight:600}
/* v5.149 bảng chọn: tô chữ khớp, 2 tầng khi hẹp, khung xem trước, gợi ý 1 kết quả */
.atp-hl{background:#ffe38a;color:inherit;padding:0;border-radius:2px}
.atp-sub{display:none}
.atp-two .atp-h{display:none}
.atp-two .atp-r{display:block;padding:3px 6px}
.atp-two .atp-r>span{display:none}
.atp-two .atp-r>span.atp-m{display:block;font-weight:600;padding:0;border:0}
.atp-two .atp-r>span.atp-sub{display:block !important;padding:0;border:0;color:#555;font-size:.92em;font-weight:400;background:none}
.atp-two .atp-r>span.atp-m .atp-pin{display:none}
.atp-c.one{font-weight:700}

/* ===== B110: ô nhập kiểu biểu mẫu nghiệp vụ — nhãn trên ô, viền mỏng, bo nhỏ, nền trắng, viền xanh thương hiệu khi chọn ===== */
.field>.lbl{font-size:.9375rem;font-weight:500;color:var(--ink);letter-spacing:0;margin-bottom:6px}
.input,select.input,textarea.input{border-radius:6px;border-color:var(--line);background:var(--surface);padding:var(--s2) 12px}
.input:focus,.input:focus-visible{border-color:var(--accent);box-shadow:none;outline:0}
.input[readonly],.input:disabled{background:var(--surface);color:var(--ink)} .input:disabled{color:var(--faint)}
.input::placeholder{color:var(--faint);opacity:.8}
.combo-list{border-radius:6px}
@media (min-width:1024px) and (pointer:fine){:root{--tap:38px}}

/* B111: khối biểu mẫu nền xám nhạt (ô nhập trắng nổi trên nền); ô chọn có mũi tên ▾ gắn trong ô */
.card:has(.field){background:var(--surface-2)}
.combo>input.input[role=combobox]{padding-right:34px}
.combo::after{content:"";position:absolute;right:12px;top:0;height:var(--tap);width:8px;pointer-events:none;background:no-repeat center/8px 5px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath d='M0 0l4 5 4-5z' fill='%236b7480'/%3E%3C/svg%3E")}
/* v5.216 ô chọn Mã + Tên tách riêng, liên kết */
.combo-pair{display:grid;grid-template-columns:minmax(84px,.45fr) minmax(0,1fr);gap:6px;min-width:0}
.combo-pair>.combo{min-width:0}
/* đóng gói thêm: thông tin tồn liên quan */
.dg-stk{display:grid;gap:4px;font-size:var(--fs-sm,.9rem);color:var(--soft)}
.dg-stk-i{overflow-wrap:anywhere}.dg-stk-i b{color:var(--ink)}.dg-stk-i.bad{color:var(--err)}.dg-stk-i.bad b{color:var(--err)}

/* ===== droplist chung (droplist.js, v5.236): select.input dùng danh sách thống nhất ===== */
select.input:not([multiple]):not([data-native]){-webkit-appearance:none;appearance:none;padding-right:30px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath d='M0 0l4 5 4-5z' fill='%236b7480'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:8px 5px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
select.input:disabled{cursor:not-allowed;opacity:.6}
select.input[aria-expanded="true"]{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-weak)}
.dl{position:fixed;inset:0;z-index:700;pointer-events:none}
.dl-box{position:fixed;pointer-events:auto;display:flex;flex-direction:column;box-sizing:border-box;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh2);overflow:hidden;animation:dl-in 130ms ease-out;transform-origin:top center}
.dl-q{border:0;border-bottom:1px solid var(--line);border-radius:0;min-height:44px;box-shadow:none;flex:none}
.dl-list{min-height:0;overflow:auto;overscroll-behavior:contain;outline:0;min-width:0}
.dl-o{display:flex;align-items:center;gap:8px;min-height:44px;padding:6px 14px;cursor:pointer;border-top:1px solid transparent;position:relative}
.dl-o:first-child{border-top:0}
.dl-o.act{background:var(--accent-weak)}
.dl-o.cur{font-weight:700}
.dl-o.dis{opacity:.45;cursor:not-allowed}
.dl-t{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
.dl-ck{flex:none;margin-left:auto;color:var(--accent);font-weight:800;visibility:hidden}
.dl-o.cur .dl-ck{visibility:visible}
.dl-none{padding:14px;color:var(--soft);overflow-wrap:anywhere}
.dl-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.dl-top{display:flex;align-items:center;gap:8px;padding:10px 8px 10px 16px;border-bottom:1px solid var(--line);flex:none}
.dl-title{flex:1;min-width:0;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dl-x{flex:none;width:44px;height:44px;border:0;border-radius:50%;background:var(--surface-2);color:var(--soft);font-size:22px;line-height:1;cursor:pointer}
.dl-sheet{pointer-events:auto;background:rgba(10,14,16,.5);display:flex;align-items:flex-end;justify-content:center;animation:dl-fade 130ms ease-out}
.dl-sheet .dl-box{position:relative;left:auto;top:auto;width:100%;max-width:none!important;min-width:0!important;border-radius:16px 16px 0 0;border-bottom:0;padding-bottom:env(safe-area-inset-bottom);animation:dl-up 160ms ease-out;transform-origin:bottom center}
.dl-sheet .dl-list{max-height:none!important;flex:1 1 auto}
.dl-sheet .dl-o{min-height:48px;padding:8px 16px;font-size:1.0625rem}
html.dl-lock,html.dl-lock body{overflow:hidden}
@keyframes dl-in{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
@keyframes dl-up{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
@keyframes dl-fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.dl-box,.dl-sheet,.dl-sheet .dl-box{animation:none}}

/* ===== combo v5.236: nút ×, ✓ giá trị hiện tại, tiêu đề nhóm, chip chọn nhiều, chuyển động ===== */
.combo-x{position:absolute;right:26px;top:calc((var(--tap) - 24px)/2);width:24px;height:24px;padding:0;border:0;border-radius:50%;background:var(--surface-2);color:var(--soft);font-size:15px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:1}
.combo-x::before{content:"×"}
.combo-x[hidden]{display:none}
.combo-x:hover{background:var(--accent-weak);color:var(--accent)}
.combo.has-x>input.input[role=combobox]{padding-right:56px}
.atp-r{position:relative}
.atp-r.is-cur{font-weight:600}
.atp-r.is-cur::after{content:"✓";position:absolute;right:3px;top:50%;transform:translateY(-50%);color:#0f766e;font-weight:800;background:#fff;padding:0 3px;border-radius:3px}
.atp-r.is-cur[aria-selected="true"]::after{background:#cde6f7}
.atp-r.is-cur.is-sel::after{background:#e3f1d9}
.atp-g{padding:3px 6px;font-size:.85em;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#4b5560;background:#f1f3f4;border-top:1px solid #d4d4d4;border-bottom:1px solid #d4d4d4;position:sticky;top:0;z-index:1}
.atp-chips{display:flex;flex-wrap:wrap;gap:4px;padding:4px 6px;background:#f4f8fb;border-bottom:1px solid #d4d4d4;max-height:68px;overflow:auto}
.atp-chip{display:inline-flex;align-items:center;gap:4px;max-width:100%;min-height:24px;padding:0 8px;border:1px solid #9bb8cf;border-radius:999px;background:#fff;color:#1d4f7a;font:inherit;cursor:pointer}
.atp-chip-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:140px}
.atp-chip.clr{border-color:#c7ced4;color:#4b5560;background:transparent}
.atp-chip-more{align-self:center;color:#4b5560}
@media (pointer:coarse){.atp-chip{min-height:32px;font-size:14px}.atp-g{padding:6px 8px}}
@media (pointer:coarse),(max-width:700px){.combo-x{width:40px;height:40px;right:20px;top:calc((var(--tap) - 40px)/2);font-size:18px}}
.atp:not([hidden]){animation:dl-in 120ms ease-out}
@media (prefers-reduced-motion:reduce){.atp:not([hidden]){animation:none}}

/* ===== tấm xem nhanh (peek.js, v5.237) ===== */
.pk{position:fixed;left:0;right:0;bottom:0;z-index:650;box-sizing:border-box;background:var(--surface);color:var(--ink);border-top:1px solid var(--line);border-radius:16px 16px 0 0;box-shadow:0 -8px 24px rgba(0,0,0,.22);padding:10px var(--gutter) calc(12px + env(safe-area-inset-bottom));max-height:70dvh;overflow:auto;animation:dl-up 160ms ease-out}
.pk-h{width:36px;height:4px;border-radius:2px;background:var(--line);margin:0 auto 10px}
.pk-t{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;font-size:1.0625rem} .pk-t .grow{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
.pk-kv{display:grid;grid-template-columns:minmax(84px,32%) minmax(0,1fr);gap:4px var(--s3);margin:var(--s3) 0}
.pk-kv dt{color:var(--soft)} .pk-kv dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.pk-b{display:flex;gap:var(--s2)} .pk-b .btn{flex:1 1 0;min-height:44px;display:flex;align-items:center;justify-content:center;text-decoration:none}
.ord-cards li.is-peek>.ord-link{background:var(--accent-weak)}
@media (prefers-reduced-motion:reduce){.pk{animation:none}}

/* ===== trạng thái bấm cho MỌI loại nút (v5.249): hover · nhấn · đang xử lý · khóa · bật/tắt ===== */
.pick-btn:hover,.ord-link:hover,.linkbtn:hover,.chat-back:hover,.chat-del:hover,.chip:hover{background:var(--surface-2)}
.pick-btn:active,.ord-link:active,.linkbtn:active,.chip:active,.chat-back:active,.chat-del:active,.combo-x:active,.fs-exit:active,.atp-fs-add:active,.atp-fs-back:active,.scn-back:active,.scn-ok:active,.scn-torch:active,[role="button"]:active{filter:brightness(.88);transform:scale(.97)}
button:disabled,button[aria-disabled="true"],button[aria-busy="true"]{cursor:not-allowed}
button[aria-busy="true"]:not(.btn){opacity:.6;pointer-events:none}
.btn[aria-pressed="true"]:not(.primary),.btn[aria-selected="true"]:not(.primary),.chip[aria-pressed="true"]{background:var(--accent-weak);border-color:var(--accent);color:var(--accent);font-weight:700}