/* =====================================================
   全站暗黑模式样式
   通过 html[data-theme="dark"] 生效；跟随系统由 javascript/theme.js 决定实际 data-theme。
   ===================================================== */

html[data-theme="dark"] {
  color-scheme: dark;

  /* 主色调 - 蓝色 */
  --primary: #3B82F6;
  --primary-dark: #2563EB;
  --primary-light: #93C5FD;
  --primary-bg: rgba(59, 130, 246, 0.15);

  /* 强调色 */
  --accent-blue: #60A5FA;
  --accent-purple: #3B82F6;
  --accent-cyan: #25d9e7;

  /* legacy / article style.css 变量 */
  --primary-color: #3B82F6;
  --secondary-color: #f472b6;
  --glass-bg: rgba(10, 10, 10, 0.72);
  --glass-border: rgba(255, 255, 255, 0.1);
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  --bg-primary: rgba(17, 17, 19, 0.95);
  --bg-secondary: rgba(10, 10, 10, 0.95);
  --border-color: rgba(255, 255, 255, 0.1);
  --moboxsvg-color:rgb(255, 255, 255);
  /* 功能色 */
  --danger: #f87171;
  --danger-dark: #ef4444;
  --success: #34d399;
  --warning: #fbbf24;

  /* 文字色 */
  --text-primary: #f8fafc;
  --text-secondary: #cbd5e1;
  --text-muted: #94a3b8;
  --text-light: rgba(255, 255, 255, 0.55);

  /* 背景色 - 半透明以允许背景图片透出（与亮色模式 0.75 透明度一致） */
  --bg-page: rgba(15, 23, 42, 0.85);
  --bg-mask-opacity: 0.3;
  --bg-mask: hsl(222 47% 11% / var(--bg-mask-opacity));
  --bg-overlay: var(--bg-mask);
  --bg-card: rgba(30, 41, 59, 0.8);
  --bg-card-glass: rgba(30, 41, 59, 0.82);
  --bg-card-solid: rgba(30, 41, 59, 0.8);
  --bg-input: #1E293B;
  --bg-hover: rgba(255, 255, 255, 0.06);
  --bg-hover-strong: rgba(255, 255, 255, 0.10);
  --bg-card-transparent:rgba(51, 65, 85, 0.51);

  /* 边框 */
  --border-light: rgba(255, 255, 255, 0.08);
  --border-default: rgba(255, 255, 255, 0.12);
  --border-focus: var(--primary);

  /* 阴影 */
  --shadow-sm: 0 4px 6px -1px rgb(0 0 0 / 0.18), 0 2px 4px -2px rgb(0 0 0 / 0.14);
  --shadow-md: 0 10px 15px -3px rgb(0 0 0 / 0.2), 0 4px 6px -4px rgb(0 0 0 / 0.16);
  --shadow-lg: 0 20px 25px -5px rgb(0 0 0 / 0.22), 0 8px 10px -6px rgb(0 0 0 / 0.18);
  --shadow-primary: 0 10px 15px -3px rgb(59 130 246 / 0.25);
}

html[data-theme="dark"] {
  background-color: transparent;
  color: var(--text-primary);
}

html[data-theme="dark"] body {
  background-color: transparent;
  color: var(--text-primary);
}

html[data-theme="dark"] .background::before {
  background-color: transparent;
  background-image: none;
}

html[data-theme="dark"] .background::after {
  background-color: rgba(15, 23, 42, 0.5);
  background-image: none;
}

html[data-theme="dark"] .btn-secondary {
  background-color: var(--bg-card);
  color: var(--text-secondary);
}

html[data-theme="dark"] .btn-secondary:hover {
  background-color: var(--bg-input);
}

html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
  color: var(--text-primary);
  background-color: var(--bg-input);
  border-color: var(--border-default);
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
  color: var(--text-muted);
}

html[data-theme="dark"] ::selection {
  background: rgba(59, 130, 246, 0.35);
  color: #fff;
}

html[data-theme="dark"] ::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.05);
}

html[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.28);
}

/* 常见内容容器补强 */
html[data-theme="dark"] .card,
html[data-theme="dark"] .article-card,
html[data-theme="dark"] .comment-item,
html[data-theme="dark"] .message-card,
html[data-theme="dark"] .upload-form,
html[data-theme="dark"] .editor-preview-pane,
html[data-theme="dark"] .file-dropzone,
html[data-theme="dark"] .login-container {
  background-color: var(--bg-card);
  border-color: var(--border-default);
  color: var(--text-primary);
}

/* 文章内容区去除背景遮罩 */
html[data-theme="dark"] .article-wrapper,
html[data-theme="dark"] .article-body,
html[data-theme="dark"] .article-content,
html[data-theme="dark"] .markdown-content {
  background: transparent !important;
  border-color: transparent;
  color: var(--text-primary);
}

html[data-theme="dark"] .hljs,
html[data-theme="dark"] pre,
html[data-theme="dark"] code {
  background-color: var(--bg-input);
  color: var(--text-primary);
}

html[data-theme="dark"] blockquote {
  background: var(--primary-bg);
  border-left-color: var(--primary);
  color: var(--text-secondary);
}