/* ============================================================
   theme.css — bảng màu dùng chung cho các trang vận hành
   (tính ca, công nợ, giờ hóa đơn rủi ro, báo cáo, admin, ...)

   Đổi giao diện toàn site chỉ cần sửa các giá trị bên dưới.
   Các trang học từ vựng (Chinese/English) KHÔNG dùng file này,
   có bảng màu riêng — không đụng tới khi đổi theme ở đây.
   ============================================================ */
:root{
  /* nền */
  --c-bg:        #0f1923;   /* nền trang (các trang thao tác đơn giản) */
  --c-card:      #0e1d2e;   /* nền card/box */

  /* xanh nhấn (accent) — dùng rgba(var(--c-accent-rgb), alpha) cho viền/nền mờ */
  --c-accent-rgb: 42,127,255;
  --c-accent:      #2a7fff;
  --c-accent-dark: #1a4fff;
  --c-accent-mid:  #4ab0ff;   /* icon/nút nhấn nhẹ */
  --c-accent-alt:  #2a9fff;   /* hover link / cuối gradient nút lưu */
  --c-accent-light:#8fd0ff;   /* số tiền nổi bật */

  /* chữ */
  --c-text:          #e0e8f0;
  --c-text-link:      #4a8aaa;
  --c-text-ghost:      #9fb8cc;
  --c-text-dim:       #4a7a9a;
  --c-text-dimmer:    #3a6a7a;
  --c-text-dimmest:   #2a4a5a;
  --c-white:          #fff;
  --c-white-rgb:       255,255,255;

  /* đỏ cảnh báo / xóa */
  --c-danger-rgb:   255,77,77;
  --c-danger-text:  #ff8a8a;
  --c-danger-text-soft: #ff9a9a;

  /* xanh lá/ngọc — thành công / đã lưu */
  --c-success-rgb:   42,200,180;
  --c-success-text:  #5fe0c0;
  --c-success-solid: #0aa88a;
}

/* ============================================================
   Tông màu thay thế — chọn ở nút 🎨 trên trang chủ, lưu bằng
   localStorage, áp bằng thuộc tính data-theme trên <html>.
   Chỉ đổi màu nhấn + chữ mờ; nền/chữ chính/đỏ cảnh báo/xanh
   thành công giữ nguyên vì đó là màu ngữ nghĩa, không phải màu nhấn.
   ============================================================ */
:root[data-theme="cam"]{
  --c-accent-rgb:   245,166,35;
  --c-accent:       #f5a623;
  --c-accent-dark:  #d9820a;
  --c-accent-mid:   #f5a623;
  --c-accent-alt:   #ffb84d;
  --c-accent-light: #ffd699;
  --c-text-dim:     #9a8567;
}
:root[data-theme="ngoc"]{
  --c-accent-rgb:   34,197,138;
  --c-accent:       #22c58a;
  --c-accent-dark:  #0e9d68;
  --c-accent-mid:   #22c58a;
  --c-accent-alt:   #3ddba0;
  --c-accent-light: #8fe8c8;
  --c-text-dim:     #5f9483;
}
:root[data-theme="tim"]{
  --c-accent-rgb:   139,92,246;
  --c-accent:       #8b5cf6;
  --c-accent-dark:  #6d3fd6;
  --c-accent-mid:   #8b5cf6;
  --c-accent-alt:   #a78bfa;
  --c-accent-light: #c9b6ff;
  --c-text-dim:     #8579a8;
}