/* ==========================================================================
   THE CLASSICS — Design tokens (nguồn duy nhất)
   Mọi màn hình import file này. Không copy :root sang file khác.
   Nguồn màu: trang đăng ký vé mời Elysian (fillout) — theme tối chính thức:
                nền thẻ #121212 · nền trang #544F4D · chữ #FFFFFF
                màu chủ đạo #B27749 (đồng cổ)
              logo.jpg — con dấu Hanoi–Amsterdam #872e34 (giữ cho Hạng 1)
   ========================================================================== */

:root {
  /* Khai báo hệ tối cho trình duyệt: ô nhập, danh sách xổ, thanh cuộn,
     ô tự động điền của trình duyệt đều theo nền tối. */
  color-scheme: dark;

  /* ---- Nền & chữ (tối: #121212 làm nền, sắc nâu #544F4D làm lớp nổi) ---- */
  --bg:            oklch(18.2% 0.004 45);   /* #121212 ấm nhẹ   */
  --surface:       oklch(23% 0.007 45);     /* thẻ / panel      */
  --surface-sunk:  oklch(14.5% 0.004 45);   /* rãnh, ô nhập     */
  --fg:            oklch(96% 0.004 70);     /* trắng dịu        */
  --muted:         oklch(72% 0.008 45);     /* nâu xám sáng     */
  --border:        color-mix(in oklab, var(--fg) 14%, transparent);
  --border-strong: color-mix(in oklab, var(--fg) 26%, transparent);

  /* ---- Accent: đồng cổ #B27749 lấy từ trang đăng ký vé mời ------------- */
  --accent:        oklch(62.1% 0.096 57.7);
  --accent-deep:   oklch(68.5% 0.104 57.7); /* accent sáng hơn: hover, và chữ
                                               đặt trên `--accent-soft`        */
  /* Trên nền tối, "nhấn nhẹ" phải SÁNG hơn nền trang chứ không tối hơn. L30
     là điểm cân: nền còn tách khỏi trang (1.36:1) mà chữ `--accent-deep` đặt
     lên vẫn đạt AA (4.73:1). Hạ tiếp thì nền chìm, nâng tiếp thì chữ trượt. */
  --accent-soft:   oklch(30% 0.038 57.7);
  --accent-line:   oklch(42% 0.062 57.7);
  --on-accent:     oklch(17% 0.010 55);     /* chữ đặt trên nền accent đặc     */

  /* ---- Nền sâu nhất (hero, phiếu, sân khấu) ---------------------------- */
  --ink:           oklch(11% 0.005 45);
  --ink-2:         oklch(16% 0.006 45);
  --on-ink:        oklch(96% 0.004 70);
  --on-ink-muted:  oklch(72% 0.008 45);
  --ink-border:    color-mix(in oklab, var(--on-ink) 16%, transparent);

  /* ---- Trạng thái nghiệp vụ (sáng lên cho nền tối) --------------------- */
  --success:       oklch(70% 0.125 152);
  --success-soft:  oklch(26% 0.045 152);
  --warn:          oklch(76% 0.125 72);
  --warn-soft:     oklch(28% 0.045 72);
  --danger:        oklch(66% 0.165 27);
  --danger-soft:   oklch(25% 0.060 27);     /* chữ `--danger` lên trên: 4.87:1 */

  /* ---- Màu hạng vé ------------------------------------------------------
     Vẽ lại từ bộ vàng/tím/cyan của bản PDF kỹ thuật (BTC đã cho phép đổi).
     Quy tắc đọc sơ đồ: CÓ MÀU = mua được · XÁM = không mua được.
     Ba hạng tách nhau trên cả sắc độ (85° / 300° / 200°) lẫn độ sáng
     (80% / 64% / 74%) để phân biệt được cả khi mù màu đỏ–lục.        ----- */
  --tier-1: oklch(50% 0.135 22);   /* Hạng 1 · 320.000đ — đỏ mận con dấu  */
  --tier-2: oklch(64% 0.100 300);  /* Hạng 2 · 290.000đ — tím thạch anh   */
  --tier-3: oklch(74% 0.080 200);  /* Hạng 3 · 250.000đ — lam băng        */

  /* chữ đặt trên nền màu hạng vé — Hạng 1 tối nên phải dùng chữ sáng */
  --tier-1-fg: oklch(97% 0.006 75);
  --tier-2-fg: oklch(19% 0.012 55);
  --tier-3-fg: oklch(19% 0.012 55);

  /* ---- Trạng thái ghế — trên nền tối thì ghế KHÔNG bán được chìm dần
     về phía nền, ghế mua được vẫn giữ màu hạng.                       ---- */
  --seat-held:     oklch(42% 0.005 45);     /* người khác giữ · có gạch chéo */
  --seat-pending:  oklch(70% 0.125 72);     /* chờ xác nhận · hổ phách       */
  --seat-sold:     oklch(34% 0.008 45);     /* đã bán · chìm                 */
  --seat-blocked:  oklch(25% 0.006 45);     /* không bán · có gạch chéo      */
  --seat-picked:   oklch(66% 0.140 152);    /* bạn đang chọn                 */

  /* ---- Chữ -------------------------------------------------------------- */
  --font-display: "Playfair Display", "Iowan Old Style", Georgia, serif;
  --font-body: "Be Vietnam Pro", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* thang 1.25 */
  --t-display: clamp(2.75rem, 1.6rem + 4.4vw, 4.5rem);
  --t-h1: clamp(2rem, 1.35rem + 2.4vw, 3rem);
  --t-h2: clamp(1.5rem, 1.2rem + 1.1vw, 2rem);
  --t-h3: 1.25rem;
  --t-body: 1rem;
  --t-small: 0.875rem;
  --t-caption: 0.75rem;

  /* ---- Nhịp & hình khối ------------------------------------------------- */
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px;
  --s5: 24px; --s6: 32px; --s7: 48px; --s8: 72px;
  --r-sm: 3px; --r-md: 6px; --r-lg: 10px; --r-pill: 999px;
  --shadow-1: 0 1px 2px oklch(0% 0 0 / 0.40);
  --shadow-2: 0 2px 4px oklch(0% 0 0 / 0.40), 0 8px 24px oklch(0% 0 0 / 0.44);
  --shadow-3: 0 4px 8px oklch(0% 0 0 / 0.45), 0 20px 48px oklch(0% 0 0 / 0.55);
  /* Đổ bóng trên nền tối là đen nguyên chất đổi alpha, không phải `--fg` pha
     loãng — pha `--fg` (gần trắng) sẽ ra vệt sáng chứ không phải bóng. */
  --shadow-edge: 0 1px 0 oklch(0% 0 0 / 0.35);      /* gờ dưới nút chính     */
  --shadow-up:   0 -8px 32px oklch(0% 0 0 / 0.5);   /* thanh tóm tắt bám đáy */
  --scrim:       oklch(0% 0 0 / 0.62);              /* nền mờ sau ngăn/hộp thoại */
  --measure: 65ch;
  --header-h: 64px;
}