/* màn nghiệp vụ (đơn bán, …) */
.row.wrap{flex-wrap:wrap} .row.end{justify-content:flex-end} .grow{flex:1;min-width:0}
.grid2,.grid3{display:grid;gap:var(--s3)} .grid2{grid-template-columns:1fr} .grid3{grid-template-columns:1fr 1fr 1fr}
@media (min-width:640px){.grid2{grid-template-columns:1fr 1fr}}
.num{text-align:right} .strong{font-weight:700}
.kv{display:grid;grid-template-columns:120px minmax(0,1fr);gap:var(--s3);padding:var(--s1) 0;border-bottom:1px solid var(--line)} .kv:last-child{border-bottom:0}
.sum .row{padding:var(--s1) 0} .sum .total{border-top:1px solid var(--line);margin-top:var(--s2);padding-top:var(--s3);font-size:var(--fs-lg)}
.pick{margin-top:calc(-1*var(--s2));box-shadow:var(--shadow, 0 4px 14px rgba(0,0,0,.12));position:relative;z-index:5;max-height:260px;overflow:auto}
.pick li{padding:0;border-radius:0} .pick-btn{display:block;width:100%;text-align:left;min-height:var(--tap);padding:var(--s2) var(--s3);background:transparent;border:0;color:var(--ink);font:inherit;cursor:pointer} .pick-btn:hover,.pick-btn:focus-visible{background:var(--accent-weak)}
.num-in{text-align:right}
.ord-link{display:block;color:inherit;text-decoration:none;padding:var(--s3)} .ord-cards>li{padding:0}
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
.tbl{width:100%;border-collapse:collapse;font-size:var(--fs)} .tbl th,.tbl td{padding:var(--s3);text-align:left;border-bottom:1px solid var(--line);white-space:nowrap} .tbl th.num,.tbl td.num{text-align:right} .tbl thead th{background:var(--surface-2);font-weight:600} .tbl tbody th{font-weight:600} .tbl tr:last-child>*{border-bottom:0}
.tbl a{color:var(--accent);min-height:var(--tap);display:inline-flex;align-items:center}
.ord-table{display:none} @media (min-width:768px){.ord-cards{display:none}.ord-table{display:block}}
.line .field{margin:0}
a.btn{text-decoration:none} .tbl td{white-space:normal} .tbl th{white-space:nowrap}
.grid3{align-items:end}
.tbl td.num,.tbl td:last-child{white-space:nowrap} .badge{white-space:nowrap}
.neg{color:var(--err)} .stk-filters{align-items:end} @media (max-width:639px){.stk-filters{grid-template-columns:1fr}}
/* hộp kiểm: vùng chạm 44px, hình 22px */
input[type=checkbox]{-webkit-appearance:none;appearance:none;width:44px;height:44px;flex:none;margin:0;background:transparent;position:relative;cursor:pointer}
input[type=checkbox]::before{content:"";position:absolute;inset:11px;border:2px solid var(--soft);border-radius:5px;background:var(--surface)}
input[type=checkbox]:checked::before{background:var(--accent);border-color:var(--accent)}
input[type=checkbox]:checked::after{content:"";position:absolute;left:17px;top:12px;width:6px;height:12px;border:solid var(--accent-ink);border-width:0 2px 2px 0;transform:rotate(45deg)}
input[type=checkbox]:focus-visible{outline:2px solid var(--focus);outline-offset:-2px;border-radius:8px}
label.row{min-height:var(--tap);cursor:pointer}
.row.wrap>.grow{flex:1 1 220px}
.linkbtn{background:none;border:0;padding:0;min-height:var(--tap);color:var(--accent);font:inherit;text-decoration:underline;cursor:pointer}

/* ---- In chứng từ ---- */
.pdoc{background:#fff;color:#000;max-width:210mm;margin:0 auto;padding:12mm;border:1px solid var(--line);font-size:13px;line-height:1.45}
.pdoc .phead{border-bottom:1px solid #000;padding-bottom:6px;margin-bottom:6px} .pdoc .ptitle{text-align:center;margin:8px 0 2px;font-size:1.25rem;letter-spacing:.02em;color:#000} .pdoc .psub{text-align:center;margin-bottom:6px}
.pdoc .pgrid{display:grid;grid-template-columns:1fr 1fr;gap:2px 16px;margin:8px 0} .pdoc .pkv{display:flex;gap:6px} .pdoc .pk{color:#333;min-width:90px;font-weight:600}
.pdoc .ptbl{width:100%;border-collapse:collapse;margin:8px 0} .pdoc .ptbl th,.pdoc .ptbl td{border:1px solid #000;padding:3px 5px;text-align:left} .pdoc .ptbl .num,.pdoc .num{text-align:right;font-variant-numeric:tabular-nums}
.pdoc .ptot{margin-left:auto;width:min(320px,100%)} .pdoc .ptot>div{display:flex;justify-content:space-between;gap:12px;padding:1px 0} .pdoc .pwords{margin:6px 0;font-style:italic}
.pdoc .psign{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:12px;text-align:center;margin-top:18px} .pdoc .sigline{height:56px}
@media (max-width:720px){.pdoc{padding:8px;overflow-x:auto}.pdoc .pgrid{grid-template-columns:1fr}.pdoc .ptbl{min-width:520px}}
@media print{
  @page{size:A4;margin:10mm}
  body{background:#fff !important} .noprint,.nav,.top,.topbar,.banner-host,header,.skip,#sync-banner,.tabs,.toast-host,h1{display:none !important}
  main,#main,.main{padding:0 !important;margin:0 !important;max-width:none !important} .pdoc{border:0;padding:0;max-width:none;font-size:11.5pt}
}

.ggt-ln{margin:8px 0;line-height:1.7;font-size:1.02rem}

.cmd-hint{flex-basis:100%}
.ggt-title{text-align:center;margin:28px 0 12px}
.ggt-sign{grid-template-columns:1fr 1fr;margin-top:24px}
/* chừa chỗ dưới cùng để thanh điều hướng điện thoại không che nút cuối trang */
@media (max-width:1023.98px){.main{padding-bottom:calc(var(--nav-h) + var(--s5) + env(safe-area-inset-bottom))}}
@media (min-width:1024px){.main{padding-bottom:var(--s6)}}

/* khoảng ngày thống nhất: Từ ngày | Đến ngày cạnh nhau, có nhãn, mọi cỡ màn hình */
.drange{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3);align-items:end;max-width:460px} .drange-f{display:flex;flex-direction:column;gap:4px;min-width:0} .drange-f .lbl{margin:0} .drange-f .input,.drange-f .combo{width:100%;min-width:0}
.rp-ctl{align-items:flex-end}
.docno{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)} .docno input[readonly]{background:var(--surface-2,#f3f4f6)}
.card.stack>.field,.grid2>.field,.grid3>.field,.docno>.field{margin-bottom:0} .card.stack>.field+.field{margin-top:var(--s3)} .grid3r{display:grid;gap:var(--s3);grid-template-columns:1fr} .grid3r>.field{margin-bottom:0} @media (min-width:720px){.grid3r{grid-template-columns:1fr 1fr 1fr}}

/* ===== bố cục form chứng từ gọn (đơn) ===== */
.docno{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} @media (min-width:720px){.docno{grid-template-columns:minmax(0,220px) minmax(0,170px)}}
.ord-who,.ord-meta{display:grid;gap:var(--s3);grid-template-columns:1fr} .ord-who>.field,.ord-meta>.field{margin-bottom:0}
@media (min-width:720px){.ord-who{grid-template-columns:minmax(0,1fr) minmax(0,300px)} .ord-meta{grid-template-columns:minmax(0,170px) minmax(0,220px) minmax(0,1fr)}}
.sum{max-width:380px;margin-left:auto} @media (max-width:719px){.sum{max-width:none}}
details.sign>summary{cursor:pointer;font-weight:600} details.sign[open]>summary{margin-bottom:var(--s3)}
.actbar{position:sticky;bottom:0;z-index:20;background:var(--bg,#f6f7f9);padding:var(--s3) 0;border-top:1px solid var(--line);align-items:center}
.actbar{bottom:calc(var(--nav-h) + env(safe-area-inset-bottom,0px))} @media (min-width:1024px){.actbar{bottom:0}}
@media (max-width:719px){.sum .row{padding-right:52px}}

/* dòng hàng dạng lưới một hàng (nhãn trên, ô dưới, thẳng cột) */
.sline,.tline,.cline,.mline{display:grid;gap:var(--s2) var(--s3);align-items:start} .sline .field,.tline .field,.cline .field,.mline .field,.oline .field{margin:0}
.s-name{min-height:44px;display:flex;align-items:center;flex-wrap:wrap;gap:0 var(--s1);overflow-wrap:anywhere}
.sline .num,.cline .num,.mline .num{min-height:44px;display:flex;align-items:center;justify-content:flex-end}
.tline .t-x{align-self:end}
.sline{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:"it it it" "rm tn sl"} .sline.sin{grid-template-areas:"it it it" "rm sl sl"}
.s-it{grid-area:it} .s-rm{grid-area:rm} .s-tn{grid-area:tn} .s-sl{grid-area:sl}
.tline{grid-template-columns:minmax(0,1fr) 44px;grid-template-areas:"it x" "sl sl"} .t-it{grid-area:it} .t-x{grid-area:x} .t-sl{grid-area:sl}
.cline{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:"it it it" "bk ct df" "nt nt nt"} .c-it{grid-area:it} .c-bk{grid-area:bk} .c-ct{grid-area:ct} .c-df{grid-area:df} .c-nt{grid-area:nt}
.mline{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"it it" "rm sl"} .m-it{grid-area:it} .m-rm{grid-area:rm} .m-sl{grid-area:sl}
@media (min-width:720px){
 .sline{grid-template-columns:minmax(0,1fr) 84px 84px 112px;grid-template-areas:"it rm tn sl"} .sline.sin{grid-template-columns:minmax(0,1fr) 84px 112px;grid-template-areas:"it rm sl"}
 .tline{grid-template-columns:minmax(0,1fr) 160px 44px;grid-template-areas:"it sl x"}
 .cline{grid-template-columns:minmax(0,1fr) 110px 130px 110px;grid-template-areas:"it bk ct df" "nt nt nt nt"}
 .mline{grid-template-columns:minmax(0,1fr) 120px 150px;grid-template-areas:"it rm sl"}
}
/* bảng dữ liệu: đầu bảng nhỏ & dịu, hàng có hover, số thẳng cột */
.tbl thead th{font-size:var(--fs-sm);color:var(--soft);font-weight:600;position:sticky;top:0;z-index:1;border-bottom:1px solid var(--line)}
.tbl tbody tr:hover>*{background:var(--accent-weak)} .tbl td.num,.tbl th.num{font-variant-numeric:tabular-nums}
.tbl tbody th a{font-weight:600}
main h1,.main h1{letter-spacing:-.01em}

/* đầu đơn: gom 2 hàng (PC) để cả đơn vừa một màn hình */
@media (min-width:1100px){
 .main h1{margin-bottom:var(--s2)} .main h2{margin:var(--s3) 0 var(--s2)}
 .sum{max-width:none;margin-left:0;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--s2) var(--s6);padding:var(--s3) var(--s4)}
 .sum .row{flex-direction:column;align-items:flex-end;gap:0;padding:0;margin:0;min-width:120px;flex-wrap:nowrap} .sum .row .grow{flex:none;font-size:var(--fs-sm);color:var(--soft)}
 .sum .total{border:0;margin:0;padding:0;font-size:var(--fs-lg)} .sum>*+*{margin-top:0}
}


/* PC: danh sách dòng hàng cuộn trong khung, dòng gọn, nhãn cột chỉ hiện ở dòng đầu */

@media (min-width:1100px){.main:has(.actbar){padding-bottom:var(--s2)} .actbar{padding:var(--s2) 0}}

/* ===== vận đơn / chuyển kho: 2 khối xếp dọc trên PC (Đơn hàng + hàng giao ở trên, Vận chuyển ở dưới) ===== */
.ship-title{display:block} .ship-meta{display:grid;gap:var(--s3);grid-template-columns:1fr} .ship-meta>.field{margin:0} .ship-meta .docno{grid-template-columns:1fr 1fr}
@media (min-width:1100px){
 .ship-cols{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s4);align-items:start}
 .ship-l>*+*{margin-top:var(--s2)} .ship-l h2{margin:var(--s2) 0 0}
 .ship-meta{grid-template-columns:190px 140px minmax(0,1fr)} .ship-meta .docno{display:contents}
 .ship-addr{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)} .ship-addr>*{margin:0!important} .ship-addr .hint{display:none}
 .ship-meta.tr-meta{grid-template-columns:190px 140px minmax(0,1fr) minmax(0,1fr)}
 .ship-info{padding:var(--s3) var(--s4)}

 .tcard{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s2) var(--s3);padding:var(--s3) var(--s4);align-items:start}
 .tcard>*{margin:0!important} .tcard>h2{grid-column:1/-1} .tcard>.field:has(textarea){grid-column:1/-1;order:99} .tcard .grid2{display:contents} .tcard .field{margin:0} .tcard .hint{display:none}
 .tcard textarea.input{min-height:var(--tap);height:var(--tap)} .tcard h2{font-size:1rem;margin:0}
}
@media (min-width:1100px){ .ship-meta.tr-meta{grid-template-columns:1fr 1fr} .ship-meta.tr-meta .docno{display:grid;grid-column:1/-1;grid-template-columns:190px 140px} }

/* kiểm kê & chi tiết chứng từ: gọn trên PC */
@media (min-width:1100px){
 .cnt-head{display:grid!important;grid-template-columns:190px 140px minmax(0,1fr) minmax(0,1.4fr);gap:var(--s3);align-items:start;padding:var(--s3) var(--s4)} .cnt-head>*{margin:0!important} .cnt-head .docno{display:contents} .cnt-head textarea.input{min-height:var(--tap);height:var(--tap)}

 .card:has(>.kv){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--s5);padding:var(--s3) var(--s4)} .card:has(>.kv)>:not(.kv){grid-column:1/-1} .card:has(>.kv)>.kv:nth-last-child(-n+3){border-bottom:0}
}

.filt-row{display:block} @media (min-width:1100px){.filt-row{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:flex-end} .filt-row>.grid2{flex:1 1 520px} .filt-row>.drange{flex:0 0 auto;margin:0;max-width:none} .filt-row>.drange{grid-template-columns:170px 170px}
 .tbl th,.tbl td{padding:var(--s2) var(--s3)}}
@media (min-width:1100px){
 .cline{grid-template-columns:minmax(0,1fr) 100px 130px 100px 240px;grid-template-areas:"it bk ct df nt";align-items:end}
 #cnt-lines{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:var(--s2) var(--s3)} #cnt-lines>*+*{margin-top:0}
 #cnt-lines .cline{border:0;box-shadow:none;border-radius:0;background:transparent;padding:var(--s1) 0;border-top:1px solid var(--line)} #cnt-lines .cline:first-child{border-top:0}
 #cnt-lines .cline:not(:first-child):not(.pg-top) .field>.lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}

/* chia trang tự động (PC) */
.pg-hide{display:none !important}
.pg-bar{display:flex;justify-content:flex-end;align-items:center;gap:var(--s3);margin-top:var(--s2)} .pg-bar .btn{min-height:34px;padding:0 var(--s3)} .pg-info{color:var(--soft);font-size:var(--fs-sm);min-width:12ch;text-align:center}
@media (min-width:1100px){
  .tbl th,.tbl td{padding:5px var(--s3)} .tbl a{min-height:0} .tbl td[colspan]{padding:3px var(--s3)}
  .tbl .btn,.tbl td[colspan] .btn{min-height:28px;padding:0 var(--s3);font-size:var(--fs-sm)}
  .tbl .stage-box{flex-direction:row;align-items:center;gap:var(--s2)}
  .pg-bar{padding-right:64px}
}
@media (min-width:1100px){
  .main{padding-top:var(--s3);padding-bottom:var(--s3) !important} .main h1{font-size:var(--fs-lg);margin-bottom:var(--s1)} .main .stack{gap:var(--s2)}
  .lbar{flex-wrap:nowrap;align-items:center} .lbar>.grow{min-width:180px} .lbar .btn{white-space:nowrap;min-height:36px} .lbar>select.input{width:auto;min-width:170px;flex:none} .lbar>.grow>.tabs{flex-wrap:nowrap}
}

@media (min-width:1100px){ .acct{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2) var(--s4);align-items:start} .acct>.card:nth-child(2){grid-row:span 3} }
@media (min-width:1100px){

  #ord-cmds>div,#ord-cmds .stack{display:flex;flex-direction:row;flex-wrap:wrap;gap:var(--s2)} #ord-cmds .btn{font-size:var(--fs-sm)}

}


/* PC: gọn khung — tiêu đề trang chỉ để trình đọc màn hình (menu bên trái đã báo mục đang mở), thanh trên 1 dòng */
@media (min-width:1100px){
  .main>h1{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0}
  .topbar{padding-block:var(--s1)} button.chip,button.chip:has(.chip-m:not(:empty)){min-height:34px;padding-block:0} .chip .chip-b{flex-direction:row;gap:var(--s2);align-items:center}
  .chip .chip-m{max-width:none}
}
@media (min-width:1100px){
  .tabs .btn{min-height:32px;padding:0 var(--s3)} .tabs{padding-bottom:0}
  .debt-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s2) var(--s4);align-items:end} .debt-card>:nth-child(n+3){grid-column:1/-1} .debt-card .docno{margin:0}
  .cnt-xn{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2) var(--s3)} .cnt-xn>strong{grid-column:1/-1} .cnt-xn>.field{margin:0}
  .card{padding:var(--s3)} textarea.input{min-height:56px}
}

@media (min-width:1100px){ #ord-cmds{padding:var(--s2) var(--s3) !important;gap:var(--s1) !important} #ord-cmds .small,#ord-cmds .muted{line-height:1.3} .acct .card{padding:var(--s2) var(--s3)} .acct{gap:var(--s2) var(--s3)} }
.pr-sel{width:auto;min-width:170px}
@media screen and (min-width:1100px){ .pdoc{zoom:var(--pz,1)} }
select.input.pr-sel{width:auto;flex:0 0 auto} @media (min-width:1100px){.row.wrap.noprint{flex-wrap:nowrap;align-items:center}}
@media (min-width:1100px){ .sign-g{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:1100px){ .sign{position:relative} .sign[open]>.sign-g{position:absolute;left:0;right:0;bottom:100%;z-index:30;margin-bottom:var(--s1);background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-lg,0 8px 24px rgba(0,0,0,.18));padding:var(--s3) var(--s4)} }
@media (min-width:1100px){ .co-form{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2) var(--s5);align-items:start} .co-form>:not(.grid2){grid-column:1/-1} .co-form>.grid2{margin:0} }
@media (min-width:1100px){ .co-form{row-gap:var(--s1)} .co-form .field{margin:0} }
@media (min-width:1100px){ .co-form>.btn{justify-self:end;width:auto} .co-form>[role=alert]:empty{display:none} }

@media (min-width:1100px){ .card:has(>.kv)>.row:has(>#debt-pay,>#debt-cancel){grid-column:auto} .card:has(>.kv)>.row:has(>#debt-cancel){justify-self:start} }
/* điện thoại: dòng hàng không có nút ✕ (đơn 1 dòng) dùng đủ 3 cột, nhãn không xuống dòng nên 3 ô ngang hàng */

@media (min-width:1100px){ .tbl td.it-name{max-width:230px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .tbl td.it-code{white-space:nowrap} }
@media (min-width:1100px){ .ord-table .tbl td{min-width:0} .ord-table .tbl td.it-name{max-width:250px} .ord-table .tbl td:nth-child(3){min-width:130px;max-width:200px;overflow:hidden;text-overflow:ellipsis} .ord-table .tbl .stage-t{display:none} }

/* Luồng chứng từ của đơn */
.steps{list-style:none;margin:0;padding:8px 10px;display:flex;flex-wrap:wrap;gap:6px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.steps li{display:flex;align-items:center;gap:6px;min-width:0}
.steps .st-dot{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1.5px solid currentColor;font-size:12px;font-weight:700;flex:none;color:var(--soft)}
.steps .st-done .st-dot{background:var(--ok);border-color:var(--ok);color:var(--accent-ink)}
.steps .st-now .st-dot{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.steps .st-now.mine .st-dot{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.steps .st-todo .st-t{color:var(--soft)}
.steps .st-now .st-t{font-weight:700}
.steps li:not(:last-child)::after{content:"";width:14px;height:2px;background:var(--line);margin-left:2px;flex:none}
@media (max-width:719px){.steps{flex-direction:column;gap:6px}.steps li:not(:last-child)::after{content:none}}
@media (min-width:1100px){.steps{gap:4px 16px;padding:6px 10px}.steps li:not(:last-child)::after{content:none}.steps .st-d{white-space:nowrap}}
/* màn hình PC thấp (≤700px cao): nén khoảng cách để mọi màn vẫn nằm trọn một trang */
@media (min-width:1100px) and (max-height:700px){
  .stack{gap:6px} .card{padding:8px 12px} .card.stack{gap:4px}
  .kv{padding-block:2px;min-height:0} .tbl th,.tbl td{padding-block:3px} .field{gap:2px} .input,select.input{min-height:32px;padding-block:3px}
  .steps{padding:4px 10px} .main{padding-top:6px} h2{margin-bottom:4px;font-size:1.05rem} .btn{min-height:32px}
  .actbar{padding-top:4px;margin-top:0}
}

@media (min-width:1100px) and (max-height:700px){.steps .st-d{display:none}.steps{flex-wrap:nowrap}.steps .st-t{white-space:nowrap}}

#task-table{font-size:.9rem} #task-table th,#task-table td{padding-block:5px} #task-table .doc-flag{margin-left:0}

/* Bảng điện Nhập–Xuất–Tồn: nền tối cố định như bảng giá chứng khoán; tăng xanh, giảm đỏ, không đổi vàng */
.board{--bd-bg:#fff;--bd-row:#fff;--bd-line:#d5dce6;--bd-ink:#14202e;--bd-soft:#4a5b70;--bd-up:#0a8f3c;--bd-dn:#d12b2b;--bd-eq:#b45309;--bd-head:#eef2f7;--bd-even:#f6f8fb;--bd-hover:#e6eefb;--bd-on:#dbe8fb;--bd-onl:#4a6fa5;--bd-z:#9aa7b8;--bd-link:#0b5fc0;--bd-grp:#0b5fc0;--bd-flu:#bbf7d0;--bd-fld:#fecaca;--bd-negbg:#b91c1c;background:var(--bd-bg);color:var(--bd-ink);border-radius:var(--r);border:1px solid var(--bd-line);overflow:hidden}
.bd-tick{display:flex;flex-wrap:wrap;gap:var(--s2);padding:var(--s3);border-bottom:1px solid var(--bd-line);background:var(--bd-head)}
.bd-chip{display:inline-flex;align-items:center;gap:var(--s2);min-height:34px;padding:0 var(--s3);border-radius:6px;border:1px solid var(--bd-line);background:transparent;color:var(--bd-ink);font:inherit;font-size:.875rem;cursor:pointer}
.bd-chip b{font-variant-numeric:tabular-nums;font-size:1rem} .bd-chip.up b{color:var(--bd-up)} .bd-chip.dn b{color:var(--bd-dn)} .bd-chip.eq b{color:var(--bd-eq)} .bd-chip.neg b{color:var(--bd-dn)}
.bd-chip.on{background:var(--bd-on);border-color:var(--bd-onl)}
.bd-wrap{overflow:auto;max-height:70vh}
.board .bd-tbl{background:transparent;color:var(--bd-ink);font-size:.92rem;font-variant-numeric:tabular-nums} .board .bd-tbl th,.board .bd-tbl td{border-bottom:1px solid var(--bd-line);background:transparent;padding:6px var(--s3)}
.board .bd-tbl thead th{background:var(--bd-head);color:var(--bd-soft);position:sticky;top:0;z-index:2;font-weight:600}
.bd-sort{background:none;border:0;color:inherit;font:inherit;font-weight:600;cursor:pointer;padding:0;min-height:0;white-space:nowrap;text-align:inherit}
.board .bd-tbl tbody tr{background:var(--bd-row)} .board .bd-tbl tbody tr:nth-child(even){background:var(--bd-even)} .board .bd-tbl tbody tr:hover>*{background:var(--bd-hover)}
.board .bd-tbl .linkbtn{color:var(--bd-link);font-weight:700;min-height:0}
@media (pointer:coarse){.board .bd-tbl .linkbtn{min-height:32px}}   /* v5.45: vùng chạm mã hàng trên điện thoại */
.kv>*{min-width:0;overflow-wrap:anywhere}   /* v5.45: tên khách dài liền không tràn ngang */
.board .bd-tbl .num{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.board .up{color:var(--bd-up)} .board .dn{color:var(--bd-dn)} .board .eq{color:var(--bd-eq)} .board .num.neg{color:#fff;background:var(--bd-negbg) !important}
.board .cl.up{color:var(--bd-up)} .board .cl.dn{color:var(--bd-dn)} .board .cl.eq{color:var(--bd-eq)}
.bd-empty{padding:var(--s5);color:var(--bd-soft);text-align:center}
@keyframes bd-fu{0%{background:var(--bd-flu)}100%{background:transparent}} @keyframes bd-fd{0%{background:var(--bd-fld)}100%{background:transparent}}
.board tr.flash-up>*{animation:bd-fu 1.4s ease-out} .board tr.flash-dn>*{animation:bd-fd 1.4s ease-out}
@media (prefers-reduced-motion:reduce){.board tr.flash-up>*,.board tr.flash-dn>*{animation:none}}
@media (max-width:720px){.bd-wrap{max-height:none}}
.board td.z{color:var(--bd-z) !important} .board .bd-tbl td.bd-name{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--bd-ink)}
@media (max-width:720px){.board .bd-tbl th,.board .bd-tbl td{padding:6px 8px}.board .bd-tbl td.bd-name{max-width:150px}}
@media (min-width:721px){.board .bd-tbl{font-size:.86rem}.board .bd-tbl th,.board .bd-tbl td{padding:6px 7px}.board .bd-tbl thead th{white-space:normal;line-height:1.35;vertical-align:bottom}}
@media (min-width:721px){.board .bd-tbl{font-size:.82rem}.board .bd-tbl th,.board .bd-tbl td{padding:6px 6px}.bd-sort{white-space:normal}}
.board .bd-d{display:block;font-size:.78em;font-weight:500;opacity:.9} .board tr.bd-sum th,.board tr.bd-sum td{background:var(--bd-head) !important;font-weight:700;border-top:2px solid var(--bd-line)}
/* Tồn kho tổng (kiểu v34): mỗi kho một nhóm cột */
.bd-opts{gap:var(--s4);margin-block:var(--s2)} .bd-opts label{gap:var(--s2);align-items:center}
.board .bd-sumtbl thead tr:nth-child(2) th{top:33px;z-index:2} .board .bd-sumtbl th.grp{text-align:center;color:var(--bd-eq);border-left:2px solid var(--bd-line)} .board .bd-sumtbl th.grp.tot{color:var(--bd-link)}
.board .bd-sumtbl .gs{border-left:2px solid var(--bd-line)} .board .bd-sumtbl td.tot b{color:var(--bd-link)} .board .bd-sumtbl td.tot.up b{color:var(--bd-up)} .board .bd-sumtbl td.tot.dn b{color:var(--bd-dn)}
.board .bd-sumtbl tbody th.code{position:sticky;left:0;z-index:1;background:var(--bd-bg);text-align:left;min-width:150px} .board .bd-sumtbl thead th:first-child{position:sticky;left:0;z-index:4}
.board .bd-sumtbl td.z b{color:var(--bd-z);font-weight:500} .board .bd-sumtbl td b{font-size:1.05em}
.board td.flash-up{animation:bd-fu 1.4s ease-out} .board td.flash-dn{animation:bd-fd 1.4s ease-out}
@media (max-width:720px){.board .bd-sumtbl tbody th.code{min-width:110px}}
.board .bd-sumtbl th{line-height:1.35}

/* Điện thoại: bảng không bị ép vừa khung (cột ngắn như ĐVT / Loại không còn rộng 200px, cột tên không bị bóp thành nhiều dòng); cuộn ngang trong khung bảng */
@media (max-width:719px){
  .tbl{width:max-content;min-width:100%}
  .tbl td,.tbl th{min-width:0}
  .tbl td:nth-child(3){min-width:0}
  .tbl td{max-width:240px}
  .tbl td.num,.tbl th.num{white-space:nowrap}
}
.tax-sel{width:44px;min-width:44px!important;text-align:center} .tax-sel input{width:20px;height:20px}

.btn.cmd-open.is-reject{background:var(--err-bg);border-color:var(--err);color:var(--ink)}
.tax-sub td{background:var(--bg-soft,transparent);padding-top:0}
.tax-inv{align-items:center;gap:8px}
.tax-inv .input{width:auto;min-width:150px;flex:1 1 150px;max-width:240px}
.tax-inv .err{flex-basis:100%}
@media (max-width:640px){.tax-inv .input{max-width:none;flex:1 1 100%}.tax-inv .btn{flex:1 1 100%}}
.tax-inv{position:sticky;left:0;box-sizing:border-box;width:min(100%,calc(100vw - 64px))}
/* bảng tồn kho kiểu bảng điện chứng khoán */
.stk-board{font-variant-numeric:tabular-nums;font-size:.92rem}
.stk-board thead th{background:#0f1b2d;color:#fff;position:sticky;top:0;z-index:1;white-space:nowrap}
.stk-board td,.stk-board th{padding:6px 10px}
.stk-board td.num{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap}
.stk-board tbody tr:hover{background:var(--ok-bg,rgba(0,128,96,.08))}
.stk-board th[scope=row]{color:#b45309;font-weight:700;white-space:nowrap}
.stk-chg.up{color:#0a8f3c;font-weight:700}.stk-chg.dn{color:#d12b2b;font-weight:700}.stk-chg.eq{color:var(--muted,#888)}
.row>select.input.sel-auto{width:auto;flex:0 0 auto;min-width:170px}
@media (max-width:639px){.row>select.input.sel-auto{flex:1 1 100%}}

/* v5.50: cờ đỏ (mới) / xanh (đang xử lý) gắn trên dòng đơn, lệnh, vận đơn */
.rflags{display:inline-flex;gap:4px;margin-left:6px;vertical-align:middle}
.rflags .cnt{border-radius:999px;font-size:.7rem;font-weight:700;padding:0 6px;min-width:18px;line-height:18px;text-align:center;color:#fff;background:var(--err-solid)}
.rflags .cnt.xl{background:var(--accent)}

/* v5.53: sang chiết */
.sc-bar{display:inline-block;width:80px;height:8px;border-radius:4px;background:var(--line);overflow:hidden;vertical-align:middle}.sc-bar>span{display:block;height:100%;background:var(--accent)}
#sc-panel h3{margin:var(--s2) 0 0;font-size:1rem}

/* v5.55: chat nội bộ */
.chatbtn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--tap,44px);height:36px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink)}
.chatbtn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round}
.chatbtn .cnt{position:absolute;top:-4px;right:-4px;border-radius:999px;font-size:.68rem;font-weight:700;padding:0 5px;min-width:18px;line-height:18px;text-align:center;color:#fff;background:var(--err)}
.chatbtn .cnt[hidden]{display:none}
.chat{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s3);height:calc(100dvh - var(--top-h,60px) - 130px);min-height:360px}
.chat-list,.chat-thread{display:flex;flex-direction:column;min-height:0;min-width:0;border:1px solid var(--line);border-radius:var(--r2,10px);background:var(--surface)}
.chat:not(.has-thread) .chat-thread{display:none}.chat.has-thread .chat-list{display:none}
@media (min-width:900px){.chat{grid-template-columns:320px minmax(0,1fr)}.chat:not(.has-thread) .chat-thread,.chat.has-thread .chat-list{display:flex}.chat-back{display:none!important}}
.chat-head,.chat-top{padding:var(--s2) var(--s3);border-bottom:1px solid var(--line);align-items:center;gap:var(--s2)}
.chat-ul{overflow-y:auto;flex:1;margin:0;padding:0}
.chat-item{display:flex;align-items:center;gap:var(--s2);padding:var(--s2) var(--s3);text-decoration:none;color:inherit;min-height:56px}
.chat-item.on,.chat-item:hover{background:var(--bg-soft,rgba(0,0,0,.05))}
.chat-ava{flex:0 0 38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--accent);color:#fff;font-weight:700}.chat-ava.grp{border-radius:10px;background:#6b7a90}
.chat-mid{flex:1;min-width:0;display:flex;flex-direction:column}.chat-prev{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-meta{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.chat-msgs{flex:1;min-height:0;overflow-y:auto;padding:var(--s3);display:flex;flex-direction:column;gap:6px}
.chat-day{align-self:center;margin:6px 0}
.chat-b{max-width:min(82%,560px);align-self:flex-start;background:var(--bg-soft,#eef1f5);border-radius:14px;padding:6px 10px;overflow-wrap:anywhere}
.chat-b.mine{align-self:flex-end;background:var(--accent);color:#fff}.chat-b.mine a{color:#fff;text-decoration:underline}.chat-b.mine .muted{color:rgba(255,255,255,.8)}
.chat-by{font-weight:700;color:var(--accent)}.chat-tx{white-space:pre-wrap}
.chat-ft{display:flex;gap:8px;justify-content:flex-end;align-items:center}.chat-b.mine .linkbtn{color:#fff}
.chat-img{max-width:100%;max-height:260px;border-radius:8px;display:block;cursor:zoom-in;margin-top:4px}
.chat-big img{max-width:100%;max-height:70vh;display:block;margin:auto}
.chat-compose{padding:var(--s2);border-top:1px solid var(--line);align-items:flex-end;gap:var(--s2)}
.chat-ta{flex:1;min-width:0;resize:none;max-height:140px}
.chat-picked{padding:4px var(--s3)}
.chat-pick{max-height:50vh;overflow:auto}.chat-pickbtn{width:100%;justify-content:flex-start}
@media (max-width:899px){.chat{height:calc(100dvh - var(--top-h,60px) - 150px)}}

/* v5.55: bộ hiệu ứng chuyển động cho chat — chỉ chạy khi hệ thống không bật "giảm chuyển động" */
@media (prefers-reduced-motion:no-preference){
  @keyframes chat-in-l{from{opacity:0;transform:translate(-14px,10px) scale(.92)}to{opacity:1;transform:none}}
  @keyframes chat-in-r{from{opacity:0;transform:translate(14px,10px) scale(.92)}to{opacity:1;transform:none}}
  @keyframes chat-out{to{opacity:0;transform:scale(.85);max-height:0;padding-block:0;margin-block:-3px}}
  @keyframes chat-pend{0%,100%{opacity:1}50%{opacity:.62}}
  @keyframes chat-hot{0%{background:var(--ok-bg,rgba(0,128,96,.18))}100%{background:transparent}}
  @keyframes chat-ring{0%{transform:rotate(0)}15%{transform:rotate(-14deg)}30%{transform:rotate(12deg)}45%{transform:rotate(-8deg)}60%{transform:rotate(5deg)}100%{transform:rotate(0)}}
  @keyframes chat-bump{0%{transform:scale(.4)}60%{transform:scale(1.35)}100%{transform:scale(1)}}
  @keyframes chat-slide{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
  @keyframes chat-fade{from{opacity:0}to{opacity:1}}
  .chat-b{transform-origin:bottom left}.chat-b.mine{transform-origin:bottom right}
  .chat-b.pop{animation:chat-in-l .26s cubic-bezier(.2,.9,.3,1.2) both}.chat-b.mine.pop{animation-name:chat-in-r}
  .chat-b.out{animation:chat-out .24s ease-in forwards;overflow:hidden}
  .chat-b.pend{animation:chat-pend 1.1s ease-in-out infinite}
  .chat-item.hot{animation:chat-hot 1.6s ease-out}
  .chat-item .cnt.moi{animation:chat-bump .35s cubic-bezier(.2,.9,.3,1.4)}
  .chatbtn.ring svg{animation:chat-ring .7s ease-in-out;transform-origin:50% 10%}
  .chatbtn.ring .cnt{animation:chat-bump .4s cubic-bezier(.2,.9,.3,1.4)}
  .chat-day{animation:chat-fade .3s ease both}
  .chat-img{opacity:0;transition:opacity .3s ease,transform .2s ease}.chat-img.in{opacity:1}.chat-img:hover{transform:scale(1.02)}
  #chat-send{transition:transform .12s ease,filter .12s ease}#chat-send:active{transform:scale(.93)}#chat-send:not(:disabled):hover{filter:brightness(1.08)}
  .chat-item{transition:background .15s ease}
  @media (max-width:899px){.chat.has-thread .chat-thread{animation:chat-slide .22s ease-out}}
}
@media (prefers-reduced-motion:reduce){.chat-img{opacity:1}}
.chat{overflow-x:clip}.chat-msgs{overflow-x:hidden}   /* hiệu ứng trượt không làm tràn ngang */

/* v5.58: bộ emoji */
.chat-thread{position:relative}
.emoji-pop{position:absolute;left:var(--s2);right:var(--s2);bottom:68px;max-width:380px;z-index:5;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 28px rgba(0,0,0,.18);overflow:hidden}
.emoji-pop[hidden]{display:none}
.emoji-tabs{display:flex;gap:2px;padding:4px;border-bottom:1px solid var(--line);overflow-x:auto}
.emoji-tab{flex:0 0 auto;min-width:40px;height:38px;border:0;border-radius:8px;background:transparent;font-size:1.25rem;cursor:pointer}
.emoji-tab.on{background:var(--bg-soft,rgba(0,0,0,.08));box-shadow:inset 0 -2px 0 var(--accent)}
.emoji-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(42px,1fr));gap:2px;padding:6px;max-height:210px;overflow-y:auto}
.emoji-btn{height:42px;border:0;border-radius:8px;background:transparent;font-size:1.5rem;line-height:1;cursor:pointer;font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif}
.emoji-btn:hover,.emoji-btn:focus-visible{background:var(--bg-soft,rgba(0,0,0,.08))}
.chat-b.emo{background:transparent!important;padding:2px 4px}.chat-b.emo .chat-tx{font-size:2.6rem;line-height:1.15}.chat-b.emo .chat-ft{color:var(--muted)}
.chat-b.emo.mine .muted,.chat-b.emo.mine .linkbtn{color:var(--muted)}
.chat-tx{font-family:inherit}
@media (prefers-reduced-motion:no-preference){@keyframes emoji-pop{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}.emoji-pop:not([hidden]){animation:emoji-pop .16s ease-out}.emoji-btn:active{transform:scale(1.3);transition:transform .08s}}

/* v5.59: phản ứng emoji lên tin nhắn */
.chat-rx{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.chat-chip{display:inline-flex;align-items:center;gap:3px;min-height:26px;padding:0 8px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:.95rem;cursor:pointer;font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif}
.chat-chip.mine{border-color:var(--accent);background:var(--ok-bg,rgba(0,128,96,.12));font-weight:700}
.chat-chip-n{font:700 .75rem system-ui,sans-serif}
.chat-rxbtn{opacity:.35;transition:opacity .15s}.chat-b:hover .chat-rxbtn,.chat-rxbtn:focus-visible{opacity:1}
@media (pointer:coarse){.chat-rxbtn{opacity:.8}}
.chat-rxbar{display:flex;gap:2px;margin-top:6px;padding:4px;border-radius:999px;background:var(--surface);border:1px solid var(--line);box-shadow:0 4px 14px rgba(0,0,0,.15);width:max-content;max-width:100%}
.chat-rxpick{width:40px;height:40px;border:0;border-radius:50%;background:transparent;font-size:1.45rem;cursor:pointer;font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif}
.chat-rxpick:hover,.chat-rxpick:focus-visible{background:var(--bg-soft,rgba(0,0,0,.08))}
@media (prefers-reduced-motion:no-preference){
  @keyframes rx-bar{from{opacity:0;transform:translateY(6px) scale(.9)}to{opacity:1;transform:none}}
  @keyframes rx-chip{0%{transform:scale(.5)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
  .chat-rxbar{animation:rx-bar .16s ease-out}.chat-rxpick:hover{transform:scale(1.25);transition:transform .1s}
  .chat-chip.new{animation:rx-chip .28s cubic-bezier(.2,.9,.3,1.4)}
}
.chat-rxbar.still{animation:none}
@media (max-width:899px){.chat-compose{gap:4px}.chat-compose .btn{padding-inline:10px;min-width:40px}.chat-ta{min-width:0;flex:1 1 auto}.chat-ta::placeholder{font-size:.9rem}}
.chat-compose{flex-wrap:nowrap}@media (max-width:899px){.chat-compose{padding-right:70px}.chat-compose .btn{padding-inline:8px;min-width:38px}}

/* v5.62: bảng hàng hóa / đơn giá của lệnh (DXH…) */
#task-items th,#task-items td{vertical-align:middle}
#task-items th.ten{text-align:left;font-weight:600;min-width:9rem}
#task-items th.ten .muted{font-weight:400}
#task-items td.num,#task-items th.num{white-space:nowrap}
#task-items .num-in{width:7.5rem;max-width:100%;text-align:right}
#task-items .qty{display:inline-flex;align-items:center;gap:.4rem}
#task-items tfoot th,#task-items tfoot td{font-weight:700;border-top:2px solid var(--line)}

/* ===== v5.63: Đề nghị xuất hóa đơn (DXH) — bố cục theo hóa đơn GTGT ===== */
.dxh{display:flex;flex-direction:column;gap:var(--s4)}
.dxh h3{margin:0 0 var(--s3);font-size:var(--fs);font-weight:700}
.dxh .mono{font-variant-numeric:tabular-nums;letter-spacing:.01em}
.dxh .warn-txt{color:var(--warn)}
.dxh-head{display:flex;flex-direction:column;gap:var(--s4)}
.dxh-head-top{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s4);align-items:flex-start;justify-content:space-between}
.dxh-title{display:flex;flex-direction:column;gap:var(--s1);min-width:0}
.dxh .eyebrow{font-size:var(--fs-sm);font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--accent)}
.dxh-idrow{gap:var(--s3);align-items:center}
.dxh-idrow h2{margin:0;font-size:var(--fs-xl);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.dxh-actions{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;justify-content:flex-end}
/* các bước: chấm + đường nối, chữ dưới chấm */
.dxh-steps{list-style:none;margin:0;padding:var(--s4) 0 0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));grid-auto-flow:column;gap:var(--s3)}
.dxh-steps .step{position:relative;display:flex;flex-direction:column;gap:var(--s2);min-width:0}
.dxh-steps .step:not(:last-child)::after{content:'';position:absolute;top:13px;left:36px;right:calc(-1 * var(--s3) + 4px);height:2px;background:var(--line)}
.dxh-steps .step.done:not(:last-child)::after{background:var(--ok)}
.dxh-steps .dot{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:var(--fs-sm);background:var(--surface);color:var(--faint);border:2px solid var(--line)}
.dxh-steps .step.done .dot{background:var(--ok-bg);color:var(--ok);border-color:var(--ok)}
.dxh-steps .step.cur .dot{background:var(--info-bg);color:var(--info);border-color:var(--info);box-shadow:0 0 0 4px var(--info-bg)}
.dxh-steps .step.err .dot{background:var(--err-bg);color:var(--err);border-color:var(--err);box-shadow:0 0 0 4px var(--err-bg)}
.dxh-steps .st-t{display:flex;flex-direction:column;gap:2px;min-width:0;overflow-wrap:anywhere}
.dxh-steps .step.todo strong{color:var(--faint);font-weight:600}
.dxh-steps .step.err strong{color:var(--err)}
.dxh-steps.off{opacity:.55}
.dxh-alert>div{display:flex;flex-direction:column;gap:2px}
/* hai cột: nội dung hóa đơn | tiến trình + trao đổi */
.dxh-cols{display:grid;gap:var(--s4)}
@media (min-width:1100px){ .dxh-cols{grid-template-columns:minmax(0,1.75fr) minmax(300px,1fr);align-items:start} }
.dxh-main,.dxh-side{min-width:0}
/* người mua | căn cứ */
.dxh-buyer{display:grid;gap:var(--s4)}
@media (min-width:720px){ .dxh-buyer{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)} .dxh-buyer .dxh-col+.dxh-col{border-left:1px solid var(--line);padding-left:var(--s4)} }
.dxh-dl{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:var(--s2) var(--s4);margin:0}
.dxh-dl dt{color:var(--soft)} .dxh-dl dd{margin:0;overflow-wrap:anywhere}
/* hàng hóa + tiền */
.dxh-goods{display:flex;flex-direction:column;gap:var(--s3)}
.dxh-hint{margin:0}
.dxh-tbl #task-items td.num,.dxh-tbl #task-items th.num{font-variant-numeric:tabular-nums}
.dxh-tbl #task-items .stt{width:2.5rem;color:var(--soft);text-align:center}
.dxh-tbl #task-items th.ten{min-width:0;white-space:normal}
.dxh-tbl #task-items td,.dxh-tbl #task-items td:nth-child(3){min-width:0}
.dxh-tbl #task-items th,.dxh-tbl #task-items td{padding-inline:var(--s2)}
.dxh-tbl #task-items .num-in{width:7.5rem}
.dxh-tbl #task-items td.dvt{width:3.5rem}
.dxh-tbl #task-items td.num>.small{margin-top:2px}
.dxh-sum{align-self:flex-end;width:min(100%,400px);display:flex;flex-direction:column;gap:2px}
.dxh-sum .sum-row{display:flex;justify-content:space-between;gap:var(--s4);padding:3px 0}
.dxh-sum .sum-row .num{font-variant-numeric:tabular-nums;white-space:nowrap}
.dxh-sum .sum-row.total{border-top:2px solid var(--ink);margin-top:var(--s1);padding-top:var(--s2);font-weight:700;font-size:var(--fs-lg)}
.dxh-sum .sum-words{font-style:italic;color:var(--soft);font-size:var(--fs-sm);text-align:right}
/* tiến trình theo thời gian */
.dxh-tl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.dxh-tl .tl-i{position:relative;display:grid;grid-template-columns:16px minmax(0,1fr);gap:var(--s3);padding-bottom:var(--s3)}
.dxh-tl .tl-i:not(:last-child)::before{content:'';position:absolute;left:7px;top:18px;bottom:2px;width:2px;background:var(--line)}
.dxh-tl .tl-dot{width:12px;height:12px;border-radius:50%;margin:4px 2px;background:var(--faint)}
.dxh-tl .tl-i.ok .tl-dot{background:var(--ok)} .dxh-tl .tl-i.info .tl-dot{background:var(--info)} .dxh-tl .tl-i.err .tl-dot{background:var(--err)} .dxh-tl .tl-i.warn .tl-dot{background:var(--warn)}
.dxh-tl .tl-i.now .tl-dot{box-shadow:0 0 0 4px var(--accent-weak)}
.dxh-tl .tl-h{gap:var(--s2);align-items:baseline}
.dxh-tl .tl-n{margin-top:2px;overflow-wrap:anywhere}
.dxh-tl .tl-i.err .tl-n{color:var(--err)}
/* trao đổi */
.dxh-thread{list-style:none;margin:0 0 var(--s3);padding:0;display:flex;flex-direction:column;gap:var(--s2);max-height:340px;overflow:auto}
.dxh-thread li{background:var(--surface-2);border-radius:var(--r-sm);padding:var(--s2) var(--s3);max-width:92%;overflow-wrap:anywhere}
.dxh-thread li.me{align-self:flex-end;background:var(--accent-weak)}
.dxh-thread li.empty-li{background:none;padding:0}
.dxh-compose{gap:var(--s2)}
/* điện thoại: nút chính rộng, bước xếp dọc, bảng thành thẻ */
@media (max-width:639px){
  .dxh-actions{width:100%;justify-content:stretch} .dxh-actions .btn{flex:1 1 auto}
  .dxh-steps{grid-auto-flow:row;grid-template-columns:1fr;gap:0}
  .dxh-steps .step{flex-direction:row;align-items:flex-start;gap:var(--s3);padding-bottom:var(--s3)}
  .dxh-steps .dot{flex:0 0 28px}
  .dxh-steps .step:not(:last-child)::after{top:30px;left:13px;right:auto;bottom:0;width:2px;height:auto}
  .dxh-tbl{border:0;background:none;overflow:visible}
  .dxh-tbl #task-items{min-width:0;width:100%;display:block}
  .dxh-tbl #task-items thead{display:none}
  .dxh-tbl #task-items tbody{display:flex;flex-direction:column;gap:var(--s2)}
  .dxh-tbl #task-items tr{display:grid;grid-template-columns:1fr;gap:var(--s2);padding:var(--s3);border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface)}
  .dxh-tbl #task-items th.ten{order:-1;padding:0;border:0;min-width:0}
  .dxh-tbl #task-items td{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:var(--s3);align-items:center;justify-items:end;text-align:right;padding:0;border:0;white-space:normal}
  .dxh-tbl #task-items td::before{content:attr(data-l);grid-row:1 / span 3;justify-self:start;align-self:start;color:var(--soft);font-size:var(--fs-sm);padding-top:4px}
  .dxh-tbl #task-items td.stt{display:none} .dxh-tbl #task-items td.dvt{width:auto}
  .dxh-tbl #task-items td.tt{font-weight:700}
  .dxh-tbl #task-items .num-in{width:9rem}
  .dxh-sum{width:100%}
}
/* v5.64: chọn người mua */
.buyer-pick{display:flex;gap:var(--s2);align-items:flex-start} .buyer-pick>.combo{flex:1 1 auto;min-width:0} .buyer-pick>.btn{flex:0 0 auto}
.dxh-colh{align-items:center;gap:var(--s2);margin-bottom:var(--s2)} .dxh-colh h3{margin:0}
.dxh-pick{display:flex;flex-direction:column;gap:var(--s1);margin-bottom:var(--s3);padding:var(--s3);border:1px dashed var(--accent);border-radius:var(--r-sm);background:var(--accent-weak)}
@media (max-width:639px){ .buyer-pick{flex-wrap:wrap} .buyer-pick>.btn{flex:1 1 100%} }

/* ===== màn lập đơn (od): [khách hàng | ngày tháng] → bảng hàng hóa → ghi chú/bằng chữ + tổng ===== */
.od{gap:var(--s3)} .od-top,.od-bot{display:grid;gap:var(--s3);grid-template-columns:minmax(0,1fr)} .od-bot>.stack{min-width:0}
.od-card{padding:var(--s3) var(--s4);display:grid;gap:var(--s3);align-content:start;min-width:0} .od-card .field{margin:0}
.od-h{font-size:var(--fs-sm);font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--soft);margin:0}
.od-pgrid,.od-docgrid{display:grid;gap:var(--s3);grid-template-columns:repeat(2,minmax(0,1fr));align-items:start} .od-pgrid>.od-w2{grid-column:1/-1} .od-pgrid>.od-s2{grid-column:span 2}
.od-docgrid>.docno{grid-column:1/-1;display:grid;gap:var(--s3);grid-template-columns:repeat(2,minmax(0,1fr))}
.od-off{display:none!important}
.od input[readonly]{background:var(--bg,#f6f7f9);color:var(--ink)}
.od-goods{padding:0;overflow:visible} .od-goods>.od-h{padding:var(--s3) var(--s4) 0}
.od-th{display:none}
.od-lines{display:block}
.oline{display:grid;gap:var(--s2) var(--s2);align-items:start;grid-template-columns:repeat(6,minmax(0,1fr)) 44px;grid-template-areas:"cd cd nm nm nm x" "sl sl dg dg ck ck" "dv av vt vt tt tt";padding:var(--s3) var(--s4);border-top:1px solid var(--line)}
.oline{grid-template-areas:"cd cd nm nm nm nm x" "sl sl dg dg ck ck ck" "dv av vt vt tv tv tv" "tt tt tt tt tt tt tt"} .oline.noav{grid-template-areas:"cd cd nm nm nm nm x" "sl sl dg dg ck ck ck" "dv dv vt vt tv tv tv" "tt tt tt tt tt tt tt"}
.oline .field,.oline .o-sl,.oline .o-dg,.oline .o-ck{margin:0} .oline .o-no{display:none}
.oline .o-cd{grid-area:cd;min-width:0} .oline .o-nm{grid-area:nm;min-width:0} .oline .o-x{grid-area:x;align-self:end} .oline .o-sl{grid-area:sl} .oline .o-dg{grid-area:dg} .oline .o-ck{grid-area:ck} .oline .o-dv{grid-area:dv} .oline .o-av{grid-area:av} .oline .o-vt{grid-area:vt} .oline .o-tt{grid-area:tt} .oline .o-tv{grid-area:tv}
.oline .lbl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block} .oline .num-in{text-align:right}
.od-ro{min-height:44px;display:flex;align-items:center;min-width:0;overflow-wrap:anywhere;line-height:1.3} .od-ro.num,.oline .o-tt>.num{justify-content:flex-end;font-variant-numeric:tabular-nums} .od-ro.low{color:var(--danger,#b42318);font-weight:700}
.oline .o-tv .lbl,.oline .o-vt .lbl,.oline .o-tt .lbl,.oline .o-av .lbl{text-align:right} .oline .o-tt>.num{min-height:44px;display:flex;align-items:center;font-weight:700} .oline .o-tv>.num{min-height:44px;display:flex;align-items:center;justify-content:flex-end;font-variant-numeric:tabular-nums}
.od-foot{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);align-items:center;padding:var(--s3) var(--s4);border-top:1px solid var(--line)} .od-foot .hint{font-size:var(--fs-sm);color:var(--soft)}
.od-bot .sum{max-width:none;margin:0;display:block;padding:var(--s3) var(--s4)} .od-bot .sum .row{display:flex;flex-direction:row;align-items:baseline;padding:var(--s1) 0;min-width:0} .od-bot .sum .row .grow{flex:1;font-size:inherit;color:inherit}
.od-bot .sum .total{border-top:2px solid var(--ink);margin-top:var(--s2);padding-top:var(--s2);font-size:var(--fs-lg)}
.od-words{font-style:italic;color:var(--soft);font-size:var(--fs-sm)} .od-words:empty{display:none}
.od textarea.input{min-height:calc(var(--tap) * 1.6);resize:vertical}
@media (min-width:900px){ .od-top{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)} .od-bot{grid-template-columns:minmax(0,1fr) minmax(300px,380px);align-items:start} .od-pgrid{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (min-width:1100px){
  .od-th,.oline{grid-template-columns:34px 200px minmax(150px,1fr) 56px 104px 92px 116px 60px 56px 120px 104px 36px;grid-template-areas:"no cd nm dv av sl dg ck vt tt tv x";gap:0 var(--s2);align-items:center}
  .od-th.noav,.oline.noav{grid-template-columns:34px 200px minmax(150px,1fr) 56px 92px 116px 60px 56px 120px 104px 36px;grid-template-areas:"no cd nm dv sl dg ck vt tt tv x"}
  .od-th{display:grid;padding:var(--s2) var(--s4);background:var(--bg,#f6f7f9);border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--soft)}
  .od-th>span{min-width:0} .od-th>span:nth-child(n+5){text-align:right} .od-th.noav>span:nth-child(n+5){text-align:right}
  .oline{padding:var(--s1) var(--s4)} .oline:first-child{border-top:0}
  .oline .field>.lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .oline .o-no{display:flex;grid-area:no;align-items:center;justify-content:center;color:var(--soft);font-size:var(--fs-sm)}
  .oline .o-x{align-self:center}
}

@media (min-width:900px){
  .oline .input,.oline .od-ro,.oline .o-tt>.num,.oline .o-tv>.num{min-height:36px;height:36px;border-radius:6px}
  .oline{padding-top:2px;padding-bottom:2px}
  .od-th>span:nth-child(n+5){padding-right:13px}
  .oline .od-ro.num,.oline .o-tt>.num,.oline .o-tv>.num{padding-right:13px;box-sizing:border-box}
}
.actbar{padding-left:var(--s3);padding-right:var(--s3)}
.od-right{min-width:0} .od-note .field>.lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)} .od-note textarea{min-height:96px;width:100%}

/* dòng số lượng: nhãn một dòng, nhãn + số cột số căn phải, số thẳng hàng với ô nhập */
.sline .field>.lbl,.mline .field>.lbl,.cline .field>.lbl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sline .s-rm .lbl,.sline .s-tn .lbl,.mline .m-rm .lbl,.cline .c-bk .lbl,.cline .c-ct .lbl,.cline .c-df .lbl{text-align:right}
.sline .s-sl .lbl,.mline .m-sl .lbl{text-align:right} .sline .num-in,.mline .num-in{text-align:right}
@media (min-width:720px){.sline{grid-template-columns:minmax(0,1fr) 100px 100px 140px}.sline.sin{grid-template-columns:minmax(0,1fr) 100px 140px}}

/* v5.128: nhóm nút theo mức độ — Hủy / Từ chối đẩy sát phải, nút khóa có biểu tượng khóa, lệnh chờ duyệt màu xanh dương */
#ord-cancel,#ship-cancel,#task-reject{margin-left:auto}
.btn.is-locked::before{content:"\1F512";font-size:.85em;margin-right:4px;opacity:.8}
/* v5.130: màu nút lệnh theo việc — xanh (màu cờ "cần làm") = việc của tôi; vàng = đang chờ bên khác; trắng = hoàn thành. Diễn giải nằm ở tooltip. */
.cmd-grp{display:contents}
.btn.cmd-open.is-open{background:var(--warn-bg);border-color:var(--warn);color:var(--ink)}
.btn.cmd-open.is-done{background:var(--surface);border-color:var(--line);color:var(--ink)}
.btn.is-todo,.btn.cmd-open.is-reject{background:var(--accent-weak);border-color:var(--accent);color:var(--accent)}
.btn.is-todo:hover,.btn.cmd-open.is-reject:hover{background:var(--accent-weak);filter:brightness(.97)}
.btn.is-locked::before{content:"\1F512";font-size:.85em;margin-right:4px;opacity:.8}

/* v5.131: bảng màu thống nhất toàn app — XANH (màu cờ cần làm) = việc của tôi; VÀNG = đang chờ bên khác; TRẮNG = hoàn thành; ĐỎ = lỗi / từ chối / hủy */
.tabs .btn.tab-lam{background:var(--accent-weak);border-color:var(--accent);color:var(--accent)}
.tabs .btn.tab-cho{background:var(--warn-bg);border-color:var(--warn);color:var(--ink)}
.tabs .btn.tab-xong,.tabs .btn.tab-all{background:var(--surface);border-color:var(--line);color:var(--ink)}
.tabs .btn.is-sel{font-weight:800;box-shadow:inset 0 -3px 0 currentColor}
/* v5.132: mẫu in theo TT 99/2025/TT-BTC (01-VT, 02-VT, 05-TT) và 03/XKNB */
.pdoc .pf-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:6px}
.pdoc .pf-mau{text-align:center;max-width:46%} .pdoc .pf-mau .small{font-size:.78em;font-style:italic}
.pdoc .pf-no,.pdoc .pf-date{text-align:center} .pdoc .pf-nc{text-align:right;font-size:.9em}
.pdoc .pf-line{margin:3px 0;overflow-wrap:anywhere} .pdoc .pf-dots{color:#555;letter-spacing:1px;overflow:hidden} .pdoc .pf-val{font-weight:600}
.pdoc .pf-tbl th{text-align:center;vertical-align:middle;font-size:.9em} .pdoc .pf-tbl .ctr{text-align:center} .pdoc .pf-tbl tbody td{height:24px} .pdoc .pf-letters th{font-weight:400}
.pdoc .pf-date{text-align:right;font-style:italic;margin-top:8px} .pdoc .pf-sign strong{display:block}
.pdoc .pf-date.c{text-align:center;margin-top:0;font-style:normal}
/* v5.133 sổ nhật ký phát sinh: A4 ngang, tiêu đề bảng lặp lại mỗi trang */
.pso-tbl{font-size:.82rem} .pso-tbl thead{display:table-header-group} .pso-tbl tr{page-break-inside:avoid} .pso-tbl td,.pso-tbl th{padding:3px 5px}
.pf-title{text-align:center;margin:10px 0 2px}
@page so{size:A4 landscape;margin:10mm}
@media print{.pso{page:so}}
/* v5.137 rà soát đa thiết bị: cảm ứng, Safari, bàn phím ảo, tai thỏ ngang */
html{color-scheme:light dark} :root[data-theme="light"]{color-scheme:light} :root[data-theme="dark"]{color-scheme:dark}
body{min-height:100vh;min-height:100dvh} #app{min-height:100vh;min-height:100dvh}
.topbar{padding-left:max(var(--gutter),env(safe-area-inset-left));padding-right:max(var(--gutter),env(safe-area-inset-right))}
.main{padding-left:max(var(--gutter),env(safe-area-inset-left));padding-right:max(var(--gutter),env(safe-area-inset-right))}
.nav{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
a,button,.btn,.chip,[role=tab],select,summary,label.row,input[type=checkbox],input[type=radio]{touch-action:manipulation}
html{scroll-padding-block:96px}
@media (hover:none){
  .btn:hover{background:var(--surface)} .btn.primary:hover{background:var(--accent)} .btn.danger:hover{background:var(--surface)} .dialog .btn.danger:hover{background:var(--err-solid)}
  .input:hover:not([readonly]):not(:disabled){border-color:var(--line)}
}
@media (pointer:coarse){
  :root{--tap:48px}
  .btn:active{background:var(--surface-2);transform:scale(.97)} .btn.primary:active{background:var(--accent-hover)} .btn.danger:active{background:var(--err-bg)}
  .nav a:active{background:var(--accent-weak)} .tbl tbody tr:active>*{background:var(--accent-weak)}
  .chip,button.chip,.bd-chip,.pg-bar .btn,.combo-add,.lbar .btn,.tabs .btn,.chat-compose .btn{min-height:44px}
  .chat-chip{min-height:36px} .nav a{font-size:.8125rem} .small{font-size:.9rem}
}
@media (max-width:1023.98px){
  body:has(input:focus:not([type=checkbox]):not([type=radio]),textarea:focus,select:focus) .nav{display:none}
  body:has(input:focus:not([type=checkbox]):not([type=radio]),textarea:focus,select:focus) .actbar{bottom:0}
}
@media (orientation:landscape) and (max-height:500px){ .main{padding-top:var(--s2)} .nav a{min-height:48px;flex-direction:row;gap:var(--s2)} :root{--nav-h:48px} }

/* v5.145 — dòng hàng dạng thẻ (điện thoại / máy tính bảng < 1100px) */
.o-steps,.o-stp{display:none} .o-px,.o-wn,.oline .o-warn{display:none}
@media (max-width:1099px){
  .oline,.oline.noav{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-areas:"cd cd cd x" "nm nm nm nm" "sl sl sl sl" "dg dg ck ck" "wn wn wn wn" "dv vt tv tv" "tt tt tt tt";border:1px solid var(--line);border-radius:12px;margin:var(--s2) var(--s3);padding:var(--s3);background:var(--card,#fff)}
  .oline .o-nm{margin-top:calc(-1 * var(--s1))} .oline .o-nm .lbl{display:none} .oline .o-nm .od-ro{min-height:0;color:var(--soft);font-size:var(--fs-sm)}
  .oline .o-x{justify-self:end;min-width:44px;min-height:44px} .oline .o-av{display:none}
  .oline .o-sl{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s2);align-items:end} .o-steps{display:flex;gap:var(--s1)} .o-stp{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0;font-size:1.25rem;font-weight:700}
  .oline .o-sl .input,.oline .o-dg .input{min-height:48px;font-size:1.0625rem}
  .oline .input,.oline .combo{width:100%;box-sizing:border-box} .oline .o-sl>.field,.oline .o-dg>.field,.oline .o-ck>.field{min-width:0;width:100%} .oline .o-cd,.oline .o-cd .combo{min-width:0}
  .o-wn{display:block;grid-area:wn;font-size:var(--fs-sm);color:var(--soft)} .o-wn:empty{display:none} .o-wn.low{color:var(--danger,#b42318);font-weight:700}
  .o-wn.low .od-ro-av::before{content:'⚠ '}
  .o-px{display:block;margin-top:var(--s1)} .o-px:empty{display:none} .o-pxb{border:0;background:none;padding:var(--s1) 0;min-height:32px;color:var(--link,#0a58ca);font-size:var(--fs-sm);text-align:left;text-decoration:underline}
  .o-px .o-warn{display:block;font-size:var(--fs-sm);color:var(--soft)} .o-px .o-warn.low{color:var(--danger,#b42318);font-weight:700}
  .oline .o-tt>.num{justify-content:flex-start;font-size:1.0625rem} .oline .o-tt .lbl,.oline .o-tv .lbl,.oline .o-vt .lbl{text-align:left}
  .oline .o-tt{border-top:1px dashed var(--line);padding-top:var(--s2)} .oline .o-tv>.num{justify-content:flex-start}
  .od-foot{position:static} .od-foot .btn{min-height:48px;flex:1 1 auto} .od-foot .hint{flex:1 1 100%}
}
@media (pointer:coarse) and (max-width:699px){ .od-multi{display:none} }
.input.is-warn{border-color:var(--danger,#b42318)}
@media (min-width:1100px){ .o-wn{display:none} .oline .o-px{display:none} }

/* v5.146 — tem QR theo mã hàng (in A4) */
.tem-sel{width:auto;min-width:150px} .tem-sheet{display:grid;grid-template-columns:repeat(var(--tc,3),minmax(0,1fr));background:#fff;color:#000;max-width:210mm;margin:var(--s3) auto 0}
.tem{display:flex;align-items:center;gap:3mm;padding:2.5mm;border:1px dashed #b8bec6;min-height:calc(var(--qs,24mm) + 8mm);break-inside:avoid}
.tem-qr{flex:0 0 var(--qs,24mm)} .tem-qr svg{width:var(--qs,24mm);height:var(--qs,24mm);display:block} .tem-t{min-width:0;font-size:9pt;line-height:1.25;overflow-wrap:anywhere} .tem-t strong{font-size:10.5pt}
@media print{ .tem-sheet{margin:0;max-width:none} .tem{border-color:#ccc} }
.tem-sel{flex:0 0 auto !important} .tem-ck{display:inline-flex;align-items:center;gap:6px;min-height:44px} .tem-ck input{width:20px;height:20px}
/* v5.155 danh sách đơn: không tràn ngang, ô dài tối đa 2 dòng */
.clamp2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;white-space:normal}
.ord-table .tbl td.c-cus{max-width:260px;overflow:visible}
.ord-table .tbl td.it-name{min-width:150px;max-width:300px;white-space:normal;overflow:visible;text-overflow:clip}
.ord-table .badge{white-space:normal;max-width:220px;text-align:left}
.tbl.hp3 .c-p3,.tbl.hp2 .c-p3,.tbl.hp2 .c-p2,.tbl.hp1 .c-p3,.tbl.hp1 .c-p2,.tbl.hp1 .c-p1{display:none}
/* v5.156 bảng dùng chung: ô chữ dài tối đa 2 dòng, cột đầu dính khi cuộn ngang */
.tbl td .cf-t{max-width:320px;min-width:120px}
.tbl-wrap .tbl tr>:first-child{position:sticky;left:0;z-index:1}
.tbl-wrap .tbl tbody tr>:first-child{background:var(--surface)}
.tbl-wrap .tbl thead tr>:first-child{z-index:3}
.tbl tbody tr:hover>:first-child{background:var(--accent-weak)}
/* v5.157 form lập đơn (PC): cột hàng hóa co giãn theo bề rộng khung; thiếu chỗ thì ẩn Tiền thuế rồi Thuế % (xem trong tổng thuế); tổng thanh toán luôn hiện ở thanh lưu */
.od-goods{container:odg / inline-size}
@media (min-width:1100px){
  .od-th,.oline{grid-template-columns:34px minmax(190px,1.2fr) minmax(130px,2fr) 52px 100px 84px minmax(90px,1fr) 52px 74px minmax(100px,1.1fr) minmax(90px,1fr) 36px}
  .od-th.noav,.oline.noav{grid-template-columns:34px minmax(190px,1.2fr) minmax(130px,2fr) 52px 84px minmax(90px,1fr) 52px 74px minmax(100px,1.1fr) minmax(90px,1fr) 36px}
}
@media (min-width:1100px){
@container odg (max-width:1130px){
  .od-th,.oline{grid-template-columns:34px minmax(170px,1.1fr) minmax(130px,2fr) 52px 100px 84px minmax(90px,1fr) 52px 74px minmax(100px,1.1fr) 36px;grid-template-areas:"no cd nm dv av sl dg ck vt tt x"}
  .od-th.noav,.oline.noav{grid-template-columns:34px minmax(170px,1.1fr) minmax(130px,2fr) 52px 84px minmax(90px,1fr) 52px 74px minmax(100px,1.1fr) 36px;grid-template-areas:"no cd nm dv sl dg ck vt tt x"}
  .oline .o-tv,.od-th .th-tv{display:none}
}
@container odg (max-width:1010px){
  .od-th,.oline{grid-template-columns:34px minmax(170px,1.1fr) minmax(130px,2fr) 52px 100px 84px minmax(90px,1fr) 52px minmax(100px,1.1fr) 36px;grid-template-areas:"no cd nm dv av sl dg ck tt x"}
  .od-th.noav,.oline.noav{grid-template-columns:34px minmax(170px,1.1fr) minmax(130px,2fr) 52px 84px minmax(90px,1fr) 52px minmax(100px,1.1fr) 36px;grid-template-areas:"no cd nm dv sl dg ck tt x"}
  .oline .o-vt,.od-th .th-vt{display:none}
}
}
/* v5.158 nút Cột (chọn cột hiển thị) cho bảng trên PC */
.col-off{display:none !important}
.tbl-tools{display:flex;justify-content:flex-end;position:relative;margin-bottom:var(--s1)}
.col-btn{min-height:30px}
.col-pop{position:absolute;right:0;top:100%;z-index:60;min-width:220px;max-height:60vh;overflow:auto;background:var(--surface,#fff);border:1px solid var(--line);border-radius:var(--r-sm,8px);box-shadow:0 8px 24px rgba(0,0,0,.18);padding:var(--s2);display:flex;flex-direction:column;gap:var(--s1)}
.col-pop[hidden]{display:none}
.col-it{display:flex;align-items:center;gap:var(--s2);min-height:32px;cursor:pointer;white-space:nowrap}
@media (max-width:1099px){.tbl-tools{display:none}}
/* v5.159 PC ≥1440px: danh sách + chi tiết cạnh nhau (Đơn bán/mua, Điều vận, Việc) */
.split{display:grid;grid-template-columns:minmax(380px,32%) minmax(0,1fr);gap:var(--s4);align-items:start}
.split-list{position:sticky;top:calc(var(--top-h,57px) + var(--s3));max-height:calc(100dvh - var(--top-h,57px) - var(--s5));overflow:auto;overscroll-behavior:contain;padding-right:2px}
.split-list .ord-cards{display:block !important} .split-list .ord-table,.split-list .pg-bar,.split-list .tbl-tools{display:none !important}
.split-list .is-open>.ord-link,.split-list li.is-open,.split-list tr.is-open>*{background:var(--accent-weak)}
.split-list li.is-open{outline:2px solid var(--accent);outline-offset:-2px;border-radius:var(--r-sm,8px)}
.split-detail{min-width:0}
.split-detail{container:spd / inline-size}
@container spd (max-width:1100px){


}
/* v5.160 phím tắt */
.nav-help{margin-top:0 !important}
.kbd{display:inline-block;min-width:2.2em;padding:2px 8px;border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;background:var(--surface-2);font:600 .85em/1.4 ui-monospace,Menlo,Consolas,monospace;white-space:nowrap}
.tbl td .cf-t{min-width:150px}

/* v5.161 màn Lệnh: không ngắt mã chứng từ, tên khách tối đa 2 dòng, trạng thái ngắn, tự ẩn cột phụ, nhóm hàng chip, chú giải */
.tbl td.chain a,.tbl td.chain strong{white-space:nowrap;display:inline}
.tbl td.chain{min-width:0}
#task-table td:nth-child(3){min-width:0}
#task-table td.party{min-width:150px;max-width:260px}
#task-table td.sender{min-width:120px}
#task-table th.num{text-align:right}
.st-cell{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0} .st-cell .badge{max-width:100%}
.tbl-wrap .tbl tbody tr.cmd-row>td{background:var(--surface-2,#f7f8fa);border-top:0;padding-left:var(--s5,28px)}
.tbl tr.cmd-row .rel-l{margin-right:var(--s2);white-space:nowrap}
.tbl tbody tr:has(+.cmd-row)>*{border-bottom-color:transparent}
.tbl-wrap .tbl tbody tr.cmd-row:hover>*{background:var(--surface-2,#f7f8fa)}
.legend{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);align-items:center}
.legend .lg::before{content:"";display:inline-block;width:12px;height:12px;border-radius:4px;margin-right:6px;vertical-align:-1px;border:1px solid var(--line)}
.legend .lg-todo::before{background:var(--accent-weak);border-color:var(--accent)} .legend .lg-open::before{background:var(--warn-bg);border-color:var(--warn)} .legend .lg-done::before{background:var(--surface)}
.legend .lg-r::before{background:var(--err-solid);border-radius:999px;border-color:transparent} .legend .lg-b::before{background:var(--accent);border-radius:999px;border-color:transparent}
.tbl-tools.in-bar{margin:0;flex:none}
@media (min-width:1100px){ .task-wrap .tbl td,.ord-table .tbl td{padding-block:6px} .task-wrap .tbl td.cmd-row,.tbl tr.cmd-row>td{padding-block:5px} }
/* v5.164 hàng tab dài gom "Khác ▾"; bảng bảng điện tử: số 0 thành "–", cột dính có bóng, hàng đều nhau; ô tích dễ bấm; bảng hàng của đơn không tràn */
.tab-more{flex:none;position:relative}
.tab-pop{position:fixed;min-width:200px;max-height:70vh;overflow:auto;gap:4px;padding:var(--s2)}
.tab-pop:not([hidden]){display:flex;flex-direction:column}
.tab-pop .btn{justify-content:flex-start;width:100%;white-space:nowrap}
.board .bd-sumtbl td.z b{font-size:0}
.board .bd-sumtbl td.z b::before{content:"–";font-size:1rem;font-weight:500}
.board .bd-tbl td.z:not(:has(*)){font-size:0}
.board .bd-tbl td.z:not(:has(*))::before{content:"–";font-size:.82rem}
.board .bd-sumtbl tbody th.code{box-shadow:2px 0 0 var(--bd-line),6px 0 8px -4px rgba(0,0,0,.6)}
.board .bd-sumtbl tbody td{height:46px}
.main label:has(>input[type=checkbox]){display:inline-flex;align-items:center;gap:var(--s2);min-height:32px;cursor:pointer}
.main input[type=checkbox]{width:18px;height:18px}
.det-items td:nth-child(2){min-width:150px;white-space:normal}

/* v5.165 GD CHI TIET 2: ô chọn đơn thay cột danh sách; chi tiết rộng toàn bộ; mặt hàng dạng thẻ trên điện thoại */
.split{display:block}
.split-bar{position:relative;display:flex;align-items:center;gap:var(--s3);margin-bottom:var(--s3)}
.split-pick{min-height:36px;font-weight:600} .split-n{font-variant-numeric:tabular-nums}
.split-list[hidden]{display:none}
.split-list{position:absolute;top:calc(100% + 6px);left:0;z-index:40;width:min(440px,92vw);max-height:min(70vh,720px);padding:var(--s3);background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.18)}
.ord-tong{font-size:1.35rem;color:var(--accent)} .ord-sub{font-size:var(--fs-md,1rem)}
@media (max-width:859.98px){
  .det-items .tbl-wrap,.det-items{overflow:visible}
}
/* v5.168 dòng phụ của bảng Công việc: "Lệnh - Tham chiếu" (xám, chỉ số chứng từ) khác "Thao tác" (xanh nhạt, nút làm việc) khác ô số hóa đơn */
.tbl-wrap .tbl tbody tr.ref-row>td{background:var(--surface-2,#f7f8fa)}
.tbl-wrap .tbl tbody tr.act-row>td,.tbl-wrap .tbl tbody tr.act-row:hover>*{background:var(--accent-weak)}
.tbl tr.act-row .rel-l{color:var(--accent);font-weight:600} .tbl tr.ref-row .rel-l{color:var(--soft)}
/* STT dòng (5.174): cột số thứ tự bằng CSS counter — không thêm ô DOM nên không lệch nth-child, cột chọn, sắp xếp; dòng phụ (colspan) không đánh số; pager.js đặt --stt0 để nối số qua trang */
.tbl-wrap:not(.det-items):not(.dxh-tbl):not(.no-stt):not(.dialog *):not(.pdoc *) .tbl:not(.dxh-form-tbl):not(.bd-tbl):not(.stk-board) tbody{counter-reset:stt var(--stt0,0)}
.tbl-wrap:not(.det-items):not(.dxh-tbl):not(.no-stt):not(.dialog *):not(.pdoc *) .tbl:not(.dxh-form-tbl):not(.bd-tbl):not(.stk-board) tbody tr:not(:has(>[colspan])){counter-increment:stt}
.tbl-wrap:not(.det-items):not(.dxh-tbl):not(.no-stt):not(.dialog *):not(.pdoc *) .tbl:not(.dxh-form-tbl):not(.bd-tbl):not(.stk-board) tbody tr:not(:has(>[colspan]))>:first-child::before,
.tbl-wrap:not(.det-items):not(.dxh-tbl):not(.no-stt):not(.dialog *):not(.pdoc *) .tbl:not(.dxh-form-tbl):not(.bd-tbl):not(.stk-board) thead tr:first-child>:first-child::before{position:absolute;left:var(--s3);top:50%;transform:translateY(-50%);min-width:1.8em;text-align:right;color:var(--soft);font-size:.85em;font-weight:500;font-variant-numeric:tabular-nums;line-height:1}
.tbl-wrap:not(.det-items):not(.dxh-tbl):not(.no-stt):not(.dialog *):not(.pdoc *) .tbl:not(.dxh-form-tbl):not(.bd-tbl):not(.stk-board) tbody tr:not(:has(>[colspan]))>:first-child::before{content:counter(stt)}
.tbl-wrap:not(.det-items):not(.dxh-tbl):not(.no-stt):not(.dialog *):not(.pdoc *) .tbl:not(.dxh-form-tbl):not(.bd-tbl):not(.stk-board) thead tr:first-child>:first-child::before{content:"STT"}
.tbl-wrap:not(.det-items):not(.dxh-tbl):not(.no-stt):not(.dialog *):not(.pdoc *) .tbl:not(.dxh-form-tbl):not(.bd-tbl):not(.stk-board) tbody tr:not(:has(>[colspan]))>:first-child,.tbl-wrap:not(.det-items):not(.dxh-tbl):not(.no-stt):not(.dialog *):not(.pdoc *) .tbl:not(.dxh-form-tbl):not(.bd-tbl):not(.stk-board) thead tr:first-child>:first-child{padding-left:calc(var(--s3) + 2.5em)}

/* ===== 5.176 chuẩn hóa giao diện (design system dùng chung) ===== */
/* 1) Ô tích: bản cũ ép 18px nhưng ::before lùi 11px nên hộp xẹp thành chấm nhỏ — ô tích gần như vô hình ở mọi màn trong .main. Dựng lại: hộp 20px, vùng bấm do nhãn bao (≥44px khi cảm ứng). */
.main input[type=checkbox],.main input[type=radio]{width:22px;height:22px;flex:none}
.main input[type=checkbox]::before{inset:2px;border-width:2px;border-radius:5px}
.main input[type=checkbox]:checked::after{left:8px;top:4px;width:6px;height:11px}
.main input[type=checkbox]:hover::before{border-color:var(--accent)}
.main label:has(>input[type=checkbox]),.main label.row:has(input[type=checkbox]){min-height:36px;gap:var(--s2)}
@media (pointer:coarse){.main label:has(>input[type=checkbox]),.main label.row:has(input[type=checkbox]){min-height:var(--tap)}}
/* 2) Thanh lọc danh sách (đơn bán / mua): ô "Khác…" không chiếm cả dòng; chip một hàng, điện thoại cuộn ngang thay vì xuống 3 hàng */
select.input.more-sel{width:auto;min-width:150px;flex:none}
.lbar>[role=group]{gap:var(--s2);align-items:center}
@media (max-width:719px){
  .lbar>[role=group]{flex:1 1 100%;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
  .lbar>[role=group]::-webkit-scrollbar{display:none}
  .lbar>[role=group]>*{flex:none}
}
/* 3) Dải tổng hợp công nợ: các số tách nhau rõ, tự xuống dòng */
#debt-sum{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s5);justify-content:flex-end;padding:var(--s2) var(--s1)}
@media (max-width:719px){#debt-sum{justify-content:flex-start}}

@media (min-width:1100px){.lbar>.grow{flex:1 1 140px;min-width:140px}}

/* 5.177: chi tiết lệnh — dải Yêu cầu / Đã lập phiếu / Còn lại; chứng từ liên quan */
.sum-strip{display:flex;flex-wrap:wrap;gap:var(--s3)}
.sum-c{flex:1 1 120px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:var(--s2) var(--s3);display:flex;flex-direction:column}
.sum-c b{font-size:var(--fs-lg,1.25rem)}
.sum-c.ok b{color:var(--ok)} .sum-c.warn b{color:var(--warn)}
#task-shipped .chip,.ds-card a.chip{text-decoration:none;min-height:36px}

/* 5.178: khung chung màn chi tiết chứng từ (public/js/docshell.js) */
.ds-shell{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s3)}
.ds-main,.ds-side{display:flex;flex-direction:column;gap:var(--s3);min-width:0}
@media (min-width:1100px){.ds-shell{grid-template-columns:minmax(0,1fr) 340px;align-items:start}.ds-shell>.ds-back,.ds-shell>.ds-head{grid-column:1/-1}}
.ds-head{display:flex;flex-direction:column;gap:var(--s3);padding:var(--s3) var(--s4)}
.ds-top{display:flex;gap:var(--s3) var(--s4);align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.ds-id{min-width:0;flex:1 1 320px}
.ds-line{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap}
.ds-code{margin:0;font-size:var(--fs-xl);line-height:1.2;overflow-wrap:anywhere}
.ds-sub{color:var(--soft);margin-top:var(--s1)}
.ds-act{display:flex;gap:var(--s2);flex-wrap:wrap;justify-content:flex-end;align-items:center}
@media (max-width:719px){.ds-act{width:100%;justify-content:stretch}.ds-act>*{flex:1 1 auto;text-align:center}}
.ds-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--s2) var(--s4)}
.ds-fact small,.ds-sc small{display:block;color:var(--faint)} .ds-fact b{font-weight:600;overflow-wrap:anywhere}
.ds-sum{display:flex;flex-wrap:wrap;gap:var(--s3)}
.ds-sc{flex:1 1 140px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r);padding:var(--s2) var(--s3)}
.ds-sc b{font-size:var(--fs-lg)} .ds-sc.ok b{color:var(--ok)} .ds-sc.warn b{color:var(--warn)}
.ds-card{padding:0;gap:0;overflow:hidden}
.ds-ch{display:flex;align-items:center;gap:var(--s3);padding:var(--s2) var(--s4);border-bottom:1px solid var(--line);background:var(--surface-2);min-height:40px}
.ds-t{margin:0;font-size:var(--fs);flex:1;min-width:0}
.ds-tools{display:flex;gap:var(--s2);align-items:center;color:var(--faint);font-size:var(--fs-sm)}
.ds-cb{padding:var(--s3) var(--s4);display:flex;flex-direction:column;gap:var(--s2)}
.ds-cb.flush{padding:0;gap:0} .ds-cb.flush .tbl-wrap{border:0;border-radius:0}
.ds-kv{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:var(--s1) var(--s4);margin:0}
.ds-kv dt{color:var(--faint)} .ds-kv dd{margin:0;overflow-wrap:anywhere}
.ds-side .list{margin:0}

/* 5.181: khối thanh toán trong khung chung */
.ds-pay .row{justify-content:space-between;align-items:baseline}
.ds-pay .row.total{border-top:1px solid var(--line);padding-top:var(--s2);font-size:var(--fs-lg)}

/* 5.182: hộp chọn chứng từ gọn — số chứng từ · khách hàng · mã hàng + số lượng */
.pick-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:var(--s1)}
.pick-it{display:grid;gap:2px;padding:var(--s2) var(--s3);border:1px solid var(--line);border-radius:var(--r-sm,8px);background:var(--surface);color:inherit;text-decoration:none}
.pick-it:hover{background:var(--surface-2)}
.split-list li.is-open .pick-it{background:var(--accent-weak);border-color:var(--accent)}
.pk-party{color:var(--soft);overflow-wrap:anywhere}
.pk-items{display:flex;flex-wrap:wrap;gap:2px var(--s3);font-size:var(--fs-sm);color:var(--soft)}
.pk-i b{font-weight:600;color:var(--ink)}
.split-list .pick-list li.is-open{outline:0;background:none}
.pick-it:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pick-list li{border:0;padding:0;background:none;box-shadow:none}

/* 5.184: lưới/hàng bên trong .stack không được thừa margin-top của .stack>*+* (cột sau bị lệch xuống so với cột đầu) */
@media (min-width:1100px){.acct>*,.debt-card>*,.cnt-xn>*,.co-form>*{margin-top:0}}

/* B112: dòng tiêu đề cột có màu nền riêng (bảng .tbl, lưới dòng hàng .od-th); bảng bảng điện tử tối (.bd-tbl, .stk-board) giữ màu riêng */
:root{--th-bg:color-mix(in srgb,var(--accent) 13%,var(--surface));--th-ink:var(--ink)}
.tbl thead th,.od-th{background:var(--th-bg);color:var(--th-ink);border-bottom:1px solid color-mix(in srgb,var(--accent) 28%,var(--line))}
.od-th{border-top:1px solid color-mix(in srgb,var(--accent) 28%,var(--line))}

/* B113: chia cột theo nội dung (tblfit.js sizeCols) — thay quy tắc cũ "cột 3 rộng 200px / mọi ô tối thiểu 80px" */
.tbl td.c-nw{white-space:nowrap} .tbl td.c-tx{min-width:14em}
.tbl th.c-hw{white-space:normal;min-width:7em;line-height:1.25;vertical-align:middle}
.tbl tbody tr.strong{counter-increment:none!important} .tbl tbody tr.strong>:first-child::before{content:none!important} .tbl tbody tr.strong>:first-child{padding-left:var(--s3)!important}
.tbl.t-dense th,.tbl.t-dense td{padding-inline:var(--s2)}
.tbl td.c-nw .clamp2{white-space:nowrap}
.tbl.t-tight{font-size:.9em} .tbl.t-tight th,.tbl.t-tight td{padding-inline:6px}
.tbl td.c-nw *{white-space:nowrap}
.tbl.tw td.c-nw:not(.it-code):not(.num){white-space:normal} .tbl.tw td.c-nw:not(.it-code):not(.num) *{white-space:normal} .tbl.tw td.c-nw .badge,.tbl.tw td.c-nw .chip{white-space:nowrap!important}
/* v5.193 PC ≥1100px: gọn chiều dọc — ô lọc/nhãn cùng hàng, hàng bảng thấp, nút Cột chung hàng với dòng đếm */
@media (min-width:1100px){
  :root{--tap:32px}
  .main{padding-top:var(--s2)} .main .stack{gap:6px} .main h1{margin-bottom:2px}
  .drange-f,.stk-filters>.drange-f{display:flex;flex-direction:row;align-items:center;gap:6px;margin:0} .drange-f>.lbl{margin:0;white-space:nowrap;font-size:var(--fs-sm)} .drange-f>.input,.drange-f>.combo{flex:1 1 auto;min-width:0}
  .stk-filters,.grid3.stk-filters,.rp-ctl,.filt-row{display:flex;flex-wrap:wrap;gap:6px var(--s3);align-items:center} .stk-filters>.drange-f{flex:1 1 200px}
  .drange{gap:6px var(--s3)} .drange .input,.lbar .input,.stk-filters .input,.rp-ctl .input,.filt-row .input{min-height:32px;padding-block:3px}
  .tabs .btn,.lbar .btn,.chip,button.chip{min-height:30px} .tabs{padding-bottom:0;gap:6px}
  .tbl th,.tbl td{padding:3px var(--s3);line-height:1.3} .task-wrap .tbl td,.ord-table .tbl td{padding-block:3px}
  .tbl .btn,.tbl td[colspan] .btn{min-height:24px} .tbl td .badge,.tbl td .chip{padding-block:1px}
  .tbl-tools{margin:0} .col-btn{min-height:26px;padding:0 var(--s3)}
  .tbl-tools.in-line{height:0;position:relative;z-index:3} .tbl-tools.in-line>.col-btn{position:absolute;right:0;top:-2px}
  .tbl-tools.in-line+.muted.small{min-height:26px;display:flex;align-items:center;margin:0}
  .pg-bar{margin-top:2px}
}
@media (min-width:1100px){
  .main .stack:not(.card)>*+*{margin-top:6px} .main .stack:not(.card) .empty{padding-block:var(--s4)}
  select.input{padding-block:0} .drange-f>input[type=date]{min-width:136px;flex:none} .filt-row>.drange{grid-template-columns:auto auto}
  .tbl-tools.in-line+.muted.small,.tbl-tools.in-line+.small{min-height:26px}
}
@media (min-width:1100px){
  .filt-row>.grid2{flex:1 1 340px;display:flex;gap:var(--s3)} .filt-row>.grid2>.drange-f{flex:1 1 0} .filt-row>.bd-opts,.bd-opts{margin:0;gap:4px var(--s3)} .filt-row{margin:0}
  .lbar{gap:6px var(--s3)}
}
@media (min-width:1100px){
  .filt-row>.drange{grid-template-columns:repeat(2,minmax(0,1fr));flex:1 1 320px;max-width:none} .drange-f>input[type=date]{min-width:0;flex:1 1 auto}
  .lbar>select.input{min-width:120px;max-width:150px} .lbar>.row.wrap{flex-wrap:nowrap}

}
/* v5.194 bảng hàng của đơn: chữ nhỏ hơn, tiêu đề không xuống dòng, cột mã đủ rộng */
@media (min-width:1100px){
  .od-th{font-size:.7rem;letter-spacing:.01em} .od-th>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .oline .input,.oline .od-ro,.oline .o-tt>.num,.oline .o-tv>.num{font-size:.9rem} .oline .od-ro.o-nm,.oline .o-nm .od-ro{line-height:1.25}
  .oline .combo>input.input[role=combobox]{padding-left:8px;padding-right:28px;text-overflow:ellipsis}
}
/* v5.197 màn chi tiết chứng từ (PC ≥1100px): khung đầu gọn — mã + loại cùng dòng, dữ kiện và dải số cùng hàng, tiến trình / khối nhỏ lại */
@media (min-width:1100px){
  .ds-shell{gap:var(--s2)} .ds-main,.ds-side{gap:var(--s2)}
  .ds-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px var(--s4);align-items:center;padding:8px var(--s4)}
  .ds-head>*{grid-column:1/-1} .ds-head>.ds-facts{grid-column:1} .ds-head>.ds-sum{grid-column:2;justify-self:end}
  .ds-top{align-items:center} .ds-id{display:flex;align-items:baseline;gap:var(--s3);flex-wrap:wrap} .ds-sub{margin:0}
  .ds-code{font-size:1.2rem} .ds-facts{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:2px var(--s4);font-size:.92rem} .ds-fact small,.ds-sc small{font-size:.75rem;line-height:1.2}
  .ds-sum{gap:var(--s2);flex-wrap:nowrap} .ds-sc{flex:0 0 auto;min-width:130px;padding:3px 12px;border-radius:8px} .ds-sc b{font-size:1rem}
  .steps{padding:4px 10px;gap:4px 10px;font-size:.9rem} .steps .st-dot{width:18px;height:18px;font-size:11px}
  .ds-head .banner{padding:6px 12px} .ds-head .muted.small{line-height:1.3}
  .ds-ch{min-height:32px;padding:4px var(--s3)} .ds-t{font-size:.95rem} .ds-cb{padding:var(--s2) var(--s3);gap:6px}
  .ds-ch .tbl-tools.in-bar{margin:0;margin-left:auto} .ds-ch .col-btn{min-height:24px}
}
@media (min-width:1100px){
  .ds-id{flex:1 1 auto} .ds-line{flex-wrap:nowrap;gap:var(--s2)} .ds-facts{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
}
/* v5.198 phone: không rớt/mất chữ */
@media (max-width:719.98px){
  .tabs{flex-wrap:wrap;overflow:visible} .tabs .btn{flex:0 1 auto;max-width:100%;white-space:normal;text-align:center;line-height:1.2;padding-block:4px}
  .nav a .cnt,.nav a .cnt.xl{top:3px;left:calc(50% + 6px);font-size:.65rem;padding:0 5px;min-width:16px}
  .nav a .cnt.moi+.cnt.xl{left:calc(50% + 24px);margin-left:0}
  .tbl td:not(.num):not(.it-code):not(:last-child),.tbl th{white-space:normal;overflow-wrap:anywhere;word-break:break-word}
  .tbl td.num,.tbl td:last-child,.ds-sc b,.ds-fact b.num{white-space:nowrap}
  .ds-sum{flex-wrap:wrap} .ds-sc{min-width:0;flex:1 1 130px} .ds-sc b{white-space:nowrap;font-size:.98rem}
  .combo input::placeholder,.combo .input::placeholder{font-size:.8rem;text-overflow:ellipsis}
  .badge,.chip{max-width:100%;overflow-wrap:anywhere}
}
@media (max-width:719.98px){
  .lbar>[role=group]{flex-wrap:wrap;overflow:visible} .lbar>[role=group]>*{flex:0 1 auto;max-width:100%;white-space:normal;line-height:1.2}
}
@media (max-width:719.98px){
  .tbl-wrap .tbl{width:max-content;min-width:100%}
  .tbl th{white-space:nowrap;overflow-wrap:normal;word-break:normal}
  .tbl td:not(.num):not(.it-code):not(:last-child){overflow-wrap:normal;word-break:normal}
  .tbl td .clamp2{-webkit-line-clamp:unset;display:block;overflow:visible}
  .tbl-wrap{background:linear-gradient(to right,var(--surface),var(--surface)) local,linear-gradient(to left,rgba(0,0,0,.12),transparent 14px) scroll 100% 0/14px 100% no-repeat}
  .field>.lbl{white-space:normal;overflow:visible}
}
@media (max-width:719.98px){
  .dxh-buyer{grid-template-columns:minmax(0,1fr)} .dxh-buyer .dxh-col+.dxh-col{border-top:1px solid var(--line);padding-top:var(--s3)}
  .kv{grid-template-columns:minmax(88px,34%) minmax(0,1fr);gap:var(--s2)}
}
@media (max-width:719.98px){
  .dg-ln-n{flex:1 1 100%;order:3} .dg-ln-q{margin-left:auto}
  .dg-f .input,.dg-f select{font-size:.88rem;text-overflow:ellipsis}
  .dg-link a{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;max-width:100%}
}
@media (max-width:719.98px){
  .grid3:not(.stk-filters){grid-template-columns:repeat(2,minmax(0,1fr))} .grid3>.field{min-width:0}
  #sc-plan-form,#sc-done-form{grid-template-columns:minmax(0,1fr)}
}
/* v5.205 chữ nhỏ hơn 1 bậc (gốc 15px phone, PC clamp 14–18px); ô chọn tệp không cắt */
@media (max-width:1023.98px),(max-device-width:600px){html{font-size:15px}}
input[type=file].input{height:auto;min-height:var(--tap);padding:5px var(--s3);line-height:1.5;box-sizing:border-box;cursor:pointer}
input[type=file].input::file-selector-button{font:inherit;font-size:.9em;padding:3px 10px;margin-right:var(--s3);border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2);color:var(--ink);cursor:pointer}
/* v5.205 phone: bảng dạng thẻ */
@media (max-width:859.98px){
  .tbl-wrap:has(>.tbl.m-cards){overflow-x:visible;border:0;background:transparent}
  .tbl.m-cards,.tbl.m-cards tbody{display:block;width:100%;min-width:0}
  .tbl.m-cards thead{display:none}
  .tbl.m-cards tbody tr{display:block;margin:0 0 8px;padding:6px 10px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);position:relative}
  .tbl.m-cards tbody td{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:3px 0;border:0;white-space:normal;text-align:right;min-width:0;position:static;background:transparent;overflow-wrap:anywhere}
  .tbl.m-cards tbody td::before{content:attr(data-l);flex:0 0 36%;max-width:42%;text-align:left;color:var(--faint);font-size:.85em;font-weight:500;position:static;display:block;overflow-wrap:normal}
  .tbl.m-cards tbody td:first-child{padding-left:0!important;justify-content:flex-start;font-weight:700;border-bottom:1px solid var(--line);padding-bottom:5px;margin-bottom:3px;text-align:left}
  .tbl.m-cards tbody td:first-child::before{content:counter(stt) "."!important;flex:none!important;max-width:none!important;color:var(--faint)!important;position:static!important;width:auto!important;height:auto!important;margin:0 4px 0 0!important;left:auto!important;top:auto!important;font-size:.85em!important}
  .tbl.m-cards tbody td[colspan]{display:block;text-align:left;padding:4px 0}
  .tbl.m-cards tbody td[colspan]::before{content:none}
  .tbl.m-cards tbody tr.cmd-row,.tbl.m-cards tbody tr.act-row,.tbl.m-cards tbody tr.ref-row{margin-top:-9px;border-top:0;border-radius:0 0 var(--r) var(--r)}
  .tbl.m-cards td.num,.tbl.m-cards td:last-child{white-space:normal}
  .tbl.m-cards td .clamp2{display:block;-webkit-line-clamp:unset;overflow:visible}
  .tbl.m-cards td .btn{white-space:normal}
}
@media (max-width:859.98px){
  .tbl.m-cards tbody td:first-child{background:transparent!important}
  .tbl.m-cards tbody td[colspan]:first-child::before{content:none!important;display:none!important}
  .tbl.m-cards tbody td[colspan]:first-child{border-bottom:0;margin:0;font-weight:400}
  .tbl.m-cards tbody tr.act-row,.tbl.m-cards tbody tr.act-row:hover{background:var(--accent-weak)}
}
@media (max-width:859.98px){
  .tbl-wrap .tbl.m-cards tbody tr>td:first-child{background:transparent!important;padding-left:0!important}
  .tbl.m-cards.stk-board tbody td:first-child::before{display:none!important}
}
@media (max-width:859.98px){
  .tbl.m-cards tbody tr:not(.cmd-row):not(.act-row):not(.ref-row){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:14px}
  .tbl.m-cards tbody tr>td{grid-column:1/-1}
  .tbl.m-cards tbody tr>td.num{grid-column:auto}
  .tbl.m-cards td.num::before{flex:0 1 auto;max-width:none}
  .tbl.m-cards td .input,.tbl.m-cards td select{flex:1 1 55%;min-width:0;width:auto}
  .tbl.m-cards td:has(.input,select,textarea)::before{flex:0 0 36%}
}
@media (max-width:859.98px){
  .tbl.m-cards tbody td:first-child{width:auto!important;max-width:none!important;min-width:0!important}
  .tbl.m-cards td .input,.tbl.m-cards td select{max-width:none!important;width:auto!important}
}
.bd-name{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;max-width:none!important;min-width:140px}
/* v5.205 bảng đơn vừa khung PC/tablet */
.ord-table .tbl td.c-tx,.ord-table .tbl td.c-cus{min-width:9em}
.ord-table .tbl td.it-name{min-width:110px}
@media (min-width:1100px){.ord-table .tbl td:nth-child(3){min-width:84px;max-width:200px}}
.ord-table .tbl td .badge{max-width:150px;white-space:normal;line-height:1.25}
.ord-table .tbl th[scope=row]{white-space:nowrap}
input.input,select.input{text-overflow:ellipsis}
.tbl .clamp2,.clamp2{display:block;-webkit-line-clamp:unset;overflow:visible}
@media (max-width:859.98px){
  .tbl.m-cards tbody tr>th{display:flex;grid-column:1/-1;align-items:baseline;justify-content:flex-start;gap:4px;padding:0 0 5px!important;margin-bottom:3px;border:0;border-bottom:1px solid var(--line);background:transparent!important;text-align:left;font-weight:700;position:static;white-space:normal;overflow-wrap:anywhere}
  .tbl.m-cards tbody tr>th::before{content:counter(stt) "."!important;position:static!important;width:auto!important;height:auto!important;margin:0 4px 0 0!important;color:var(--faint);font-size:.85em;font-weight:400;left:auto!important;top:auto!important}
  .tbl.m-cards td.num,.tbl.m-cards td:last-child:not(:has(.input,select,textarea)){white-space:nowrap!important;overflow-wrap:normal!important}
  .tbl.m-cards td.num::before{white-space:normal}
}
/* v5.210 xem toàn màn hình */
.fs-exit{display:none}
.fs-area.fs-on{position:fixed;inset:0;z-index:1000;background:var(--bg,var(--surface,#fff));overflow:auto;padding:12px;box-sizing:border-box}
.fs-area:fullscreen{background:var(--bg,var(--surface,#fff));overflow:auto;padding:12px}
.fs-area.fs-on>.fs-exit{display:inline-flex;position:sticky;top:0;z-index:2;margin-bottom:8px}
html.fs-lock,html.fs-lock body{overflow:hidden}
/* v5.211 toàn màn hình: bảng bung hết chiều cao còn lại */
.fs-area.fs-on .bd-wrap,.fs-area:fullscreen .bd-wrap,.fs-area.fs-on .tbl-wrap,.fs-area:fullscreen .tbl-wrap{max-height:calc(100vh - 110px);max-height:calc(100dvh - 110px)}

/* bảng điện: tối khi giao diện Tối (hoặc Theo thiết bị đang tối) */
:root[data-theme="dark"] .board{--bd-bg:#0b1220;--bd-row:#101a2c;--bd-line:#1e2b42;--bd-ink:#e5edf7;--bd-soft:#9fb0c7;--bd-up:#2fd16f;--bd-dn:#ff5b5b;--bd-eq:#f5c542;--bd-head:#0e1628;--bd-even:#0d1626;--bd-hover:#16243d;--bd-on:#1a2a47;--bd-onl:#4a6fa5;--bd-z:#5b6b85;--bd-link:#7fc4ff;--bd-grp:#7fc4ff;--bd-flu:#14532d;--bd-fld:#7f1d1d;--bd-negbg:#7f1d1d}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .board{--bd-bg:#0b1220;--bd-row:#101a2c;--bd-line:#1e2b42;--bd-ink:#e5edf7;--bd-soft:#9fb0c7;--bd-up:#2fd16f;--bd-dn:#ff5b5b;--bd-eq:#f5c542;--bd-head:#0e1628;--bd-even:#0d1626;--bd-hover:#16243d;--bd-on:#1a2a47;--bd-onl:#4a6fa5;--bd-z:#5b6b85;--bd-link:#7fc4ff;--bd-grp:#7fc4ff;--bd-flu:#14532d;--bd-fld:#7f1d1d;--bd-negbg:#7f1d1d}}

/* 5.262 (B188): đầu danh sách 3 hàng — trạng thái + nút lập (phải) / số đơn / tìm kiếm + Ngày tạo + Cột */
.lbar-top>[role=group]{flex:1 1 auto;min-width:0}
.lbar-top>.btn.primary{margin-left:auto;flex:none}
/* 5.263 (B189): hộp thoại Xuất excel đơn bán / mua */
.xp-dlg{width:min(460px,calc(100vw - 32px))}
.xp-body fieldset.xp-fs{border:1px solid var(--line);border-radius:var(--r-sm);padding:var(--s2) var(--s3);margin:0;gap:var(--s1)}
.xp-body legend{padding:0 var(--s1);font-weight:600}
.xp-quick{gap:var(--s2)}
.xp-st{gap:var(--s2);align-items:center;min-height:32px}
@media (pointer:coarse){.xp-st{min-height:var(--tap)}}
.xp-quick .btn{width:auto;flex:none}
/* 5.265 (B191): ô thả xuống chọn nhiều (Trạng thái, Quy cách) trong hộp thoại Xuất excel */
.xp-ms-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
@media (max-width:480px){.xp-ms-row{grid-template-columns:1fr}}
.xp-ms{display:flex;flex-direction:column;gap:4px;min-width:0}
.xp-ms-l{font-weight:600}
.xp-ms-box{position:relative}
.xp-ms-btn{width:100%;text-align:left;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:28px}
.xp-ms-car{position:absolute;right:10px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--soft)}
.xp-ms-btn.is-bad{border-color:var(--err)}
.xp-ms-pop{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:30;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:0 8px 24px rgba(0,0,0,.18);padding:4px;max-height:240px;overflow:auto}
.xp-ms-it{gap:var(--s2);align-items:center;min-height:34px;padding:0 var(--s2);border-radius:var(--r-sm);cursor:pointer}
.xp-ms-it:hover{background:var(--surface-2)}
.xp-ms-all{border-bottom:1px solid var(--line);border-radius:0;margin-bottom:2px}
@media (pointer:coarse){.xp-ms-it{min-height:var(--tap)}}
/* 5.266 (B192): danh sách thả xuống tự giãn theo chữ dài nhất — chữ luôn cùng dòng với ô tích (không quá bề ngang màn hình; quá thì chữ xuống dòng nhưng vẫn thẳng hàng bên phải ô tích) */
.xp-ms-pop{right:auto;min-width:100%;width:max-content;max-width:calc(100vw - 48px)}
.xp-ms-row>.xp-ms:last-child .xp-ms-pop{left:auto;right:0}
.xp-ms-it{display:flex;flex-wrap:nowrap}
.xp-ms-it>input{flex:none}
.xp-ms-tx{flex:1;min-width:0;white-space:nowrap}
@media (max-width:480px){.xp-ms-tx{white-space:normal}.xp-ms-row>.xp-ms:last-child .xp-ms-pop{left:0;right:auto}}
.xp-ms-pop{max-height:min(320px,55vh)}
/* 5.268 (B194): điện thoại — ô Ngày tạo Từ – Đến luôn một hàng, chia đều bề ngang (trước bị rơi ô "Đến" xuống dòng) */
@media (max-width:640px){
  .lbar>.dflt{flex:1 1 100%;flex-wrap:nowrap;overflow:visible;padding-bottom:0}
  .lbar>.dflt>.dflt-box{flex:1 1 0;width:auto;min-width:0}
}
@media (max-width:719px){
  .lbar.lbar-top>.row.wrap[role=group]{flex:1 1 100%;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
  .lbar.lbar-top>.row.wrap[role=group]>*{flex:none}
  .lbar.lbar-top>.btn.primary{margin-left:auto}
}
/* 5.269 (B195): xem trước nhập giá cước */
.fr-imp-dlg{width:min(980px,calc(100vw - 32px))}
.fr-imp{max-height:55vh;overflow:auto}
.fr-imp .badge{white-space:normal;text-align:left}
.badge.fr-ok{background:var(--ok-bg);color:var(--ok)}