/*
File: dark.css — CHẾ ĐỘ TỐI của panel (task-40). Nạp ở layouts/head-style.php, SAU app.min.css + panel.css (mọi trang, kể cả đăng nhập). MỌI luật dưới đây nằm trong [data-bs-theme="dark"]
(<html> + <body> được assets/js/app.js — window.kpTheme — và đoạn đầu trang layouts/body.php đặt khi người dùng chọn tối) nên CHẾ ĐỘ SÁNG KHÔNG ĐỔI MỘT BYTE.

Vì sao có file này: template đã có phần lớn giao diện tối, nhưng một số màu của nó (và của Bootstrap) thiếu tương phản trên nền tối — đo bằng tests/ui/audit-dark.js (WCAG: chữ ≥ 4,5 : 1, biểu tượng ≥ 3 : 1)
trên MỌI trang của panel ở bộ thử, lúc đầu 769 / 769 lượt đo tối có lỗi (8.335 mục, ~28 cặp màu khác nhau). Mỗi nhóm luật ghi số đo TRƯỚC → SAU (tương phản trên nền thẻ #2c302e / nền trang #313533):
  - chữ phụ (.text-muted, chữ nhãn, gợi ý ô nhập) 4,10 – 4,34 → ≥ 4,65 (--bs-secondary-color alpha .75 → .90);
  - chữ / số / biểu tượng / link màu primary #5156be hoặc #979ad8 (.text-primary, nút viền primary, số ở Dashboard, link) 2,18 / 4,19 → ≥ 4,79 (#a3a6e0);
  - nhãn đặc: xanh lá + chữ trắng 2,62 → 4,97; đỏ + chữ trắng 2,96 → 4,93; xám + chữ trắng 4,36 → 5,20; vàng / xanh dương: chữ ĐEN (template đổi .text-dark thành chữ sáng ở chế độ tối → 1,35 / 2,17) → 9,42 / 5,88;
  - nhãn nền nhạt (bg-*-subtle) 2,46 – 4,01 → ≥ 5,69 (màu chữ nhấn của template);
  - nút: viền xám #74788d 3,07 → 6,97; viền primary 2,18 → 5,05; nút xanh / đỏ / vàng như nhãn đặc;
  - viền ô nhập / ô chọn / ô đánh dấu 1,16 – 1,2 → 1,9 / 2,6 (nhìn thấy ô; chế độ sáng: 1,49).
Thêm 1 màu / 1 thành phần mới cần chỉnh cho chế độ tối: sửa Ở ĐÂY, đo lại bằng `php tests/run.php --only=ui_*` (quét tối chạy cả ở chế độ tối cho MỌI trang — luật `ui.md`). Không đặt màu cứng ở CSS của trang: dùng biến Bootstrap
(var(--bs-body-bg), var(--bs-border-color), var(--bs-secondary-color) …) thì cả 2 chế độ tự đúng.
*/

/* ---- 1. biến màu của chế độ tối ---- */
[data-bs-theme="dark"] {
    --bs-secondary-color: rgba(173, 181, 189, .9); /* template .75 → chữ phụ 4,10 – 4,34 : 1 */
    --bs-link-color: #a3a6e0; --bs-link-color-rgb: 163, 166, 224;               /* template #979ad8: trên dòng vừa sửa (nền xanh nhạt) chỉ 4,19 : 1 → 5,2 : 1 */
    --bs-link-hover-color: #b9bbe9; --bs-link-hover-color-rgb: 185, 187, 233;
    --kp-input-border: #565d59;                    /* viền ô nhập / ô chọn: 1,9 : 1 với nền ô (#383d3b của template: 1,16) */
    --kp-check-border: #6b736f;                    /* viền ô đánh dấu / ô chọn tròn: 2,6 : 1 */
}

/* ---- 2. viền ô nhập, ô chọn, ô đánh dấu (biến đặt NGAY TRÊN phần tử: luật :focus / .is-invalid của Bootstrap đặt border-color riêng nên vẫn thắng) ---- */
[data-bs-theme="dark"] .form-control, [data-bs-theme="dark"] .form-select, [data-bs-theme="dark"] .input-group-text { --bs-border-color: var(--kp-input-border); }
[data-bs-theme="dark"] .form-check-input { --bs-border-color: var(--kp-check-border); }

/* ---- 3. chữ / biểu tượng màu trạng thái trên nền tối ---- */
[data-bs-theme="dark"] .text-primary { --bs-primary-rgb: 163, 166, 224; }   /* #a3a6e0 */
[data-bs-theme="dark"] .text-danger { --bs-danger-rgb: 255, 138, 135; }     /* #ff8a87 — lỗi đăng nhập, số âm, nút Xoá: 3,74 – 4,5 → ≥ 4,87 : 1 (kể cả trên dòng vừa sửa — nền xanh nhạt) */
[data-bs-theme="dark"] .text-success { --bs-success-rgb: 59, 194, 139; }    /* #3bc28b: 4,22 → 4,89 : 1 trên dòng vừa sửa */
[data-bs-theme="dark"] .text-info { --bs-info-rgb: 93, 179, 241; }          /* #5db3f1: 4,22 → 4,84 : 1 */
[data-bs-theme="dark"] .app-select-option .app-select-check { color: #a3a6e0; }
[data-bs-theme="dark"] pre { color: var(--bs-body-color); }                 /* template: pre { color: #212529 } → chữ đen trên nền tối */

/* ---- 4. nhãn (badge) ---- */
/* nhãn đặc: nền đậm hơn để chữ trắng đọc được */
[data-bs-theme="dark"] .badge.bg-success { --bs-success-rgb: 29, 127, 88; }
[data-bs-theme="dark"] .badge.bg-danger { --bs-danger-rgb: 190, 74, 70; }
[data-bs-theme="dark"] .badge.bg-secondary { --bs-secondary-rgb: 104, 108, 127; }
/* nền sáng (vàng, xanh dương): chữ đen (.text-dark của template thành chữ sáng ở chế độ tối) */
[data-bs-theme="dark"] .badge.bg-warning, [data-bs-theme="dark"] .badge.bg-info { --bs-badge-color: #212529; --bs-dark-rgb: 33, 37, 41; }
/* nhãn nền nhạt (bg-*-subtle + text-*): màu chữ nhấn của template */
[data-bs-theme="dark"] .bg-success-subtle.text-success { --bs-success-rgb: 127, 211, 177; }
[data-bs-theme="dark"] .bg-danger-subtle.text-danger { --bs-danger-rgb: 254, 161, 158; }
[data-bs-theme="dark"] .bg-info-subtle.text-info { --bs-info-rgb: 147, 202, 245; }
[data-bs-theme="dark"] .bg-warning-subtle.text-warning { --bs-warning-rgb: 255, 217, 152; }
[data-bs-theme="dark"] .bg-secondary-subtle.text-secondary { --bs-secondary-rgb: 172, 174, 187; }
[data-bs-theme="dark"] .bg-primary-subtle.text-primary { --bs-primary-rgb: 163, 166, 224; }

/* ---- 5. nút ---- */
/* task-49 (report-48 5.2): nút đặc xanh lá / đỏ ở chế độ TỐI — rê chuột / nhấn KHÔNG tối đi (bản cũ đổi nền sang #186d4b / #a63f3c: so với nền thẻ #141729 chỉ 2,8 : 1 / 2,5 : 1 < 3 : 1) mà giữ nền và đổi VIỀN sáng (#4ade80 / #fca5a5) — chữ vẫn ≥ 4,9 : 1. */
[data-bs-theme="dark"] .btn-success { --bs-btn-bg: #1d7f58; --bs-btn-border-color: #1d7f58; --bs-btn-hover-bg: #1d7f58; --bs-btn-hover-border-color: #4ade80; --bs-btn-active-bg: #1d7f58; --bs-btn-active-border-color: #4ade80; --bs-btn-disabled-bg: #1d7f58; --bs-btn-disabled-border-color: #1d7f58; }
[data-bs-theme="dark"] .btn-danger { --bs-btn-bg: #be4a46; --bs-btn-border-color: #be4a46; --bs-btn-hover-bg: #be4a46; --bs-btn-hover-border-color: #fca5a5; --bs-btn-active-bg: #be4a46; --bs-btn-active-border-color: #fca5a5; --bs-btn-disabled-bg: #be4a46; --bs-btn-disabled-border-color: #be4a46; }
/* nút vàng: template ép chữ trắng (!important) — trắng trên vàng 1,64 : 1; chế độ tối dùng chữ đen */
[data-bs-theme="dark"] .btn-warning { color: #212529 !important; --bs-btn-color: #212529; --bs-btn-hover-color: #212529; --bs-btn-active-color: #212529; --bs-btn-disabled-color: #212529; }
[data-bs-theme="dark"] .btn-info { --bs-btn-color: #212529; --bs-btn-hover-color: #212529; --bs-btn-active-color: #212529; --bs-btn-disabled-color: #212529; }
/* nút viền (task-48): primary / secondary / danger / success do theme.css mục 10 (nền NHẠT + viền đậm khi rê chuột); còn lại vàng / xanh dương dùng chữ đen */
[data-bs-theme="dark"] .btn-outline-warning, [data-bs-theme="dark"] .btn-outline-info { --bs-btn-hover-color: #212529; --bs-btn-active-color: #212529; }
[data-bs-theme="dark"] .btn-outline-info { --bs-btn-color: #5db3f1; --bs-btn-disabled-color: #5db3f1; }

/* ---- 6. khung "Nội dung chuyển khoản" (nền vàng nhạt kiểu tối) + cảnh báo vàng ---- */
[data-bs-theme="dark"] .topup-row-code > dt, [data-bs-theme="dark"] .topup-row-code .text-muted { color: var(--bs-warning-text-emphasis) !important; }  /* .text-muted của Bootstrap là !important */
[data-bs-theme="dark"] .alert-warning a:not(.btn) { color: var(--bs-warning-text-emphasis); text-decoration: underline; }

/* ---- 7. menu trái: tiêu đề nhóm ("Menu") ---- */
body[data-bs-theme="dark"] .menu-title { color: #9aa3ad; }  /* template body[data-sidebar=dark] .menu-title #858d98 trên nền #2c302e: 3,99 → 5,0 : 1 (cùng độ ưu tiên, nạp sau) */

/* ---- 8. biểu đồ cột (Doanh thu) + icon mặc định của app ---- */
[data-bs-theme="dark"] .rv-bar:not(.rv-bar-spent) { background-color: #7a7ed4; }   /* cột màu primary #5156be trên nền thẻ chỉ 2,2 : 1 (đồ hoạ cần ≥ 3 : 1) → 3,5 : 1; cột xanh lá (credit đã tiêu) 5,1 : 1 giữ nguyên */
[data-bs-theme="dark"] img.app-icon[src*="app-icon-default"], [data-bs-theme="dark"] img.app-icon.app-icon-default { filter: brightness(.55); }   /* ô xám sáng #e9ecef của app chưa có icon là khối sáng chói trên nền tối → xám vừa; icon thật của app giữ nguyên */
