/* APP CON "HOÁ ĐƠN CQT" — tab hdcqt (KIEMKHO.HUTHD)
   Tông khối: nâu gạch (giấy tờ) --mk:#9a3412 — Khối Màu 4 điểm nhẹ, không đổ nền lớn.
   Bảng theo chuẩn: table-layout fixed + %, tên đậm trên / MST xám dưới, số căn phải,
   ≤900px chuyển thẻ dọc có vạch màu trái. */

/* -------- khối ⚠ CẦN SOI (THANHTOAN) -------- */
.cansoi{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin:0 0 12px;
  background:#fff8f2;border:1px solid #f3ddc9;border-radius:11px;padding:8px 11px}
.cansoi>b{font-size:13px;color:#9a3412}
.cansoi>b i{font-style:normal;background:#9a3412;color:#fff;border-radius:10px;padding:1px 7px;font-size:11.5px;margin-left:2px}
.cansoi button{border:1px solid #f0d3ba;background:#fff;border-radius:14px;padding:4px 10px;
  font:inherit;font-size:12.5px;font-weight:600;color:#5b4a3c;cursor:pointer}
.cansoi button:hover{border-color:#9a3412;background:#fbeee8}
.cansoi button i{font-style:normal;font-weight:700;color:#9a3412;margin-left:2px}

/* -------- ô Thanh toán trong bảng -------- */
.tt-o{display:inline-flex;flex-direction:column;align-items:flex-start;gap:0;border-radius:9px;
  border:1px solid transparent;padding:3px 8px;font:inherit;font-size:12.5px;font-weight:700;
  cursor:pointer;line-height:1.25;text-align:left}
.tt-o small{font-weight:500}
.tt-o .tt-ngay{font-size:10.5px;font-weight:500;color:inherit;opacity:.75}
.tt-ok{background:#e2f4ee;color:#047857;border-color:#04785726}
.tt-ok:hover{background:#d3eee4}
.tt-lech{background:#fef3c7;color:#92400e;border-color:#92400e26}
.tt-canh{background:#fee2e2;color:#b91c1c;border-color:#b91c1c33}
.tt-chua{background:#fff;color:#8a979c;border-color:var(--vien);font-weight:600}
.tt-chua:hover{border-color:#9a3412;color:#9a3412;background:#fbeee8}
.tt-cham{color:#d97706;font-size:17px;margin-left:3px;vertical-align:middle}

/* -------- popup thanh toán + form tay + cb ngoài tờ -------- */
.hdcqt-dlg .hdlg-tt-tong{padding:10px 16px 4px;font-size:13.5px}
.hdcqt-dlg .hdlg-tt-tong .xanh{color:#047857;font-weight:700}
.hdcqt-dlg .hdlg-tt-tong .do{color:#b91c1c;font-weight:700}
.hdcqt-dlg .hdlg-tt-tong .mo{color:#8a979c}
.hdcqt-dlg table.hdlg-tt{margin:8px 16px;width:calc(100% - 32px)}
.hdcqt-dlg .hdlg-nho{border:1px solid var(--vien);background:#fff;border-radius:7px;
  padding:2px 8px;font:inherit;font-size:12px;cursor:pointer;color:#2b3c42}
.hdcqt-dlg .hdlg-nho:hover{border-color:#9a3412;background:#fbeee8}
.hdcqt-dlg .hdlg-cb{margin:6px 16px;padding:8px 10px;background:#fff8f2;border:1px solid #f3ddc9;
  border-radius:9px;font-size:12.5px;line-height:1.5}
.hdcqt-dlg .hdlg-noi{display:flex;gap:6px;margin-top:6px}
.hdcqt-dlg .hdlg-noi input{flex:1;border:1px solid var(--vien);border-radius:7px;padding:5px 8px;font:inherit;font-size:12.5px}
.hdcqt-dlg-nho{width:min(420px,calc(100vw - 24px))}
.hdcqt-dlg .hdlg-form{display:flex;flex-direction:column;gap:9px;padding:12px 16px 15px}
.hdcqt-dlg .hdlg-form label{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;color:#5b6b70;font-weight:600}
.hdcqt-dlg .hdlg-form input,.hdcqt-dlg .hdlg-form select{flex:1;max-width:230px;border:1px solid var(--vien);border-radius:8px;padding:7px 9px;font:inherit;font-size:13px}
.hdcqt-dlg .hdlg-form .btn{align-self:flex-end}

/* -------- pill NHÓM (Sếp 05/09): Tất cả · từng nhóm · Chưa phân · ⚙ -------- */
.hdcqt-nhom{display:flex;gap:7px;flex-wrap:wrap;margin:2px 0 12px}
.hdcqt-nhom .np{border:1px solid var(--vien);background:#fff;border-radius:16px;padding:5px 12px;
  font:inherit;font-size:13px;font-weight:600;color:#3f4f55;cursor:pointer;line-height:1.4}
.hdcqt-nhom .np i{font-style:normal;font-weight:700;font-size:11.5px;color:#8a979c;margin-left:2px}
.hdcqt-nhom .np:hover{border-color:#9a3412;background:#fbeee8}
.hdcqt-nhom .np.on{background:var(--mkn,#fbeee8);border-color:var(--mk,#9a3412);color:#7c2d12}
.hdcqt-nhom .np.on i{color:#9a3412}
.hdcqt-nhom .np.caidat{margin-left:auto;border-style:dashed;color:#5b6b70}
.nhom-tag{color:#9a3412;font-weight:600}
/* tên NCC gọi dưới tên ĐVP trong dòng phiếu vòng đời (Sếp 05/09 chiều) */
.phu.ten-ncc{font-style:italic}

/* -------- hộp Quản lý nhóm -------- */
/* dialog bị reset *{margin:0} nuốt căn giữa — ghi margin:auto TƯỜNG MINH (bài học cũ) */
.hdcqt-dlg{margin:auto;border:none;border-radius:14px;padding:0;width:min(680px,calc(100vw - 24px));
  max-height:min(84vh,760px);box-shadow:0 24px 60px -20px rgba(6,43,51,.45)}
.hdcqt-dlg::backdrop{background:rgba(9,36,43,.45)}
.hdcqt-dlg .hdlg-dau{display:flex;justify-content:space-between;align-items:center;
  padding:13px 16px;background:#fbeee8;border-bottom:1px solid #9a341226;font-size:15px;color:#7c2d12}
.hdcqt-dlg .hdlg-dong{border:none;background:transparent;font-size:16px;cursor:pointer;color:#7c2d12;padding:2px 6px}
.hdcqt-dlg .hdlg-tao{display:flex;gap:8px;padding:12px 16px 4px}
.hdcqt-dlg .hdlg-tao input{flex:1;border:1px solid var(--vien);border-radius:8px;padding:8px 10px;font:inherit;font-size:13.5px}
.hdcqt-dlg .hdlg-nhomds{display:flex;gap:6px;flex-wrap:wrap;padding:8px 16px}
.hdcqt-dlg .hdlg-nhom{display:inline-flex;align-items:center;gap:2px;background:#fbeee8;color:#7c2d12;
  border:1px solid #9a341233;border-radius:14px;padding:3px 4px 3px 10px;font-size:12.5px;font-weight:600}
.hdcqt-dlg .hdlg-nhom button{border:none;background:transparent;cursor:pointer;font-size:12px;padding:1px 4px;opacity:.7}
.hdcqt-dlg .hdlg-nhom button:hover{opacity:1}
.hdcqt-dlg .hdlg-trong{padding:8px 16px;color:#8a979c;font-size:13px}
.hdcqt-dlg .hdlg-tim{margin:6px 16px;width:calc(100% - 32px);border:1px solid var(--vien);border-radius:8px;padding:8px 10px;font:inherit;font-size:13px}
.hdcqt-dlg .hdlg-cuon{overflow:auto;max-height:46vh;margin:0 16px 4px;border:1px solid var(--vien);border-radius:10px}
.hdcqt-dlg .hdlg-bang{width:100%;border-collapse:collapse;font-size:13px;table-layout:fixed}
.hdcqt-dlg .hdlg-bang th{position:sticky;top:0;background:#f6f9fa;text-align:left;font-size:11.5px;
  text-transform:uppercase;padding:7px 10px;border-bottom:1px solid var(--vien)}
.hdcqt-dlg .hdlg-bang th:nth-child(1){width:52%}
.hdcqt-dlg .hdlg-bang th:nth-child(2){width:13%}
.hdcqt-dlg .hdlg-bang th:nth-child(3){width:35%}
.hdcqt-dlg .hdlg-bang td{padding:6px 10px;border-bottom:1px solid #eef2f3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hdcqt-dlg .hdlg-bang td b{display:block;font-size:12.5px}
.hdcqt-dlg .hdlg-bang td .mst{font-size:11px;color:#8a979c}
.hdcqt-dlg .hdlg-bang td.num,.hdcqt-dlg .hdlg-bang th.num{text-align:right}
.hdcqt-dlg .hdlg-bang select{width:100%;border:1px solid var(--vien);border-radius:7px;padding:5px 6px;font:inherit;font-size:12.5px;background:#fff}
.hdcqt-dlg .hdlg-chan{padding:8px 16px 13px;color:#8a979c;font-size:12px}
@media(max-width:520px){
  .hdcqt-nhom .np.caidat{margin-left:0}
  .hdcqt-dlg .hdlg-bang th:nth-child(2){display:none}
  .hdcqt-dlg .hdlg-bang td:nth-child(2){display:none}
}

/* -------- hàng lọc -------- */
.hdcqt-loc{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:2px 0 12px}
.hdcqt-loc label{display:flex;gap:6px;align-items:center;font-size:13px;color:#5b6b70;font-weight:600}
.hdcqt-loc input[type=date]{border:1px solid var(--vien);border-radius:8px;padding:7px 8px;font:inherit;font-size:13px;background:#fff}
.hdcqt-loc .hdcqt-tim{flex:1 1 210px;max-width:290px;border:1px solid var(--vien);border-radius:8px;padding:8px 10px;font:inherit;font-size:13.5px}
.hdcqt-loc select{border:1px solid var(--vien);border-radius:8px;padding:7px 8px;font:inherit;font-size:13px;background:#fff;color:#2b3c42}
.hdcqt-loc .hdcqt-tim:focus,.hdcqt-loc select:focus,.hdcqt-loc input[type=date]:focus{outline:2px solid #9a341233;border-color:#9a3412}
.hdcqt-loc .btn{margin-left:auto}

/* -------- bảng desktop -------- */
.hdcqt-cuon{overflow-x:auto}
/* min-width 1080 → 1280 khi thêm cột thứ 12. Đây là SÀN: dưới mức này thanh cuộn ngang
   bật, thay vì để trình duyệt bóp đều 12 cột tới mức cột Ngày mất năm. Đo ở 1280:
   Ngày cấp 8% = 102px (đủ "08/09/2026" cần 103 — sát, nên đừng hạ nữa), Số HĐ 7% = 90px,
   nút Nội dung CK 9% = 115px. */
.tbl-hdcqt{width:100%;min-width:1280px;table-layout:fixed;border-collapse:collapse;font-size:13.5px;line-height:1.35}
.tbl-hdcqt th{background:var(--mkn,#fbeee8);color:#7c2d12;text-align:left;font-size:12px;
  text-transform:uppercase;letter-spacing:.03em;padding:8px 9px;border-bottom:2px solid #9a341226}
.tbl-hdcqt th.num{text-align:right}
.tbl-hdcqt td{padding:8px 9px;border-bottom:1px solid var(--vien);vertical-align:middle;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tbl-hdcqt tbody tr{cursor:pointer}
.tbl-hdcqt tbody tr:hover{background:#fbeee855}
.tbl-hdcqt td.num{text-align:right;font-variant-numeric:tabular-nums}
.tbl-hdcqt td.tt{font-weight:700}
.tbl-hdcqt td b{font-weight:700}
.tbl-hdcqt .mst{display:block;font-size:11.5px;color:#8a979c;font-weight:400}
/* Dòng phụ trong ô gộp (ký hiệu dưới số HĐ · tiền thuế dưới giá trị) — cùng một thứ
   tiếng với .mst để ba ô gộp nhìn như một họ. */
.tbl-hdcqt .o-doi{display:block}
.tbl-hdcqt .phu-o{display:block;font-size:11.5px;color:#8a979c;font-weight:400}
/* Ô gộp căn phải thì cả hai dòng cùng căn phải (cột Giá trị / Thuế). */
.tbl-hdcqt td.num .o-doi,.tbl-hdcqt td.num .phu-o{text-align:right}
/* Ô TÊN NCC: cho XUỐNG DÒNG thay vì cắt cụt. Sếp soi bản thật 10/09 — "fix cho tên hiển
   thị đầy đủ". Cắt bằng ellipsis là mất chữ vĩnh viễn, xuống dòng chỉ tốn chiều cao;
   dòng nào cũng cao bằng nhau vì cả bảng dùng vertical-align:middle. */
.tbl-hdcqt td.o-ncc{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.3}
.tbl-hdcqt td.o-ncc b{font-weight:700}
/* ô nút không được nuốt nút thứ hai (bẫy ellipsis chung) */
.tbl-hdcqt td.o-xml{overflow:visible;text-overflow:clip;white-space:nowrap}
/* 2 nút icon vuông gọn — Sếp soi 05/09 tối: bản cũ cột 4% hai nút bị cắt mất */
.tbl-hdcqt td.o-xml a,.tbl-hdcqt td.o-xml button{display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:24px;border:1px solid var(--vien);background:#fff;border-radius:7px;
  font-size:12.5px;line-height:1;cursor:pointer;text-decoration:none;color:#2b3c42;margin-right:3px;padding:0}
.tbl-hdcqt td.o-xml a:hover,.tbl-hdcqt td.o-xml button:hover{border-color:#9a3412;background:#fbeee8}

/* -------- cột NỘI DUNG CK (KIEMKHO.NOIDUNGCK 10/09) -------- */
/* Cùng bẫy với ô XML: .tbl-hdcqt td đặt text-overflow:ellipsis chung, ô chứa nút phải
   tự gỡ ra không thì nút bị xén (Sếp soi 05/09 tối, hai nút XML bị cắt mất). */
.tbl-hdcqt td.o-ck{overflow:visible;text-overflow:clip;white-space:nowrap}
/* Viền mảnh, KHÔNG tô nền đặc: bảng đã có 3 loại chip màu (Đối soát · Thanh toán ·
   TT CQT). Thêm nút nền đặc trên mọi dòng là điểm nhấn thứ tư — nhấn 5 thứ cùng lúc
   là không nhấn gì. */
.tbl-hdcqt .nut-ck{display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--vien);background:#fff;border-radius:8px;padding:4px 9px;
  font:inherit;font-size:11.5px;font-weight:600;color:#7c2d12;cursor:pointer;
  line-height:1.3;white-space:nowrap;max-width:100%}
.tbl-hdcqt .nut-ck:hover{border-color:#9a3412;background:#fbeee8}
.tbl-hdcqt .nut-ck:focus-visible{outline:2px solid #9a341255;outline-offset:1px}

/* -------- hộp Nội dung chuyển khoản -------- */
/* margin:auto + max-width ghi TƯỜNG MINH — reset *{margin:0} của app nuốt margin mặc
   định của <dialog> (popup dính góc trên-trái), và UA đặt max-width:calc(100% - 36px)
   bóp mất bề ngang trên mobile. Hai bẫy đã ghi ở khối .hdcqt-dlg phía trên. */
.hdcqt-dlg-ck{margin:auto;width:min(470px,calc(100vw - 24px));max-width:min(470px,calc(100vw - 24px))}
.hdcqt-dlg-ck .ck-dang{padding:26px 16px;color:#8a979c;font-size:13px;text-align:center}
.hdcqt-dlg-ck .ck-tho{padding:12px 16px 2px;font-size:13.5px;line-height:1.45}
.hdcqt-dlg-ck .ck-tho .ghi{display:block;font-size:11.5px;color:#8a979c;margin-top:2px}
.hdcqt-dlg-ck .ck-o{margin:10px 16px 0;border:1px solid var(--vien);background:#fbfdfd;
  border-radius:10px;padding:11px 12px;line-height:1.55;word-break:break-word;cursor:text;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Courier New",monospace;font-size:13.5px}
.hdcqt-dlg-ck .ck-dem{margin:5px 16px 0;font-size:11px;color:#8a979c}
.hdcqt-dlg-ck .ck-ghep{margin:12px 16px 0;border-top:1px dashed var(--vien);padding-top:9px}
.hdcqt-dlg-ck .ck-nhan{font-size:11px;color:#8a979c;margin-bottom:5px}
.hdcqt-dlg-ck .ck-ghep table{width:100%;border-collapse:collapse;font-size:11.5px}
.hdcqt-dlg-ck .ck-ghep td{padding:2.5px 0;vertical-align:top;line-height:1.5}
.hdcqt-dlg-ck .ck-ten{color:#8a979c;width:34%}
.hdcqt-dlg-ck .ck-tu{color:#8a979c;font-weight:400;margin-left:4px}
.hdcqt-dlg-ck .ck-may{display:inline-block;background:#fff4e5;color:#9a4b00;border:1px solid #f0d18a;
  border-radius:6px;padding:1px 6px;font-size:10.5px;font-weight:600;margin-left:5px;white-space:nowrap}
.hdcqt-dlg-ck .ck-thieu{color:#b91c1c;font-weight:600}
.hdcqt-dlg-ck .ck-canh{margin:10px 16px 0;background:#fff8f2;border:1px solid #f3ddc9;
  border-radius:9px;padding:9px 11px;font-size:11.5px;line-height:1.5;color:#7c2d12}
.hdcqt-dlg-ck .ck-chan{display:flex;justify-content:flex-end;align-items:center;gap:8px;
  padding:12px 16px;margin-top:12px;border-top:1px solid var(--vien);background:#fbfdfd;flex-wrap:wrap}
.hdcqt-dlg-ck .ck-xong{background:#047857;border-color:#047857}
/* Nút "Đã chuyển khoản": viền xanh tiền, KHÔNG tô nền đặc — nền đặc để dành cho nút
   Copy (việc chính của hộp này). Hai nút đặc cạnh nhau là mắt không biết bấm cái nào. */
.hdcqt-dlg-ck .ck-nut-ck{border-color:#04785755;color:#047857;font-weight:600;margin-right:auto}
.hdcqt-dlg-ck .ck-nut-ck:hover:not(:disabled){border-color:#047857;background:#e2f4ee}
.hdcqt-dlg-ck .ck-nut-ck:disabled{opacity:.55;cursor:default}
.hdcqt-dlg-ck .ck-datra{margin-right:auto;font-size:11.5px;color:#047857;font-weight:600}

/* -------- chip trạng thái CQT + đối soát -------- */
.ttcqt{display:inline-block;font-size:12px;font-weight:600;color:#3f4f55}
.ttcqt.xau{color:#b91c1c;font-weight:700}
.ttcqt.mo,.tbl-hdcqt .mo{color:#a5b1b5}
.xn-chip{display:inline-flex;flex-direction:column;align-items:flex-start;gap:0;font-size:12px;font-weight:700;
  border-radius:11px;padding:3px 9px;border:1px solid transparent;white-space:nowrap;line-height:1.3;max-width:100%}
.xn-chip small{font-weight:500;opacity:.75}
/* mã phiếu dài (ĐH-260801-02/UNIBEN…) phải THẤY ĐỦ — Sếp soi lần 2: cho xuống dòng trong chip */
.xn-chip .xn-ma{font-size:10.5px;font-weight:600;opacity:.8;white-space:normal;word-break:break-all;line-height:1.2}
.xn-vd{background:#e2f4ee;color:#047857;border-color:#04785726}
.xn-kt{background:#e3f3f6;color:#076e7e;border-color:#076e7e26;cursor:pointer}
.xn-kt:hover{background:#d2ecf1}
.xn-chua{background:#fff;color:#9a3412;border-color:#9a341255;cursor:pointer}
.xn-chua:hover{background:#fbeee8}

/* -------- ≤900px: bảng thành THẺ DỌC, vạch màu 3px bên trái -------- */
@media(max-width:900px){
  .hdcqt-cuon{overflow:visible}
  .tbl-hdcqt{min-width:0;display:block}
  .tbl-hdcqt colgroup,.tbl-hdcqt thead{display:none}
  .tbl-hdcqt tbody{display:block}
  .tbl-hdcqt tbody tr{display:block;border:1px solid var(--vien);border-left:3px solid #9a3412;
    border-radius:10px;margin-bottom:10px;padding:4px 0;background:#fff}
  .tbl-hdcqt td{display:flex;justify-content:space-between;gap:10px;border-bottom:none;
    padding:4px 12px;white-space:normal;overflow:visible;text-align:right}
  .tbl-hdcqt td::before{content:attr(data-nhan);color:#8a979c;font-size:12px;font-weight:600;
    flex-shrink:0;text-align:left}
  .tbl-hdcqt td[data-nhan="Người bán"]{display:block;text-align:left;padding-top:8px}
  .tbl-hdcqt td[data-nhan="Người bán"]::before{display:none}
  .tbl-hdcqt td.num,.tbl-hdcqt td.tt{text-align:right}
  .tbl-hdcqt td.o-xml{justify-content:flex-end}
  /* Nội dung CK: KHÔNG dùng nhãn ::before như các ô khác — nhãn trái + nút phải đọc
     thành "Nội dung CK — Nội dung CK". Thành nút chạy hết bề ngang cuối thẻ, tách bằng
     một đường đứt. Ngón tay bấm dễ hơn nút con 26px. */
  .tbl-hdcqt td.o-ck{display:block;white-space:normal;padding:9px 12px 3px;margin-top:4px;
    border-top:1px dashed var(--vien)}
  .tbl-hdcqt td.o-ck::before{display:none}
  .tbl-hdcqt .nut-ck{width:100%;padding:9px 0;font-size:12.5px;border-color:#9a3412;background:#fbeee8}
}
@media(max-width:520px){
  .hdcqt-loc label{flex:1 1 46%}
  .hdcqt-loc .hdcqt-tim{max-width:none;flex-basis:100%}
  .hdcqt-loc select{flex:1 1 46%}
  .hdcqt-loc .btn{margin-left:0;flex-basis:100%}
}
/* số tiền dài (347.000.000 = 11 ký tự) phải nằm TRỌN MỘT DÒNG trong ô ~80px
   — Sếp soi 05/09 tối; 16px vẫn ngắt "347.000.0/00" nên hạ 13.5px, wrap chỉ là lưới cuối */
@media(max-width:700px){
  #v-hdcqt .stat .n.n-tien{font-size:13.5px;letter-spacing:-.01em;overflow-wrap:anywhere;line-height:1.6}
}
