/* ══ ✅ BỘ ẢNH ĐÃ XONG — web giaoanhin (29/10 · BL-261029-2APD · luật 08) ══
   Nạp ở index.html SAU bao-cao.css (dùng lại `.bc-*` · `.db-ky-nut` · `.bc-gap`). Mọi màu trỏ biến SẴN CÓ; chữ ≥ 12px;
   vùng bấm ≥ 44px trên điện thoại; điện thoại = mỗi bộ một thẻ dọc, máy tính (≥ 900px) = dòng lưới. */
.bx-man{padding-bottom:var(--k4)}
.bx-dau-man{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--k2)}
.bx-tab{display:flex; gap:var(--k2)}
.bx-tab [aria-selected="true"]{border-color:var(--chinh-500); background:var(--chinh-100); color:var(--chinh-800)}  /* 4.52:1 */
.bx-khung{display:flex; flex-direction:column; gap:var(--k3); min-width:0}
.bx-chi-tiet,.bx-bd,.bx-ds,.bx-bd-noi{display:flex; flex-direction:column; gap:var(--k2); min-width:0}
.bx-loc{display:flex; flex-direction:column; gap:var(--k2)}
.bx-chip-nhom{display:flex; flex-direction:column; gap:4px}
.bx-chip-nhan,.bx-chon{font-size:12px; color:var(--chu-mo)}
.bx-chip-hang,.bx-chon-hang,.bx-bd-xem,.bx-the-hang{display:flex; flex-wrap:wrap; gap:var(--k2)}
.bx-chip small{font-size:12px}
.bx-chon select{margin-left:6px; min-height:var(--cao-nut); font:inherit; font-size:var(--cx-nho); border:1px solid var(--vien-dam); border-radius:var(--bo-o); background:var(--nen-3); color:var(--chu)}
.bx-the-ds{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--k2)}
.bx-the{display:grid; gap:var(--k2); padding:var(--k3); border:1px solid var(--vien-dam); border-radius:var(--bo-o); background:var(--nen-3); min-width:0}
.bx-ten{display:flex; flex-wrap:wrap; align-items:baseline; gap:6px; min-height:var(--cao-nut); padding:0; border:0; background:none; color:var(--chu); font:inherit; font-size:var(--cx); text-align:left; cursor:pointer}
.bx-ten small{font-size:12px; color:var(--chu-phu)}
.bx-ten:focus-visible,.bx-chip:focus-visible,.bx-the-chip:focus-visible{outline:2px solid var(--chinh-500); outline-offset:2px}
.bx-so{display:flex; flex-wrap:wrap; gap:var(--k2); font-size:12px; color:var(--chu)}
.bx-diem,.bx-khach{padding:2px var(--k2); border-radius:var(--bo-tron); background:var(--nen-phu); font-size:12px}
.bx-the-chip[aria-pressed="true"]{border-color:var(--chinh-500); background:var(--chinh-100); color:var(--chinh-800)}
.bx-ghi{display:flex; flex-wrap:wrap; align-items:center; gap:var(--k2)}
.bx-ghi label{display:flex; flex:1 1 220px; flex-direction:column; gap:4px; font-size:12px; color:var(--chu-mo)}
.bx-ghi-o{min-height:var(--cao-nut); padding:0 var(--k3); font:inherit; font-size:var(--cx-nho); border:1px solid var(--vien-dam); border-radius:var(--bo-o); background:var(--nen); color:var(--chu)}
.bx-tt{font-size:12px; color:var(--chu-mo)}
.bx-tt.tot{color:var(--chinh-800)}
.bx-tt.loi{color:var(--loi-700)}  /* 4.57:1 */
.bx-thu{min-height:var(--cao-nut); padding:0 var(--k3); font:inherit; font-size:12px; border:1px solid var(--vien-dam); border-radius:var(--bo-o); background:var(--nen-3); color:var(--chu); cursor:pointer}
.bx-ct{display:grid; gap:var(--k2)}
.bx-ct[hidden]{display:none}
.bx-khung-ct{padding:var(--k2) var(--k3); border-radius:var(--bo-o); background:var(--nen-phu)}
.bx-khung-ct h4{margin:0 0 4px; font-size:var(--cx-nho)}
.bx-khung-ct dl{display:grid; grid-template-columns:auto 1fr; gap:2px var(--k3); margin:0 0 var(--k2); font-size:12px}
.bx-khung-ct dt{color:var(--chu-mo)}
.bx-khung-ct dd{margin:0; overflow-wrap:anywhere}
.bx-bang .bx-ten-nguoi{min-height:var(--cao-nut); padding:0; border:0; background:none; color:var(--chinh-800); font:inherit; font-size:12px; text-align:left; text-decoration:underline; cursor:pointer}
.bx-bd-khoi{padding:var(--k3); border-radius:var(--bo-o); background:var(--nen-3)}
/* chữ HTML của biểu đồ ≥ 12px. KHÔNG áp cho <text> trong <svg>: cỡ ở đó tính theo đơn vị viewBox (42→130px), đặt 12px làm «tổng» to gấp 3 và đè số giữa vòng (Planner 29/10) */
.bx-man .bd-tieu,.bx-man .bd-trong,.bx-man .bd-cg-dong,.bx-man .bd-cg-dong *,.bx-man .bd-cot-dong,.bx-man .bd-cot-dong *{font-size:12px}
.bx-man .bd-tam-chu{font-size:4px}   /* 4 × 130/42 ≈ 12,4px — nhỏ nhất đạt sàn 12px, vẫn nằm dưới số «4» (y 26 vs 20) */
@media (max-width:640px){
  .bx-chip,.bx-the-chip,.bx-tab .db-ky-nut,.bx-man .bc-xem-ds,.bx-thu{min-height:var(--cao-bam)}
  .bx-ghi-o,.bx-chon select{min-height:var(--cao-bam)}
}
/* ≥ 900px: danh sách là BẢNG thật (<table class="bx-bang-lon">, mỗi bộ một <tbody> hai hàng: dòng chính + dòng chi tiết) */
.bx-cuon{width:100%}
.bx-bang-lon{width:100%; border-collapse:collapse; font-size:12px}
.bx-bang-lon th{padding:6px var(--k2); text-align:left; font-weight:700; color:var(--chu-mo); border-bottom:1px solid var(--vien-dam)}
.bx-bang-lon td{padding:6px var(--k2); vertical-align:top; border-bottom:1px solid var(--vien-dam)}
.bx-bang-lon .bx-ct-hang td{border-bottom:0; padding-top:0}
.bx-bang-lon .bx-ct-hang td:empty,.bx-bang-lon .bx-ct-hang .bx-ct[hidden]:only-child{display:none}
.bx-bang-lon .bx-ghi{flex-wrap:nowrap}
.bx-bang-lon .bx-ghi-o{min-width:160px; flex:1}
.bx-bang-lon .bx-ten{min-height:var(--cao-nut); font-size:12px; flex-wrap:nowrap; align-items:flex-start; gap:4px}
body.quay-day .bx-man{padding:var(--k3) var(--k4) 0}
