/* KLM System — design tokens. Giao diện kiểu Canva + màu KL Marketing (Kha duyệt 02/11/2026):
   nền trắng phẳng, đỏ KLM là màu nhấn DUY NHẤT (#D32525 → #950102), xám ấm trung tính, không hồng.
   Tên token cũ (--account, --chat…) được giữ để mọi trang tự đổi theo; chỉ giá trị đổi. */
:root {
  /* Thương hiệu */
  --red: #D32525;
  --red-deep: #950102;
  --red-dark: #6E0000;

  /* Nền & chữ */
  --bg: #F3EFED;          /* bề mặt trung tính (rãnh, hover, ô chìm) */
  --card: #FFFFFF;
  --card-grad: #FAF8F7;   /* thẻ phẳng (tên cũ giữ nguyên) */
  --text: #1C1B1B;
  --text-2: #5E5858;
  --text-3: #8A8483;
  --line: #E9E4E1;

  /* Màu "chính" (tên cũ --account): đỏ KLM. -icon = nét icon, -ink = chữ liên kết/nhấn */
  --account: #D32525;  --account-icon: #D32525;  --account-ink: #950102;

  /* Các module không còn màu riêng: nền trung tính ấm, nét đỏ, chữ đỏ đậm (giữ tên token để CSS các trang không phải sửa) */
  --creative: #F3EFED; --creative-icon: #D32525; --creative-ink: #950102;
  --qc: #F3EFED;       --qc-icon: #D32525;       --qc-ink: #950102;
  --insight: #F3EFED;  --insight-icon: #D32525;  --insight-ink: #950102;
  --admin: #F3EFED;    --admin-icon: #D32525;    --admin-ink: #950102;
  --chat: #F3EFED;     --chat-icon: #D32525;     --chat-ink: #950102;
  --docs: #F3EFED;     --docs-icon: #D32525;     --docs-ink: #950102;
  --calendar: #F3EFED; --calendar-icon: #D32525; --calendar-ink: #950102;
  --tailieu: #F3EFED;  --tailieu-icon: #D32525;  --tailieu-ink: #950102;
  --diem: #F3EFED;     --diem-icon: #D32525;     --diem-ink: #950102;
  --todo: #F3EFED;     --todo-icon: #D32525;     --todo-ink: #950102;

  /* Chữ/icon đậm trên khối trung tính (tương phản ≥ 4,5:1) */
  --todo-deep: #6E0000;
  --chat-deep: #6E0000;
  --calendar-deep: #6E0000;
  --docs-deep: #6E0000;
  --tailieu-deep: #6E0000;
  --qc-deep: #6E0000;
  --diem-deep: #6E0000;
  --admin-deep: #1C1B1B;
  --insight-deep: #6E0000;

  /* Trạng thái (cần phân biệt được nên giữ khác nhau) */
  --success: #2F7D4F;
  --warning: #E39B2D;
  --error: #D32525;
  --info: #5E7C8A;

  /* Chi tiết trang trí (không còn đất nung) */
  --terracotta: #D32525;

  /* Hình khối PHẲNG: viền mảnh + bóng rất nhẹ (kiểu Canva), không còn bóng xéo/nổi khối */
  --rim: 0 0 0 0 transparent;
  --shadow-card: 0 0 0 1px var(--line), 0 6px 22px rgba(28,27,27,0.05);
  --shadow-card-hover: 0 0 0 1px #D8D2CF, 0 10px 26px rgba(28,27,27,0.09);
  --shadow-clay: 0 0 0 1px var(--line);
  --shadow-press: inset 0 0 0 1px rgba(28,27,27,0.14);
  --shadow-inset: 0 0 0 1px var(--line);
  --radius-card: 18px;
  --radius-ctl: 12px;

  --font: "Be Vietnam Pro", system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* Màu trạng thái task — mỗi trạng thái một màu riêng, đậm, chữ trắng (góp ý nhân sự 12/11) */
:root {
  --st-waiting_phase: #8A7F79; --st-pending: #5B6675; --st-doing: #2563EB; --st-waiting_client: #D9730D;
  --st-paused: #7C3AED; --st-done: #0E8A86; --st-accepted: #15803D; --st-cancelled: #57534E;
}