/* Plugin Detail Page extracted styles */
.plugin-detail-page *{ box-sizing:border-box; }
.plugin-detail-page{ background-color:#f5f7fb; color:#1e1e2c; line-height:1.6; }
.plugin-detail-page :root{ --primary:#4361ee; --primary-light:#4895ef; --secondary:#3f37c9; --dark:#1e1e2c; --light:#f8f9fa; --gray:#6c757d; --success:#4cc9f0; --border:#e1e5ee; --shadow:0 4px 12px rgba(0,0,0,.08); }
.plugin-detail-page .container{ max-width:1200px; margin:0 auto; padding:0 20px; }

/* Banner header spacing driven by CSS vars */
.page-header--banner{
  margin-top: var(--df-sticky-top, 84px);
  min-height: var(--pd-banner-min-h, 180px);
  padding-top: var(--pd-banner-pt, 40px);
  padding-bottom: var(--pd-banner-pb, 40px);
}
body.admin-bar .page-header--banner{
  margin-top: calc(var(--df-sticky-top, 84px) + 32px);
}

/* 顶部区域 */
.plugin-detail-page .product-detail{ padding:1rem 3rem; }
body.admin-bar .plugin-detail-page .product-detail{ padding-top: calc(1rem + 0px); }
.site-header.is-sticky ~ .plugin-detail-page .product-detail,
.header-sticky .plugin-detail-page .product-detail{ padding-top: calc(1rem + 60px); }
@media (max-width: 768px){ .plugin-detail-page .product-detail{ padding-top:4rem; }}
.plugin-detail-page .product-header{ display:grid; grid-template-columns:1fr 2fr; gap:2rem; margin-bottom:3rem; }
.plugin-detail-page .product-image{ background:#fff; border-radius:16px; padding:1.5rem; box-shadow:var(--shadow); text-align:center; position:relative; }
.plugin-detail-page .product-image img{ max-width:100%; height:auto; border-radius:8px; }
.plugin-detail-page .product-info{ background:#fff; border-radius:16px; padding:2rem; box-shadow:var(--shadow); }
.plugin-detail-page .product-title{ font-size:2rem; margin-bottom:.25rem; color:var(--dark); position:relative; padding-bottom:.4rem; }
.plugin-detail-page .product-title::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:#e5e7eb; border-radius:1px; }
.plugin-detail-page .product-author{ color:var(--gray); margin:.25rem 0 1.25rem; font-size:1.02rem; display:flex; align-items:center; gap:.5rem; }
.plugin-detail-page .product-author:before{ display:none; content:none; }
.plugin-detail-page .product-author i.fa-solid{ color:#94a3b8; }
.plugin-detail-page .product-description{ margin-bottom:1.1rem; line-height:1.7; display:-webkit-box; -webkit-line-clamp:4; line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.plugin-detail-page .product-stats{ display:flex; gap:1.25rem; margin-bottom:1.25rem; flex-wrap:nowrap; align-items:center; overflow-x:auto; }
.plugin-detail-page .stat{ display:flex; flex-direction:row; align-items:center; gap:.4rem; min-width:auto; white-space:nowrap; }
.plugin-detail-page .stat-value{ font-size:1rem; font-weight:600; color:#111; line-height:1; }
.plugin-detail-page .stat-value.stars{ color:#f97316; }
.plugin-detail-page .stat-label{ font-size:.95rem; color:#6b7280; line-height:1; }
@media (max-width:576px){
  .plugin-detail-page .product-stats{ gap:.9rem; }
  .plugin-detail-page .stat-value{ font-size:.95rem; }
  .plugin-detail-page .stat-label{ font-size:.9rem; }
}
.plugin-detail-page .product-actions{ display:flex; gap:1rem; margin-top:1.25rem; flex-wrap:wrap; }
.plugin-detail-page .btn{ padding:.8rem 1.6rem; border-radius:8px; font-weight:700; cursor:pointer; transition:.25s; background:#2168da; border-color:#1e62cf; color:#fff;  display:inline-flex; align-items:center; gap:8px; text-decoration:none; }
.plugin-detail-page .btn-primary{ background:#3b82f6; border-color:#3b82f6; color:#fff; }
.plugin-detail-page .btn-primary:hover{ background:#2563eb; border-color:#2563eb; transform:translateY(-2px); }
.plugin-detail-page .btn-secondary{ background:#fff; color:var(--primary); border-color:var(--primary); }
.plugin-detail-page .btn-secondary:hover{ background:#f0f4ff; }
.plugin-detail-page .tags{ display:flex; flex-wrap:wrap; gap:.5rem; margin:1rem 0 0; }
.plugin-detail-page .tag{ background:#eef2ff; color:var(--primary); padding:.4rem .8rem; border-radius:20px; font-size:.9rem; }
.plugin-detail-page .product-image .tags{ justify-content:center; }

/* 通用内容块 */
.plugin-detail-page .content-section{ background:#fff; border-radius:12px; padding:2rem; margin-bottom:2rem; box-shadow:var(--shadow); }
.plugin-detail-page .section-title{ font-size:1.5rem; margin:0 0 1.25rem; color:var(--dark); text-align:left; position:relative; }
.plugin-detail-page .section-title::after{ content:""; display:block; width:100%; height:2px; background:#d1d5db; margin-top:.5rem; border-radius:1px; }
.plugin-detail-page .content-section>h2{ font-size:1.5rem; margin:0 0 1.25rem; color:var(--dark); text-align:left; position:relative; }
.plugin-detail-page .content-section>h2::after{ content:""; display:block; width:100%; height:1px; background:#e8edf5; margin-top:.5rem; border-radius:1px; }
.plugin-detail-page .entry-content p{ margin:0 0 1em; }
.plugin-detail-page .entry-content h2,.plugin-detail-page .entry-content h3{ margin:1.2em 0 .6em; }
.plugin-detail-page .entry-content ul{ padding-left:1.2em; margin:0 0 1em; }
.plugin-detail-page .entry-content img{ max-width:100%; height:auto; }

/* 特性网格、截图 */
.plugin-detail-page .features-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(300px,1fr)); gap:1.5rem; }
.plugin-detail-page .feature{ display:flex; gap:1rem; }
.plugin-detail-page .feature-icon{ background:#eef2ff; color:var(--primary); width:50px; height:50px; border-radius:10px; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:1.2rem; }
.plugin-detail-page .feature-content h3{ margin:0 0 .5rem; font-size:1.05rem; }
.plugin-detail-page .feature-content p{ color:var(--gray); margin:0; }
.plugin-detail-page .screenshots{ display:grid; grid-template-columns:repeat(auto-fill, minmax(250px,1fr)); gap:1.5rem; }
.plugin-detail-page .screenshot{ border-radius:8px; overflow:hidden; box-shadow:0 4px 8px rgba(0,0,0,.1); transition:transform .3s; background:#000; }
.plugin-detail-page .screenshot img{ width:100%; height:180px; object-fit:cover; display:block; }
.plugin-detail-page .screenshot:hover{ transform:translateY(-5px); }

/* Lightbox */
.pd-lb-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.85); display:none; align-items:center; justify-content:center; z-index:9999; opacity:0; transition:opacity .18s ease-out; }
.pd-lb-overlay.is-open{ display:flex; opacity:1; }
.pd-lb-stage{ position:relative; max-width:92vw; max-height:92vh; overflow:hidden; }
.pd-lb-overlay img{ max-width:92vw; max-height:92vh; border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,.5); display:block; margin:0 auto; transform-origin:center center; transition: transform .12s ease-out; }
.pd-lb-overlay .pd-lb-close{ position:absolute; top:18px; right:24px; color:#fff; font-size:28px; cursor:pointer; }
.pd-lb-arrow{ position:absolute; top:50%; transform:translateY(-50%); color:#fff; font-size:36px; line-height:1; padding:.2rem .5rem; cursor:pointer; user-select:none; opacity:.8; }
.pd-lb-arrow:hover{ opacity:1; }
.pd-lb-prev{ left:16px; }
.pd-lb-next{ right:16px; }

/* 评价、FAQ、Changelog */
.plugin-detail-page .reviews{ display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:1.5rem; }
.plugin-detail-page .review{ border:1px solid var(--border); border-radius:8px; padding:1.5rem; background:#fff; }
.plugin-detail-page .review-header{ display:flex; justify-content:space-between; margin-bottom:1rem; gap:1rem; }
.plugin-detail-page .reviewer{ display:flex; align-items:center; gap:.8rem; }
.plugin-detail-page .reviewer-avatar{ width:40px; height:40px; border-radius:50%; background:var(--primary-light); display:flex; align-items:center; justify-content:center; color:#fff; font-weight:bold; overflow:hidden; }
.plugin-detail-page .review-date{ color:var(--gray); font-size:.9rem; }
.plugin-detail-page .rating{ color:#ffc107; }
.plugin-detail-page .review-content{ color:#6b7280; line-height:1.6; }
.plugin-detail-page .review-content.clamped{ display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.plugin-detail-page .review-toggle{ margin-top:.6rem; background:#f1f3f9; border:1px solid var(--border); color:#334155; border-radius:16px; padding:.25rem .7rem; font-size:.85rem; cursor:pointer; }

.plugin-detail-page .faq-item{ border-bottom:1px solid var(--border); padding:.25rem 0; }
.plugin-detail-page .faq-question{ font-weight:600; cursor:pointer; display:flex; justify-content:space-between; align-items:center; padding:12px 16px; border-radius:10px; }
.plugin-detail-page .faq-question:hover{ background:#f8fafc; }
.plugin-detail-page .faq-question span{ display:inline-block; font-size:18px; line-height:1; transition:transform .18s ease; }
.plugin-detail-page .faq-item.is-open .faq-question span{ transform:rotate(90deg); }
.plugin-detail-page .faq-answer{ color:#6b7280; line-height:1.7; display:none; padding:0 16px 12px; }
.plugin-detail-page .faq-item.is-open .faq-answer{ display:block; }

.plugin-detail-page .changelog-controls{ display:flex; justify-content:space-between; align-items:center; margin-bottom:1.5rem; flex-wrap:wrap; gap:1rem; }
.plugin-detail-page .changelog-filter{ display:flex; gap:.5rem; flex-wrap:wrap; }
.plugin-detail-page .filter-btn{ padding:.5rem 1rem; background:#f1f3f9; border:none; border-radius:20px; cursor:pointer; transition:.2s; }
.plugin-detail-page .filter-btn.is-active, .plugin-detail-page .filter-btn:hover{ background:#e6ebf7; }
.plugin-detail-page .changelog-search input{ padding:.55rem .9rem; border:1px solid var(--border); border-radius:8px; min-width:220px; }
.plugin-detail-page .changelog-list{ display:flex; flex-direction:column; gap:1rem; }
.plugin-detail-page .changelog-entry{ position:relative; border:1px solid var(--border); border-radius:10px; padding:1rem 1.2rem; background:#f6f9ff; border-left:4px solid #3b82f6; }
.plugin-detail-page .changelog-entry .entry-head{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:.6rem; }
.plugin-detail-page .changelog-entry .ver-pill{ display:inline-block; background:#3b82f6; color:#fff; padding:4px 10px; border-radius:999px; font-weight:700; }
.plugin-detail-page .changelog-entry .ver-date{ color:#6b7280; white-space:nowrap; }
.plugin-detail-page .chg-more{ display:flex; justify-content:center; }
.plugin-detail-page #btnShowMoreChg{ background:#3b82f6; color:#fff; border-color:#3b82f6; }
.plugin-detail-page #btnShowMoreChg:hover{ background:#2563eb; border-color:#2563eb; }
.plugin-detail-page #btnShowMoreChg:active{ background:#1d4ed8; border-color:#1d4ed8; }
.plugin-detail-page .badge{ display:inline-block; padding:.2rem .6rem; border-radius:999px; font-size:.75rem; color:#fff; }
.plugin-detail-page .badge.add{ background:#10b981; }
.plugin-detail-page .badge.improve{ background:#6366f1; }
.plugin-detail-page .badge.fix{ background:#ef4444; }
.plugin-detail-page .badge.sec{ background:#f59e0b; }
.plugin-detail-page .badge.doc{ background:#0ea5e9; }
.plugin-detail-page .badge.other{ background:#6b7280; }

/* TOC */
.pd-toc{ position:fixed; right:20px; top:140px; width:240px; max-height:70vh; overflow:auto; background:#fff; border:1px solid var(--border); border-radius:10px; box-shadow:var(--shadow); padding:12px 12px; z-index:100; box-sizing:border-box; }
.pd-toc .toc-title{ font-weight:700; margin:0 0 .5rem; font-size:14px; color:#111; }
.pd-toc ul{ list-style:none; padding:0; margin:0; }
.pd-toc li{ margin:.35rem 0; }
.pd-toc a{ display:block; color:#374151; text-decoration:none; font-size:13px; line-height:1.4; padding:4px 6px; border-radius:6px; }
.pd-toc a:hover{ background:#f3f4f6; }
.pd-toc a.active{ background:#e6f0ff; color:#1e3a8a; font-weight:600; }
.pd-toc .toc-lv2{ padding-left:10px; }

/* 折叠状态：仅显示按钮，隐藏内部目录内容 */
.pd-toc .pd-toc-inner{ display:block; }
.pd-toc.is-collapsed{
  padding:0;
  width:auto;
  max-height:none;
  background:transparent;
  border:none;
  box-shadow:none;
}
/* 无论目录是否包在 .pd-toc-inner 中，折叠时一律隐藏标题和列表 */
.pd-toc.is-collapsed .pd-toc-inner,
.pd-toc.is-collapsed .toc-title,
.pd-toc.is-collapsed ul{ display:none; }

/* 目录折叠/展开按钮基础样式（保持视觉简洁，细节可继续在 override.css 中微调） */
.pd-toc .pd-toc-toggle{
  position:fixed;
  right:10px;
  top:220px;
  width:32px;
  height:32px;
  border-radius:16px;
  border:none;
  background:#111827;
  cursor:pointer;
  padding:0;
  color:#fff;
  z-index:1000;
}
.pd-toc .pd-toc-toggle::before{
  content:"目";
  font-size:14px;
}

@media (max-width:1200px){
  /* 小屏时目录靠右贴边，宽度收缩，仍通过按钮控制展开 */
  .pd-toc{
    right:0;
    top:auto;
    bottom:120px;
    width:220px;
    max-height:60vh;
  }
}

body.admin-bar .pd-toc{ top: calc(140px + 32px); }
