/* ══════════════════════════════════════════════════════════════════
   LIGHT MODE OVERRIDES — load SAU tailwind-built.css
   ──────────────────────────────────────────────────────────────────
   File này áp dụng độc lập, không cần `npm run build:css`.
   Khi nào rebuild được tailwind-built.css thì các rule này được
   gộp vào source `tailwind-input.css` (đã backup sẵn) và xóa file này.

   Selector: html:not(.dark) — khớp với toggle của site (Tailwind dark class).
   Mọi rule dùng !important để override CSS từ tailwind-built.css.
   ══════════════════════════════════════════════════════════════════ */

/* ───── Tailwind 100-400 light shades → 700-800 dark shades cho contrast WCAG AA ───── */

/* CRITICAL: text-white + shade 50 — class phổ biến nhất, vô hình trên bg trắng */
html:not(.dark) .text-white,
html:not(.dark) .text-zinc-50,
html:not(.dark) .text-slate-50,
html:not(.dark) .text-gray-50,
html:not(.dark) .text-neutral-50,
html:not(.dark) .text-stone-50    { color:#1a1f2e !important; }

/* GRAY scale 100-400 (Tailwind default gray, không phải zinc/slate) */
html:not(.dark) .text-gray-100,
html:not(.dark) .text-gray-200   { color:#1f2937 !important; }
html:not(.dark) .text-gray-300   { color:#374151 !important; }
html:not(.dark) .text-gray-400   { color:#4b5563 !important; }

html:not(.dark) .text-gray-500   { color:#5a6573 !important; }
html:not(.dark) .text-slate-100,
html:not(.dark) .text-slate-200  { color:#1e293b !important; }
html:not(.dark) .text-slate-300  { color:#334155 !important; }
html:not(.dark) .text-slate-400  { color:#475569 !important; }
html:not(.dark) .text-zinc-100,
html:not(.dark) .text-zinc-200   { color:#27272a !important; }
html:not(.dark) .text-zinc-300   { color:#3f3f46 !important; }
html:not(.dark) .text-zinc-400   { color:#52525b !important; }
html:not(.dark) .text-neutral-100,
html:not(.dark) .text-neutral-200{ color:#262626 !important; }
html:not(.dark) .text-neutral-300{ color:#404040 !important; }
html:not(.dark) .text-neutral-400{ color:#525252 !important; }
html:not(.dark) .text-stone-100,
html:not(.dark) .text-stone-200  { color:#292524 !important; }
html:not(.dark) .text-stone-300  { color:#44403c !important; }
html:not(.dark) .text-stone-400  { color:#57534e !important; }

html:not(.dark) .text-red-100,
html:not(.dark) .text-red-200    { color:#991b1b !important; }
html:not(.dark) .text-red-300,
html:not(.dark) .text-red-400    { color:#b91c1c !important; }

html:not(.dark) .text-orange-100,
html:not(.dark) .text-orange-200 { color:#9a3412 !important; }
html:not(.dark) .text-orange-300,
html:not(.dark) .text-orange-400 { color:#c2410c !important; }

html:not(.dark) .text-amber-100,
html:not(.dark) .text-amber-200  { color:#92400e !important; }
html:not(.dark) .text-amber-300,
html:not(.dark) .text-amber-400  { color:#b45309 !important; }

html:not(.dark) .text-yellow-100,
html:not(.dark) .text-yellow-200 { color:#854d0e !important; }
html:not(.dark) .text-yellow-300,
html:not(.dark) .text-yellow-400 { color:#a16207 !important; }

html:not(.dark) .text-lime-100,
html:not(.dark) .text-lime-200   { color:#3f6212 !important; }
html:not(.dark) .text-lime-300,
html:not(.dark) .text-lime-400   { color:#4d7c0f !important; }

html:not(.dark) .text-green-100,
html:not(.dark) .text-green-200  { color:#166534 !important; }
html:not(.dark) .text-green-300,
html:not(.dark) .text-green-400  { color:#15803d !important; }

html:not(.dark) .text-emerald-100,
html:not(.dark) .text-emerald-200{ color:#065f46 !important; }
html:not(.dark) .text-emerald-300,
html:not(.dark) .text-emerald-400{ color:#047857 !important; }

html:not(.dark) .text-teal-100,
html:not(.dark) .text-teal-200   { color:#115e59 !important; }
html:not(.dark) .text-teal-300,
html:not(.dark) .text-teal-400   { color:#0f766e !important; }

html:not(.dark) .text-cyan-100,
html:not(.dark) .text-cyan-200   { color:#155e75 !important; }
html:not(.dark) .text-cyan-300,
html:not(.dark) .text-cyan-400   { color:#0e7490 !important; }

html:not(.dark) .text-sky-100,
html:not(.dark) .text-sky-200    { color:#075985 !important; }
html:not(.dark) .text-sky-300,
html:not(.dark) .text-sky-400    { color:#0369a1 !important; }

html:not(.dark) .text-blue-100,
html:not(.dark) .text-blue-200   { color:#1e40af !important; }
html:not(.dark) .text-blue-300,
html:not(.dark) .text-blue-400   { color:#1d4ed8 !important; }

html:not(.dark) .text-indigo-100,
html:not(.dark) .text-indigo-200 { color:#3730a3 !important; }
html:not(.dark) .text-indigo-300,
html:not(.dark) .text-indigo-400 { color:#4338ca !important; }

html:not(.dark) .text-violet-100,
html:not(.dark) .text-violet-200 { color:#5b21b6 !important; }
html:not(.dark) .text-violet-300,
html:not(.dark) .text-violet-400 { color:#6d28d9 !important; }

html:not(.dark) .text-purple-100,
html:not(.dark) .text-purple-200 { color:#6b21a8 !important; }
html:not(.dark) .text-purple-300,
html:not(.dark) .text-purple-400 { color:#7e22ce !important; }

html:not(.dark) .text-fuchsia-100,
html:not(.dark) .text-fuchsia-200{ color:#86198f !important; }
html:not(.dark) .text-fuchsia-300,
html:not(.dark) .text-fuchsia-400{ color:#a21caf !important; }

html:not(.dark) .text-pink-100,
html:not(.dark) .text-pink-200   { color:#9d174d !important; }
html:not(.dark) .text-pink-300,
html:not(.dark) .text-pink-400   { color:#be185d !important; }

html:not(.dark) .text-rose-100,
html:not(.dark) .text-rose-200   { color:#9f1239 !important; }
html:not(.dark) .text-rose-300,
html:not(.dark) .text-rose-400   { color:#be123c !important; }

/* ───── Hover text variants ───── */
html:not(.dark) .hover\:text-white:hover     { color:#1a1f2e !important; }
html:not(.dark) .hover\:text-gray-100:hover  { color:#2d3344 !important; }
html:not(.dark) .hover\:text-gray-200:hover  { color:#3d4456 !important; }
html:not(.dark) .hover\:text-gray-300:hover  { color:#4a5160 !important; }
html:not(.dark) .hover\:text-emerald-300:hover { color:#047857 !important; }
html:not(.dark) .hover\:text-emerald-400:hover { color:#047857 !important; }
html:not(.dark) .hover\:text-amber-300:hover   { color:#b45309 !important; }
html:not(.dark) .hover\:text-pri-light:hover   { color:#cc5f00 !important; }

/* ───── Bg đen/zinc/slate đậm chưa cover ở tailwind-built.css ───── */
html:not(.dark) .bg-zinc-900,
html:not(.dark) .bg-slate-900,
html:not(.dark) .bg-neutral-900,
html:not(.dark) .bg-gray-900     { background-color:#ffffff !important; }
html:not(.dark) .bg-zinc-800,
html:not(.dark) .bg-slate-800,
html:not(.dark) .bg-gray-800     { background-color:#eef2f7 !important; }
html:not(.dark) .bg-zinc-700,
html:not(.dark) .bg-slate-700,
html:not(.dark) .bg-gray-700     { background-color:#e0e6ee !important; }
html:not(.dark) .bg-black\/20,
html:not(.dark) .bg-black\/30,
html:not(.dark) .bg-black\/40,
html:not(.dark) .bg-black\/50    { background-color:rgba(15,23,42,.08) !important; }
/* Lưu ý: .bg-black GIỮ NGUYÊN tối — vì hay dùng làm frame video, banner cam, v.v. */

/* ───── Border trắng mờ → border xám nhạt ───── */
html:not(.dark) .border-white\/10,
html:not(.dark) .border-white\/20,
html:not(.dark) .border-white\/30  { border-color:rgba(15,23,42,.10) !important; }
html:not(.dark) .border-zinc-800,
html:not(.dark) .border-zinc-700,
html:not(.dark) .border-slate-800,
html:not(.dark) .border-slate-700,
html:not(.dark) .border-gray-800,
html:not(.dark) .border-gray-700   { border-color:#d6dce6 !important; }

/* ───── Divide line tối ───── */
html:not(.dark) .divide-white\/10 > * + *,
html:not(.dark) .divide-zinc-800 > * + *,
html:not(.dark) .divide-slate-800 > * + * { border-color:#e0e6ee !important; }

/* ───── Placeholder ───── */
html:not(.dark) ::placeholder      { color:#8a93a3 !important; opacity:1; }
html:not(.dark) ::-webkit-input-placeholder { color:#8a93a3 !important; }

/* ───── Inline style color trắng (không kèm bg) → text tối ───── */
html:not(.dark) [style*="color:#fff"]:not([style*="background"]):not([style*="bg"]):not(.lv):not(.lv-num):not(.msg-text):not(.msg-name),
html:not(.dark) [style*="color: #fff"]:not([style*="background"]):not([style*="bg"]):not(.lv):not(.lv-num):not(.msg-text):not(.msg-name),
html:not(.dark) [style*="color:#ffffff"]:not([style*="background"]):not([style*="bg"]):not(.lv):not(.lv-num):not(.msg-text):not(.msg-name),
html:not(.dark) [style*="color: #ffffff"]:not([style*="background"]):not([style*="bg"]):not(.lv):not(.lv-num):not(.msg-text):not(.msg-name){
  color: #1a1f2e !important;
}

/* ───── Link mặc định trên light ───── */
html:not(.dark) a:not([class*="text-"]):not([class*="bg-"]) { color: #1d4ed8; }
html:not(.dark) a:not([class*="text-"]):not([class*="bg-"]):hover { color: #1e3a8a; }

/* ───── Pre/code block tối ───── */
html:not(.dark) pre,
html:not(.dark) code:not([class*="text-"]){
  background:#eef2f7 !important;
  color:#1a1f2e !important;
  border-color:#d6dce6 !important;
}

/* ───── Modal/dropdown surface chung ───── */
html:not(.dark) .bg-bg-card\/95,
html:not(.dark) .bg-bg-card\/90,
html:not(.dark) .bg-bg-card\/80 { background-color: rgba(255,255,255,.95) !important; }

/* ───── Scrollbar light ───── */
html:not(.dark) .scrollbar-thin::-webkit-scrollbar-thumb { background:#cbd5e1 !important; }

/* ───── Fallback: <strong>/<b> không có class color → đậm cam thương hiệu ───── */
html:not(.dark) strong:not([class*="text-"]):not([style*="color"]),
html:not(.dark) b:not([class*="text-"]):not([style*="color"]){
  color:#c2410c !important;
}

/* ───── Article body trên light (trang giới thiệu/policy) ───── */
html:not(.dark) article p,
html:not(.dark) .prose p,
html:not(.dark) .article-body p,
html:not(.dark) .seo-content p{
  color:#1f2937 !important;
}
html:not(.dark) article h1,
html:not(.dark) article h2,
html:not(.dark) article h3,
html:not(.dark) .prose h1,
html:not(.dark) .prose h2,
html:not(.dark) .prose h3{
  color:#0f172a !important;
}

/* ══════════════════════════════════════════════════════════════════
   TRANG /tin-tuc — custom class .fr-* hardcode màu đen trong <style>
   inline của tw-tin-tuc.ejs (#171c28, #1a2030, #232a3a)
   ══════════════════════════════════════════════════════════════════ */
html:not(.dark) .fr-card,
html:not(.dark) .fr-sb-card{
  background:#ffffff !important;
  border-color:#d6dce6 !important;
}
html:not(.dark) .fr-sb-card:hover{
  background:#f8fafc !important;
  border-color:#10b981 !important;
}
html:not(.dark) .fr-news-row{
  border-bottom-color:#e0e6ee !important;
}
html:not(.dark) .fr-news-row:hover{
  background:#f8fafc !important;
}
/* Thumb wrapper: giữ nền xám rất nhạt (bao quanh SVG hero tối) */
html:not(.dark) .fr-thumb,
html:not(.dark) .fr-thumb-lg,
html:not(.dark) .fr-hero-img{
  background:#eef2f7 !important;
}
/* Chip filter chuyên mục/giải đấu */
html:not(.dark) .fr-chip{
  background:#eef2f7 !important;
  color:#1f2937 !important;
  border-color:#d6dce6 !important;
}
html:not(.dark) .fr-chip:hover{
  background:#dde4ee !important;
}
html:not(.dark) .fr-chip.active{
  color:#ffffff !important;  /* giữ trắng trên gradient xanh */
}
html:not(.dark) .fr-chip .cnt{
  color:#047857 !important;  /* số đếm xanh emerald đậm */
}
/* fr-widget-head: GIỮ gradient xanh emerald — header section design đẹp */

/* News-flt button (chip filter chính) khi KHÔNG active */
html:not(.dark) .news-flt:not(.active){
  background:#eef2f7 !important;
  color:#1f2937 !important;
  border-color:#d6dce6 !important;
}

/* ───── Inline color hex phổ biến cần đậm hơn cho light ───── */
/* #94a3b8 (slate-400 muted) → #475569 cho readable */
html:not(.dark) [style*="color:#94a3b8"],
html:not(.dark) [style*="color: #94a3b8"]{
  color:#475569 !important;
}
/* #cbd5e1 (slate-300) → #334155 */
html:not(.dark) [style*="color:#cbd5e1"],
html:not(.dark) [style*="color: #cbd5e1"]{
  color:#334155 !important;
}
/* #34d399 (emerald-400) → #047857 đậm hơn cho contrast trên nền trắng */
html:not(.dark) [style*="color:#34d399"],
html:not(.dark) [style*="color: #34d399"]{
  color:#047857 !important;
}
/* #fb923c (orange-400) → giữ nguyên, OK trên trắng */
/* #fff đã có rule ở trên */

/* ══════════════════════════════════════════════════════════════════
   PHÒNG LIVE DESKTOP — partials/tw-live-desktop-room.ejs (.dlr-*)
   Toàn bộ class hardcode bg đen/xanh đậm (#0a0d12, #13171f, #1a1f29,
   #152040, #0a1628) — cần override sạch để light mode trông sáng sủa.
   GIỮ NGUYÊN: sân bóng .dlr-sim-pitch (xanh cỏ), banner cam (.dlr-banner-cta),
   bookie gradient cam (.dlr-tb-brand, .dlr-odds-bookmaker).
   ══════════════════════════════════════════════════════════════════ */

/* ── Surface chính: top-bar, odds-row, nav-tabs, status-strip ── */
html:not(.dark) .dlr-top-bar{
  background:linear-gradient(180deg,#ffffff,#f6f8fc) !important;
  border-color:#d6dce6 !important;
}
html:not(.dark) .dlr-odds-row,
html:not(.dark) .dlr-nav-tabs,
html:not(.dark) .dlr-status-strip{
  background:#ffffff !important;
  border-color:#d6dce6 !important;
}
html:not(.dark) .dlr-status-strip{ border-bottom:none !important; }
html:not(.dark) .dlr-odds-head{ border-bottom-color:#e0e6ee !important; }

/* ── Chip BLV, mini-scores ── */
html:not(.dark) .dlr-chip-blv{
  background:#f1f5f9 !important;
  border-color:#d6dce6 !important;
  color:#1f2937 !important;
}
html:not(.dark) .dlr-mini-label,
html:not(.dark) .dlr-nav-label,
html:not(.dark) .dlr-odds-bookmaker-label,
html:not(.dark) .dlr-odds-col-label,
html:not(.dark) .dlr-banner-icons,
html:not(.dark) .dlr-tags-label,
html:not(.dark) .dlr-tb-desc,
html:not(.dark) .dlr-stat-empty,
html:not(.dark) .dlr-sb-ht{
  color:#475569 !important;
}

/* ── Score box, team names ── */
html:not(.dark) .dlr-team-name{ color:#0f172a !important; }
html:not(.dark) .dlr-score-status{ color:#475569 !important; }
html:not(.dark) .dlr-score-nums{ color:#c2410c !important; } /* cam thay vàng cho contrast */

/* ── Odds cells ── */
html:not(.dark) .dlr-odd-cell{
  background:#f1f5f9 !important;
  color:#0f172a !important;
}
/* .dlr-odd-line giữ nguyên cam */
/* .dlr-odd-cta giữ nguyên xanh emerald */

/* ── Nav tabs ── */
html:not(.dark) .dlr-nav-tab{ color:#475569 !important; }
html:not(.dark) .dlr-nav-tab:hover{
  color:#c2410c !important;
  background:rgba(255,122,24,.08) !important;
}
html:not(.dark) .dlr-nav-tab.active{
  color:#c2410c !important;
  background:rgba(255,122,24,.12) !important;
}

/* ── SIM toggle ── */
html:not(.dark) .dlr-sim-toggle{
  color:#475569 !important;
  border-color:#d6dce6 !important;
}
html:not(.dark) .dlr-sim-toggle:hover{ color:#c2410c !important; }

/* ── Section header H3 ── */
html:not(.dark) .dlr-section-h h3{ color:#0f172a !important; }
html:not(.dark) .dlr-section-h h3 span{ color:#c2410c !important; }

/* ── Status strip text ── */
html:not(.dark) .dlr-status-strip span{ color:#1f2937 !important; }
html:not(.dark) .dlr-status-strip b{ color:#c2410c !important; }
html:not(.dark) .dlr-status-cta{ color:#b45309 !important; }

/* ── Player tabs ── */
html:not(.dark) .dlr-player-tabs{ border-bottom-color:#d6dce6 !important; }
html:not(.dark) .dlr-pt{ color:#475569 !important; }
html:not(.dark) .dlr-pt.active{
  background:#ffffff !important;
  color:#c2410c !important;
}

/* ── Quality bar ── */
html:not(.dark) .dlr-quality-bar{
  background:#ffffff !important;
  border-color:#d6dce6 !important;
}
html:not(.dark) .dlr-qbtn{
  background:#f1f5f9 !important;
  color:#1f2937 !important;
  border-color:#d6dce6 !important;
}
html:not(.dark) .dlr-qbtn:hover{ color:#c2410c !important; }
/* .dlr-qbtn.active giữ nguyên cam */

/* ── Score bar dưới pitch (đang là #152040 — xanh navy đậm) ── */
html:not(.dark) .dlr-sim-scorebar{
  background:linear-gradient(180deg,#f8fafc,#eef2f7) !important;
  border-color:#d6dce6 !important;
}
html:not(.dark) .dlr-sb-name{ color:#0f172a !important; }
html:not(.dark) .dlr-sb-timer{ color:#c2410c !important; }
html:not(.dark) .dlr-sb-score{ color:#0f172a !important; }
html:not(.dark) .dlr-card-corner{
  background:#e0e6ee !important;
  color:#334155 !important;
}

/* ── Timeline biểu đồ momentum ── */
html:not(.dark) .dlr-sim-timeline{
  background:#ffffff !important;
  border-color:#d6dce6 !important;
}
html:not(.dark) .dlr-tl-header,
html:not(.dark) .dlr-tl-footer{ color:#475569 !important; }
html:not(.dark) .dlr-tl-axis{ color:#475569 !important; }
html:not(.dark) .dlr-tl-marker-icon{ border-color:#ffffff !important; }
html:not(.dark) .dlr-tl-marker-tooltip{
  background:#1f2937 !important;
  color:#ffffff !important;
}

/* ── Bookie panel + Other matches + SEO box ── */
html:not(.dark) .dlr-top-bookie,
html:not(.dark) .dlr-other-matches,
html:not(.dark) .dlr-seo{
  background:#ffffff !important;
  border-color:#d6dce6 !important;
}
html:not(.dark) .dlr-other-head{ color:#c2410c !important; }
html:not(.dark) .dlr-other-item{
  color:#1f2937 !important;
  border-bottom-color:#e0e6ee !important;
}
html:not(.dark) .dlr-other-item:hover{ background:rgba(255,122,24,.06) !important; }
html:not(.dark) .dlr-other-time{ color:#b45309 !important; }
html:not(.dark) .dlr-other-match{ color:#334155 !important; }

/* ══════════════════════════════════════════════════════════════════
   /lich-phat-song DESKTOP redesign (lps-*) — v159+
   ══════════════════════════════════════════════════════════════════ */

/* Sport tab pills (Bóng đá / Bóng rổ / Tennis ...) */
html:not(.dark) .lps-sport-tab {
  background: #ffffff !important;
  border-color: #d6dce6 !important;
  color: #475569 !important;
}
html:not(.dark) .lps-sport-tab:hover {
  background: #f1f5f9 !important; color: #0f172a !important;
}
html:not(.dark) .lps-sport-tab.is-active {
  background: linear-gradient(135deg, #14b8a6, #0d9488) !important;
  border-color: #14b8a6 !important; color: #ffffff !important;
}
html:not(.dark) .lps-sport-ico { background: rgba(0,0,0,.06) !important; }
html:not(.dark) .lps-sport-tab.is-active .lps-sport-ico { background: rgba(255,255,255,.25) !important; }

/* Filter bar wrapper (HÔM NAY / date / sort) */
html:not(.dark) .lps-day-btn {
  border-color: #d6dce6 !important; color: #475569 !important;
}
html:not(.dark) .lps-day-btn:hover { color: #0d9488 !important; border-color: #14b8a6 !important; }
html:not(.dark) .lps-day-btn.is-active {
  background: rgba(20,184,166,.12) !important;
  border-color: #14b8a6 !important; color: #0d9488 !important;
}
html:not(.dark) input[type="date"]#lpsDate {
  background: #ffffff !important; border-color: #d6dce6 !important; color: #1a1f2e !important;
}
html:not(.dark) #lpsSortBtn { color: #c2410c !important; }

/* League filter chips */
html:not(.dark) .lps-lg-chip {
  background: #ffffff !important; border-color: #d6dce6 !important; color: #475569 !important;
}
html:not(.dark) .lps-lg-chip:hover {
  background: #fff7ed !important; color: #c2410c !important; border-color: #fdba74 !important;
}
html:not(.dark) .lps-lg-chip.is-active {
  background: linear-gradient(135deg, #ff7a18, #ea580c) !important;
  border-color: #ff7a18 !important; color: #ffffff !important;
}

/* League group header */
html:not(.dark) .lps-lg-header {
  background: linear-gradient(90deg, #fff7ed 0%, #ffedd5 100%) !important;
  border-color: #fdba74 !important;
}
html:not(.dark) .lps-lg-header .text-white { color: #0f172a !important; }
html:not(.dark) .lps-lg-header .text-muted { color: #64748b !important; }
html:not(.dark) .lps-lg-logo {
  background: #ffffff !important; border: 1px solid #fdba74 !important; color: #c2410c !important;
}

/* Match row */
html:not(.dark) .lps-match-row {
  background: #ffffff !important; border-color: #e0e6ee !important;
}
html:not(.dark) .lps-match-row:hover { background: #fafbfd !important; }

/* Time box */
html:not(.dark) .lps-time-box {
  background: #fff7ed !important; border-color: #fdba74 !important; color: #c2410c !important;
}

/* Team name + logo */
html:not(.dark) .lps-team-name { color: #1f2937 !important; }
html:not(.dark) .lps-team-logo { background: #ffffff !important; border: 1px solid #e0e6ee !important; }
html:not(.dark) .lps-team-letter { color: #1f2937 !important; }

/* VS fallback text */
html:not(.dark) .lps-col-vs > span { color: #94a3b8 !important; }

/* Action buttons - giữ màu pop, chỉ chỉnh outline */
html:not(.dark) .lps-btn-detail {
  background: #ffffff !important; border-color: #d6dce6 !important; color: #64748b !important;
}
html:not(.dark) .lps-btn-detail:hover { border-color: #14b8a6 !important; color: #0d9488 !important; }

/* Round tag */
html:not(.dark) .lps-round-tag {
  background: #f1f5f9 !important; border-color: #d6dce6 !important; color: #64748b !important;
}

/* H1 title trên top desktop */
html:not(.dark) .hidden.md\:block > header > h1 { color: #0f172a !important; }

/* ══════════════════════════════════════════════════════════════════
   /livescore DESKTOP redesign (lvs-*) — v161+
   ══════════════════════════════════════════════════════════════════ */

/* Tabs row */
html:not(.dark) .lvs-tabs {
  background: #f1f5f9 !important;
  border-bottom-color: #d6dce6 !important;
}
html:not(.dark) .lvs-tab { color: #475569 !important; }
html:not(.dark) .lvs-tab:hover { background: rgba(20,184,166,.12) !important; color: #0f172a !important; }
html:not(.dark) .lvs-tab.is-active {
  background: linear-gradient(180deg, #ccfbf1 0%, #99f6e4 100%) !important;
  color: #0f3a36 !important;
  border-color: #d6dce6 !important;
  border-bottom-color: #ccfbf1 !important;
}
html:not(.dark) .lvs-count { background: #14b8a6 !important; color: #fff !important; }
html:not(.dark) .lvs-tab.is-active .lvs-count { background: #ea580c !important; color: #fff !important; }

/* Table head */
html:not(.dark) .lvs-table-head {
  background: #f1f5f9 !important;
  border-color: #d6dce6 !important;
  color: #475569 !important;
}

/* League block / header row */
html:not(.dark) .lvs-lg-row {
  background: linear-gradient(90deg, #fff7ed 0%, #ffedd5 100%) !important;
  border-color: #fdba74 !important;
}
html:not(.dark) .lvs-lg-name { color: #0f172a !important; }
html:not(.dark) .lvs-lg-country { color: #94a3b8 !important; }
html:not(.dark) .lvs-lg-flag { background: #fff !important; border: 1px solid #fdba74 !important; }

/* Match row */
html:not(.dark) .lvs-row {
  background: #ffffff !important;
  border-color: #e0e6ee !important;
}
html:not(.dark) .lvs-row:hover { background: #fafbfd !important; }
html:not(.dark) .lvs-row[data-status="live"] { background: #fef2f2 !important; }
html:not(.dark) .lvs-row[data-status="live"]:hover { background: #fee2e2 !important; }

/* Fav star */
html:not(.dark) .lvs-fav { color: #cbd5e1 !important; }
html:not(.dark) .lvs-fav:hover { color: #f59e0b !important; }

/* Time */
html:not(.dark) .lvs-time-hhmm { color: #c2410c !important; }
html:not(.dark) .lvs-time-date { color: #64748b !important; }
html:not(.dark) .lvs-time-min { color: #dc2626 !important; }

/* Team */
html:not(.dark) .lvs-team-name { color: #1f2937 !important; }
html:not(.dark) .lvs-team-logo { background: #ffffff !important; border: 1px solid #e0e6ee !important; }
html:not(.dark) .lvs-team-letter { color: #1f2937 !important; }

/* HT / PG */
html:not(.dark) .lvs-ht, html:not(.dark) .lvs-pg { color: #64748b !important; }
html:not(.dark) .lvs-ht .text-muted, html:not(.dark) .lvs-pg .text-muted { color: #cbd5e1 !important; }

/* Odds */
html:not(.dark) .lvs-odd-up { color: #dc2626 !important; }
html:not(.dark) .lvs-odd-dn { color: #c2410c !important; }

/* Empty state */
html:not(.dark) .lvs-empty {
  background: #ffffff !important; border-color: #d6dce6 !important; color: #64748b !important;
}
html:not(.dark) .lvs-empty .text-white { color: #0f172a !important; }
html:not(.dark) .lvs-empty .text-muted { color: #64748b !important; }

/* ══════════════════════════════════════════════════════════════════
   /ket-qua DESKTOP redesign (kq-*) — v163+
   ══════════════════════════════════════════════════════════════════ */

/* League filter chips */
html:not(.dark) .kq-lg-chip {
  background: #ffffff !important; border-color: #d6dce6 !important; color: #475569 !important;
}
html:not(.dark) .kq-lg-chip:hover {
  background: #f0fdfa !important; color: #0d9488 !important; border-color: #14b8a6 !important;
}
html:not(.dark) .kq-lg-chip.is-active {
  background: linear-gradient(135deg, #14b8a6, #0d9488) !important;
  border-color: #14b8a6 !important; color: #ffffff !important;
}

/* League header */
html:not(.dark) .kq-lg-header {
  background: linear-gradient(90deg, #fff7ed 0%, #ffedd5 100%) !important;
  border-color: #fdba74 !important;
}
html:not(.dark) .kq-lg-name { color: #0f172a !important; }
html:not(.dark) .kq-lg-country { color: #94a3b8 !important; }
html:not(.dark) .kq-lg-logo { background: #ffffff !important; border: 1px solid #fdba74 !important; color: #c2410c !important; }

/* Sub-head */
html:not(.dark) .kq-sub-head {
  background: #f1f5f9 !important;
  border-color: #d6dce6 !important;
  color: #475569 !important;
}

/* Row */
html:not(.dark) .kq-row {
  background: #ffffff !important; border-color: #e0e6ee !important;
}
html:not(.dark) .kq-row:hover { background: #fafbfd !important; }

/* Time box */
html:not(.dark) .kq-time-box {
  background: #fff7ed !important; border-color: #fdba74 !important; color: #c2410c !important;
}

/* Round tag */
html:not(.dark) .kq-round-tag {
  background: #f1f5f9 !important; border-color: #d6dce6 !important; color: #64748b !important;
}

/* Team name / logo */
html:not(.dark) .kq-team-name { color: #1f2937 !important; }
html:not(.dark) .kq-team-name.kq-winner { color: #c2410c !important; }
html:not(.dark) .kq-team-logo { background: #ffffff !important; border: 1px solid #e0e6ee !important; }
html:not(.dark) .kq-team-letter { color: #1f2937 !important; }

/* HT */
html:not(.dark) .kq-col-ht { color: #15803d !important; }
html:not(.dark) .kq-ht-val { color: #15803d !important; }
html:not(.dark) .kq-col-ht .text-muted { color: #cbd5e1 !important; }

/* Corners + Cards */
html:not(.dark) .kq-col-corners .kq-pair-num,
html:not(.dark) .kq-col-cards .kq-pair-num { color: #64748b !important; }
html:not(.dark) .kq-col-corners .kq-pair-num:nth-of-type(3),
html:not(.dark) .kq-col-corners .kq-pair-num:nth-of-type(4) { color: #15803d !important; }
html:not(.dark) .kq-col-cards .kq-pair-num:nth-of-type(3),
html:not(.dark) .kq-col-cards .kq-pair-num:nth-of-type(4) { color: #d97706 !important; }
html:not(.dark) .kq-pair-sep { color: #cbd5e1 !important; }

/* Empty state */
html:not(.dark) .kq-empty {
  background: #ffffff !important; border-color: #d6dce6 !important; color: #64748b !important;
}
html:not(.dark) .kq-empty .text-white { color: #0f172a !important; }
html:not(.dark) .kq-empty .text-muted { color: #64748b !important; }

/* ── SEO article text ── */
html:not(.dark) .dlr-seo h4{ color:#0f172a !important; }
html:not(.dark) .dlr-seo p{ color:#1f2937 !important; }
html:not(.dark) .dlr-seo b{ color:#0f172a !important; }
html:not(.dark) .dlr-seo a{ color:#c2410c !important; }
html:not(.dark) .dlr-seo .dlr-gold{ color:#b45309 !important; }

/* ── Tags ── */
html:not(.dark) .dlr-tags{ border-top-color:#e0e6ee !important; }
html:not(.dark) .dlr-tag{
  background:#f1f5f9 !important;
  color:#c2410c !important;
}
html:not(.dark) .dlr-tag:hover{ background:rgba(255,122,24,.15) !important; }

/* ── Stats panel (overlay trên pitch — giữ xanh cỏ) ── */
html:not(.dark) .dlr-sim-stats h4{ color:#ffffff !important; } /* trên nền cỏ vẫn cần trắng */
html:not(.dark) .dlr-stat-l,
html:not(.dark) .dlr-stat-r{ color:#ffffff !important; }
html:not(.dark) .dlr-stat-label{
  background:rgba(255,255,255,.92) !important;
  color:#c2410c !important;
}

/* ── Inline-styled wrappers (SVG sim, iframe, tooltip) ── */
html:not(.dark) #dlrSimSvgWrap,
html:not(.dark) #dlrSimIframeWrap{
  background:#ffffff !important;
  border-color:#d6dce6 !important;
}
html:not(.dark) #dlrSimIframe{
  background:#ffffff !important;
}
/* Tooltip mô phỏng giữ tối — đè lên sân cỏ nên cần contrast */

/* ══════════════════════════════════════════════════════════════════
   v5 — Chat system "Phòng chưa lên sóng" (chat-v2.js)
   JS hard-code #1a1f29 + #fff (dark) → override sang tone light
   ══════════════════════════════════════════════════════════════════ */
html:not(.dark) .chat-sys-offline{
  background:#f3f4f6 !important;
  border-color:#d1d5db !important;
  color:#4b5563 !important;
}
html:not(.dark) .chat-sys-offline b{ color:#111827 !important; }
html:not(.dark) .chat-sys-offline span{ color:#6b7280 !important; }


/* ══════════════════════════════════════════════════════════════════
   v9 — Thanh/card NEN TOI co dinh tren MOBILE giu chu SANG trong light mode
   Header mobile (#globalMobileHeader) + card featured trang chu (#mhLivePreview)
   co nen toi hardcoded (khong doi theo theme). Rule chung .text-white->toi
   lam chu/icon toi tren nen toi = KHONG DOC DUOC → ep lai trang.
   (svg play .text-pri van giu mau cam, khong dung toi.)
   ══════════════════════════════════════════════════════════════════ */
html:not(.dark) #globalMobileHeader .text-white,
html:not(.dark) #mhLivePreview .text-white,
html:not(.dark) #mhLiveName,
html:not(.dark) #mhLiveCta { color:#fff !important; }
html:not(.dark) #mhLivePreview [class*="text-white/"] { color:rgba(255,255,255,.75) !important; }

/* ══════════════════════════════════════════════════════════════════
   Thẻ trận (tw-stream-card) — vùng ảnh sân (.sc-media) LUÔN nền TỐI.
   Rule chung .text-white->tối làm tỷ số + badge LIVE/môn TN mất hút.
   → ép mọi chữ/badge trong .sc-media về TRẮNG ở light mode.
   ══════════════════════════════════════════════════════════════════ */
html:not(.dark) .sc-media .text-white { color:#fff !important; }
html:not(.dark) .sc-media [class*="text-white/"] { color:rgba(255,255,255,.75) !important; }

/* ══════════════════════════════════════════════════════════════════
   Khối nền TỐI CỐ ĐỊNH (nền giữ nguyên ở cả 2 theme) → chữ phải SÁNG.
   Rule chung .text-white→#1a1f2e làm tiêu đề/mô tả mất hút ở light mode.
     .cat-hero    → hero chuyên mục (tw-cat-hero + tw-idol-live)
     .x66-on-dark → panel nền tối tuỳ biến (vd hộp "Nâng cấp VIP")
   ══════════════════════════════════════════════════════════════════ */
html:not(.dark) .cat-hero .text-white,
html:not(.dark) .x66-on-dark .text-white          { color:#fff !important; }
html:not(.dark) .cat-hero [class*="text-white/"],
html:not(.dark) .x66-on-dark [class*="text-white/"] { color:rgba(255,255,255,.7) !important; }

/* Badge nền đỏ .bg-live (#ff3b3b — KHÔNG đổi theo theme): LIVE/HOT/$$$/NEW ở
   sidebar, header, profile-follow. Rule chung ép chữ về tối → khó đọc trên đỏ. */
html:not(.dark) .bg-live.text-white { color:#fff !important; }

/* ══════════════════════════════════════════════════════════════════
   Widget "PHÂN TÍCH TRẬN ĐẤU" (.insights-widget) — box đặt bg-[#13171f]
   nhưng class arbitrary KHÔNG build => box trong suốt => light mode hiện
   nền TRẮNG, trong khi chữ bên trong toàn text-white/* => trắng-trên-trắng.
   → Ép box TỐI lại (đồng bộ khu "AI NHẬN ĐỊNH" bên dưới cũng tối), chữ
   trắng + tint emerald/yellow/prob-bar giữ nguyên như thiết kế dark.
   ══════════════════════════════════════════════════════════════════ */
/* Widget này thiết kế cho nền tối, nhưng ở LIGHT MODE phải SÁNG cho đồng bộ.
   Box -> trắng, chữ -> tối, sub-box tối -> sáng, vàng -> amber đậm. */
html:not(.dark) .insights-widget > div {
  background:#ffffff !important;
  border-color:#e2e8f0 !important;
}
/* Chữ trắng (kể cả text-white/50-70) -> tối trên nền sáng */
html:not(.dark) .insights-widget .text-white,
html:not(.dark) .insights-widget [class*="text-white/"] { color:#1f2937 !important; }
/* Sub-box tối + viền trắng mờ -> sáng */
html:not(.dark) .insights-widget [class*="bg-black/"]  { background:#f1f5f9 !important; }
html:not(.dark) .insights-widget [class*="bg-white/"]  { background:#f1f5f9 !important; }
html:not(.dark) .insights-widget [class*="border-white/"] { border-color:#e2e8f0 !important; }
/* Vàng nhạt -> amber đậm để đọc trên nền sáng */
html:not(.dark) .insights-widget .text-yellow-200,
html:not(.dark) .insights-widget .text-yellow-300 { color:#b45309 !important; }

/* ══════════════════════════════════════════════════════════════════
   Bottom-sheet .x-bs (popup profile, sheet mobile…)
   bottom-sheet.css:40 dùng `background: var(--bg-card, #1a1f29)` NHƯNG biến
   --bg-card KHÔNG hề được định nghĩa ⇒ luôn rơi về fallback TỐI, kể cả light
   mode ⇒ panel tối + chữ bị rule chung lật tối = tên/bio mất hút.
   → Light mode: panel phải SÁNG (đồng bộ .bg-bg-card = #fff). Chữ bên trong
     giữ nguyên màu tối mặc định của light mode, KHÔNG ép trắng.
   bottom-sheet.css còn hardcode màu cho nền tối ở handle/title/close/border.
   ══════════════════════════════════════════════════════════════════ */
html:not(.dark) .x-bs {
  background: #ffffff !important;
  border-top-color: rgba(0,0,0,.08) !important;
  box-shadow: 0 -10px 40px rgba(0,0,0,.18) !important;
}
@media (min-width: 768px) {                      /* desktop = center modal */
  html:not(.dark) .x-bs {
    border-color: rgba(0,0,0,.10) !important;
    box-shadow: 0 25px 80px rgba(0,0,0,.25) !important;
  }
}
html:not(.dark) .x-bs-handle::before        { background: rgba(0,0,0,.22) !important; }
html:not(.dark) .x-bs-handle:active::before { background: rgba(0,0,0,.40) !important; }
html:not(.dark) .x-bs-header               { border-bottom-color: rgba(0,0,0,.08) !important; }
html:not(.dark) .x-bs-title                { color:#1a1f2e !important; }
html:not(.dark) .x-bs-close                { background: rgba(0,0,0,.06) !important; color:#1a1f2e !important; }
html:not(.dark) .x-bs-close:hover          { background: rgba(0,0,0,.12) !important; }
/* .text-gold = #ffd23f (vàng chói) → trên hộp sáng #eef2f7 gần như không đọc
   được. Dùng gold đậm (amber-700) cho nền sáng, vẫn giữ đúng chất vàng. */
html:not(.dark) .x-bs .text-gold           { color:#b45309 !important; }