/* =========================================================
 * theory/theory.css
 * 2026-10-25 新建：/theory/ 理论频道页样式
 * 风格对齐首页卡片（白底圆角、紫 accent），并适配暗黑模式
 * ========================================================= */

.th-channel {
  max-width: 980px;
  margin: 0 auto;
  padding: 24px 16px 80px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  color: #0f172a;
}

/* ---------- 顶部标题区 ---------- */
.th-hero {
  text-align: center;
  padding: 28px 16px 22px;
}
.th-hero h1 {
  font-size: 28px;
  margin: 0 0 10px;
  letter-spacing: .5px;
}
.th-hero p {
  margin: 0 auto;
  max-width: 620px;
  font-size: 15px;
  line-height: 1.7;
  color: #64748b;
}
.th-hero__stats {
  margin-top: 14px;
  font-size: 13px;
  color: #7c3aed;
}
.th-hero__stats b {
  font-size: 18px;
  margin: 0 2px;
}

/* ---------- 管理员操作入口（2026-11-02） ---------- */
.th-hero__ops {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 14px;
}
.th-btn-admin {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid rgba(124, 58, 237, .35);
  background: rgba(124, 58, 237, .08);
  color: #6d28d9;
  font-size: 13px;
  line-height: 1.5;
  text-decoration: none;
  transition: background .15s ease, border-color .15s ease;
}
.th-btn-admin:hover {
  background: rgba(124, 58, 237, .16);
  border-color: rgba(124, 58, 237, .55);
}
body.dark-mode .th-btn-admin {
  color: #c4b5fd;
  border-color: rgba(167, 139, 250, .4);
  background: rgba(124, 58, 237, .16);
}
body.dark-mode .th-btn-admin:hover {
  background: rgba(124, 58, 237, .3);
  border-color: rgba(167, 139, 250, .7);
}

/* ---------- 分组标题 ---------- */
.th-group-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 30px 0 12px;
  font-size: 18px;
  font-weight: 700;
}
.th-group-title::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #e2e8f0;
}
.th-group-title .th-group-count {
  font-size: 12px;
  font-weight: 400;
  color: #64748b;
  background: #f1f5f9;
  border-radius: 10px;
  padding: 2px 8px;
}

/* ---------- 精选卡（首页中部 A 区同款） ---------- */
.th-featured {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.th-feat-card {
  display: block;
  padding: 18px 18px 16px;
  background: linear-gradient(135deg, #ffffff 0%, #f5f3ff 100%);
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  text-decoration: none;
  color: #0f172a;
  transition: all .18s;
}
.th-feat-card:hover {
  transform: translateY(-2px);
  border-color: #7c3aed;
  box-shadow: 0 10px 24px rgba(124, 58, 237, .14);
}
.th-feat-card__icon {
  font-size: 26px;
}
.th-feat-card__name {
  display: block;
  margin: 8px 0 6px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.45;
}
.th-feat-card__summary {
  display: block;
  font-size: 13px;
  line-height: 1.65;
  color: #64748b;
}
.th-feat-card__foot {
  margin-top: 10px;
  font-size: 12px;
  color: #7c3aed;
}

/* ---------- 列表卡 ---------- */
.th-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
.th-item {
  display: block;
  padding: 13px 14px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  text-decoration: none;
  color: #0f172a;
  transition: all .15s;
}
.th-item:hover {
  border-color: #7c3aed;
  box-shadow: 0 6px 16px rgba(124, 58, 237, .10);
  transform: translateY(-1px);
}
.th-item__head {
  display: flex;
  align-items: center;
  gap: 8px;
}
.th-item__icon {
  font-size: 17px;
  line-height: 1;
  flex-shrink: 0;
}
.th-item__name {
  flex: 1;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.45;
  word-break: break-word;
}
.th-item__summary {
  margin: 6px 0 0;
  font-size: 12.5px;
  line-height: 1.6;
  color: #64748b;
}

/* ---------- 标签：阅读量 / 旧版 / 热门 ---------- */
.th-badge {
  display: inline-block;
  font-size: 11px;
  line-height: 1;
  padding: 3px 7px;
  border-radius: 9px;
  flex-shrink: 0;
  white-space: nowrap;
}
.th-badge--reads {
  color: #475569;
  background: #f1f5f9;
}
.th-badge--hot {
  color: #c2410c;
  background: #ffedd5;
}
.th-badge--legacy {
  color: #64748b;
  background: #f1f5f9;
  border: 1px dashed #cbd5e1;
}

/* ---------- 结构化理论工具入口 ---------- */
.th-tools__hint {
  margin: -4px 0 14px;
  font-size: 13px;
  line-height: 1.7;
  color: #64748b;
}
.th-tools__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.th-tool-card {
  display: block;
  padding: 16px 16px 14px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  text-decoration: none;
  color: #0f172a;
  transition: all .18s;
}
.th-tool-card:hover {
  border-color: #7c3aed;
  box-shadow: 0 8px 20px rgba(124, 58, 237, .12);
  transform: translateY(-1px);
}
.th-tool-card__icon {
  font-size: 22px;
  line-height: 1;
}
.th-tool-card__name {
  display: block;
  margin: 7px 0 5px;
  font-size: 15px;
  font-weight: 700;
}
.th-tool-card__summary {
  display: block;
  font-size: 12.5px;
  line-height: 1.65;
  color: #64748b;
}

/* ---------- 底部导流 ---------- */
.th-foot {
  margin: 36px 0 0;
  padding: 18px;
  text-align: center;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  font-size: 14px;
}
.th-foot a {
  color: #7c3aed;
  font-weight: 600;
  text-decoration: none;
}
.th-foot a:hover {
  text-decoration: underline;
}

/* ---------- 暗黑模式 ---------- */
body.dark-mode .th-channel { color: #e2e8f0; }
body.dark-mode .th-hero p { color: #94a3b8; }
body.dark-mode .th-group-title::after { background: #334155; }
body.dark-mode .th-group-title .th-group-count { color: #94a3b8; background: #1e293b; }
body.dark-mode .th-feat-card {
  background: linear-gradient(135deg, #1e293b 0%, #172033 100%);
  border-color: #334155;
  color: #e2e8f0;
}
body.dark-mode .th-feat-card:hover { border-color: #60a5fa; box-shadow: 0 10px 24px rgba(96, 165, 250, .16); }
body.dark-mode .th-feat-card__summary { color: #94a3b8; }
body.dark-mode .th-feat-card__foot { color: #60a5fa; }
body.dark-mode .th-item { background: #0f172a; border-color: #334155; color: #e2e8f0; }
body.dark-mode .th-item:hover { border-color: #60a5fa; box-shadow: 0 6px 16px rgba(96, 165, 250, .14); }
body.dark-mode .th-item__summary { color: #94a3b8; }
body.dark-mode .th-badge--reads { color: #94a3b8; background: #1e293b; }
body.dark-mode .th-badge--legacy { color: #94a3b8; background: #1e293b; border-color: #475569; }
body.dark-mode .th-foot { background: #1e293b; border-color: #334155; }
body.dark-mode .th-tools__hint { color: #94a3b8; }
body.dark-mode .th-tool-card { background: #0f172a; border-color: #334155; color: #e2e8f0; }
body.dark-mode .th-tool-card:hover { border-color: #60a5fa; box-shadow: 0 8px 20px rgba(96, 165, 250, .14); }
body.dark-mode .th-tool-card__summary { color: #94a3b8; }

/* ---------- 响应式 ---------- */
@media (max-width: 640px) {
  .th-featured, .th-list, .th-tools__grid { grid-template-columns: 1fr; }
  .th-hero h1 { font-size: 23px; }
}