/**
 * ChangoJournal 主题样式
 * 版本: 20260128_v2
 */

:root {
  --jg-transition: all 0.2s ease;
}

/* ===== 主题变量 ===== */
.mode-light .journal-guide-container,
.mode-light .search-page,
.mode-light .compare-page,
.mode-light .recommend-container,
.mode-light .detail-page,
.mode-light .rankings-page,
.mode-light .favorites-page,
.mode-light .tutorial-page,
.mode-light .tutorial-container {
  --jg-page-bg: #f3f6fb;
  --jg-text: #1f2937;
  --jg-text-strong: #111827;
  --jg-text-muted: #111827;
  --jg-card-bg: rgba(255, 255, 255, 0.95);
  --jg-card-strong-bg: rgba(248, 250, 252, 0.98);
  --jg-border: rgba(15, 23, 42, 0.08);
  --jg-header-bg: rgba(255, 255, 255, 0.9);
  --jg-header-border: rgba(15, 23, 42, 0.12);
  --jg-accent: #2563eb;
  --jg-accent-strong: #1d4ed8;
  --jg-accent-border: rgba(37, 99, 235, 0.35);
}

.mode-dark .journal-guide-container,
.mode-dark .search-page,
.mode-dark .compare-page,
.mode-dark .recommend-container,
.mode-dark .detail-page,
.mode-dark .rankings-page,
.mode-dark .favorites-page,
.mode-dark .tutorial-page,
.mode-dark .tutorial-container {
  --jg-page-bg: #0b0f16;
  --jg-text: #e5e7eb;
  --jg-text-strong: #f3f4f6;
  --jg-text-muted: #9ca3af;
  --jg-card-bg: rgba(17, 24, 39, 0.85);
  --jg-card-strong-bg: rgba(17, 24, 39, 0.95);
  --jg-border: rgba(255, 255, 255, 0.08);
  --jg-header-bg: rgba(8, 12, 20, 0.95);
  --jg-header-border: rgba(255, 255, 255, 0.08);
  --jg-accent: #22c55e;
  --jg-accent-strong: #16a34a;
  --jg-accent-border: rgba(34, 197, 94, 0.35);
}

.mode-scifi .journal-guide-container,
.mode-scifi .search-page,
.mode-scifi .compare-page,
.mode-scifi .recommend-container,
.mode-scifi .detail-page,
.mode-scifi .rankings-page,
.mode-scifi .favorites-page,
.mode-scifi .tutorial-page,
.mode-scifi .tutorial-container {
  --jg-page-bg: linear-gradient(135deg, #0a1929 0%, #001e3c 50%, #0a1929 100%);
  --jg-text: #e2f8ff;
  --jg-text-strong: #e2f8ff;
  --jg-text-muted: rgba(226, 248, 255, 0.65);
  --jg-card-bg: rgba(10, 25, 41, 0.7);
  --jg-card-strong-bg: rgba(8, 20, 35, 0.85);
  --jg-border: rgba(0, 243, 255, 0.25);
  --jg-header-bg: rgba(3, 16, 30, 0.95);
  --jg-header-border: rgba(0, 243, 255, 0.25);
  --jg-accent: #00f3ff;
  --jg-accent-strong: #00c7d1;
  --jg-accent-border: rgba(0, 243, 255, 0.35);
}

/* ===== 页面与文本 ===== */
.journal-guide-container,
.search-page,
.compare-page,
.recommend-container,
.detail-page,
.rankings-page,
.favorites-page,
.tutorial-page,
.tutorial-container {
  background: var(--jg-page-bg, linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0f172a 100%));
  color: var(--jg-text, #e2e8f0);
}

.journal-guide-container a,
.search-page a,
.compare-page a,
.recommend-container a,
.detail-page a,
.rankings-page a,
.favorites-page a,
.tutorial-page a,
.tutorial-container a {
  color: inherit;
}

.jg-text-strong {
  color: var(--jg-text-strong, #1f2937);
}

.jg-text-muted {
  color: var(--jg-text-muted, #94a3b8);
}

.jg-logo-text span,
.search-hint,
.journal-meta,
.results-count,
.rankings-table td,
.favorites-count,
.tutorial-hero p {
  color: var(--jg-text-muted, #94a3b8);
}

/* ===== 顶部导航/标题栏 ===== */
.jg-header,
.search-header,
.compare-header,
.detail-header,
.rankings-header,
.favorites-header,
.tutorial-header,
.recommend-header {
  background: var(--jg-header-bg, rgba(15, 23, 42, 0.95));
  border-bottom: 1px solid var(--jg-header-border, rgba(255, 255, 255, 0.1));
}

/* ===== 主题切换按钮 ===== */
.jg-mode-toggle {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid var(--jg-border, rgba(255, 255, 255, 0.15));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: var(--jg-transition);
  color: var(--jg-text-muted, #94a3b8);
}

.jg-mode-toggle:hover {
  background: rgba(255, 255, 255, 0.2);
  color: var(--jg-accent, #10b981);
  transform: rotate(180deg);
}

/* ===== 卡片与容器 ===== */
.jg-stat-card,
.jg-feature-card,
.search-box,
.journal-card,
.analysis-card,
.recommend-card,
.compare-empty,
.hero-stat-card,
.info-card,
.partition-card,
.related-card,
.favorites-page .journal-card,
.tutorial-card,
.tutorial-content,
.learning-path,
.rankings-table {
  background: var(--jg-card-bg, rgba(255, 255, 255, 0.03));
  border-color: var(--jg-border, rgba(255, 255, 255, 0.1));
}

.rankings-table th {
  background: var(--jg-card-strong-bg, rgba(16, 185, 129, 0.1));
}

.jg-stat-label,
.journal-title,
.analysis-card h3,
.recommend-card-title,
.info-card-title,
.partition-name,
.related-card-title,
.tutorial-card-title,
.rankings-title {
  color: var(--jg-text, #e2e8f0);
}

.jg-stat-card:hover,
.journal-card:hover,
.tutorial-card:hover,
.recommend-card:hover,
.related-card:hover {
  border-color: var(--jg-accent-border, rgba(16, 185, 129, 0.3));
}

/* ===== 表单控件 ===== */
.search-input,
.filter-group select {
  background: var(--jg-card-strong-bg, rgba(255, 255, 255, 0.05));
  color: var(--jg-text, #e2e8f0);
  border-color: var(--jg-border, rgba(255, 255, 255, 0.1));
}

.search-input::placeholder {
  color: var(--jg-text-muted, #94a3b8);
}

/* ===== 轻量化互斥效果 ===== */
.mode-light .search-btn {
  background: linear-gradient(135deg, var(--jg-accent, #2563eb), var(--jg-accent-strong, #1d4ed8));
}

.mode-light .rankings-table tr:hover,
.mode-light .journal-card:hover {
  background: rgba(37, 99, 235, 0.06);
}

/* ===== 白天主题文字修订 ===== */
.mode-light .jg-nav-btn,
.mode-light .jg-user-btn,
.mode-light .jg-dropdown-item,
.mode-light .search-hint,
.mode-light .results-count,
.mode-light .journal-meta,
.mode-light .journal-title,
.mode-light .filter-group label,
.mode-light .rankings-tab,
.mode-light .page-btn,
.mode-light .loading,
.mode-light .compare-float-close,
.mode-light .compare-float-item-title,
.mode-light .compare-float-btn.secondary,
.mode-light .journal-action-btn.secondary,
.mode-light .journal-action-btn.favorite,
.mode-light .requirement-desc,
.mode-light .analysis-card h3,
.mode-light .recommend-card-subtitle,
.mode-light .tutorial-hero p {
  color: var(--jg-text-strong, #111827);
}

.mode-light .compare-empty h2,
.mode-light .compare-empty p,
.mode-light .compare-empty-icon,
.mode-light .faq-q,
.mode-light .faq-a,
.mode-light .favorites-nav-btn,
.mode-light .favorites-count,
.mode-light .empty-state h3,
.mode-light .empty-state p,
.mode-light .empty-state i,
.mode-light .journal-meta-item i,
.mode-light .journal-meta-item span,
.mode-light .tutorial-content p,
.mode-light .tutorial-content li,
.mode-light .glossary-def,
.mode-light .path-arrow,
.mode-light .tutorial-card-meta,
.mode-light .tutorial-footer,
.mode-light .rankings-table td,
.mode-light .compare-table td,
.mode-light .compare-table th {
  color: var(--jg-text-strong, #111827);
}

.mode-light .rankings-tab.active,
.mode-light .page-btn.active,
.mode-light .rankings-tab:hover,
.mode-light .page-btn:hover,
.mode-light .journal-action-btn.primary,
.mode-light .compare-float-btn.primary {
  color: #ffffff;
}