/* CSS riêng của App Công Việc — PH-GD-TC (anh Chung duyệt 26/10/2026; 2.11 theo ảnh trang chủ quản lý 27/10/2026).
   Chỉ bố cục trình bày. Chỉ dùng BIẾN của bộ giao-dien-chung (không mã màu, không bóng, không chuyển màu, không độ mờ, không font riêng).
   KHÔNG nhắm lớp .gd-… của bộ: mã app gắn lớp riêng cv-… vào phần tử cần chỉnh (luật dòng 24 bộ kiểm 4C).
   Ngoại lệ đã ghi ở KHAC-CHUAN-GIAO-DIEN.md (CV-NL-a / b / c). */

/* 2.11a — bấm được thể hiện bằng ô (nền + viền nhẹ + ›), KHÔNG gạch chân */
.cv-lk { color: inherit; text-decoration: none; }

/* 2.11b — 3 số con của thẻ Có mặt: 3 ô bằng nhau, số trên, nhãn dưới, căn giữa, cả ô bấm được (≥ 44px) */
.cv-luoi-3 { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: var(--sp-2); }   /* 2 hoặc 3 ô: chia đều theo số ô */
.cv-o-so { min-width: 0; min-height: 44px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  padding: var(--sp-2) var(--sp-1); border: 1px solid var(--ke); border-radius: var(--r-nho); background: var(--the-phu); color: inherit; text-decoration: none;
  overflow-wrap: anywhere; }

/* 2.11c — lưới ô lẻ: hàng chỉ còn MỘT ô -> ô đó kéo hết bề ngang hàng */
.cv-hang > :only-child { flex: 1 1 100%; width: 100%; }

/* 2.11d — khối cuối trang không bị thanh dưới (và nút giữa nhô lên) che */
main#noi-dung { padding-bottom: var(--sp-3); }

/* 2.3 — danh sách 2 dòng: dòng chính 1 dòng (tên cắt …, số / trạng thái bên phải không xuống dòng), dòng phụ 1 dòng cắt … */
.cv-dong-chinh { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cv-dong-phu { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cv-so-phai { white-space: nowrap; flex-shrink: 0; }
/* lưới 2 tầng (CV.haiDong): hàng 1 = tên | số / trạng thái | ›; hàng 2 = dòng phụ chạy hết bề ngang. Khoảng cách bằng lề (cột trống không để hở) */
.cv-hai-dong { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 0; align-items: center; }
.cv-hai-dong > .cv-giua { display: contents; }
.cv-hai-dong .cv-dong-chinh { grid-column: 1; grid-row: 1; min-width: 0; }
.cv-hai-dong > .cv-so-phai { grid-column: 2; grid-row: 1; margin-left: var(--sp-3); }
.cv-hai-dong > .cv-mui { grid-column: 3; grid-row: 1; margin-left: var(--sp-3); }
.cv-hai-dong .cv-dong-phu { grid-column: 1 / -1; grid-row: 2; min-width: 0; }
.cv-co-icon { grid-template-columns: auto minmax(0, 1fr) auto auto; }
.cv-co-icon > .cv-icon { grid-column: 1; grid-row: 1 / span 2; margin-right: var(--sp-3); }
.cv-co-icon .cv-dong-chinh { grid-column: 2; }
.cv-co-icon > .cv-so-phai { grid-column: 3; }
.cv-co-icon > .cv-mui { grid-column: 4; }
.cv-co-icon .cv-dong-phu { grid-column: 2 / -1; }

/* 2.2 — hàng nút chọn ≤ 4 lựa chọn: dùng kiểu "nhom" của bộ (chia đều, xuống dòng, không cuộn ngang); chỉ thêm ngắt chữ dài trong nút */
.cv-chon-deu > * { overflow-wrap: anywhere; }

/* 2.6 — nhãn "Tạm tính" sát số */
.cv-tam-tinh { display: inline-block; margin-left: var(--sp-2); padding: 0 var(--sp-2); border: 1px solid var(--nhan); border-radius: 999px;
  color: var(--nhan-chu); font-size: .75rem; line-height: 1.6; vertical-align: middle; white-space: nowrap; }

/* 2.4 — ô tìm nhanh: dòng đếm kết quả */
.cv-tim-dem { margin-top: var(--sp-1); color: var(--chu-phu); font-size: .8125rem; }

/* PH-TK — Thư ký (chỉ tài khoản chủ). Bong bóng: anh bên phải nền vàng, thư ký bên trái nền thẻ. Thanh đáy riêng đặt vào chỗ thanh dưới của bộ (k.datThanh). */
.cv-tk-ds { display: flex; flex-direction: column; gap: var(--sp-3); padding-bottom: var(--sp-2); }
.cv-tk-hang { display: flex; flex-direction: column; align-items: flex-start; gap: var(--sp-1); max-width: 100%; }
.cv-tk-hang--anh { align-items: flex-end; }
.cv-tk-tin { max-width: 86%; padding: var(--sp-2) var(--sp-3); border-radius: var(--r-the); overflow-wrap: anywhere; line-height: 1.5; }
.cv-tk-anh { background: var(--g4); color: var(--tren-vang); }
.cv-tk-thu-ky { background: var(--the-phu); color: var(--chu); border: 1px solid var(--ke); }
.cv-tk-tin--chon { outline: 2px solid var(--g4); outline-offset: 2px; }
.cv-tk-meta { margin-top: var(--sp-1); font-size: .75rem; line-height: 1.4; }
.cv-tk-thu-ky .cv-tk-meta { color: var(--chu-phu); }
.cv-tk-nhap { width: 100%; max-width: 100%; display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-3); border: 1px solid var(--ke); border-radius: var(--r-the); background: var(--the-phu); }
.cv-tk-dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--sp-1) var(--sp-3); }
.cv-tk-dl dt { color: var(--chu-phu); }
.cv-tk-dl dd { margin: 0; overflow-wrap: anywhere; font-weight: 600; }
.cv-tk-tt { font-size: .8125rem; color: var(--chu-phu); }
.cv-tk-tron--vang { background: var(--g4); color: var(--tren-vang); }
.cv-tk-to { background: var(--g4); color: var(--tren-vang); border-radius: 2px; }
.cv-tk-day { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--sp-2); height: 100%; padding: 0 var(--sp-3); }
.cv-tk-giua { min-width: 0; }
.cv-tk-nghe, .cv-tk-cham-noi, .cv-tk-go { width: 100%; min-height: 44px; border: 1px solid var(--ke); border-radius: 999px; background: var(--the-phu); color: var(--chu);
  padding: 0 var(--sp-3); font: inherit; }
.cv-tk-nghe { display: flex; align-items: center; gap: var(--sp-2); overflow: hidden; }
.cv-tk-nghe-chu { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.cv-tk-song { display: inline-flex; align-items: center; gap: 3px; flex: none; }
.cv-tk-song > span { display: block; width: 3px; border-radius: 2px; background: var(--g4); }
.cv-tk-song > span:nth-child(1) { height: 8px; } .cv-tk-song > span:nth-child(2) { height: 16px; } .cv-tk-song > span:nth-child(3) { height: 12px; } .cv-tk-song > span:nth-child(4) { height: 6px; }
.cv-tk-cham-noi { display: flex; align-items: center; justify-content: center; gap: var(--sp-2); cursor: pointer; }

/* PH-SOKT-CHU-DE-HIEU (02/11): màn Sổ KT — từng khối (dòng + nút của nó) cách nhau rõ; nút giữ bề rộng theo chữ (CV-NL-m) */
.cv-ds-khoi { display: flex; flex-direction: column; gap: var(--sp-4); }
.cv-khoi { display: flex; flex-direction: column; gap: var(--sp-2); }
/* CV-NL-n (02/11): số lớn + "Tạm tính" không vừa một dòng -> thu cỡ số (CV.ganTamTinh đo và gắn) */
.cv-so-thu { font-size: 1.75rem; }
.cv-so-thu-2 { font-size: 1.5rem; }

/* PH-DONG-PHUC-ANH-2.9.13 (CV-NL-o) — khung camera chụp ảnh đồng phục lúc chấm ĐẾN + ảnh xem lại: bộ chưa có thành phần camera / ảnh.
   Chỉ khung (bề ngang theo cột, cao tối đa 60% màn, bo góc + nền thẻ phụ của bộ). CHỈ camera trước (hiện như gương); ảnh lưu KHÔNG lật. */
.cv-camera { display: block; width: 100%; max-height: 60vh; aspect-ratio: 3 / 4; object-fit: cover; border-radius: var(--r-nho); background: var(--the-phu); border: 1px solid var(--ke); }
.cv-camera--guong { transform: scaleX(-1); }
.cv-anh { display: block; width: 100%; max-height: 60vh; object-fit: contain; border-radius: var(--r-nho); background: var(--the-phu); border: 1px solid var(--ke); }
.cv-anh-dong { display: flex; gap: var(--sp-2); align-items: flex-start; padding: var(--sp-2) 0; border-top: 1px solid var(--ke); }
.cv-anh-dong:first-child { border-top: 0; }
.cv-anh-nho { display: block; width: 72px; height: 96px; object-fit: cover; border-radius: var(--r-nho); background: var(--the-phu); border: 1px solid var(--ke); }
.cv-anh-dong > a, .cv-anh-dong > .cv-anh-trong { flex: 0 0 auto; min-height: 44px; }
.cv-anh-dong > :last-child { min-width: 0; flex: 1 1 auto; overflow-wrap: anywhere; }
.cv-anh-trong { width: 72px; height: 96px; display: flex; align-items: center; justify-content: center; text-align: center; border-radius: var(--r-nho); background: var(--the-phu); border: 1px solid var(--ke); }

/* BT-01 (anh Chung duyệt 09/11/2026) — CHẾ ĐỘ THỬ (chỉ khi máy chủ đặt BM_BAN_THU=1; bản chính không có 2 lớp này trên trang).
   Dải "BẢN THỬ — không phải app thật" cố định trên đầu mọi màn, cao 28px, màu = cặp token nút chính của bộ (--g4 / --tren-vang), không màu mới.
   Khung app (bám cửa sổ bằng --vung-tren) lùi xuống đúng 28px để dải không đè nội dung. */
html.cv-ban-thu { --vung-tren: calc(env(safe-area-inset-top, 0px) + 28px); }
.cv-dai-thu { position: fixed; top: env(safe-area-inset-top, 0px); left: 0; right: 0; height: 28px; z-index: 2147483000; display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 700; line-height: 1; background: var(--g4); color: var(--tren-vang); pointer-events: none; }
