/* ============================================================
   edumaster 夜间模式（dark-mode）
   body 加 .dark-mode 后全站切换暗色。
   JS 由 edumaster-bundle.js 的 bindNightMode 处理（点击 data-toggle-night）。
   这里补齐 .dark-mode 的实际样式，否则开关无视觉效果。
   覆盖 Tailwind 常用背景/文字/边框类，作用于 body 后代，特异性更高。
   ============================================================ */

.dark-mode { color-scheme: dark; }

/* ---- 页面底色 ---- */
.dark-mode body {
    background-color: #0b1220 !important;
    color: #d7dde7 !important;
}

/* ---- 卡片 / 容器背景（白 → 深） ---- */
.dark-mode .bg-white       { background-color: #16202f !important; }
.dark-mode .bg-gray-50     { background-color: #131c2b !important; }
.dark-mode .bg-gray-100    { background-color: #182436 !important; }
.dark-mode .bg-gray-200    { background-color: #223349 !important; }
.dark-mode .bg-gray-300    { background-color: #2c3f58 !important; }
.dark-mode .bg-slate-50    { background-color: #131c2b !important; }
.dark-mode .bg-slate-100   { background-color: #182436 !important; }
.dark-mode .bg-slate-200   { background-color: #223349 !important; }

/* ---- 浅色 soft 背景（bg-*-50 / bg-*-100）转深色半透明 ---- */
.dark-mode .bg-blue-50     { background-color: #14233c !important; }
.dark-mode .bg-indigo-50   { background-color: #171f3a !important; }
.dark-mode .bg-emerald-50  { background-color: #122e2c !important; }
.dark-mode .bg-amber-50    { background-color: #302714 !important; }
.dark-mode .bg-rose-50     { background-color: #321a22 !important; }
.dark-mode .bg-sky-50      { background-color: #11283a !important; }
.dark-mode .bg-violet-50   { background-color: #1d1a36 !important; }
.dark-mode .bg-teal-50     { background-color: #102e2c !important; }
.dark-mode .bg-orange-50   { background-color: #302314 !important; }
.dark-mode .bg-fuchsia-50  { background-color: #2c1636 !important; }
.dark-mode .bg-lime-50     { background-color: #1d2c12 !important; }
.dark-mode .bg-cyan-50     { background-color: #0f2a30 !important; }
.dark-mode .bg-blue-100    { background-color: #14233c !important; }
.dark-mode .bg-indigo-100  { background-color: #171f3a !important; }
.dark-mode .bg-emerald-100 { background-color: #122e2c !important; }
.dark-mode .bg-amber-100   { background-color: #302714 !important; }
.dark-mode .bg-rose-100    { background-color: #321a22 !important; }
.dark-mode .bg-sky-100     { background-color: #11283a !important; }

/* ---- 深色背景保持更深 ---- */
.dark-mode .bg-gray-900    { background-color: #070d1a !important; }
.dark-mode .bg-gray-800    { background-color: #0d1524 !important; }
.dark-mode .bg-slate-800   { background-color: #0d1524 !important; }
.dark-mode .bg-slate-900   { background-color: #070d1a !important; }

/* ---- 文字（深灰系列转浅色，浅灰系列适度） ---- */
.dark-mode .text-gray-900  { color: #f1f5f9 !important; }
.dark-mode .text-gray-800  { color: #e2e8f0 !important; }
.dark-mode .text-gray-700  { color: #cbd5e1 !important; }
.dark-mode .text-gray-600  { color: #b3bdc9 !important; }
.dark-mode .text-gray-500  { color: #94a3b8 !important; }
.dark-mode .text-gray-400  { color: #64748b !important; }
.dark-mode .text-slate-900 { color: #f1f5f9 !important; }
.dark-mode .text-slate-800 { color: #e2e8f0 !important; }
.dark-mode .text-slate-700 { color: #cbd5e1 !important; }
.dark-mode .text-slate-600 { color: #b3bdc9 !important; }
.dark-mode .text-slate-500 { color: #94a3b8 !important; }
.dark-mode .text-slate-400 { color: #64748b !important; }
/* 白字在深底上保持可读（若原为深底上的白字，勿转） */
.dark-mode .text-white     { color: #f8fafc !important; }

/* ---- 边框（浅灰转深） ---- */
.dark-mode .border-gray-100,
.dark-mode .border-gray-200,
.dark-mode .border-gray-300,
.dark-mode .border-slate-100,
.dark-mode .border-slate-200,
.dark-mode .border-slate-300 {
    border-color: #2c3f58 !important;
}
.dark-mode .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
.dark-mode .divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
    border-color: #2c3f58 !important;
}

/* ---- 输入控件 ---- */
.dark-mode input,
.dark-mode textarea,
.dark-mode select {
    background-color: #16202f !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}
.dark-mode input::placeholder,
.dark-mode textarea::placeholder { color: #64748b !important; }

/* ---- 头部 / 底部导航 ---- */
.dark-mode #main-header,
.dark-mode .ls-topbar,
.dark-mode #mobile-header {
    background-color: #101828 !important;
    border-color: #223349 !important;
}

/* ---- 通用面板标题/副标题在深底可读 ---- */
.dark-mode .text-black   { color: #e5e7eb !important; }
.dark-mode .heading,
.dark-mode h1, .dark-mode h2, .dark-mode h3, .dark-mode h4, .dark-mode h5, .dark-mode h6 {
    color: #f1f5f9 !important;
}

/* ---- 阴影卡片在深底下更自然 ---- */
.dark-mode .shadow-sm,
.dark-mode .shadow,
.dark-mode .shadow-md {
    box-shadow: 0 1px 3px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.3) !important;
}

/* ---- 移动端抽屉/遮罩 ---- */
.dark-mode #mobile-menu-overlay,
.dark-mode .ls-drawer,
.dark-mode .mobile-menu-panel {
    background-color: #101828 !important;
}
