/* Chấm công Nhóm Đọc Sách — CSS RIÊNG CỦA APP: CHỈ bố cục nghiệp vụ (CHUAN 1.2, 4C BỘ GIAO DIỆN CHUNG).
   Không mã màu, không chuyển màu, không bóng, không font, không cỡ chữ, không nhắm lớp của bộ.
   Khoảng cách và đường kẻ dùng biến của bộ. */

/* Bộ chọn màn Chấm công (12.3): lưới 2 cột rộng bằng nhau, xuống dòng — khối chứa đặt lưới, nút giữ nguyên hình dáng của bộ */
.ccds-chon-luoi > [role="group"] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Thẻ "Chuyên cần tháng này" (12.6): MỘT thẻ, lưới 2 × 2, các ô không nền, không viền thẻ riêng, ngăn bằng đường kẻ */
.ccds-luoi-4 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ccds-luoi-4 > div { padding: var(--sp-3) var(--sp-2); }
.ccds-luoi-4 > div:nth-child(odd) { border-right: 1px solid var(--ke); padding-left: 0; }
.ccds-luoi-4 > div:nth-child(n+3) { border-top: 1px solid var(--ke); }

/* Nhiều khối trong cùng một thẻ (màn 02, 03, 11, 13, 16): ngăn nhau bằng đường kẻ, không thẻ chồng thẻ (GD-2) */
.ccds-khoi + .ccds-khoi { border-top: 1px solid var(--ke); padding-top: var(--sp-3); }
.ccds-khoi > * + * { margin-top: var(--sp-2); }
.ccds-luoi-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2) var(--sp-3); }
.ccds-hang { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); }