/* ============================================================
   theme.css  |  TuxunBoke 统一深色模式
   由 _worker.js 自动注入到每个 HTML，无需手动引用
   ============================================================ */

:root {
  --bg: #f8f9fa;
  --bg-card: #ffffff;
  --bg-elev: #fafafa;
  --bg-input: #ffffff;
  --text: #333333;
  --text-strong: #111111;
  --text-muted: #888888;
  --border: #eaeaea;
  --border-strong: #dddddd;
  --primary: #111111;
  --primary-contrast: #ffffff;
  --accent: #0000ee;
  --danger: #cc0000;
  --success: #17b978;
  --gold: #D4AF37;
  --shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
}

body.dark-mode {
  --bg: #121212;
  --bg-card: #1e1e1e;
  --bg-elev: #262626;
  --bg-input: #111111;
  --text: #d6d9e0;
  --text-strong: #f0f0f0;
  --text-muted: #9aa0a6;
  --border: #333333;
  --border-strong: #444444;
  --primary: #ffffff;
  --primary-contrast: #000000;
  --accent: #6fa8ff;
  --danger: #ff6b6b;
  --success: #3ddc97;
  --gold: #FFD700;
  --shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
  color-scheme: dark;
}

body.dark-mode {
  background-color: var(--bg);
  color: var(--text);
}

body.dark-mode ::selection {
  background: #3a3a3a;
  color: #ffffff;
}

body.dark-mode ::-webkit-scrollbar { width: 10px; height: 10px; }
body.dark-mode ::-webkit-scrollbar-track { background: #1a1a1a; }
body.dark-mode ::-webkit-scrollbar-thumb { background: #444444; border-radius: 5px; }
body.dark-mode ::-webkit-scrollbar-thumb:hover { background: #555555; }

body.dark-mode .content,
body.dark-mode .container,
body.dark-mode .section-box,
body.dark-mode .profile-card,
body.dark-mode .article-card,
body.dark-mode .card,
body.dark-mode .box,
body.dark-mode .renew-box,
body.dark-mode .redeem-box,
body.dark-mode .vip-panel,
body.dark-mode .modal-box,
body.dark-mode .login-box,
body.dark-mode .report-box,
body.dark-mode .broadcast-box,
body.dark-mode .ref-box {
  background: var(--bg-card) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
  box-shadow: var(--shadow) !important;
}

body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode .post-title,
body.dark-mode .tier-name,
body.dark-mode .section-title,
body.dark-mode .card-title,
body.dark-mode .user-name {
  color: var(--text-strong) !important;
}

body.dark-mode input,
body.dark-mode textarea,
body.dark-mode select {
  background: var(--bg-input) !important;
  color: var(--text) !important;
  border-color: var(--border-strong) !important;
}

body.dark-mode input:focus,
body.dark-mode textarea:focus,
body.dark-mode select:focus {
  border-color: #ffffff !important;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
  color: #666666 !important;
}

body.dark-mode .btn-primary,
body.dark-mode .login-submit,
body.dark-mode .submit-btn,
body.dark-mode .download-btn,
body.dark-mode .broadcast-btn,
body.dark-mode .agree-btn,
body.dark-mode .p-btn,
body.dark-mode .s-btn {
  background: var(--primary) !important;
  color: var(--primary-contrast) !important;
  border-color: var(--primary) !important;
}

body.dark-mode table { color: var(--text); }
body.dark-mode th { background: #222222 !important; color: #dddddd !important; border-color: #444444 !important; }
body.dark-mode td { border-color: #2e2e2e !important; }
body.dark-mode tr:nth-child(even) { background: #1a1a1a; }
body.dark-mode tr:hover { background: #2a2a2a !important; }
body.dark-mode .btn-small { background: #222222 !important; color: #cccccc !important; border-color: #444444 !important; }
body.dark-mode .btn-small:hover { background: #333333 !important; }

body.dark-mode .nav-bar span { color: #aaaaaa; }
body.dark-mode .nav-bar span.active { color: #ffffff; border-bottom-color: #ffffff; }
body.dark-mode .tag-item { background: #222222 !important; color: #aaaaaa !important; border-color: #444444 !important; }
body.dark-mode .tag-item:hover { background: #333333 !important; border-color: #555555 !important; }
body.dark-mode .tag-item.active { background: #ffffff !important; color: #000000 !important; border-color: #ffffff !important; }
body.dark-mode .page-btn { background: #222222 !important; color: #cccccc !important; border-color: #444444 !important; }
body.dark-mode .page-btn.active { background: #ffffff !important; color: #000000 !important; border-color: #ffffff !important; }
body.dark-mode .page-btn:disabled { background: #1a1a1a !important; color: #555555 !important; }

body.dark-mode .toast { background: #ffffff !important; color: #000000 !important; }
body.dark-mode .modal-overlay,
body.dark-mode #reportModal,
body.dark-mode #payModal,
body.dark-mode #mailDetailModal,
body.dark-mode #composeModal,
body.dark-mode #settingsModal,
body.dark-mode #favModal,
body.dark-mode #msgModal,
body.dark-mode #broadcastModal,
body.dark-mode #protocolModal {
  background: rgba(0, 0, 0, 0.75) !important;
}

body.dark-mode .code-block-body { background: #0f0f0f !important; border-color: #333333 !important; }
body.dark-mode .markdown-content pre { background: #2a2a2a !important; border-color: #444444 !important; }
body.dark-mode .markdown-content code { background: #333333 !important; color: #ff6b6b !important; }

body.dark-mode input[type="datetime-local"],
body.dark-mode input[type="date"],
body.dark-mode input[type="color"] {
  color-scheme: dark;
}