/* Design token của LiveSite. Không hardcode hex ở bất kỳ đâu khác. */
:root {
    /* Nói cho TRÌNH DUYỆT biết chủ đề, không chỉ cho CSS của ta. Thiếu dòng này thì mọi thứ do UA
       vẽ — ô nhập chưa khai màu, checkbox, lịch của datetime-local, thanh cuộn, nền autofill,
       popup của <select> — đi theo cài đặt của HỆ ĐIỀU HÀNH chứ không theo data-theme. Đó là lý do
       máy đặt macOS chủ đề tối thấy ô nhập nền tối mà chữ vẫn đen. */
    color-scheme: light;

    --lc-primary: #002066;
    --lc-primary-container: #1e377e;
    --lc-on-primary: #ffffff;
    --lc-primary-fixed: #dce1ff;
    --lc-primary-fixed-dim: #b5c4ff;
    --lc-on-primary-fixed: #00164e;
    --lc-surface: #f8f9fb;
    --lc-surface-container-lowest: #ffffff;
    --lc-surface-container-low: #f2f4f6;
    --lc-surface-container: #edeef0;
    --lc-surface-variant: #e1e2e4;
    --lc-on-surface: #191c1e;
    --lc-on-surface-variant: #444651;
    --lc-outline: #757682;
    --lc-error: #ba1a1a;
    --lc-error-container: #ffdad6;
    --lc-on-error-container: #93000a;
    --lc-success: #2e7d32;
    --lc-secondary-container: #fdc8ba;
    --lc-on-secondary-container: #795247;

    /* Nền ô checkbox/radio khi đã tích. KHÔNG dùng --lc-primary cho việc này: @tailwindcss/forms
       vẽ dấu tích bằng SVG có `stroke='white'` GẮN CỨNG trong data-URI, không đổi được bằng CSS ⇒
       token này buộc phải ĐỦ TỐI ở CẢ HAI chủ đề, còn --lc-primary thì đảo thành màu sáng
       (#b5c4ff) ở chủ đề tối và làm dấu tích trắng biến mất. */
    --lc-control-checked: #002066;

    --lc-radius: 8px;
    --lc-space-1: 4px;
    --lc-space-2: 8px;
    --lc-space-3: 16px;

    --lc-font-sans: "Be Vietnam Pro", sans-serif;
}

/* ---- Chủ đề tối (spec 7 plan 7f mục 9.1) ----
   Tailwind của LiveSite đã map toàn bộ colors qua var(--lc-*) (_Layout.cshtml) ⇒ định nghĩa lại
   token ở đây là MỌI class màu tự theo, không phải sửa một view nào.

   Attribute data-theme được đặt trên <html> bởi script chống FOUC ở <head> của _Layout.cshtml —
   nó chạy TRƯỚC khi trang vẽ, xem mục 9.2 của spec.

   KHÔNG khai lại --lc-radius / --lc-space-* / --lc-font-sans: chủ đề không đổi khoảng cách hay
   phông chữ. Đây cũng là file DUY NHẤT được khai :root { --lc-* } (live-architecture.md mục 3c). */
:root[data-theme="dark"] {
    /* Cặp đôi của color-scheme ở khối sáng — xem chú thích ở trên. */
    color-scheme: dark;

    /* Primary: nền tối cần primary SÁNG hơn, không phải #002066 tối om trên nền tối. */
    --lc-primary: #b5c4ff;
    /* DEVIATION khỏi plan 7f Task 1 (plan ghi #1e377e). Codebase KHÔNG có token
       --lc-on-primary-container: mọi chỗ dùng --lc-primary-container làm NỀN đều đặt chữ bằng
       --lc-on-primary (.tile-avatar ở live-room.css, .bo-bar__btn:hover ở live-breakout.css,
       hover:bg-primary-container hover:text-on-primary ở Home/Index + Login + ForgotPassword).
       Chủ đề tối đảo --lc-on-primary thành #00164e (tối), nên để container tối om là chữ tối trên
       nền tối — không đọc được. Giữ container SÁNG hơn nền, chỉ đục hơn --lc-primary để hover vẫn
       thấy khác: #00164e trên #93a7ee ≈ 7.5:1, trên #b5c4ff ≈ 10.2:1. */
    --lc-primary-container: #93a7ee;
    --lc-on-primary: #00164e;
    --lc-primary-fixed: #1e377e;
    --lc-primary-fixed-dim: #2b47a0;
    --lc-on-primary-fixed: #dce1ff;

    /* Bề mặt: đảo thang. surface tối nhất, container-lowest là nền của card/panel. */
    --lc-surface: #111318;
    --lc-surface-container-lowest: #191c22;
    --lc-surface-container-low: #1f232a;
    --lc-surface-container: #262a32;
    --lc-surface-variant: #363a43;

    --lc-on-surface: #e3e2e6;
    --lc-on-surface-variant: #c3c6cf;
    --lc-outline: #8d9199;

    /* Error/success: bản sáng hơn để đọc được trên nền tối. */
    --lc-error: #ffb4ab;
    --lc-error-container: #93000a;
    --lc-on-error-container: #ffdad6;
    --lc-success: #7bd67f;

    --lc-secondary-container: #5d4037;
    --lc-on-secondary-container: #fdc8ba;

    /* Vẫn phải TỐI — dấu tích là SVG stroke trắng gắn cứng, xem chú thích ở khối sáng. Sáng hơn
       bản của chủ đề sáng một bậc để còn tách được khỏi nền tối xung quanh. */
    --lc-control-checked: #1e377e;
}
