/* 正文排版增强：链接、行内代码、表格、H3 层级、图片 */
/* 全部使用主题变量，暗色模式自动跟随；作用域限定 .md-typeset（文章内容） */

/* 1) 链接：常驻淡下划线，扫读时链接一眼可辨；标题锚点与按钮式链接除外 */
.md-typeset a {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-decoration-color: var(--md-typeset-a-color);
  text-underline-offset: 0.18em;
}

.md-typeset a.headerlink,
.md-typeset a.md-button {
  text-decoration: none;
}

/* 2) 行内代码：淡底 + 细边框 + 圆角，与正文明显区分；
      用 :not(pre) 排除代码块内的 code，让代码块保留主题默认样式 */
.md-typeset :not(pre) > code {
  padding: 0.1em 0.32em;
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0.2rem;
  background-color: var(--md-code-bg-color);
}

/* 代码块：底色沿用主题的代码底色（比正文略深），再叠一层细边框与圆角，
   起止位置一眼可辨；内边距留出复制按钮的空间 */
.md-typeset pre {
  margin-left: auto;
  margin-right: auto;
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0.2rem;
  background-color: var(--md-code-bg-color);
}

.md-typeset pre > code {
  display: block;
  padding: 0.9rem 1.1rem;
  background-color: transparent;
}

/* 3) 表格：表头浅底色加粗；宽表保留主题自带的横向滚动容器 */
.md-typeset table:not([class]) th {
  font-weight: 700;
  background-color: var(--md-default-fg-color--lightest);
}

/* 4) 三级标题：左侧短竖线，与 H2 底线形成两级视觉标记 */
.md-typeset h3 {
  padding-left: 0.5em;
  border-left: 3px solid var(--md-primary-fg-color);
}

/* 5) 图片：默认居中、圆角、限制最大高度（长截图不霸屏）
      Material 的双主题图片是同一段落内两个 <a class="glightbox">（light/dark），
      所以用 :only-child 无法命中，改以段落为单位整段居中 */
.md-typeset p:has(> a > img),
.md-typeset p:has(> img) {
  text-align: center;
}

.md-typeset p > a > img,
.md-typeset p > img,
.md-typeset figure img {
  max-width: 100%;
  max-height: 70vh;
  border-radius: 0.2rem;
  vertical-align: middle;
}

.md-typeset figure img {
  display: block;
  margin: 1em auto;
}

/* 图片外层链接不继承正文链接的下划线 */
.md-typeset p > a:has(> img),
.md-typeset figure > a {
  text-decoration: none;
}

/* 6) 插入型内容居中：Mermaid 图与表格 */
/* Mermaid 的 svg 是行内元素，容器 text-align 即可居中；
   超宽图仍由 extra.css 的 overflow-x 滚动承接 */
.md-typeset div.mermaid,
.md-typeset pre.mermaid {
  text-align: center;
}

/* 表格：Material 把表格装进 inline-block 的 .md-typeset__table，并在
   .md-typeset__scrollwrap 里做横向滚动；居中要作用在外层容器，
   单元格内部的对齐保持不动 */
.md-typeset__scrollwrap {
  text-align: center;
}

.md-typeset__table {
  text-align: start;
}
