/* ==========================================================================
   Post Detail Page ( /post/{id}.html ) — 参考文章详情页样式
   复用 app_article.css 的框架（.article-hero / .article-wrap /
   .article-side / .read-progress / .side-card / .share-btn / .mod-link），
   这里只做论坛特有的主题色覆盖与板块徽标配色。

   v3 (20260910)：修正「相关帖子」板块徽标颜色突兀的问题——
   原来用实心高饱和 --blue(#5B9BD5)，与站点深橄榄底 + 金色的整体色系不协调；
   改为主题内的低调徽标（中性底 + 弱线边框 + 弱化文字），悬停时带出金色。
   ========================================================================== */

/* ---------- 板块徽标配色（Hero 用，保持弱化透明底 + 描边，非实心） ---------- */
.badge-cat[data-cat="mod"],
.badge-cat[data-cat="res"]{
  background: rgba(213,56,44,.15); color: var(--red);
  border-color: rgba(213,56,44,.35);
}
.badge-cat[data-cat="strategy"]{
  background: rgba(217,164,65,.15); color: var(--gold);
  border-color: rgba(217,164,65,.35);
}
.badge-cat[data-cat="tournament"]{
  background: rgba(166,201,74,.15); color: var(--green);
  border-color: rgba(166,201,74,.35);
}
.badge-cat[data-cat="qa"]{
  background: rgba(91,155,213,.15); color: var(--blue);
  border-color: rgba(91,155,213,.35);
}
.badge-cat[data-cat="bug"]{
  background: rgba(155,111,216,.15); color: var(--purple);
  border-color: rgba(155,111,216,.35);
}
.badge-cat[data-cat="chat"]{
  background: rgba(154,160,133,.15); color: var(--muted);
  border-color: rgba(154,160,133,.35);
}

/* 审核中状态（主楼待审） */
.hero-status{
  display:inline-block; margin-left:10px; padding:2px 9px;
  font-size:12px; font-weight:600; letter-spacing:.05em;
  color: var(--gold); background: rgba(217,164,65,.12);
  border:1px solid rgba(217,164,65,.3); border-radius:2px;
  vertical-align:middle;
}

/* ---------- 帖子正文：对齐文章页金色主题 ---------- */
.fdz-p-body{ color: var(--ink); word-break: break-word; }
.fdz-p-body a{
  color: var(--gold); text-decoration:none;
  border-bottom:1px solid rgba(217,164,65,.35); transition: border-color .15s;
}
.fdz-p-body a:hover{ border-bottom-color: var(--gold); }
.fdz-p-body blockquote{
  border-left:3px solid var(--gold); background: rgba(217,164,65,.05); color: var(--ink);
}
.fdz-p-body h3{ border-left:2px solid var(--gold); padding-left:10px; }
.fdz-p-body h2{
  font-size:22px; margin:30px 0 14px; padding:6px 0 6px 14px;
  border-left:4px solid var(--gold);
  background: linear-gradient(90deg, rgba(217,164,65,.08) 0%, transparent 70%);
  color: var(--ink);
}
.fdz-p-body h2::before{ content:"§"; color:var(--gold); margin-right:8px; opacity:.7; }
.fdz-p-body pre{ border:1px solid var(--line); }
.fdz-p-body code{ color: var(--gold); background: rgba(217,164,65,.1); }

/* ---------- 回复楼层：在文章面板内做成干净卡片 ---------- */
.fdz-post{
  border:1px solid var(--line); border-radius:2px; margin:14px 0;
  background: rgba(255,255,255,.015); overflow:hidden;
}
.fdz-post-side{
  background: rgba(0,0,0,.2); border-right:1px solid var(--line);
}
.fdz-p-meta .fdz-p-floor.is-reply{ color: var(--gold); }
.fdz-p-meta .fdz-like{ border-color: var(--line); color: var(--muted); }
.fdz-p-meta .fdz-like:hover:not(:disabled){ border-color: var(--gold); color: var(--gold); }
.fdz-p-meta .fdz-like.is-on{ border-color: var(--gold); color: var(--gold); background: rgba(217,164,65,.08); }
.fdz-p-meta .fdz-like b{ font-family: var(--mono, monospace); }

/* 主楼点赞/收藏按钮（复用 .ad-tool 视觉，这里补一点间距） */
.ad-tools .ad-tool#pdLike.is-on{ color: var(--red); border-color: var(--red); }

/* ---------- 相关帖子列表（复用 .mod-link） ---------- */
.related-list{ display:flex; flex-direction:column; }
.related-list .fdz-loading{ color:var(--muted); font-size:12.5px; padding:6px 0; }

/* 板块徽标：不用实心高饱和色块，改为主题内的低调样式
   —— 默认中性（弱线边框 + 弱化文字），悬停随整行带出金色。 */
.related-list .mod-tag{
  flex-shrink:0; white-space:nowrap;
  background: rgba(255,255,255,.03);
  border:1px solid var(--line);
  color: var(--muted);
  font-family: var(--mono);
  font-size: 9.5px; font-weight:500; letter-spacing:.08em;
  padding: 2px 7px; border-radius:2px;
  transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.related-list .mod-link:hover .mod-tag{
  color: var(--gold);
  border-color: rgba(217,164,65,.45);
  background: rgba(217,164,65,.08);
}
/* 最后一行不留多余分隔线 */
.related-list .mod-link:last-child{ border-bottom:0; padding-bottom:2px; }

/* ---------- 移动端：侧栏相关/分享自然落到下方 ---------- */
@media (max-width: 960px){
  .fdz-post-side{ width:120px; padding:14px 10px; }
}