/* ================= Theme: Sáng / Tối / Hệ thống ================= */
:root { color-scheme: dark; }
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="light"] body {
    background: #eef2f7 !important;
    background-image: none !important;
    color: #0f172a !important;
}

/* Nền */
:root[data-theme="light"] .bg-black\/60,
:root[data-theme="light"] .bg-black\/70,
:root[data-theme="light"] .bg-black\/80 { background-color: rgba(15, 23, 42, .5) !important; }
:root[data-theme="light"] .bg-slate-950,
:root[data-theme="light"] .bg-slate-950\/70,
:root[data-theme="light"] .bg-slate-950\/75,
:root[data-theme="light"] .bg-slate-900,
:root[data-theme="light"] .bg-slate-900\/60 { background-color: #e2e8f0 !important; }
:root[data-theme="light"] .bg-slate-800,
:root[data-theme="light"] .bg-slate-800\/90,
:root[data-theme="light"] .bg-slate-800\/60 { background-color: #ffffff !important; }
:root[data-theme="light"] .bg-slate-700,
:root[data-theme="light"] .bg-slate-700\/40,
:root[data-theme="light"] .bg-slate-700\/50,
:root[data-theme="light"] .bg-slate-700\/60 { background-color: #f1f5f9 !important; }
:root[data-theme="light"] .bg-slate-600,
:root[data-theme="light"] .bg-slate-600\/40,
:root[data-theme="light"] .bg-slate-600\/70 { background-color: #e2e8f0 !important; }
:root[data-theme="light"] .bg-slate-500,
:root[data-theme="light"] .bg-slate-500\/20 { background-color: #cbd5e1 !important; }
:root[data-theme="light"] .bg-white\/5 { background-color: rgba(15, 23, 42, .04) !important; }
:root[data-theme="light"] .bg-white\/10 { background-color: rgba(15, 23, 42, .06) !important; }
:root[data-theme="light"] .bg-white\/20 { background-color: rgba(15, 23, 42, .12) !important; }
:root[data-theme="light"] .bg-slate-900\/60,
:root[data-theme="light"] .bg-slate-800\/40 { background-color: #eef2f7 !important; }

/* Hover nền */
:root[data-theme="light"] .hover\:bg-slate-600:hover,
:root[data-theme="light"] .hover\:bg-slate-700:hover,
:root[data-theme="light"] .hover\:bg-slate-700\/60:hover,
:root[data-theme="light"] .hover\:bg-slate-500:hover { background-color: #dbe3ec !important; }
:root[data-theme="light"] .hover\:bg-white\/10:hover,
:root[data-theme="light"] .hover\:bg-white\/20:hover { background-color: rgba(15, 23, 42, .08) !important; }

/* Chữ */
:root[data-theme="light"] .text-white { color: #0f172a !important; }
:root[data-theme="light"] .text-slate-100,
:root[data-theme="light"] .text-slate-200 { color: #1e293b !important; }
:root[data-theme="light"] .text-slate-300 { color: #334155 !important; }
:root[data-theme="light"] .text-slate-400 { color: #475569 !important; }
:root[data-theme="light"] .text-slate-500 { color: #64748b !important; }
:root[data-theme="light"] .text-slate-600 { color: #475569 !important; }
:root[data-theme="light"] .text-slate-900 { color: #0f172a !important; }
:root[data-theme="light"] .text-indigo-300,
:root[data-theme="light"] .text-indigo-400 { color: #4f46e5 !important; }
:root[data-theme="light"] .text-indigo-200 { color: #4338ca !important; }
:root[data-theme="light"] .text-indigo-100 { color: #3730a3 !important; }

/* Giữ chữ trắng trên nền màu */
:root[data-theme="light"] [class*="bg-indigo-"].text-white,
:root[data-theme="light"] [class*="bg-violet-"].text-white,
:root[data-theme="light"] [class*="bg-blue-"].text-white,
:root[data-theme="light"] [class*="bg-sky-"].text-white,
:root[data-theme="light"] [class*="bg-cyan-"].text-white,
:root[data-theme="light"] [class*="bg-teal-"].text-white,
:root[data-theme="light"] [class*="bg-emerald-"].text-white,
:root[data-theme="light"] [class*="bg-green-"].text-white,
:root[data-theme="light"] [class*="bg-amber-"].text-white,
:root[data-theme="light"] [class*="bg-orange-"].text-white,
:root[data-theme="light"] [class*="bg-red-"].text-white,
:root[data-theme="light"] [class*="bg-rose-"].text-white,
:root[data-theme="light"] [class*="bg-pink-"].text-white,
:root[data-theme="light"] [class*="bg-fuchsia-"].text-white { color: #ffffff !important; }

/* Viền */
:root[data-theme="light"] .border-white\/10,
:root[data-theme="light"] .border-white\/15,
:root[data-theme="light"] .border-white\/20 { border-color: rgba(15, 23, 42, .12) !important; }
:root[data-theme="light"] .border-slate-700,
:root[data-theme="light"] .border-slate-700\/60,
:root[data-theme="light"] .border-slate-600 { border-color: rgba(15, 23, 42, .16) !important; }

/* Input */
:root[data-theme="light"] select,
:root[data-theme="light"] input,
:root[data-theme="light"] textarea { color: #0f172a !important; }
:root[data-theme="light"] input::placeholder,
:root[data-theme="light"] textarea::placeholder { color: #94a3b8 !important; }

/* Nội dung HTML bài giảng */
:root[data-theme="light"] .rich-html,
:root[data-theme="light"] .class-html-content,
:root[data-theme="light"] .cls-post.ql-editor { color: #1e293b !important; }
:root[data-theme="light"] .rich-html h1,
:root[data-theme="light"] .rich-html h2,
:root[data-theme="light"] .rich-html h3,
:root[data-theme="light"] .rich-html h4 { color: #0f172a !important; }
:root[data-theme="light"] .rich-html pre,
:root[data-theme="light"] .rich-html code { background: #e2e8f0 !important; color: #0f172a !important; }
:root[data-theme="light"] .rich-html blockquote { color: #475569 !important; border-color: #818cf8 !important; background: rgba(99, 102, 241, .06) !important; }
:root[data-theme="light"] .rich-html td,
:root[data-theme="light"] .rich-html th { border-color: #cbd5e1 !important; }

/* Trình chiếu toàn màn hình */
:root[data-theme="light"] .lop-fullscreen { background: #eef2f7 !important; }

/* ================= Hài hòa tương phản (dark) =================
   Nâng độ sáng chữ mờ + viền để đạt tối thiểu ~4.5:1 trên nền slate-800/700. */
:root:not([data-theme="light"]) .text-slate-600 { color: #8b98ab !important; }
:root:not([data-theme="light"]) .text-slate-500 { color: #a4b1c4 !important; }
:root:not([data-theme="light"]) .text-slate-400 { color: #b3bfcf !important; }
:root:not([data-theme="light"]) .text-slate-300 { color: #cbd5e1 !important; }
:root:not([data-theme="light"]) .text-indigo-300 { color: #a5b4fc !important; }
:root:not([data-theme="light"]) .text-indigo-400 { color: #93a4f8 !important; }
:root:not([data-theme="light"]) .text-emerald-400 { color: #34d399 !important; }
:root:not([data-theme="light"]) .text-amber-400 { color: #fbbf24 !important; }
:root:not([data-theme="light"]) .text-red-400 { color: #f87171 !important; }
:root:not([data-theme="light"]) input::placeholder,
:root:not([data-theme="light"]) textarea::placeholder { color: #a0adc0 !important; }
:root:not([data-theme="light"]) .border-slate-700,
:root:not([data-theme="light"]) .border-slate-700\/60 { border-color: #3a4a61 !important; }
:root:not([data-theme="light"]) .border-slate-600 { border-color: #4a5a72 !important; }
:root:not([data-theme="light"]) .border-white\/10 { border-color: rgba(148, 163, 184, .18) !important; }
:root:not([data-theme="light"]) .border-white\/20 { border-color: rgba(148, 163, 184, .28) !important; }
/* Nút màu đậm hơn để chữ trắng đủ tương phản */
:root:not([data-theme="light"]) .bg-emerald-600 { background-color: #047857 !important; }
:root:not([data-theme="light"]) .bg-indigo-500 { background-color: #4f46e5 !important; }
:root:not([data-theme="light"]) .bg-amber-600 { background-color: #b45309 !important; }

/* ================= Hài hòa tương phản (light) =================
   Hạ tông các màu nhấn để đủ tương phản trên nền sáng. */
:root[data-theme="light"] .text-emerald-100,
:root[data-theme="light"] .text-emerald-200,
:root[data-theme="light"] .text-emerald-300,
:root[data-theme="light"] .text-emerald-400 { color: #047857 !important; }
:root[data-theme="light"] .text-amber-100,
:root[data-theme="light"] .text-amber-200,
:root[data-theme="light"] .text-amber-300,
:root[data-theme="light"] .text-amber-400 { color: #b45309 !important; }
:root[data-theme="light"] .text-red-100,
:root[data-theme="light"] .text-red-200,
:root[data-theme="light"] .text-red-300,
:root[data-theme="light"] .text-red-400 { color: #b91c1c !important; }
:root[data-theme="light"] .text-sky-300,
:root[data-theme="light"] .text-sky-400 { color: #0369a1 !important; }
:root[data-theme="light"] .text-fuchsia-200,
:root[data-theme="light"] .text-fuchsia-300 { color: #a21caf !important; }
:root[data-theme="light"] .text-violet-300,
:root[data-theme="light"] .text-violet-400 { color: #6d28d9 !important; }
:root[data-theme="light"] .text-cyan-300,
:root[data-theme="light"] .text-cyan-400 { color: #0e7490 !important; }
:root[data-theme="light"] .text-slate-100,
:root[data-theme="light"] .text-slate-200 { color: #1e293b !important; }
:root[data-theme="light"] .border-slate-700,
:root[data-theme="light"] .border-slate-600 { border-color: #cbd5e1 !important; }