/* Breadcrumb chrome lives in breadcrumb.css (single source). */

/* ========== 主布局 ========== */
.content-main {
  width: 100%;
}

.content-main--single {
  max-width: 100%;
}

.content-shell {
  width: 100%;
  margin: 0 auto;
  padding: 32px 16px 48px;
  max-width: var(--container);
}

@media (min-width: 768px) {
  .content-shell {
    padding: 40px 24px 56px;
  }
}

/* page.php 专用：阅读宽度收窄 */
.content-shell--page {
  max-width: var(--container-page, 860px);
}

.content-shell--cms {
  max-width: 100%;
  padding: 0;
}

/* page.php 内的元素 */
.entry-page .entry-thumb {
  margin: 0 0 var(--space-6, 24px);
  border-radius: var(--radius-lg, 12px);
  overflow: hidden;
}

.entry-page .page-links {
  margin-top: var(--space-6, 24px);
  font-size: var(--text-sm, 0.875rem);
  color: var(--color-ink-3, var(--color-ink-3));
}

.entry-page .page-links-title {
  margin-right: 8px;
  font-weight: 600;
}

/* ============================================================
 * Site shell — Zibll site-layout-1/2/3 float dual-column (main.css 1:1)
 * DOM: main.container > .content-wrap + .sidebar (siblings)
 * body.site-layout-1 = no sidebar
 * body.site-layout-2 = sidebar right
 * body.site-layout-3 = sidebar left
 *
 * Never put display:flex/grid on .content-wrap for dual-column pages —
 * float is ignored under flex/grid and .sidebar negative-margin then overlaps.
 * ============================================================ */

main.container,
main.content-shell,
.site-main.container {
  position: relative;
}

/* content-shell is a padding shell for non-dual pages; when it also hosts
 * the float dual-column, kill horizontal padding so negative-margin math matches Zibll. */
main.container.content-shell,
main.content-shell.container,
.site-main.container.content-shell {
  padding-left: 0;
  padding-right: 0;
  max-width: var(--container, var(--mian-max-width, 1200px));
  width: 100%;
  box-sizing: border-box;
}

main.container::after,
main.content-shell::after,
.site-main.container::after {
  content: "";
  display: table;
  clear: both;
}

/* Zibll main.css 1:1 dual-column (float + negative-margin).
 *
 * Critical: .content-layout must NOT set width:100%. Under box-sizing:border-box
 * a 100% width + margin-right gutter keeps the border-box at full container
 * width, so the gutter never shrinks the content box and .sidebar (margin-left:-311px)
 * sits under the main column (overlap). Zibll only sets margin on .content-layout;
 * width stays auto so margin carves out the column. */
.content-wrap {
  float: left;
  width: 100%;
  min-width: 0;
  display: block;
  box-sizing: border-box;
}

.content-layout {
  display: block;
  /* width:auto — never 100%; margin must shrink the used width */
  width: auto;
  min-width: 0;
  max-width: none;
  margin-right: 0;
  margin-left: 0;
  box-sizing: border-box;
}

.content-layout__primary {
  min-width: 0;
  max-width: 100%;
}

/* Base sidebar column (Zibll .sidebar defaults) — layout variants override below */
.sidebar {
  float: left;
  width: 311px; /* Zibll hard 311px; --sidebar-width kept in sync via runtime vars */
  width: var(--sidebar-width, 311px);
  min-width: 0;
  position: relative;
  box-sizing: border-box;
  display: block;
}

.content-layout__aside {
  min-width: 0;
}

/* No sidebar */
body.site-layout-1 .sidebar,
.site-layout-1 .sidebar {
  display: none;
}

body.site-layout-1 .content-layout,
body.site-layout-1 .content-layout--no-sidebar,
.site-layout-1 .content-layout {
  margin-left: 0;
  margin-right: 0;
}

/* Compat: templates may still stamp content-layout--no-sidebar */
.content-layout--no-sidebar {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Sidebar RIGHT (layout 2) — Zibll: margin-right: calc(311px + 15px) only */
body.site-layout-2 .content-layout,
.site-layout-2 .content-layout {
  margin-right: calc(311px + 15px);
  margin-right: calc(var(--sidebar-width, 311px) + 15px);
  margin-left: 0;
  width: auto;
}

body.site-layout-2 .sidebar,
.site-layout-2 .sidebar {
  float: left;
  width: 311px;
  width: var(--sidebar-width, 311px);
  margin-left: -311px;
  margin-left: calc(0px - var(--sidebar-width, 311px));
  position: unset;
}

/* Sidebar LEFT (layout 3) */
body.site-layout-3 .content-layout,
.site-layout-3 .content-layout {
  margin-left: calc(311px + 15px);
  margin-left: calc(var(--sidebar-width, 311px) + 15px);
  margin-right: unset;
  width: auto;
}

body.site-layout-3 .sidebar,
.site-layout-3 .sidebar {
  float: left;
  width: 311px;
  width: var(--sidebar-width, 311px);
  margin-left: -100%;
  position: unset;
}

/* Sticky widgets inside sidebar */
@media (min-width: 992px) {
  body.site-layout-2 .sidebar .posts-nav-box,
  body.site-layout-3 .sidebar .posts-nav-box,
  .sidebar .content-layout__aside,
  .content-layout__aside {
    position: sticky;
    top: calc(var(--nav-height, 60px) + 16px);
  }

  .has-static-nav .sidebar .posts-nav-box,
  .has-static-nav .content-layout__aside {
    top: 16px;
  }
}

/* Mobile collapse (Zibll max-width: 991px) */
@media (max-width: 991.98px) {
  body.site-layout-2 .content-layout,
  body.site-layout-3 .content-layout,
  .site-layout-2 .content-layout,
  .site-layout-3 .content-layout {
    margin-left: auto;
    margin-right: auto;
  }

  body.site-layout-2 .sidebar,
  body.site-layout-3 .sidebar,
  .site-layout-2 .sidebar,
  .site-layout-3 .sidebar,
  .sidebar {
    display: none;
  }
}

/* ========== 页面标题区 ========== */
.page-header {
  margin-bottom: 28px;
}

.page-header .entry-title {
  margin-bottom: 8px;
}

.page-header p {
  color: var(--color-ink-3);
  margin: 0;
  max-width: 720px;
}

.term-page-header {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--color-line-soft, rgba(15, 23, 42, 0.08));
  border-radius: var(--radius-lg);
  background: var(--surface-1);
  box-shadow: var(--shadow-sm, 0 1px 6px rgba(15, 23, 42, 0.04));
}

.term-page-header__body {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 24px;
}

.term-page-header__eyebrow {
  margin: 0 0 8px;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-primary);
}

.term-page-header__desc {
  margin-top: 10px;
}

.term-page-header__cover {
  min-height: 140px;
  background-position: center;
  background-size: cover;
  border-top: 1px solid var(--color-line-soft, rgba(15, 23, 42, 0.08));
}

.term-page-header--simple .term-page-header__cover {
  display: none;
}

/* Card style: accent top border, slightly more padding */
.term-page-header--card {
  border-top: 3px solid var(--color-primary, #f04494);
}

.term-page-header--card .term-page-header__body {
  padding: 28px 24px;
}

/* Cover style: full-width hero with background image */
.term-page-header--cover {
  border: none;
  border-radius: var(--radius-lg);
  background: transparent;
  box-shadow: none;
  min-height: 220px;
  display: flex;
  flex-direction: column;
}

.term-page-header__cover-bg {
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  border-radius: var(--radius-lg);
}

.term-page-header__cover-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.25) 100%);
  border-radius: var(--radius-lg);
}

.term-page-header--cover .term-page-header__body {
  flex: 1;
  align-items: flex-end;
  z-index: 2;
}

.term-page-header__body--overlay .entry-title,
.term-page-header__body--overlay .term-page-header__desc,
.term-page-header__body--overlay .term-page-header__eyebrow {
  color: #fff;
}

.term-page-header__body--overlay .term-page-header__eyebrow {
  color: rgba(255, 255, 255, 0.8);
}

@media (max-width: 767px) {
  .term-page-header--cover {
    min-height: 160px;
  }
}

.aksrt-admin-quicklink {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-pill, 999px);
  background: var(--surface-2);
  color: var(--color-ink-2);
  text-decoration: none;
  white-space: nowrap;
  font-size: 0.875rem;
  font-weight: 600;
}

.aksrt-admin-quicklink:hover {
  color: var(--color-primary);
  border-color: var(--color-primary);
  background: var(--color-primary-soft, rgba(59, 130, 246, 0.08));
}

.archive-filter-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin: -8px 0 24px;
  padding: 16px 18px;
  border-radius: var(--radius-lg);
  background: var(--surface-2);
  border: 1px solid var(--color-line-soft, rgba(15, 23, 42, 0.06));
}

.archive-filter-bar__main {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.archive-filter-bar__label {
  color: var(--color-ink-4);
  font-size: 0.8125rem;
  font-weight: 600;
}

.archive-filter-bar__chips {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.archive-filter-bar__chip {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border-radius: var(--radius-pill, 999px);
  background: var(--surface-1);
  color: var(--color-ink-2);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
}

.archive-filter-bar__chip.is-active,
.archive-filter-bar__chip:hover {
  background: var(--color-primary);
  color: var(--color-on-primary, #fff);
}

.archive-filter-bar__meta {
  color: var(--color-ink-4);
  font-size: 0.8125rem;
  font-weight: 600;
}

.archive-filter-bar__sort {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}

.archive-filter-bar__main--tags {
  border-top: 1px solid var(--color-line-soft, rgba(15, 23, 42, 0.06));
  padding-top: 10px;
  margin-top: 10px;
}

/* §3.4 custom_filter dimension rows */
.archive-filter-bar__main--custom {
  border-top: 1px solid var(--color-line-soft, rgba(15, 23, 42, 0.06));
  padding-top: 10px;
  margin-top: 10px;
}


.content-stream {
  display: grid;
  gap: 20px;
}

.content-main--archive,
.content-main--tag,
.content-main--category,
.content-main--search,
.content-main--single {
  display: grid;
  gap: 20px;
}

.content-stream__list {
  width: 100%;
}

.content-stream__footer {
  margin-top: 4px;
}

.content-stream__footer > .content-stream__footer-nav,
.archive__ajax-wrap > .content-stream__footer-nav {
  margin-top: 0;
}

.content-stream__empty {
  padding: 28px 24px;
  border-radius: var(--radius-lg);
  background: var(--surface-1);
  border: 1px solid var(--color-line-soft, rgba(15, 23, 42, 0.08));
}

.article-shell {
  overflow: hidden;
}

/* AJAX 筛选加载状态 */
.archive__ajax-wrap {
  position: relative;
  transition: opacity 0.2s ease;
}

.archive__ajax-wrap.is-loading {
  opacity: 0.5;
  pointer-events: none;
}

.archive__ajax-loading {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  align-items: center;
  justify-content: center;
  z-index: 5;
  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(1px);
}

.archive__ajax-loading.is-loading {
  display: flex;
}

.archive__ajax-spinner {
  display: inline-block;
  width: 28px;
  height: 28px;
  border: 3px solid var(--surface-3, #e8e8e8);
  border-top-color: var(--color-primary, #f04494);
  border-radius: 50%;
  animation: aksrt-spin 0.6s linear infinite;
}

@media (max-width: 767px) {
  .term-page-header__body {
    flex-direction: column;
    align-items: stretch;
    padding: 20px;
  }

  .aksrt-admin-quicklink {
    width: fit-content;
  }
}

/* ========== AJAX 分页（加载更多 / 无限滚动） ========== */
.aksrt-pagination-ajax {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  margin: 40px 0 8px;
}

.aksrt-load-more-btn {
  min-width: 180px;
  height: 44px;
  padding: 0 32px;
  border-radius: var(--radius-btn);
  border: 1px solid var(--color-line);
  background: var(--surface-page);
  color: var(--color-ink);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.2s, color 0.2s, background 0.2s;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.aksrt-load-more-btn:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
}

.aksrt-load-more-btn:disabled {
  opacity: 0.5;
  pointer-events: none;
}

.aksrt-loading-indicator {
  display: none;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--color-ink-4);
}

.aksrt-loading-indicator i {
  font-size: 16px;
}

.aksrt-scroll-sentinel {
  width: 100%;
  height: 1px;
  pointer-events: none;
}

/* ========== 移动端/平板隐藏侧栏（与 zibll 一致：991px 以下隐藏） ========== */
@media (max-width: 991px) {
  .content-layout__aside {
    display: none;
  }
}

/* CMS 模块在侧栏布局中的适配 */
.content-layout__primary--cms {
  min-width: 0;
}

.content-layout__primary--cms .home-modules {
  gap: var(--space-7, 32px);
}

.content-layout__primary--cms .home-modules > .home-module {
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}

/* ============================================================
 * Phase 2 — 背景遮罩层级修正
 * body.aksrt-bg-overlay 的 ::before 需要 z-index: -1 让内容在其上方
 * ============================================================ */
body.aksrt-bg-overlay {
  position: relative;
}

body.aksrt-bg-overlay::before {
  z-index: -1;
}

body.aksrt-bg-overlay .site-wrapper {
  position: relative;
  z-index: 0;
}

/* ============================================================
 * Phase 2 — 侧栏 widget 内链接增强
 * ============================================================ */
.content-layout__aside .widget a {
  transition: color var(--dur-fast, 0.15s) var(--ease);
}

.content-layout__aside .widget a:hover {
  color: var(--color-primary);
}

/* ============================================================
 * Phase 5 — 文章操作卡片增强
 * ============================================================ */

/* ============================================================
 * Phase 6 — 评论卡片容器
 * ============================================================ */
.comments-card {
  overflow: hidden;
}
