/* ============================================================
   Design tokens — Học Cùng AI 3 Gốc
   Giá trị lưu dạng BỘ 3 KÊNH RGB (không có rgb(), không có #)
   để Tailwind dùng được cú pháp rgb(var(--x) / <alpha-value>)
   → bg-primary/10 vẫn chạy, và sáng/tối tự đổi không cần dark:
   Mọi cặp màu bên dưới đã kiểm định tương phản WCAG AA.
   ============================================================ */

:root {
  /* --- Thương hiệu --------------------------------------- */
  --c-primary:        15 118 110;   /* #0F766E  5.47:1 / trắng — ĐẠT AA chữ thường */
  --c-primary-soft:   13 148 136;   /* #0D9488  3.74:1 — CHỈ mảng lớn/icon/viền */
  --c-primary-tint:  240 253 250;   /* #F0FDFA  nền nhấn nhẹ */
  --c-on-primary:    255 255 255;   /* chữ trên nền primary */

  --c-accent:        180  83   9;   /* #B45309  5.02:1 — ĐẠT AA chữ thường */
  --c-accent-soft:   217 119   6;   /* #D97706  3.19:1 — CHỈ mảng lớn/icon */
  --c-accent-tint:   255 251 235;   /* #FFFBEB */
  --c-on-accent:     255 255 255;

  /* --- Nền & bề mặt -------------------------------------- */
  --c-bg:            248 250 252;   /* #F8FAFC nền trang */
  --c-surface:       255 255 255;   /* #FFFFFF thẻ, panel */
  --c-surface-2:     241 245 249;   /* #F1F5F9 vùng chìm, hàng chẵn */

  /* --- Chữ ----------------------------------------------- */
  --c-fg:             15  23  42;   /* #0F172A 17.85:1 */
  --c-fg-muted:       71  85 105;   /* #475569  7.58:1 */
  --c-fg-subtle:     100 116 139;   /* #64748B  4.76:1 — mờ nhất VẪN đạt AA */

  /* --- Viền ---------------------------------------------- */
  --c-border:        226 232 240;   /* #E2E8F0 đường kẻ trang trí */
  --c-border-input:  100 116 139;   /* #64748B 4.76:1 — viền ô nhập, đạt 3:1 non-text */

  /* --- Ngữ nghĩa ----------------------------------------- */
  --c-danger:        220  38  38;   /* #DC2626 4.83:1 */
  --c-danger-tint:   254 242 242;
  --c-on-danger:     255 255 255;

  --c-success:        21 128  61;   /* #15803D 5.02:1 */
  --c-success-tint:  240 253 244;
  --c-on-success:    255 255 255;

  --c-warning:       161  98   7;   /* #A16207 4.92:1 */
  --c-warning-tint:  254 252 232;
  --c-on-warning:    255 255 255;

  --c-info:           29  78 216;   /* #1D4ED8 6.70:1 */
  --c-info-tint:     239 246 255;
  --c-on-info:       255 255 255;

  /* --- Icon ---------------------------------------------- */
  --icon-sm: 1rem;
  --icon-md: 1.25rem;
  --icon-lg: 1.5rem;
}

/* ============================================================
   CHẾ ĐỘ TỐI
   Không đảo ngược màu sáng — dùng tông nhạt bão hoà thấp hơn,
   và ĐẢO chữ-trên-nền-màu sang slate-900.
   Lý do: chữ trắng trên #2DD4BF chỉ đạt 1.86:1 (hỏng hoàn toàn);
   slate-900 trên cùng nền đó đạt 9.59:1.
   ============================================================ */
.dark {
  --c-primary:        45 212 191;   /* #2DD4BF 7.86:1 / #1E293B */
  --c-primary-soft:   20 184 166;   /* #14B8A6 */
  --c-primary-tint:   19  78  74;   /* #134E4A */
  --c-on-primary:     15  23  42;   /* 9.59:1 — KHÔNG dùng trắng ở đây */

  --c-accent:        251 191  36;   /* #FBBF24 8.76:1 */
  --c-accent-soft:   245 158  11;   /* #F59E0B */
  --c-accent-tint:    69  26   3;   /* #451A03 */
  --c-on-accent:      15  23  42;   /* 10.69:1 */

  --c-bg:             15  23  42;   /* #0F172A */
  --c-surface:        30  41  59;   /* #1E293B */
  --c-surface-2:      51  65  85;   /* #334155 */

  --c-fg:            226 232 240;   /* #E2E8F0 11.87:1 */
  --c-fg-muted:      148 163 184;   /* #94A3B8  5.71:1 */
  --c-fg-subtle:     148 163 184;   /* cố ý TRÙNG fg-muted: tông nào tối hơn
                                       cũng tụt dưới 4.5:1 trên nền #1E293B */

  --c-border:         51  65  85;   /* #334155 */
  --c-border-input:  100 116 139;   /* #64748B 3.07:1 — đạt ngưỡng non-text */

  --c-danger:        248 113 113;   /* #F87171 5.29:1 */
  --c-danger-tint:    69  10  10;
  --c-on-danger:      15  23  42;

  --c-success:        74 222 128;   /* #4ADE80 8.40:1 */
  --c-success-tint:    5  46  22;
  --c-on-success:     15  23  42;

  --c-warning:       250 204  21;   /* #FACC15 9.55:1 */
  --c-warning-tint:   66  32   6;
  --c-on-warning:     15  23  42;

  --c-info:           96 165 250;   /* #60A5FA 5.75:1 */
  --c-info-tint:      23  37  84;
  --c-on-info:        15  23  42;
}