/* =============================================================================
   THANG Z-INDEX CHUNG cho lớp nổi của bộ control (22/09)

   Trước: số rải rác trong thư viện (20, 9500, 9999, 99998, 99999, 100000, 100001, 100010, 200000,
   2147483647…) và của Portal (2, 10, 20, 30, 9998, 9999). Nay một thang biến CSS, bậc nào đè bậc nào
   nhìn là biết. Luật dưới đây đè số của thư viện bằng bộ chọn lặp lớp (thư viện chèn CSS SAU tệp này
   qua adoptedStyleSheets, cùng độ ưu tiên thì nó thắng) — không sửa tệp thư viện.

   LƯU Ý: hộp thoại của Portal là <dialog>.showModal() — nằm ở TOP LAYER, trên mọi z-index. Lớp nổi gắn
   vào <body> vì thế luôn bị che dù z-index cao đến đâu; ThemHis/js/lop-noi-tren-hop-thoai.js chuyển lớp
   nổi vào trong hộp thoại đang mở. Thang này lo thứ tự GIỮA các lớp nổi với nhau và với khung trang.
   ========================================================================== */
:root {
  --z-trong-luoi: 20;      /* nút góc nhóm, ô đang sửa — trong lòng lưới */
  --z-khung-trang: 30;     /* đầu trang dính, thanh điều hướng */
  --z-lop-noi: 1100;       /* bảng lọc cột, thực đơn tiêu đề, danh sách xổ, lịch, gợi ý */
  --z-phu-man: 1200;       /* lớp phủ cả màn của control (xem trọn ô, hộp chọn nhiều) */
  --z-thong-bao: 1300;     /* hộp nổi thông báo, hộp khoá màn của thư viện */
  --z-goi-y: 1400;         /* chú giải rê chuột — trên cùng */
}

.excel-filter-panel.excel-filter-panel,
.exgrid-hdr-menu.exgrid-hdr-menu,
.exgrid-cc-popup.exgrid-cc-popup,
.exgrid-panel-loc.exgrid-panel-loc,
.benh-lkpop.benh-lkpop,
.flatpickr-calendar.flatpickr-calendar,
.ts-dropdown.ts-dropdown { z-index: var(--z-lop-noi); }

.exgrid-cellpop-bg.exgrid-cellpop-bg,
.dmg-modal-bg.dmg-modal-bg { z-index: var(--z-phu-man); }

.his-toast-wrap.his-toast-wrap,
.his-toast-cfg.his-toast-cfg,
.his-toast-test.his-toast-test,
.his-mdl-bd.his-mdl-bd { z-index: var(--z-thong-bao); }

.tooltip.tooltip,
.popover.popover { z-index: var(--z-goi-y); }