/* ==========================================================================
   V-TIP DESIGN TOKENS · v1.0  — NGUỒN SỰ THẬT DUY NHẤT VỀ MÀU/CHỮ/HÌNH
   Theo Brand Book v1.0. Mọi giao diện V-TIP phải lấy màu từ đây,
   KHÔNG hardcode hex rời rạc, KHÔNG dùng bảng màu Tailwind mặc định.
   ========================================================================== */
:root{
  /* --- Brand --- */
  --vtip-green:#0E7C66;      /* Màu chính: nút, liên kết, AI Sales */
  --vtip-deep:#0B5E4D;       /* Nền đậm, header, trang trọng */
  --vtip-amber:#E0A100;      /* Nhấn, mùa thu hoạch, An Đắk Lắk */
  --vtip-bazan:#B4552D;      /* Đất đỏ bazan — dòng OCOP Commerce */
  --vtip-sky:#2E6F9E;        /* Thông tin — dòng V-TIP Travel */

  /* --- Neutral (lệch nhẹ sang xanh, không xám trung tính) --- */
  --vtip-ink:#17241F;
  --vtip-slate:#38473F;
  --vtip-muted:#5F706A;
  --vtip-line:#E2E8E5;
  --vtip-paper:#F6F8F7;
  --vtip-card:#FFFFFF;

  /* --- Tints (nền nhạt cho badge/alert) --- */
  --vtip-green-l:#E8F5EC;
  --vtip-amber-l:#FFF6E5;
  --vtip-bazan-l:#F9EFE9;
  --vtip-sky-l:#EAF2F8;
  --vtip-danger-l:#FBEEEC;

  /* --- Semantic --- */
  --success:var(--vtip-green);
  --warning:var(--vtip-amber);
  --danger:#C0392B;
  --info:var(--vtip-sky);

  /* --- Type --- */
  --font-sans:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-serif:"Lora",Georgia,serif;   /* CHỈ cho An Đắk Lắk & trích dẫn */

  /* --- Shape --- */
  --radius-control:12px;
  --radius-card:16px;
  --radius-pill:999px;
  --shadow-soft:0 8px 30px rgba(20,60,40,.06);

  /* --- Space --- */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px;
}

/* Chế độ tối — chỉ định nghĩa lại token, không đổi component */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --vtip-green:#31A388;  --vtip-deep:#0A4A3D;  --vtip-amber:#F0B838;
    --vtip-bazan:#D97A4E;  --vtip-sky:#5F9BC7;
    --vtip-ink:#E9F1EC;    --vtip-slate:#B9C9C1; --vtip-muted:#8FA39A;
    --vtip-line:#25342D;   --vtip-paper:#0E1714;  --vtip-card:#141F1A;
    --vtip-green-l:#12302A; --vtip-amber-l:#2E2513;
  }
}
:root[data-theme="dark"]{
  --vtip-green:#31A388;  --vtip-deep:#0A4A3D;  --vtip-amber:#F0B838;
  --vtip-bazan:#D97A4E;  --vtip-sky:#5F9BC7;
  --vtip-ink:#E9F1EC;    --vtip-slate:#B9C9C1; --vtip-muted:#8FA39A;
  --vtip-line:#25342D;   --vtip-paper:#0E1714;  --vtip-card:#141F1A;
  --vtip-green-l:#12302A; --vtip-amber-l:#2E2513;
}