/* lianyanshe 全站风格适配器
   作用：把各子站原本独立的主题色/组件强制对齐到 lianyanshe.css 共享设计系统，
   同时尽量保留各页原有布局与交互功能。
   加载顺序：在 lianyanshe.css 之后、页面自定义样式之后引入。

   注意：禁止对同名 CSS 变量做自引用（如 --bg-secondary: var(--bg-secondary)），
   否则会在计算时失效，暗色模式下文字/背景会崩坏。 */

/* ─────────────── 1. 仅映射「别名」变量（不覆盖同名 token） ─────────────── */
:root,
html[data-theme="light"],
html[data-theme="dark"] {
  --bg: var(--bg-primary);
  --bg-elev: var(--bg-card);
  --bg-soft: var(--bg-secondary);
  --bg-1: var(--bg-primary);
  --bg-2: var(--bg-secondary);
  --bg-3: var(--bg-tertiary);
  --bg-0: var(--bg-primary);
  --bg-card-hover: var(--bg-hover);
  --paper: var(--bg-primary);
  --paper-2: var(--bg-secondary);
  --text: var(--text-primary);
  --text-soft: var(--text-secondary);
  --text-mute: var(--text-muted);
  --text-faint: var(--text-muted);
  --text-dim: var(--text-muted);
  --text-1: var(--text-primary);
  --text-2: var(--text-secondary);
  --text-3: var(--text-muted);
  --border-local: var(--border);
  --border-strong: var(--border);
  --rule: var(--border);
  --rule-soft: var(--border-light);
  --accent-local: var(--accent);
  --link: var(--accent);
  --code-bg: var(--bg-secondary);
  --pre-bg: var(--bg-tertiary);
  --table-head-bg: var(--bg-secondary);
  --table-row-alt: rgba(184,118,58,0.025);
  --table-border: var(--border-light);
  --shadow-card: var(--shadow-sm);
  --shadow-card-hover: var(--shadow-md);
  --shadow-1: var(--shadow-sm);
  --shadow-2: var(--shadow-md);
  --neutral: var(--text-muted);
  --copper: var(--accent);
  --amber: var(--accent-hi);
  --amber-deep: var(--accent-2);
  --amber-bright: var(--accent-hi);
}

/* 兜底：页面根色对齐共享系统 */
html, body {
  background: var(--bg-primary) !important;
  color: var(--text-primary) !important;
  font-family: var(--sans) !important;
}

/* ─────────────── 2. 覆盖 Tailwind 通用颜色类 ─────────────── */
[class*="bg-white"],
[class*="bg-slate-50"],
[class*="bg-zinc-50"],
[class*="bg-gray-50"],
[class*="bg-neutral-50"],
[class*="bg-stone-50"] {
  background-color: var(--bg-card) !important;
}

[class*="bg-slate-100"],
[class*="bg-zinc-100"],
[class*="bg-gray-100"],
[class*="bg-neutral-100"],
[class*="bg-stone-100"],
[class*="bg-slate-200"],
[class*="bg-zinc-200"],
[class*="bg-gray-200"],
[class*="bg-neutral-200"] {
  background-color: var(--bg-secondary) !important;
}

[class*="bg-slate-900"],
[class*="bg-zinc-900"],
[class*="bg-gray-900"],
[class*="bg-neutral-900"],
[class*="bg-slate-800"],
[class*="bg-zinc-800"],
[class*="bg-gray-800"],
[class*="bg-neutral-800"] {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
}

/* 文字色 */
[class*="text-slate-900"],
[class*="text-zinc-900"],
[class*="text-gray-900"],
[class*="text-neutral-900"],
[class*="text-stone-900"],
[class*="text-slate-800"],
[class*="text-zinc-800"],
[class*="text-gray-800"],
[class*="text-neutral-800"],
[class*="text-black"] {
  color: var(--text-primary) !important;
}

[class*="text-slate-700"],
[class*="text-zinc-700"],
[class*="text-gray-700"],
[class*="text-neutral-700"],
[class*="text-stone-700"],
[class*="text-slate-600"],
[class*="text-zinc-600"],
[class*="text-gray-600"],
[class*="text-neutral-600"],
[class*="text-stone-600"] {
  color: var(--text-secondary) !important;
}

[class*="text-slate-500"],
[class*="text-zinc-500"],
[class*="text-gray-500"],
[class*="text-neutral-500"],
[class*="text-stone-500"],
[class*="text-slate-400"],
[class*="text-zinc-400"],
[class*="text-gray-400"],
[class*="text-neutral-400"] {
  color: var(--text-muted) !important;
}

/* 边框 */
[class*="border-slate-"],
[class*="border-zinc-"],
[class*="border-gray-"],
[class*="border-neutral-"],
[class*="border-stone-"],
[class*="border-white"],
[class*="border-black"] {
  border-color: var(--border) !important;
}

/* 阴影 */
[class*="shadow-sm"] { box-shadow: var(--shadow-sm) !important; }
[class*="shadow-md"] { box-shadow: var(--shadow-md) !important; }
[class*="shadow-lg"],
[class*="shadow-xl"],
[class*="shadow-2xl"] { box-shadow: var(--shadow-lg) !important; }

/* ─────────────── 3. 常见页面组件 ─────────────── */
.card,
.lesson-card,
.path-card,
.tool-card,
.report-card,
.strategy-card,
.chapter-card,
.course-card,
.module-card {
  background: var(--bg-card) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-lg) !important;
  color: var(--text-primary) !important;
  box-shadow: var(--shadow-sm) !important;
}
.card:hover,
.lesson-card:hover,
.path-card:hover,
.tool-card:hover {
  box-shadow: var(--shadow-md) !important;
  border-color: var(--accent) !important;
}

button,
[role="button"],
.btn,
.button,
.theme-toggle {
  font-family: var(--sans) !important;
}

.theme-toggle {
  background: var(--bg-card) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-secondary) !important;
  border-radius: var(--radius-full) !important;
}
.theme-toggle:hover {
  border-color: var(--accent) !important;
  color: var(--accent) !important;
}

input,
textarea,
select {
  background: var(--bg-card) !important;
  color: var(--text-primary) !important;
  border-color: var(--border) !important;
}
input:focus,
textarea:focus,
select:focus {
  border-color: var(--accent) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(184,118,58,0.15) !important;
}

pre,
code,
.code-block {
  background: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border) !important;
}
blockquote {
  border-left: 4px solid var(--accent) !important;
  background: linear-gradient(90deg, rgba(184,118,58,0.06) 0%, rgba(184,118,58,0.02) 100%) !important;
  color: var(--text-secondary) !important;
}
table,
.data-table,
.prose-table {
  background: var(--bg-card) !important;
  border-color: var(--border) !important;
}
th,
.data-table th,
.prose-table th {
  background: var(--bg-secondary) !important;
  color: var(--accent) !important;
  border-bottom-color: var(--accent) !important;
}
td,
.data-table td,
.prose-table td {
  color: var(--text-secondary) !important;
  border-color: var(--border-light) !important;
}

/* ─────────────── 4. 正文 / prose ─────────────── */
.prose-cn,
.prose,
.prose-turtle,
.article-body,
.content-body,
.tutorial-content,
.lesson-content,
.lesson-view {
  color: var(--text-secondary) !important;
  line-height: 1.85 !important;
}
.prose-cn h1, .prose-cn h2, .prose-cn h3, .prose-cn h4,
.prose h1, .prose h2, .prose h3, .prose h4,
.prose-turtle h1, .prose-turtle h2, .prose-turtle h3, .prose-turtle h4,
.article-body h1, .article-body h2, .article-body h3, .article-body h4,
.tutorial-content h1, .tutorial-content h2, .tutorial-content h3, .tutorial-content h4,
.lesson-content h1, .lesson-content h2, .lesson-content h3, .lesson-content h4 {
  color: var(--text-primary) !important;
  font-family: var(--serif) !important;
}
.prose-cn strong, .prose strong, .article-body strong,
.tutorial-content strong, .lesson-content strong {
  color: var(--text-primary) !important;
}
.prose-cn a, .prose a, .article-body a,
.tutorial-content a, .lesson-content a {
  color: var(--accent) !important;
  text-decoration-color: rgba(184,118,58,0.3) !important;
}
.prose-cn code, .prose code, .article-body code {
  color: var(--accent) !important;
  background: var(--bg-secondary) !important;
}

/* ─────────────── 5. 顶栏 / 导航 ─────────────── */
header,
.topnav,
.navbar,
.top-nav,
.site-header {
  background: var(--bg-secondary) !important;
  border-color: var(--border) !important;
  color: var(--text-primary) !important;
}
header a,
.topnav a,
.navbar a,
.top-nav a,
.site-header a {
  color: var(--text-secondary) !important;
}
header a:hover,
.topnav a:hover,
.navbar a:hover {
  color: var(--accent) !important;
}

/* ─────────────── 6. portal 顶栏保护 ─────────────── */
[data-portal-host] {
  background: var(--bg-secondary) !important;
  border-bottom-color: var(--border) !important;
  color: var(--text-secondary) !important;
  box-shadow: var(--shadow-sm) !important;
}
[data-portal-host] .pb-home { color: var(--text-primary) !important; }
[data-portal-host] .pb-name { color: var(--text-secondary) !important; }
[data-portal-host] .pb-back {
  color: var(--accent-2) !important;
  background: var(--bg-primary) !important;
  border-color: var(--border) !important;
}
[data-portal-host] .pb-back:hover {
  background: var(--accent) !important;
  color: #fff !important;
  border-color: var(--accent) !important;
}
[data-portal-host] .pb-theme {
  background: var(--bg-primary) !important;
  border-color: var(--border) !important;
  color: var(--accent-2) !important;
}

/* ─────────────── 7. 暗色模式：强制可读 ─────────────── */
html[data-theme="dark"] {
  color-scheme: dark;
}

html[data-theme="dark"] body,
html[data-theme="dark"] main,
html[data-theme="dark"] .main,
html[data-theme="dark"] .content,
html[data-theme="dark"] .app,
html[data-theme="dark"] #app,
html[data-theme="dark"] #main-content,
html[data-theme="dark"] .lesson-view,
html[data-theme="dark"] .lesson-content,
html[data-theme="dark"] .prose-turtle,
html[data-theme="dark"] .prose-cn,
html[data-theme="dark"] .prose,
html[data-theme="dark"] .article-body,
html[data-theme="dark"] .content-body,
html[data-theme="dark"] .tutorial-content,
html[data-theme="dark"] .sidebar,
html[data-theme="dark"] aside {
  color: var(--text-primary) !important;
}

html[data-theme="dark"] body,
html[data-theme="dark"] .app,
html[data-theme="dark"] #app,
html[data-theme="dark"] main {
  background-color: var(--bg-primary) !important;
}

html[data-theme="dark"] .sidebar,
html[data-theme="dark"] aside {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border) !important;
}

/* 标题与正文 */
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6,
html[data-theme="dark"] .page-title,
html[data-theme="dark"] .page-hook,
html[data-theme="dark"] .page-summary,
html[data-theme="dark"] .page-eyebrow,
html[data-theme="dark"] .case-title,
html[data-theme="dark"] .brand-text h1,
html[data-theme="dark"] .brand-text p {
  color: var(--text-primary) !important;
}

html[data-theme="dark"] p,
html[data-theme="dark"] li,
html[data-theme="dark"] dd,
html[data-theme="dark"] td,
html[data-theme="dark"] label,
html[data-theme="dark"] .desc,
html[data-theme="dark"] .summary,
html[data-theme="dark"] .quiz-opt-text,
html[data-theme="dark"] .opt-text,
html[data-theme="dark"] .nav-item,
html[data-theme="dark"] .chapter-nav-btn {
  color: var(--text-secondary) !important;
}

html[data-theme="dark"] .lesson-content h1,
html[data-theme="dark"] .lesson-content h2,
html[data-theme="dark"] .lesson-content h3,
html[data-theme="dark"] .lesson-content h4,
html[data-theme="dark"] .lesson-content strong,
html[data-theme="dark"] .prose-turtle h1,
html[data-theme="dark"] .prose-turtle h2,
html[data-theme="dark"] .prose-turtle h3,
html[data-theme="dark"] .prose-turtle h4,
html[data-theme="dark"] .tutorial-content h1,
html[data-theme="dark"] .tutorial-content h2,
html[data-theme="dark"] .tutorial-content h3,
html[data-theme="dark"] .tutorial-content h4 {
  color: var(--text-primary) !important;
}

html[data-theme="dark"] .lesson-content p,
html[data-theme="dark"] .lesson-content li,
html[data-theme="dark"] .tutorial-content p,
html[data-theme="dark"] .tutorial-content li {
  color: var(--text-secondary) !important;
}

/* Tailwind 固定浅色在暗色下强制反转 */
html[data-theme="dark"] [class*="bg-white"],
html[data-theme="dark"] [class*="bg-gray-50"],
html[data-theme="dark"] [class*="bg-slate-50"],
html[data-theme="dark"] [class*="bg-zinc-50"],
html[data-theme="dark"] [class*="bg-neutral-50"],
html[data-theme="dark"] [class*="bg-stone-50"] {
  background-color: var(--bg-card) !important;
  color: var(--text-primary) !important;
}

html[data-theme="dark"] [class*="bg-gray-100"],
html[data-theme="dark"] [class*="bg-slate-100"],
html[data-theme="dark"] [class*="bg-zinc-100"],
html[data-theme="dark"] [class*="bg-neutral-100"],
html[data-theme="dark"] [class*="bg-stone-100"],
html[data-theme="dark"] [class*="bg-gray-200"],
html[data-theme="dark"] [class*="bg-slate-200"] {
  background-color: var(--bg-secondary) !important;
}

html[data-theme="dark"] [class*="text-gray-900"],
html[data-theme="dark"] [class*="text-slate-900"],
html[data-theme="dark"] [class*="text-zinc-900"],
html[data-theme="dark"] [class*="text-neutral-900"],
html[data-theme="dark"] [class*="text-stone-900"],
html[data-theme="dark"] [class*="text-gray-800"],
html[data-theme="dark"] [class*="text-slate-800"],
html[data-theme="dark"] [class*="text-zinc-800"],
html[data-theme="dark"] [class*="text-black"] {
  color: var(--text-primary) !important;
}

html[data-theme="dark"] [class*="text-gray-700"],
html[data-theme="dark"] [class*="text-slate-700"],
html[data-theme="dark"] [class*="text-zinc-700"],
html[data-theme="dark"] [class*="text-stone-700"],
html[data-theme="dark"] [class*="text-gray-600"],
html[data-theme="dark"] [class*="text-slate-600"],
html[data-theme="dark"] [class*="text-zinc-600"] {
  color: var(--text-secondary) !important;
}

html[data-theme="dark"] [class*="text-gray-500"],
html[data-theme="dark"] [class*="text-slate-500"],
html[data-theme="dark"] [class*="text-zinc-500"],
html[data-theme="dark"] [class*="text-gray-400"],
html[data-theme="dark"] [class*="text-slate-400"] {
  color: var(--text-muted) !important;
}

html[data-theme="dark"] [class*="border-gray-"],
html[data-theme="dark"] [class*="border-slate-"],
html[data-theme="dark"] [class*="border-zinc-"],
html[data-theme="dark"] [class*="border-neutral-"],
html[data-theme="dark"] [class*="border-stone-"] {
  border-color: var(--border) !important;
}

/* 卡片组件暗色描边；nav-item / chapter-nav-btn 是侧栏导航，不要当卡片画框 */
html[data-theme="dark"] .lesson-card,
html[data-theme="dark"] .module-card,
html[data-theme="dark"] .card,
html[data-theme="dark"] .path-card,
html[data-theme="dark"] .tool-card {
  background: var(--bg-card) !important;
  color: var(--text-primary) !important;
  border-color: var(--border) !important;
}

/* 海龟等页硬编码按钮 */
html[data-theme="dark"] .btn-secondary {
  background: var(--bg-card) !important;
  color: var(--text-secondary) !important;
  border-color: var(--border) !important;
}
html[data-theme="dark"] .btn-ghost {
  background: transparent !important;
  color: var(--text-muted) !important;
}
html[data-theme="dark"] .btn-ghost:hover {
  background: var(--bg-hover) !important;
  color: var(--text-primary) !important;
}

/* 渐变标题徽章：暗色下保持高对比 */
html[data-theme="dark"] .tutorial-content h2.md-h1 {
  color: #1a1610 !important;
}

/* 侧栏激活态 */
html[data-theme="dark"] .nav-item.active,
html[data-theme="dark"] .chapter-nav-btn.active {
  background: rgba(212, 168, 87, 0.12) !important;
  color: var(--accent) !important;
}
html[data-theme="dark"] .nav-item:not(.active):hover,
html[data-theme="dark"] .chapter-nav-btn:not(.active):hover {
  background: var(--bg-hover) !important;
}

/* 滚动条（暗色） */
html[data-theme="dark"] .scroll-area::-webkit-scrollbar-thumb,
html[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: #4a3e2d !important;
}
html[data-theme="dark"] .scroll-area::-webkit-scrollbar-thumb:hover {
  background: #6a5a40 !important;
}

/* 常见「白底卡片」兜底 */
html[data-theme="dark"] .bg-white,
html[data-theme="dark"] [style*="background:#fff"],
html[data-theme="dark"] [style*="background: #fff"],
html[data-theme="dark"] [style*="background:#ffffff"],
html[data-theme="dark"] [style*="background: #ffffff"],
html[data-theme="dark"] [style*="background-color:#fff"],
html[data-theme="dark"] [style*="background-color: #fff"] {
  background: var(--bg-card) !important;
  color: var(--text-primary) !important;
}

/* 阅读区与进度条 */
html[data-theme="dark"] .read-progress,
html[data-theme="dark"] #top-progress {
  background: var(--accent) !important;
}
html[data-theme="dark"] .home-progress,
html[data-theme="dark"] .progress-track {
  background: var(--bg-tertiary) !important;
}

/* 覆盖子页打印样式误伤暗色：不在屏幕上强制黑字 */
@media screen {
  html[data-theme="dark"] .tutorial-content p,
  html[data-theme="dark"] .tutorial-content li {
    color: var(--text-secondary) !important;
  }
  html[data-theme="dark"] .page-title,
  html[data-theme="dark"] .page-eyebrow,
  html[data-theme="dark"] .page-hook,
  html[data-theme="dark"] .page-summary {
    color: var(--text-primary) !important;
  }
}

/* 海龟交易等页：测验选项硬编码浅蓝 */
html[data-theme="dark"] .quiz-option:has(input:checked) {
  background-color: rgba(59, 130, 246, 0.15) !important;
  border-color: #60a5fa !important;
}
html[data-theme="dark"] .quiz-option:has(input:checked) .opt-letter {
  background-color: #3b82f6 !important;
  color: #fff !important;
  border-color: #3b82f6 !important;
}
html[data-theme="dark"] .quiz-option:has(input:checked) .opt-text {
  color: #dbeafe !important;
}

/* 硬编码白底按钮（海龟 .btn-secondary 等） */
html[data-theme="dark"] .btn-primary {
  color: #fff !important;
}
html[data-theme="dark"] .btn-done,
html[data-theme="dark"] .btn-emerald-outline {
  background: rgba(16, 185, 129, 0.12) !important;
  color: #6ee7b7 !important;
  border-color: rgba(16, 185, 129, 0.35) !important;
}

/* 通用：任意浅色固定色字在暗色下提亮 */
html[data-theme="dark"] .text-gray-900,
html[data-theme="dark"] .text-gray-800,
html[data-theme="dark"] .text-gray-700,
html[data-theme="dark"] .text-slate-900,
html[data-theme="dark"] .text-slate-800 {
  color: var(--text-primary) !important;
}
html[data-theme="dark"] .bg-white\/90,
html[data-theme="dark"] .bg-white\/80,
html[data-theme="dark"] [class*="bg-white/"] {
  background-color: color-mix(in srgb, var(--bg-secondary) 92%, transparent) !important;
}

/* 加密期权/美股期权：侧栏与主区保证对比度 */
html[data-theme="dark"] .brand,
html[data-theme="dark"] .brand-text,
html[data-theme="dark"] .search-box input,
html[data-theme="dark"] .nav-section-title,
html[data-theme="dark"] .chapter-title,
html[data-theme="dark"] .tool-card,
html[data-theme="dark"] .path-card,
html[data-theme="dark"] .home-hero,
html[data-theme="dark"] .reading-tools {
  color: var(--text-primary) !important;
}
html[data-theme="dark"] .sidebar .nav-item span,
html[data-theme="dark"] .sidebar a {
  color: inherit;
}

/* 主内容区背景不要残留浅色 */
html[data-theme="dark"] .content-area,
html[data-theme="dark"] .main-content,
html[data-theme="dark"] .lesson-main,
html[data-theme="dark"] .page-content {
  background: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}

/* 强制子页跟随 data-theme：覆盖 Tailwind CDN 未映射的工具类 */
html[data-theme="dark"] body.bg-gray-50,
html[data-theme="dark"] body.bg-white,
html[data-theme="dark"] body[class*="bg-gray"],
html[data-theme="dark"] body[class*="bg-slate"] {
  background-color: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}

html[data-theme="dark"] .bg-white\/90,
html[data-theme="dark"] .backdrop-blur {
  background-color: color-mix(in srgb, var(--bg-secondary) 90%, transparent) !important;
}

/* 门户顶栏暗色对比 */
html[data-theme="dark"] [data-portal-host] {
  background: var(--bg-secondary) !important;
  border-bottom-color: var(--border) !important;
  color: var(--text-secondary) !important;
}