/* ============================================
 * 文章页（post.ejs）：标题、正文、上下篇共用 --post-content-pad
 * ============================================ */
.page-shell:has(.post-page-card) > .page-grid {
  margin-top: var(--post-page-stack-pad-top);
}

.post-page-card__header {
  padding: var(--post-content-pad) var(--post-content-pad) 0;
}

/* 标题与分类页 note-card .note-card-title 共用类名；文章页单独略放大 */
.post-page__title.note-card-title {
  margin: 0 0 0.75rem;
  font-size: calc(var(--mdui-typescale-title-large-size, 1.375rem) * 1.2);
  line-height: calc(var(--mdui-typescale-title-large-line-height, 1.75rem) * 1.2);
}

/* 与分类卡片 .note-meta 同一套字号/行高/间距；不加 .note-meta 以免带入卡片底部 padding */
.post-page__meta-row {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.5rem 0.75rem;
  margin: 0 0 0.75rem;
  font-size: var(--mdui-typescale-label-medium-size, 0.75rem);
  line-height: var(--mdui-typescale-label-medium-line-height, 1rem);
}

.post-page__meta-row .note-read {
  margin-left: auto;
}

.post-page-card__header .post-page__meta--cats {
  display: contents;
}

.post-page-card__header .post-page__meta--cats a.note-tag {
  text-decoration: none;
  color: rgb(var(--mdui-color-on-surface-variant));
}

.post-page-card__header .post-page__meta--cats a.note-tag:hover,
.post-page-card__header .post-page__meta--cats a.note-tag:focus {
  background-color: var(--app-hover-on-surface-subtle);
  text-decoration: none;
}

.post-page-card__body {
  padding: 1.25rem var(--post-content-pad) var(--post-content-pad);
  min-width: 0;
  /* 宽表横向滚动放在卡片 body，避免整段 .mdui-prose 成滚动容器导致其后段落版式异常 */
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* 文章卡片与 MDUI host 一并约束，防止正文内大图/表格把侧栏挤出可视区 */
mdui-card.post-page-card {
  min-width: 0;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
  overflow-x: hidden;
}

.post-page-card .post-nav {
  padding: 0.75rem var(--post-content-pad) var(--post-content-pad);
}

.page-sidebar--post {
  display: none;
}

@media (min-width: 840px) {
  .page-sidebar--post {
    display: block;
  }
}

/* ============================================
 * 正文内图片（mdui-prose）
 * ============================================ */
.mdui-prose img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}

/*
 * 内联 style 的 width/height 特异性高于类选择器，此处保留 !important 才能压过 Hexo/Markdown 输出。
 * 代码高亮等处已改为提高特异性，勿在此处复用 !important 以外的手段。
 */
.post-page-card__body .mdui-prose img,
.post-page-card__body .mdui-prose video {
  max-width: 100% !important;
  height: auto !important;
}

.post-page-card__body .mdui-prose figure {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.post-page-card__body .mdui-prose {
  max-width: 100%;
}

/* 目录锚点与 sticky TOC 使用同一条对齐线，避免标题贴住或落入固定 Topbar。 */
.post-page-card__body .mdui-prose :is(h2[id], h3[id]) {
  scroll-margin-top: var(--app-sticky-stack-gap);
}

.post-backlinks {
  margin-top: 2rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--app-divider-hairline);
}

.post-backlinks__title {
  margin: 0 0 0.75rem;
  font-size: var(--mdui-typescale-title-medium-size, 1rem);
  line-height: var(--mdui-typescale-title-medium-line-height, 1.5rem);
  font-weight: 600;
  color: rgb(var(--mdui-color-on-surface));
}

.post-backlinks__list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.45rem;
  min-width: 0;
}

.post-backlinks__link {
  max-width: 100%;
  color: rgb(var(--mdui-color-primary));
  font-size: var(--mdui-typescale-body-medium-size, 0.875rem);
  line-height: var(--mdui-typescale-body-medium-line-height, 1.25rem);
  text-decoration: none;
  overflow-wrap: anywhere;
}

.post-backlinks__link:hover,
.post-backlinks__link:focus-visible {
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

/* 独立 Page 模板：横向滚动放在正文栏，避免祖先 overflow 破坏 sticky 侧栏 */
.page-main.page-page__body {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

main.page-shell .mdui-prose.page-page__prose {
  box-sizing: border-box;
  max-width: min(var(--page-static-prose-max-width), 100%);
  margin-right: auto;
  margin-left: 0;
}

/* 有目录时正文栏受 grid 限宽（--page-article-column-max-width），正文填满栏宽，与文章页读数宽度一致 */
.page-grid--post:not(.page-grid--single) .page-main.page-page__body .page-page__prose {
  max-width: none;
}

/* 页面无卡片内边距，正文与目录比文章页更贴，单独放宽空隙 */
@media (min-width: 840px) {
  .page-grid--post:not(.page-grid--single):has(.page-page__body) {
    column-gap: 4rem;
  }
}

/* 页面正文标题与文章页一致的目录锚点偏移，避免贴住固定顶栏 */
.page-page__prose :is(h2[id], h3[id]) {
  scroll-margin-top: var(--app-sticky-stack-gap);
}

/* 文章侧栏目录：直接落在页面背景上；随正文吸附，长文时仅目录区内部滚动 */
.post-toc-panel.toc-full-height {
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - var(--app-sticky-offset) - var(--post-toc-viewport-bottom));
  max-height: calc(100dvh - var(--app-sticky-offset) - var(--post-toc-viewport-bottom));
  min-height: 0;
  width: 100%;
  box-sizing: border-box;
}

.post-toc-inner {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  padding: 0.75rem 0;
}

.post-toc-scroll {
  flex: 1;
  min-height: 0;
  padding: 0.25rem 0.625rem 0.25rem 0.375rem;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-color: rgb(var(--mdui-color-outline-variant)) transparent;
  scrollbar-width: thin;
}

/* H2/H3 各自拥有竖向轨道；圆点与轨道对齐，嵌套列表自然形成路径。 */
.post-toc-scroll.mdui-prose .post-toc,
.post-toc-scroll.mdui-prose .post-toc-child {
  list-style: none;
  position: relative;
  margin: 0;
  padding: 0 0 0 1.25rem;
  border-left: 1px solid rgb(var(--mdui-color-outline-variant));
}

.post-toc-scroll.mdui-prose .post-toc {
  margin-left: 0.3125rem;
}

.post-toc-scroll.mdui-prose .post-toc-child {
  margin: 0.625rem 0 0.125rem 0.75rem;
}

.post-toc-scroll.mdui-prose .post-toc-item {
  position: relative;
  margin: 0;
  padding: 0;
}

.post-toc-scroll.mdui-prose .post-toc-item + .post-toc-item {
  margin-top: 0.625rem;
}

.post-toc-scroll.mdui-prose .post-toc-link {
  display: block;
  position: relative;
  padding: 0.125rem 0.25rem 0.125rem 0;
  border: 0;
  color: rgb(var(--mdui-color-on-surface-variant));
  font-size: var(--mdui-typescale-body-small-size, 0.75rem);
  font-weight: 400;
  line-height: 1.25rem;
  text-decoration: none;
  word-break: break-word;
  overflow-wrap: anywhere;
  transition: color 160ms ease, font-weight 160ms ease;
}

.post-toc-scroll.mdui-prose .post-toc-level-3 > .post-toc-link {
  font-size: var(--mdui-typescale-label-medium-size, 0.75rem);
}

.post-toc-scroll.mdui-prose .post-toc-link::before {
  position: absolute;
  top: 0.5rem;
  left: -1.53125rem;
  width: 0.5625rem;
  height: 0.5625rem;
  box-sizing: border-box;
  border: 1.5px solid rgb(var(--mdui-color-outline));
  border-radius: 50%;
  background: rgb(var(--mdui-color-surface));
  content: '';
  transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.post-toc-scroll.mdui-prose .post-toc-link:hover,
.post-toc-scroll.mdui-prose .post-toc-link:focus-visible {
  border: 0;
  color: rgb(var(--mdui-color-primary));
  text-decoration: none;
}

.post-toc-scroll.mdui-prose .post-toc-link:hover::before,
.post-toc-scroll.mdui-prose .post-toc-link:focus-visible::before {
  border-color: rgb(var(--mdui-color-primary));
}

.post-toc-scroll.mdui-prose .post-toc-link.is-active {
  color: rgb(var(--mdui-color-primary));
  font-weight: 650;
}

.post-toc-scroll.mdui-prose .post-toc-link.is-active::before {
  border-color: rgb(var(--mdui-color-primary));
  background: rgb(var(--mdui-color-primary));
  box-shadow: 0 0 0 0.1875rem color-mix(in srgb, rgb(var(--mdui-color-primary)) 22%, transparent);
}

.post-toc-scroll.mdui-prose .post-toc-link.is-active-ancestor {
  color: color-mix(in srgb, rgb(var(--mdui-color-primary)) 72%, rgb(var(--mdui-color-on-surface)));
  font-weight: 550;
}

.post-toc-scroll.mdui-prose .post-toc-link.is-active-ancestor::before {
  border-color: rgb(var(--mdui-color-primary));
}

@media (prefers-reduced-motion: reduce) {
  .post-toc-scroll.mdui-prose .post-toc-link,
  .post-toc-scroll.mdui-prose .post-toc-link::before {
    transition: none;
  }
}

/* ============================================
 * 代码块适配 (Hexo highlight & mdui-prose)：高特异性，避免 !important
 * ============================================ */
.mdui-prose .highlight {
  overflow: auto;
  margin: 1.5em 0;
  background: rgb(var(--mdui-color-surface-container-low, 244, 244, 244));
  border-radius: 4px;
  -webkit-overflow-scrolling: touch;
}

.mdui-prose figure.highlight {
  margin: 1.5em 0;
}

mdui-card.post-page-card .post-page-card__body .mdui-prose figure.highlight table,
mdui-card.post-page-card .post-page-card__body .mdui-prose .highlight table,
main.page-shell .mdui-prose figure.highlight table,
main.page-shell .mdui-prose .highlight table {
  margin: 0;
  display: block;
  overflow-x: auto;
  width: auto;
  border: none;
}

mdui-card.post-page-card .post-page-card__body .mdui-prose figure.highlight td,
mdui-card.post-page-card .post-page-card__body .mdui-prose .highlight td,
main.page-shell .mdui-prose figure.highlight td,
main.page-shell .mdui-prose .highlight td {
  padding: 0;
  border: none;
}

mdui-card.post-page-card .post-page-card__body .mdui-prose .highlight pre,
main.page-shell .mdui-prose .highlight pre {
  margin: 0;
  padding: 0.75rem 1rem;
  white-space: pre;
  word-break: normal;
}

/* 外链 open_in_new：紧接在 </a> 后作行内元素，只控制相对正文的尺寸 */
mdui-icon.post-external-link-icon {
  font-size: 1em;
  width: 1em;
  height: 1em;
}