/* ============================================================================
   ALPHA DESIGN ERP — MODERN REFINEMENT LAYER v4.8.39
   ----------------------------------------------------------------------------
   Lớp hợp nhất CUỐI CÙNG của design system: khôi phục và chuẩn hóa các quy tắc
   trình bày chuyên nghiệp đã bị các lớp vá lịch sử (v4.5.46 / v4.5.48) ghi đè,
   đồng thời bổ sung các bảo đảm accessibility / touch / motion toàn cục.

   NGUYÊN TẮC CỦA LỚP NÀY
   - Chỉ BỔ SUNG sau cùng; không sửa bất kỳ sheet lịch sử nào (các release-gate
     đang khóa nội dung của chúng).
   - `!important` CHỈ dùng ở đúng những nơi phải thắng một `!important` cũ
     (các "specificity closure" v4.5.46/48). Mỗi chỗ đều có chú thích lý do.
   - Token màu/đường kẻ dùng lại biến hiện hành (--line, --alpha-*) nên tự
     tương thích Dark mode.
   ============================================================================ */

/* ----------------------------------------------------------------------------
   1) BẢNG DỮ LIỆU — HỢP ĐỒNG CĂN GIỮA TOÀN HỆ THỐNG
      Yêu cầu chủ sở hữu sản phẩm (2026-08-25): nội dung MỌI bảng trên toàn bộ
      phần mềm căn GIỮA theo cột — bao gồm cả cột số tiền / số lượng / tỷ lệ —
      và tiêu đề cột căn giữa theo thân cột. Hợp đồng này THAY THẾ quy ước cũ
      "văn bản TRÁI · số liệu PHẢI · trạng thái GIỮA" của v4.5.45/v4.8.38.

      Cột số vẫn giữ `tabular-nums lining-nums`: mọi chữ số cùng bề rộng nên
      khối số căn giữa không "nhảy" khi giá trị thay đổi giữa các lần render.

      NGOẠI LỆ DUY NHẤT — Card View (`.alpha-card-view`): chế độ này KHÔNG có
      cột (mỗi ô là một dòng nhãn↔giá trị do alpha-data-grid.css dựng bằng
      flex). Ép căn giữa ở đó sẽ phá cặp nhãn/giá trị, nên loại trừ tường minh
      bằng `:not(.alpha-card-view)` ở mọi tầng.

      BA TẦNG SELECTOR là bắt buộc, không phải trùng lặp: các sheet lịch sử
      khóa căn lề bằng !important ở nhiều mức specificity khác nhau —
      (0,1,1) alpha-layout-modern/professional-ui · (0,2,1)…(0,3,2)
      design-system/construction/payroll · ID-level #appShell (v4.5.51).
      Mỗi tầng dưới đây hòa hoặc vượt đúng một nhóm trong số đó.
   ---------------------------------------------------------------------------- */

/* 1a. Tầng nền (0,1,4) — mọi bảng ở mọi container: modal, print, màn hình
   đăng nhập, view ngoài app-shell. */
table:not(.alpha-card-view)>thead>tr>th,
table:not(.alpha-card-view)>thead>tr>td,
table:not(.alpha-card-view)>tbody>tr>th,
table:not(.alpha-card-view)>tbody>tr>td,
table:not(.alpha-card-view)>tfoot>tr>th,
table:not(.alpha-card-view)>tfoot>tr>td,
table:not(.alpha-card-view)>tr>th,
table:not(.alpha-card-view)>tr>td{
  text-align:center!important;
}

/* 1b. Tầng module (0,2,4)+ — thắng closure của design-system, data-grid,
   construction-workspace/c13, payroll, accounting, staff-cost… */
.table-wrap table:not(.alpha-card-view)>thead>tr>th,
.table-wrap table:not(.alpha-card-view)>tbody>tr>td,
.table-wrap table:not(.alpha-card-view)>tfoot>tr>td,
.table-wrap>table.table-grid-exact th.table-col-numeric,
.table-wrap>table.table-grid-exact td.table-col-numeric,
.table-wrap>table.table-grid-exact th.table-col-date,
.table-wrap>table.table-grid-exact td.table-col-date,
.table-wrap>table.table-grid-exact th.table-col-primary,
.table-wrap>table.table-grid-exact td.table-col-primary,
.table-wrap>table.table-grid-exact th.table-col-text,
.table-wrap>table.table-grid-exact td.table-col-text,
.table-wrap>table.table-grid-exact th.numeric,
.table-wrap>table.table-grid-exact td.numeric,
.table-wrap>table.table-grid-exact thead th,
table.table-auto-columns th.table-col-numeric,
table.table-auto-columns td.table-col-numeric,
.alpha-data-grid:not(.alpha-card-view) thead th,
.alpha-data-grid:not(.alpha-card-view) tbody td,
.balanced-table .table-col-numeric,
.construction-workspace :is(th,td),
.construction-c13 :is(th,td),
.accounting-project-profit-table :is(th,td),
.accounting-management-result-table :is(th,td),
.payroll-detail-table :is(thead th,tbody td),
.staff-cost-table :is(th,td){
  text-align:center!important;
}

/* 1c. Tầng ID — hòa specificity với sắc lệnh `#appShell …!important`
   (v4.5.51 và các hotfix cột thao tác), thắng nhờ thứ tự nạp sau cùng. */
#appShell table:not(.alpha-card-view)>thead>tr>th,
#appShell table:not(.alpha-card-view)>tbody>tr>th,
#appShell table:not(.alpha-card-view)>tbody>tr>td,
#appShell table:not(.alpha-card-view)>tfoot>tr>td,
#appShell .table-wrap table:not(.alpha-card-view)>thead>tr>th,
#appShell .table-wrap table:not(.alpha-card-view)>tbody>tr>td,
#appShell .table-wrap table:not(.alpha-card-view)>tfoot>tr>td{
  text-align:center!important;
}
/* Lưu ý specificity: tầng ID (1,1,4) THẮNG cả closure Card View (0,4,4) của
   alpha-data-grid.css. Vì vậy `:not(.alpha-card-view)` ở đây là BẮT BUỘC —
   thiếu nó, ô Card View (dòng nhãn↔giá trị) bị ép căn giữa và vỡ layout. */
#appShell .table-wrap table:not(.alpha-card-view)>thead>tr>th.numeric,
#appShell .table-wrap table:not(.alpha-card-view)>thead>tr>th.table-col-numeric,
#appShell .table-wrap table:not(.alpha-card-view)>thead>tr>th.table-col-date,
#appShell .table-wrap table:not(.alpha-card-view)>thead>tr>th.table-col-status,
#appShell .table-wrap table:not(.alpha-card-view)>thead>tr>th.table-col-progress,
#appShell .table-wrap table:not(.alpha-card-view)>thead>tr>th.table-col-actions,
#appShell .table-wrap table:not(.alpha-card-view)>tbody>tr>td.numeric,
#appShell .table-wrap table:not(.alpha-card-view)>tbody>tr>td.table-col-numeric,
#appShell .table-wrap table:not(.alpha-card-view)>tbody>tr>td.table-col-date,
#appShell .table-wrap table:not(.alpha-card-view)>tbody>tr>td.table-col-primary,
#appShell .table-wrap table:not(.alpha-card-view)>tbody>tr>td.table-col-text,
#appShell .table-wrap table:not(.alpha-card-view)>tbody>tr>td.table-col-status,
#appShell .table-wrap table:not(.alpha-card-view)>tbody>tr>td.table-col-progress,
#appShell .table-wrap table:not(.alpha-card-view)>tbody>tr>td.table-col-actions,
#appShell .table-wrap table:not(.alpha-card-view)>tbody>tr>td.actions,
#appShell .table-wrap table:not(.alpha-card-view)>tbody>tr>td[colspan],
#appShell .table-wrap table:not(.alpha-card-view)>tfoot>tr>td.numeric,
#appShell .table-wrap table:not(.alpha-card-view)>tfoot>tr>td.table-col-numeric{
  text-align:center!important;
}

/* 1d. Bề rộng chữ số cố định — điều kiện để khối số căn giữa không rung cột
   giữa hai lần render (giữ nguyên từ hợp đồng cũ). */
td.numeric,th.numeric,
td.table-col-numeric,th.table-col-numeric,
td.table-col-date,th.table-col-date{
  font-variant-numeric:tabular-nums lining-nums;
}

/* 1e. Nội dung KHÔNG phải text-node cũng phải nằm giữa: `text-align` không tác
   động tới flex container (nhóm nút thao tác, mặc định flex-end) và block có
   min-width (thanh tiến độ). Hai loại này cần căn giữa bằng chính trục của
   chúng, nếu không cột Thao tác/Tiến độ sẽ lệch phải trong ô đã căn giữa. */
td.actions>.table-action-group,
td.table-col-actions>.table-action-group,
.table-wrap table:not(.alpha-card-view) td>.table-action-group,
#appShell table:not(.alpha-card-view) td>.table-action-group{
  justify-content:center!important;
  margin-inline:auto!important;
}
.table-wrap table:not(.alpha-card-view) td>.progress,
#appShell table:not(.alpha-card-view) td>.progress{
  margin-inline:auto!important;
}

/* ----------------------------------------------------------------------------
   2) BẢNG DỮ LIỆU — BỎ LƯỚI DỌC NẶNG NỀ (phong cách tối giản Nhật Bản:
      hàng phân tách bằng hairline; cột phân tách bằng KHOẢNG TRẮNG).
      Giữ nguyên shadow phân cách của cột sticky đầu/cuối (do data-grid quản lý).
   ---------------------------------------------------------------------------- */
.table-wrap>table.table-grid-exact>thead>tr>th,
.table-wrap>table.table-grid-exact>tbody>tr>td,
.table-wrap>table.table-grid-exact>tfoot>tr>td,
.table-wrap>table.table-grid-exact>tfoot>tr>th{
  border-inline-end:0; /* trung hòa lưới dọc v4.5.45 (không !important gốc) */
}

/* ----------------------------------------------------------------------------
   3) CHÍNH SÁCH XUỐNG DÒNG TRONG Ô — không bẻ giữa từ tiếng Việt.
      (fit-wide từng đặt overflow-wrap:anywhere → "mặt bằng" bị cắt "mặt/bằng"
      sai vị trí, tên riêng vỡ chữ.)
   ---------------------------------------------------------------------------- */
.balanced-table.table-fit-wide th,
.balanced-table.table-fit-wide td,
.alpha-data-grid tbody td{
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:none;
}
/* Mã/chuỗi kỹ thuật vẫn được phép bẻ bất kỳ để không tràn cột */
.alpha-data-grid td .code,
.alpha-data-grid td code,
td.account-code,
td [data-alpha-field="code"]{
  overflow-wrap:anywhere;
}

/* Nhãn/tiêu đề bảng legacy chưa qua data-grid: nâng cỡ chữ tối thiểu cho dễ đọc,
   đồng nhất với data-grid (th 9px→10px, td 11px→12px). */
.table-wrap table:not(.alpha-data-grid) th{font-size:10px}
.table-wrap table:not(.alpha-data-grid) td{font-size:12px;line-height:1.45}

/* ----------------------------------------------------------------------------
   4) BANNER TRẠNG THÁI MẠNG — không được che các điều khiển giữa toolbar.
      Desktop/tablet: neo góc phải dưới header như một toast hệ thống.
      (Mobile giữ nguyên hành vi đáy màn hình của design-system.)
   ---------------------------------------------------------------------------- */
@media(min-width:821px){
  .network-state-banner{
    left:auto;
    right:14px;
    transform:none;
    max-width:min(420px,calc(100vw - 28px));
  }
}

/* ----------------------------------------------------------------------------
   5) FOCUS-VISIBLE TOÀN CỤC — bảo đảm mọi điều khiển có chỉ báo bàn phím,
      kể cả nơi các sheet cũ chưa khai báo. Không đổi thiết kế các focus ring
      chuyên biệt đã có (rule cụ thể hơn vẫn thắng).
   ---------------------------------------------------------------------------- */
:where(button,[role="button"],a[href],input,select,textarea,summary,[tabindex]:not([tabindex="-1"])):focus-visible{
  outline:2px solid var(--primary,#226b93);
  outline-offset:2px;
  border-radius:6px;
}
:where(button,[role="button"],a[href]):focus:not(:focus-visible){outline:0}

/* ----------------------------------------------------------------------------
   6) GIẢM CHUYỂN ĐỘNG TOÀN CỤC — tôn trọng prefers-reduced-motion ở mọi lớp,
      kể cả các sheet lịch sử chưa khai báo. (Bổ trợ cho 21 khối hiện có.)
   ---------------------------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;   /* thắng animation cũ có !important */
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}

/* ----------------------------------------------------------------------------
   7) MỤC TIÊU CHẠM ≥44px TRÊN THIẾT BỊ CẢM ỨNG (WCAG 2.5.5 / Apple HIG).
      Chỉ áp cho con trỏ thô để desktop giữ mật độ chuyên nghiệp.
   ---------------------------------------------------------------------------- */
@media (pointer:coarse){
  button,
  .ghost-btn,
  .primary-btn,
  .toolbar-button,
  .accounting-tab,
  .alpha-grid-control,
  .nav-item,
  .mobile-bottom-nav button,
  input[type="checkbox"]+label,
  select,
  input:not([type="checkbox"]):not([type="radio"]),
  .filter-select,
  .search-input{
    min-height:44px;
  }
  .table-wrap td .ghost-btn{min-height:40px;padding-block:8px}
  .alpha-context-action,.alpha-context-close{min-height:44px}
  /* Pill lọc/tìm kiếm dùng height:38px!important nội bộ — nâng vùng chạm của
     CẢ pill lẫn control bên trong lên chuẩn 44 (cần !important tương xứng). */
  .filter-control{min-height:44px}
  .filter-control .search-input,
  .filter-control .filter-select:not(.searchable-native-select),
  .filter-control .searchable-combobox-input{
    height:44px!important;
    min-height:44px!important;
  }
  /* Construction sub-screens từng chốt 38px */
  .construction-c13 button,.construction-c13 select,
  .construction-c4__form button{min-height:44px}
}

/* ----------------------------------------------------------------------------
   8) TRẠNG THÁI HÀNG & HOVER TINH TẾ — phản hồi rõ nhưng không lòe loẹt.
   ---------------------------------------------------------------------------- */
.alpha-data-grid tbody tr:hover td{
  background:color-mix(in srgb,var(--primary,#226b93) 4%,var(--alpha-surface,#fff))!important; /* thắng nền trắng !important của data-grid */
}
html[data-theme="dark"] .alpha-data-grid tbody tr:hover td{
  background:color-mix(in srgb,var(--primary,#4fa9ff) 9%,var(--alpha-surface,#0f1a24))!important;
}

/* ----------------------------------------------------------------------------
   9) EMPTY-STATE BẢNG — đồng nhất khoảng thở và giọng hướng dẫn.
   ---------------------------------------------------------------------------- */
.table-empty-state{
  display:grid;
  justify-items:center;
  gap:6px;
  padding:34px 16px;
  color:var(--muted,#64748b);
}
.table-empty-state>span{font-size:22px;opacity:.55}
.table-empty-state>strong{font-size:12.5px;color:var(--text,#22314a)}
.table-empty-state>small{font-size:11px}

/* ----------------------------------------------------------------------------
   10) THÔNG BÁO LỖI TRONG KHUNG NỘI DUNG — thân thiện, không lộ chi tiết kỹ thuật
       thô. (JS đã lo phần message; đây là khung hiển thị nhất quán.)
   ---------------------------------------------------------------------------- */
.notice.danger,.doc-error{
  border-radius:12px;
  line-height:1.5;
}
.demo-feature-note{
  display:grid;
  gap:6px;
  padding:18px 16px;
  border:1px dashed color-mix(in srgb,var(--primary,#226b93) 38%,transparent);
  border-radius:12px;
  background:color-mix(in srgb,var(--primary,#226b93) 5%,var(--card,#fff));
  color:var(--muted,#5b6b80);
  font-size:11.5px;
}
.demo-feature-note strong{color:var(--text,#22314a);font-size:12.5px}

/* ----------------------------------------------------------------------------
   11) DARK MODE — đồng bộ các phần tử lớp này (line/hover đã dùng token nên
       phần lớn tự áp; bổ sung các nền cứng còn lại của khu vực bảng legacy).
   ---------------------------------------------------------------------------- */
html[data-theme="dark"] .table-wrap table:not(.alpha-data-grid) th{background:#13202b;color:#9fb1c1}
html[data-theme="dark"] .table-wrap table:not(.alpha-data-grid) td{border-bottom-color:#20303d}
html[data-theme="dark"] .table-empty-state>strong{color:#dbe6ef}
html[data-theme="dark"] .demo-feature-note{background:color-mix(in srgb,#4fa9ff 8%,#101c26);color:#9fb1c1}
html[data-theme="dark"] .demo-feature-note strong{color:#dbe6ef}

/* ------------------------------------------------------------------
   BANG TRAN THI PHAI CUON TOI DUOC.

   Nhieu luat trong he thong tat cuon ngang bang overflow-x:hidden!important
   voi gia dinh "man hinh rong thi bang luon vua khung":
     - @media(min-width:1280px) .table-wrap:has(> table.table-auto-columns)
     - .table-wrap.desktop-no-scroll
     - .dashboard-project-table-wrap
   Do tren ban chay that 28/08/2026, bang "Dong tien theo thang":
     1440px thua 171px · 1536px thua 15px · 1600px thua 10px · 1680px thua 2px
   Gia dinh do sai, va hau qua la mot cot so tien bien mat khong xem toi duoc.

   enhanceResponsiveTables() do be rong THAT cua <table> roi gan lop nay khi
   bang thuc su tran. Chi luc do moi bat cuon — bang vua khung van sach se,
   khong co thanh cuon thua.

   Lap lai ten lop hai lan de do uu tien vuot .table-wrap:has(> table...)
   (0,2,1); (0,3,0) thang. Khong phai meo, la yeu cau cua cascade.
   ------------------------------------------------------------------ */
.table-wrap.table-overflow-reachable.table-overflow-reachable{
  overflow-x:auto!important;
  padding-bottom:2px!important;
}

/* ------------------------------------------------------------------
   CHECKBOX / RADIO TRONG .field KHONG PHAI O NHAP CHU.

   Luat .field input{width:100%;min-height:43px;border;padding;background}
   duoc viet cho input text/date, nhung selector cua no trung ca
   input[type=checkbox] va input[type=radio]. Hau qua: mot o tich bien
   thanh hop cao 43px rong het o, chu bi day sang mep va xuong dong.
   Da thay tren man hinh "Nghi phep & che do" muc Nua ngay.

   Hai luat gay ra viec nay deu dung !important:
     alpha-professional-ui.css  .field input,... {min-height:41px!important}
     alpha-design-system.css    .field input,... {min-height:var(--ux-control-height)!important}
   nen ban va nay cung phai !important; do uu tien (0,2,1) > (0,1,1) thi thang.
   Ap cho ca .drawer-form va .modal-form vi ba noi dung chung mot dang selector.
   ------------------------------------------------------------------ */
.field input[type="checkbox"],
.field input[type="radio"],
.drawer-form input[type="checkbox"],
.drawer-form input[type="radio"],
.modal-form input[type="checkbox"],
.modal-form input[type="radio"]{
  width:16px!important;
  height:16px!important;
  min-height:0!important;
  min-width:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
  accent-color:#1c78aa;
  flex:0 0 auto;
  appearance:auto;
}

/* ---------- Vien chon "Nua ngay" o form tao don nghi ---------- */
.halfday-options{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.halfday-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:0 13px;
  border:1px solid var(--line,#d0dde4);
  border-radius:10px;
  background:var(--surface,#fff);
  color:var(--text,#112631);
  font-size:12px;
  font-weight:600;
  line-height:1;
  cursor:pointer;
  user-select:none;
  transition:border-color .15s ease,background .15s ease,box-shadow .15s ease;
}
.halfday-chip:hover{border-color:#93bdd4;background:color-mix(in srgb,#1c78aa 6%,var(--surface,#fff))}
.halfday-chip input[type="checkbox"]{width:16px;height:16px;margin:0;cursor:pointer}
.halfday-chip span{white-space:nowrap}
/* Trang thai da chon: doi ca vien lan nen, de nhin luot qua la biet ngay. */
.halfday-chip:has(input:checked){
  border-color:#1c78aa;
  background:color-mix(in srgb,#1c78aa 11%,var(--surface,#fff));
  color:#14455f;
}
.halfday-chip:focus-within{box-shadow:0 0 0 3px color-mix(in srgb,#1c78aa 22%,transparent)}

html[data-theme="dark"] .halfday-chip{
  border-color:#2d4857;
  background:#0f2532;
  color:#d0e1eb;
}
html[data-theme="dark"] .halfday-chip:hover{border-color:#40687d;background:#16313f}
html[data-theme="dark"] .halfday-chip:has(input:checked){
  border-color:#56a3cd;
  background:#183747;
  color:#eaf3f7;
}

/* ------------------------------------------------------------------
   HAI BANG CANH NHAU THI CHIA DEU KHONG GIAN.

   Luat nen .two-col{grid-template-columns:minmax(0,1.55fr) minmax(310px,.85fr)}
   duoc thiet ke cho cap "bieu do lon ben trai + danh sach nho ben phai".
   Khi CA HAI o deu la BANG thi ti le do phan bo nguoc:

     Do tren ban chay that 29/08/2026, trang Dong tien, khung 1366px:
       "Co cau tien vao"      2 cot · duoc 662px · can 646px
       "Dong tien theo thang" 4 cot · duoc 363px · can 517px  -> thua 168px, phai cuon

   Bang IT cot hon lai duoc gan gap doi cho. Cot RONG cuoi cung ("Rong") bi
   day ra ngoai khung.

   Chi ap khi MOI o con deu la .table-card: `:not(:has(> :not(.table-card)))`
   nghia la "khong co o con nao khong phai bang" — cap bieu do+danh sach giu
   nguyen ti le cu.

   Do uu tien: :has() lay do uu tien cua doi so, nen (0,2,0)+(0,1,0)=(0,3,0),
   thang luat nen .two-col (0,1,0).
   ------------------------------------------------------------------ */
.grid.two-col:not(:has(> :not(.table-card))){
  /* auto chu khong phai 1fr: moi cot lay dung be rong noi dung CAN roi moi chia phan du.
     Do lai o 1600px: 651px cho bang 2 cot / 602px cho bang 4 cot — dung chieu. */
  grid-template-columns:minmax(0,auto) minmax(0,auto)!important;
}
/* Duoi 1500px thi hai bang tien 4 cot canh nhau van chat: do duoc o 1366px van con thieu 11px.
   Xep doc thi moi bang duoc tron chieu ngang — dung yeu cau "hien thi duoc full thong tin",
   thay vi bat nguoi dung cuon ngang trong mot o hep. */
@media (max-width:1500px){
  .grid.two-col:not(:has(> :not(.table-card))){
    grid-template-columns:minmax(0,1fr)!important;
  }
}

/* ------------------------------------------------------------------
   BANG "Co cau tien vao" (man hinh Dong tien): hai cot rong bang nhau.

   Bo chia cot tu dong trong app.js can theo trong so ngu nghia nhan he so
   do dai noi dung. Bang chi co HAI cot thi cot 'table-col-primary' (he so
   nen 1.38) nuot gan het be ngang. Do tren trinh duyet that 29/08/2026:
       Nhom 465px (76%)  ·  Gia tri 145px (24%)   — lech 320px / 610px
   Bang 4 cot ben canh chia 33/20/17/29 nen trong can hon han.

   Cach sua: bang tu khai colgroup va gan lop 'table-authored-columns' —
   applyDesktopTableColumnLayout() se giu nguyen hinh hoc do khai, khong
   sinh chieu rong nua. Pham vi dung bang MOT bang, khong dung toi cac
   bang hai cot khac trong phan mem (neu nham .table-columns-2 thi trung het).
   ------------------------------------------------------------------ */
.table-wrap>table.cashflow-inflow-table{table-layout:fixed!important;width:100%!important;min-width:0!important}
.cashflow-inflow-table>colgroup>col.cashflow-inflow-col{width:50%}

/* ------------------------------------------------------------------
   BO THAM SO PHAP LY (man hinh Thue).

   Backend co san /tax/policies kem submit/approve/reject tu lau nhung
   KHONG man hinh nao goi toi, nen bo tham so nam mai o Draft va ca phan
   he Luong khong tinh duoc dong nao. Do ngay 29/08/2026.

   Trong tam khong phai cai nut Duyet ma la hai khoi thong tin canh no:
   danh sach _canXacNhan (cho he thong tu nhan la chua chac) va _nguon
   (nguon phap ly cua tung con so). Nut Duyet khong kem hai thu do la bay.
   ------------------------------------------------------------------ */
.tax-policy-list{display:flex;flex-direction:column;gap:14px;padding:0 var(--card-pad,20px) var(--card-pad,20px)}
.tax-policy-card{display:flex;flex-direction:column;gap:14px}
.tax-policy-card .section-header{align-items:flex-start;gap:16px;padding:0}
.tax-policy-card h3{margin:0;font-size:1.02rem;line-height:1.35}
.tax-policy-card .section-header p{margin:4px 0 0;font-size:.84rem;color:var(--muted,#6b7f88)}
.tax-policy-checklist{margin:10px 0 0;padding-left:1.15em;display:flex;flex-direction:column;gap:8px;font-size:.88rem;line-height:1.55}
.tax-policy-checklist li::marker{font-weight:600}
.tax-policy-sources{border:1px solid var(--line,#d8e3ed);border-radius:6px;padding:10px 14px;font-size:.86rem}
.tax-policy-sources summary{cursor:pointer;font-weight:500}
.tax-policy-sources dl{margin:12px 0 0;display:grid;grid-template-columns:minmax(150px,auto) 1fr;gap:6px 16px}
.tax-policy-sources dt{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem;color:var(--muted,#6b7f88);word-break:break-word}

/* Small supporting labels need the same AA contrast as body text. */
html:not([data-theme="dark"]) .sidebar-product>small,
html:not([data-theme="dark"]) .global-search-wrap kbd{color:#526673!important}
.tax-policy-sources dd{margin:0}
.tax-policy-card .form-actions{margin:0;padding:0;border:0;justify-content:flex-start;gap:10px}
@media (max-width:720px){
  .tax-policy-sources dl{grid-template-columns:1fr}
  .tax-policy-sources dt{margin-top:8px}
}

/* Collapsed navigation: the 76px rail has only 47px left inside its nested
   padding. Fit each square to that space instead of clipping a fixed 56px
   button at the scroll container's right edge. Override the legacy fixed
   height as well so the complete rounded frame stays square. */
@media (min-width:821px){
  .sidebar.collapsed .nav .nav-item{
    width:min(50px,100%)!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:1;
  }
  .sidebar.collapsed .nav .nav-item:focus-visible{
    outline-offset:0!important;
  }
}

/* Operational control: keep forecast warnings readable and centered as one column. */
#control-panel-quality>.card.table-card.section:last-child .table-wrap>table{
  min-width:1020px;
  table-layout:fixed;
}
#control-panel-quality>.card.table-card.section:last-child :is(th,td):nth-child(1){width:29%}
#control-panel-quality>.card.table-card.section:last-child :is(th,td):nth-child(2){width:18%}
#control-panel-quality>.card.table-card.section:last-child :is(th,td):nth-child(3){width:13%}
#control-panel-quality>.card.table-card.section:last-child :is(th,td):nth-child(4){width:16%}
#control-panel-quality>.card.table-card.section:last-child :is(th,td):nth-child(5){
  width:24%;
  text-align:center!important;
  vertical-align:middle;
}
#control-panel-quality>.card.table-card.section:last-child td:nth-child(5) .control-warning{
  max-width:none;
  margin:4px auto;
  text-align:center;
  overflow-wrap:anywhere;
}
/* Nhãn phụ trên thẻ KPI (đơn vị, chú thích) phải đạt tương phản WCAG AA ở MỌI màn hình.
   alpha-layout-modern.css đặt .kpi-foot,.kpi-unit{color:#82929c!important} = 3,21:1 trên nền trắng
   (axe 18/09/2026, tab Tài sản/CCDC: 11 nút serious). Bản v4.8.79 chỉ sửa trong
   #content[data-view="dashboard"] nên các thẻ KPI ở Mua sắm & Tài sản vẫn đỏ. Số đo bằng công thức
   WCAG (tests/backend/tuong-phan-wcag-aa-v4880.test.mjs): #52646f trên #ffffff = 6,16:1,
   trên #f7f8fa = 5,79:1; dark #c0ced7 trên #10232d = 10,04:1. */
#content .executive-stat-rail span,
#content .executive-stat-rail small,
#content .kpi-card .kpi-unit,
#content .kpi-card .kpi-foot,
#content .kpi-card .kpi-foot span{color:#52646f!important}
html[data-theme="dark"] #content .executive-stat-rail span,
html[data-theme="dark"] #content .executive-stat-rail small,
html[data-theme="dark"] #content .kpi-card .kpi-unit,
html[data-theme="dark"] #content .kpi-card .kpi-foot,
html[data-theme="dark"] #content .kpi-card .kpi-foot span{color:#c0ced7!important}

/* v4.8.80 — Tìm kiếm trên di động. Header ≤820px giấu .global-search-wrap (alpha-layout-modern.css)
   nên trước đây điện thoại KHÔNG có cách nào tìm kiếm: Ctrl K không tồn tại trên màn cảm ứng và
   body.alpha-command-open chỉ đổi position chứ không thắng display:none!important. Nút kính lúp
   #mobileSearchBtn mở bảng lệnh; khi bảng lệnh mở, ô tìm kiếm phải hiện lên như trên desktop. */
.mobile-search{display:none}
@media(max-width:820px){
  .header-actions .mobile-search{display:grid!important;place-items:center;min-width:42px;min-height:42px}
  body.alpha-command-open .global-search-wrap{display:flex!important}
  body.alpha-command-open .global-search-wrap kbd{display:none!important}
}

/* v4.8.80 — Thanh điều hướng đáy trên di động: alpha-layout-modern.css đặt nhãn mục không hoạt động
   #71848f = 3,82:1 trên nền #fcfdfe (axe 18/09/2026, mobile-chromium, màn Dự án: 2 nút serious).
   #56707c = 5,15:1 trên #fcfdfe (công thức WCAG, tests/backend/tuong-phan-wcag-aa-v4880.test.mjs);
   mục đang hoạt động giữ #165e84 (7,07:1). Dark: #b7c7d1 trên #0d1d26 = 9,91:1, mục hoạt động
   #7fcdf2 = 9,76:1 (trước đây dark kế thừa #165e84 = 2,43:1 — mục đang chọn gần như không thấy). */
@media(max-width:820px){
  html:not([data-theme="dark"]) .mobile-bottom-nav button{color:#56707c!important}
  html:not([data-theme="dark"]) .mobile-bottom-nav button.active{color:#165e84!important}
  html[data-theme="dark"] .mobile-bottom-nav button{color:#b7c7d1!important}
  html[data-theme="dark"] .mobile-bottom-nav button.active{color:#7fcdf2!important}
}