/* ============================================================
   ZAI 论坛三页（首页 / 版块 / 帖子）共用主题
   颜色统一消费 zai-base.css 的 --zai-* 变量，
   同时适配 coral / violet 双主题（<html data-theme> 驱动）。
   ============================================================ */

.zai-forum-home{ font-family:var(--zai-font); color:var(--zai-text); background:var(--zai-bg); }

/* ---------- 统一导航（与 partner 页一致） ---------- */
.zai-nav{position:sticky;top:0;z-index:100;height:56px;background:var(--zai-nav-bg);backdrop-filter:blur(12px);border-bottom:1px solid var(--zai-border);display:flex;align-items:center;padding:0 24px;gap:32px;flex-shrink:0}
.zai-nav a.zai-logo{text-decoration:none}
.zai-logo{font-size:18px;font-weight:700;color:var(--zai-primary);display:flex;align-items:center;gap:8px}
.zai-logo-dot{width:24px;height:24px;border-radius:7px;background:var(--zai-grad);display:flex;align-items:center;justify-content:center;color:var(--zai-on-grad);font-size:13px;font-weight:700}
.zai-nav-links{display:flex;gap:26px}
.zai-nav-links a{color:var(--zai-text-mid);text-decoration:none;font-size:14px;font-weight:500}
.zai-nav-links a.on{color:var(--zai-primary);font-weight:600}
.zai-nav-right{margin-left:auto;display:flex;align-items:center;gap:14px}
.zai-switch{display:flex;background:var(--zai-surface-sunken);border-radius:999px;padding:3px;gap:2px}
.zai-switch button{border:0;background:transparent;padding:5px 12px;border-radius:999px;font-size:12px;cursor:pointer;color:var(--zai-text-mid);font-family:inherit}
.zai-switch button.on{background:var(--zai-primary);color:var(--zai-on-primary);font-weight:600}
.zai-nav-user{width:32px;height:32px;border-radius:50%;background:var(--zai-grad-rev);color:var(--zai-on-grad);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none}
.zai-nav-out{margin-left:2px;color:var(--zai-text-mid);text-decoration:none;font-size:13px;font-weight:500;transition:color .18s}
.zai-nav-out:hover{color:var(--zai-primary)}

/* ---------- 隐藏 Discuz 默认页脚（论坛页用自己的页脚） ---------- */
.pg_index #ft, .pg_index #frt, .pg_index #flk,
.pg_forumdisplay #ft, .pg_forumdisplay #frt, .pg_forumdisplay #flk,
.pg_viewthread #ft, .pg_viewthread #frt, .pg_viewthread #flk{ display:none !important; }

/* ---------- 首屏（比门户更紧凑） ---------- */
.zai-hero-sm{ padding:64px 0 48px; }
.zai-hero-sm .zai-hero-inner{ max-width:980px; }
.zai-hero-sm h1{ font-size:40px; line-height:1.25; margin:18px 0 14px; }
.zai-hero-sm .zai-hero-sub{ font-size:16px; max-width:980px; }

/* ---------- 版块快捷入口 ---------- */
.zai-forum-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px; }
.zai-forum-card{
  display:flex; align-items:center; gap:14px;
  padding:18px 20px; border-radius:var(--zai-radius);
  background:var(--zai-surface); border:1px solid var(--zai-border);
  box-shadow:var(--zai-shadow-s); text-decoration:none; color:inherit;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.zai-forum-card:hover{ transform:translateY(-3px); box-shadow:var(--zai-shadow-m); border-color:var(--zai-primary); }
.zai-fc-icon{
  flex:0 0 auto; width:46px; height:46px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:18px; color:var(--zai-on-grad);
  background:var(--zai-grad);
}
.zai-fc-body{ flex:1 1 auto; min-width:0; }
.zai-fc-body h4{ margin:0 0 4px; font-size:16px; font-weight:600; color:var(--zai-text); }
.zai-fc-body p{ margin:0 0 6px; font-size:13px; color:var(--zai-text-mid); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.zai-fc-meta{ font-size:12px; color:var(--zai-text-light); }
.zai-fc-arrow{ flex:0 0 auto; color:var(--zai-text-light); font-size:18px; transition:transform .16s ease, color .16s ease; }
.zai-forum-card:hover .zai-fc-arrow{ transform:translateX(4px); color:var(--zai-primary); }

/* ---------- 两栏布局 ---------- */
/* 轨道用 minmax(0,1fr) 并给子项 min-width:0：
   否则内部 white-space:nowrap 的文本（帖子标题/热帖标题）会把 min-content
   撑到 500px+，在窄屏把整页顶宽（横向溢出）。 */
.zai-home-2col{ display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:28px; align-items:start; }
.zai-col-main{ min-width:0; }
.zai-col-main .zai-section-head{ margin-bottom:18px; }
.zai-col-side{ display:flex; flex-direction:column; gap:20px; position:sticky; top:84px; min-width:0; }

/* ---------- 信息流 ---------- */
.zai-feed{
  display:flex; align-items:center; gap:14px; padding:16px 18px;
  background:var(--zai-surface); border:1px solid var(--zai-border); border-radius:var(--zai-radius);
  text-decoration:none; color:inherit; margin-bottom:12px; transition:border-color .16s ease, box-shadow .16s ease;
}
.zai-feed:hover{ border-color:var(--zai-primary); box-shadow:var(--zai-shadow-s); }
.zai-feed-av{
  flex:0 0 auto; width:40px; height:40px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-weight:700; color:var(--zai-on-grad);
  background:var(--zai-grad-rev); font-size:16px;
}
.zai-feed-body{ flex:1 1 auto; min-width:0; }
.zai-feed-title{ margin:0 0 6px; font-size:15px; font-weight:600; color:var(--zai-text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.zai-feed:hover .zai-feed-title{ color:var(--zai-primary); }
.zai-feed-meta{ display:flex; gap:10px; font-size:12px; color:var(--zai-text-light); flex-wrap:wrap; }
.zai-feed-fname{ color:var(--zai-primary); font-weight:600; }
.zai-feed-stats{ flex:0 0 auto; display:flex; gap:12px; font-size:12px; color:var(--zai-text-mid); }
.zai-empty{ padding:40px; text-align:center; color:var(--zai-text-mid); background:var(--zai-surface); border-radius:var(--zai-radius); border:1px dashed var(--zai-border); }
.zai-empty a{ color:var(--zai-primary); font-weight:600; }
.zai-col-more{ margin-top:8px; }

/* ---------- 侧栏卡片 ---------- */
.zai-side-card{ background:var(--zai-surface); border:1px solid var(--zai-border); border-radius:var(--zai-radius); padding:18px 20px; box-shadow:var(--zai-shadow-s); }
.zai-side-title{ margin:0 0 14px; font-size:15px; font-weight:700; color:var(--zai-text); }
.zai-hotlist{ list-style:none; margin:0; padding:0; counter-reset:hot; }
.zai-hotlist li{ display:flex; align-items:center; gap:10px; padding:9px 0; border-bottom:1px dashed var(--zai-border); }
.zai-hotlist li:last-child{ border-bottom:none; }
.zai-hot-num{ flex:0 0 auto; width:22px; height:22px; border-radius:6px; background:var(--zai-surface-sunken); color:var(--zai-text-light); font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.zai-hotlist li.top .zai-hot-num{ background:var(--zai-primary); color:var(--zai-on-primary); }
.zai-hotlist a{ flex:1 1 auto; min-width:0; font-size:14px; color:var(--zai-text); text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.zai-hotlist a:hover{ color:var(--zai-primary); }
.zai-stats-mini{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; text-align:center; }
.zai-stats-mini b{ display:block; font-size:20px; font-weight:800; color:var(--zai-primary); }
.zai-stats-mini span{ font-size:12px; color:var(--zai-text-light); }
.zai-cta-card p{ margin:0 0 14px; font-size:14px; color:var(--zai-text-mid); line-height:1.6; }
.zai-cta-card .zai-btn{ width:100%; text-align:center; }

/* ---------- 版块列表页 forumdisplay ---------- */
.zai-forum-page{ font-family:var(--zai-font); color:var(--zai-text); background:var(--zai-bg); }

/* 版块头卡 */
.zai-fd-hero{ padding:40px 0 28px; background:linear-gradient(180deg,var(--zai-bg-muted),var(--zai-bg)); }
.zai-fd-hero-inner{ max-width:1040px; }
.zai-back{ display:inline-block; margin-bottom:14px; font-size:13px; color:var(--zai-text-mid); text-decoration:none; transition:color .15s; }
.zai-back:hover{ color:var(--zai-primary); }
.zai-fd-hero-row{ display:flex; align-items:center; gap:20px; }
.zai-fd-icon{ flex:0 0 auto; width:64px; height:64px; border-radius:18px; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:28px; color:var(--zai-on-grad); background:var(--zai-grad); box-shadow:var(--zai-shadow-m); }
.zai-fd-hero-main{ flex:1 1 auto; min-width:0; }
.zai-fd-hero-main h1{ margin:0 0 6px; font-size:30px; font-weight:800; color:var(--zai-text); }
.zai-fd-desc{ margin:0 0 12px; font-size:15px; color:var(--zai-text-mid); line-height:1.6; }
.zai-fd-stats{ display:flex; gap:22px; font-size:13px; color:var(--zai-text-light); }
.zai-fd-stats b{ color:var(--zai-primary); font-weight:700; margin-right:3px; }

/* 胶囊筛选 Tab */
.zai-fd-tabs-wrap{ border-bottom:1px solid var(--zai-border); background:var(--zai-bg); }
.zai-fd-tabs{ display:flex; gap:10px; padding:14px 0; flex-wrap:wrap; }
.zai-fd-tabs a{ padding:7px 18px; border-radius:999px; font-size:14px; font-weight:600; text-decoration:none; color:var(--zai-text-mid); background:var(--zai-bg-muted); border:1px solid transparent; transition:all .16s; }
.zai-fd-tabs a:hover{ color:var(--zai-primary); border-color:var(--zai-border); }
.zai-fd-tabs a.on{ background:var(--zai-primary); color:var(--zai-on-primary); }

/* 帖子行 */
.zai-thread-list{ display:flex; flex-direction:column; gap:12px; }
.zai-thread{ display:flex; align-items:center; gap:14px; padding:16px 18px; background:var(--zai-surface); border:1px solid var(--zai-border); border-radius:var(--zai-radius); text-decoration:none; color:inherit; transition:border-color .16s, box-shadow .16s, transform .12s; }
.zai-thread:hover{ border-color:var(--zai-primary); box-shadow:var(--zai-shadow-s); transform:translateY(-1px); }
.zai-thread.is-top{ border-color:var(--zai-primary-soft); background:linear-gradient(90deg,var(--zai-primary-soft),var(--zai-surface) 40%); }
.zai-thread-av{ flex:0 0 auto; width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; color:var(--zai-on-grad); background:var(--zai-grad-rev); font-size:16px; }
.zai-thread-body{ flex:1 1 auto; min-width:0; }
.zai-thread-title{ margin:0 0 6px; font-size:16px; font-weight:600; color:var(--zai-text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.zai-thread:hover .zai-thread-title{ color:var(--zai-primary); }
.zai-thread-flag{ display:inline-block; margin-right:8px; padding:1px 8px; border-radius:6px; font-size:12px; font-weight:700; color:var(--zai-on-primary); background:var(--zai-primary); vertical-align:middle; }
.zai-thread-meta{ display:flex; gap:12px; font-size:12px; color:var(--zai-text-light); flex-wrap:wrap; }
.zai-thread-last{ color:var(--zai-text-mid); }
.zai-thread-stats{ flex:0 0 auto; display:flex; gap:14px; font-size:13px; color:var(--zai-text-mid); }

/* ---------- 帖子详情页 viewthread ---------- */
.zai-thread-page{ font-family:var(--zai-font); color:var(--zai-text); background:var(--zai-bg); }
.zai-crumb{ padding:20px 0 4px; font-size:13px; color:var(--zai-text-light); display:flex; gap:8px; align-items:center; flex-wrap:wrap; max-width:1040px; }
.zai-crumb a{ color:var(--zai-text-mid); text-decoration:none; }
.zai-crumb a:hover{ color:var(--zai-primary); }
.zai-crumb-cur{ color:var(--zai-text); max-width:420px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.zai-post{ background:var(--zai-surface); border:1px solid var(--zai-border); border-radius:var(--zai-radius); padding:22px 24px; margin-bottom:16px; box-shadow:var(--zai-shadow-s); }
.zai-post-first{ border-color:var(--zai-primary-soft); }
.zai-post-head{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.zai-post-av{ flex:0 0 auto; width:42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; color:var(--zai-on-grad); background:var(--zai-grad-rev); font-size:17px; }
.zai-post-author{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; }
.zai-post-name{ font-size:15px; font-weight:700; color:var(--zai-text); }
.zai-post-time{ font-size:12px; color:var(--zai-text-light); }
.zai-post-badge{ flex:0 0 auto; padding:3px 10px; border-radius:999px; font-size:12px; font-weight:700; color:var(--zai-on-primary); background:var(--zai-primary); }
.zai-post-title{ margin:0 0 16px; font-size:26px; line-height:1.35; font-weight:800; color:var(--zai-text); }
.zai-post-body{ font-size:15px; line-height:1.85; color:var(--zai-text); word-break:break-word; }
.zai-post-body p{ margin:0 0 14px; }
.zai-post-body img{ max-width:100%; border-radius:10px; margin:6px 0; }
.zai-post-body a{ color:var(--zai-primary); }
.zai-post-body blockquote{ margin:0 0 14px; padding:10px 16px; border-left:3px solid var(--zai-primary); background:var(--zai-bg-muted); border-radius:0 8px 8px 0; color:var(--zai-text-mid); }
.zai-post-body pre, .zai-post-body code{ background:var(--zai-bg-muted); border-radius:6px; padding:2px 6px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13px; }
.zai-post-body pre{ padding:14px 16px; overflow:auto; }
.zai-post-body table{ border-collapse:collapse; margin:0 0 14px; }
.zai-post-body th, .zai-post-body td{ border:1px solid var(--zai-border); padding:6px 12px; }
.zai-post-body ul, .zai-post-body ol{ padding-left:22px; margin:0 0 14px; }
.zai-post-foot{ margin-top:16px; padding-top:14px; border-top:1px dashed var(--zai-border); display:flex; gap:20px; font-size:13px; color:var(--zai-text-light); }

/* 回复 CTA */
.zai-reply-cta{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 22px; background:linear-gradient(135deg,var(--zai-primary-soft),var(--zai-bg)); border:1px solid var(--zai-border); border-radius:var(--zai-radius); flex-wrap:wrap; }
.zai-reply-cta p{ margin:0; font-size:15px; color:var(--zai-text); font-weight:600; }

/* 侧栏小修饰 */
.zai-side-forum{ margin:0 0 12px; font-weight:700; color:var(--zai-text); }
.zai-btn-block{ display:block; width:100%; text-align:center; }

/* 分页（multi() 生成的 .pg） */
.zai-pager{ margin-top:20px; }
.zai-pager .pg{ display:flex; gap:6px; flex-wrap:wrap; align-items:center; font-size:14px; }
.zai-pager .pg a, .zai-pager .pg strong, .zai-pager .pg label{ display:inline-flex; align-items:center; justify-content:center; min-width:34px; height:34px; padding:0 10px; border-radius:9px; text-decoration:none; color:var(--zai-text-mid); background:var(--zai-surface); border:1px solid var(--zai-border); }
.zai-pager .pg a:hover{ color:var(--zai-primary); border-color:var(--zai-primary); }
.zai-pager .pg strong{ color:var(--zai-on-primary); background:var(--zai-primary); border-color:var(--zai-primary); }

/* ---------- 响应式 ---------- */
@media (max-width: 900px){
  .zai-home-2col{ grid-template-columns:minmax(0,1fr); }
  .zai-col-side{ position:static; }
  .zai-hero-sm h1{ font-size:32px; }
}
@media (max-width: 640px){
  .zai-fd-hero-row{ flex-wrap:wrap; }
  .zai-fd-icon{ width:52px; height:52px; font-size:22px; }
  .zai-fd-hero-main{ min-width:100%; }
  .zai-fd-hero-main h1{ font-size:24px; }
  .zai-post-title{ font-size:21px; }
  .zai-thread-stats{ display:none; }
  .zai-fd-stats{ gap:14px; }
}

/* 会员组：彩色组名 + 徽章（帖子作者栏） */
.zai-mg-tag{display:inline-flex;align-items:center;height:18px;padding:0 8px;margin-left:6px;
  border:1px solid var(--zai-border-strong);border-radius:999px;font-size:11px;line-height:1;
  background:var(--zai-surface);white-space:nowrap}
.zai-mg-badge{height:16px;vertical-align:-3px;margin-left:6px;border-radius:3px}
