/* Base page colors and typography */
body {
    margin: 0;
    background-color: var(--bgColor-default, #ffffff);
    color: var(--fgColor-default, #1f2328);
}

/* 全文字体统一 */
/* 仅调整现有字体栈的顺序和回退，引入 macOS/iOS 上更柔和的中文字体优先。 */
body {
    font-family: "SF Pro Text", "SF Pro SC", "PingFang SC", "Helvetica Neue", 
                 "Noto Sans CJK SC", "Microsoft YaHei", system-ui, -apple-system, 
                 BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* site.css 后导入，优先级会高于github-markdown-css 存在覆盖*/
/* 导航栏字体大小 */
header nav{
    font-size: 18px;
}
/* 覆盖 GitHub markdown 的正文排版 */
.markdown-body {
    font-size: 18px;
    line-height: 1.7;
}


/* Smooth in-page anchor scrolling */
html {
    scroll-behavior: smooth;
}

/* 声明当前主题为浅色，影响浏览器原生控件（如表单、滚动条）配色 */
html[data-theme="light"] {
    color-scheme: light;
}

/* 声明当前主题为深色，确保原生控件在深色模式下显示正确 */
html[data-theme="dark"] {
    color-scheme: dark;
}

/* Theme variables (shared by layout and markdown content) */
html[data-theme="light"] {
    --bgColor-default: #ffffff;
    --bgColor-muted: #f6f8fa;
    --bgColor-neutral-muted: #818b981f;
    --fgColor-default: #1f2328;
    --fgColor-muted: #59636e;
    --fgColor-accent: #0969da;
    --borderColor-default: #d1d9e0;
    --borderColor-muted: #d1d9e0b3;
}

html[data-theme="dark"] {
    --bgColor-default: #292a2d;
    --bgColor-muted: #151b23;
    --bgColor-neutral-muted: #656c7633;
    --fgColor-default: #f0f6fc;
    --fgColor-muted: #9198a1;
    --fgColor-accent: #4493f8;
    --borderColor-default: #3d444d;
    --borderColor-muted: #3d444db3;
}

/* Main content container */
main.markdown-body {
    box-sizing: border-box;
    min-width: 200px;
    max-width: 980px;
    margin: 0 auto;
    padding: 45px;
}

@media (max-width: 767px) {
    main.markdown-body {
        padding: 15px;
    }
}

/* Top navigation */
header {
    background: transparent;
}

header nav {
    box-sizing: border-box;
    min-width: 200px;
    max-width: 980px;
    margin: 0 auto;
    padding: 14px 45px 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
}

@media (max-width: 767px) {
    header nav {
        padding: 12px 15px 0;
    }
}

/* 导航内部右侧容器：把链接和搜索框横向排布并控制间距 */
header nav .nav-right {
    display: flex;
    align-items: center;
    gap: 14px;
}

/* 导航链接基础样式：默认强调色 + 半粗体 */
header nav a {
    color: var(--fgColor-accent);
    text-decoration: none;
    font-weight: 600;
}

/* 导航链接悬停反馈：仅在 hover 时显示下划线 */
header nav a:hover {
    text-decoration: underline;
}

/* Minimal list styling for index/tag/category pages */

/* 首页/分类/标签页列表容器：移除默认圆点并贴齐左边界 */
.markdown-body .post-list,
.markdown-body .tax-list {
    list-style: none;
    padding-left: 0;
}

/* 列表项横向布局：标题与日期分列，基线对齐并保留垂直留白 */
.markdown-body .post-item,
.markdown-body .tax-item {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding: 6px 0;
}

/* 覆盖 github-markdown 的 li+li 间距，仅作用于你的文章列表 */
.markdown-body .post-list > .post-item + .post-item {
  margin-top: 0;
}

/* 收紧列表项上下留白 */
.markdown-body .post-list > .post-item {
  padding: 3px 0;
}

/* 列表项链接默认不加下划线，保持简洁 */
.markdown-body .post-item a,
.markdown-body .tax-item a {
    text-decoration: none;
}

/* 列表项链接悬停时增加下划线，提供可点击提示 */
.markdown-body .post-item a:hover,
.markdown-body .tax-item a:hover {
    text-decoration: underline;
}

/* 分页容器：居中布局，允许换行，适配窄屏 */
.pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    align-items: center;
    justify-content: center;
    margin: 24px 0 0;
}

/* 分页按钮基础样式：弱按钮视觉（无边框、底部高亮线） */
.pagination-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 2px;
    border: 0;
    border-bottom: 1px solid transparent;
    text-decoration: none;
    color: var(--fgColor-default);
    font-size: 0.92em;
    letter-spacing: 0.02em;
}

/* 当前页状态：底边线高亮并稍加粗 */
.pagination-link.is-current {
    border-bottom-color: var(--borderColor-muted, #d1d9e0b3);
    color: var(--fgColor-default);
    font-weight: 500;
}

/* 不可点击状态：弱化颜色并去掉底边强调 */
.pagination-link.is-disabled {
    color: var(--fgColor-muted);
    border-bottom-color: transparent;
}

/* 可点击分页项悬停反馈：显示底边线 */
.pagination-link:hover {
    border-bottom-color: var(--borderColor-default, #d1d9e0);
}

/* 文章日期/元信息：弱化显示并防止日期换行断裂 */
.markdown-body .meta {
    color: var(--fgColor-muted);
    font-size: 0.9em;
    white-space: nowrap;
}

/* Post footer meta (category/tags) */
.post-meta-footer {
    margin-top: 24px;
    padding-top: 12px;
    border-top: 1px solid var(--borderColor-muted);
    color: var(--fgColor-muted);
    font-size: 0.9em;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
}

/* 文章底部元信息中的链接：默认继承父级颜色，避免喧宾夺主 */
.post-meta-footer a {
    color: inherit;
    text-decoration: none;
}

/* 文章底部元信息链接悬停：强调色 + 下划线提示 */
.post-meta-footer a:hover {
    color: var(--fgColor-accent);
    text-decoration: underline;
}

/* Post images: rounded + centered */
.markdown-body img {
    border-radius: 8px;
    display: block;
    margin: 0 auto;
}

/* Callouts */
.markdown-body .callout {
    border: none;
    border-left: 3px solid var(--callout-accent, var(--fgColor-accent));
    background: var(--callout-bg, var(--bgColor-muted));
    padding: 12px 14px;
    border-radius: 6px;
    margin: 16px 0;
}

/* 修复 callout 内段落默认下边距导致的“空一行”视觉问题 */
.markdown-body .callout p {
    margin: 0.4em 0;
}

/* 首尾段落不额外撑开边距 */
.markdown-body .callout > :first-child {
    margin-top: 0;
}

.markdown-body .callout > :last-child {
    margin-bottom: 0;
}

.markdown-body .callout-title {
    font-size: 0.92em;
    font-weight: 600;
    margin-bottom: 6px;
    color: var(--callout-accent, var(--fgColor-accent));
}

.markdown-body .callout-content > :first-child {
    margin-top: 0;
}

.markdown-body .callout-content > :last-child {
    margin-bottom: 0;
}

.markdown-body .callout-note {
    --callout-accent: #0969da;
    --callout-bg: rgba(9, 105, 218, 0.06);
}

.markdown-body .callout-tip {
    --callout-accent: #2da44e;
    --callout-bg: rgba(45, 164, 78, 0.06);
}

.markdown-body .callout-warning {
    --callout-accent: #d29922;
    --callout-bg: rgba(210, 153, 34, 0.08);
}

.markdown-body .callout-important {
    --callout-accent: #8250df;
    --callout-bg: rgba(130, 80, 223, 0.06);
}

.markdown-body .callout-caution {
    --callout-accent: #cf222e;
    --callout-bg: rgba(207, 34, 46, 0.06);
}

/* 深色模式下 callout 公共背景：避免浅色背景在暗色主题中过亮 */
.dark .markdown-body .callout,
[data-theme="dark"] .markdown-body .callout {
    background: var(--callout-bg-dark, rgba(255,255,255,0.03));
}

/* 深色模式各类 callout 的专属背景变量（保持语义色但降低亮度） */
.dark .markdown-body .callout-note,
[data-theme="dark"] .markdown-body .callout-note {
    --callout-bg-dark: rgba(9, 105, 218, 0.10);
}

.dark .markdown-body .callout-tip,
[data-theme="dark"] .markdown-body .callout-tip {
    --callout-bg-dark: rgba(45, 164, 78, 0.10);
}

.dark .markdown-body .callout-warning,
[data-theme="dark"] .markdown-body .callout-warning {
    --callout-bg-dark: rgba(210, 153, 34, 0.10);
}

.dark .markdown-body .callout-important,
[data-theme="dark"] .markdown-body .callout-important {
    --callout-bg-dark: rgba(130, 80, 223, 0.10);
}

.dark .markdown-body .callout-caution,
[data-theme="dark"] .markdown-body .callout-caution {
    --callout-bg-dark: rgba(207, 34, 46, 0.10);
}

/* Page layout with sidebar TOC (outside markdown body) */
.page-layout {
    position: relative;
}

/* 正文主内容块在带侧栏布局中的宽度和内边距控制 */
.page-layout .markdown-body {
    max-width: 980px;
    margin: 0 auto;
    padding: 45px;
}

/* 防止内容在 flex/grid 场景下因最小宽度导致溢出 */
.post-content {
    min-width: 0;
}

/* 右侧目录（TOC）：固定定位在正文右侧，超高时可滚动 */
.post-toc {
    position: fixed;
    top: 90px;
    left: calc(50% + 490px + 24px);
    width: 200px;
    padding: 8px 0 8px 14px;
    border-left: 1px solid var(--borderColor-muted);
    color: var(--fgColor-muted);
    max-height: calc(100vh - 140px);
    overflow: auto;
}

/* 无目录内容时直接隐藏整个 TOC 容器 */
.post-toc.is-empty {
    display: none;
}

/* TOC 标题：小号大写标签样式，强化结构层级 */
.toc-title {
    font-size: 0.75em;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 10px;
    color: var(--fgColor-muted);
}

/* TOC 链接列表纵向排列并控制每项间距 */
.toc-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* TOC 链接默认弱化，避免抢正文视觉焦点 */
.toc-link {
    color: var(--fgColor-muted);
    text-decoration: none;
    font-size: 0.9em;
}

/* TOC 链接悬停增强可读性与可点击感 */
.toc-link:hover {
    color: var(--fgColor-default);
    text-decoration: underline;
}

/* TOC 二级项缩进并略微缩小字号，体现层级关系 */
.toc-link-sub {
    padding-left: 12px;
    font-size: 0.86em;
}

/* 窄屏下关闭侧边 TOC，避免遮挡正文并提升移动端阅读体验 */
@media (max-width: 980px) {
    .page-layout {
        padding: 0;
    }

    .page-layout .markdown-body {
        padding: 15px;
    }

    .post-toc {
        display: none;
    }
}

/* Floating action buttons and theme toggle */
.fab,
.theme-toggle {
    position: fixed;
    right: 16px;
    z-index: 10;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--borderColor-default);
    background: var(--bgColor-muted);
    color: var(--fgColor-default);
    border-radius: 999px;
    font: inherit;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    padding: 0;
}

/* 悬浮按钮悬停反馈：轻微边框变化提示交互状态 */
.fab:hover,
.theme-toggle:hover {
    border-color: var(--borderColor-muted);
}

/* 主题切换按钮固定在右下角 */
.theme-toggle {
    bottom: 16px;
}

/* 让主题切换按钮可承载伪元素图标 */
.theme-toggle {
    position: relative;
}

/* 主题按钮内置圆形“明暗”图标（纯 CSS 绘制） */
.theme-toggle::before {
    content: "";
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1px solid var(--borderColor-default);
    background: linear-gradient(90deg, var(--fgColor-default) 0 50%, var(--bgColor-default) 50% 100%);
    box-sizing: border-box;
}

/* 返回顶部按钮默认隐藏，滚动后通过 JS 添加类名显示 */
.fab-top {
    bottom: 68px;
    display: none;
}

/* 返回顶部按钮可见态 */
.fab-top.is-visible {
    display: flex;
}


/* 主题切换按钮 */
#themeToggle {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 10;
}

/* 主题样式*/
/* 强制默认浅色（不依赖 prefers-color-scheme） */
html[data-theme="light"] .markdown-body {
  color-scheme: light;
  --bgColor-default: #ffffff;
  --fgColor-default: #1f2328;
  --fgColor-accent: #0969da;
  --bgColor-muted: #f6f8fa;
  --borderColor-muted: #d1d9e0b3;
}

/* 深色主题 */
/* 自定义：浅灰色背景 */
/* 正文提亮 10%、标题再提亮 5%、muted 色微调让层级梯度更线性，不动背景和边框。 */
html[data-theme="dark"] .markdown-body {
    --bgColor-default: #292a2d;
    --fgColor-default: #e6edf3;      /* 原来是 #d8d8db */
    --fgColor-accent: #58a6ff;        /* 原来是 #4493f8，轻微提亮 */
    --fgColor-muted: #8b949e;         /* 需在此处也覆盖 muted */
    --bgColor-muted: #151b23;
    --borderColor-muted: #3d444db3;
    background-color: var(--bgColor-default);
}

/* 深色主题 */
/* Github 默认深色背景 */
/* html[data-theme="dark"] {
    --bgColor-default: #0d1117;
} */

/* 深色主题标题颜色增强，提升层级可读性 */
html[data-theme="dark"] .markdown-body h1-h6 {
    color: #f0f6fc;
}


/* 统一导航与列表链接在浅色模式下的默认视觉 */
header nav a,
.markdown-body .post-item a,
.markdown-body .tax-item a {
  color: #111827;
  text-decoration: none;
  transition: color 0.15s ease, opacity 0.15s ease;
}

/* 深色模式下导航与列表链接采用低亮灰色，减少刺眼感 */
/* 文章列表标题 — 首页主内容，应清晰可读 */
html[data-theme="dark"] .markdown-body .post-item a,
html[data-theme="dark"] .markdown-body .tax-item a {
  color: #c9cdd1;
}

/* 导航链接 — 可见但克制 */
html[data-theme="dark"] header nav a {
  color: #b4b8bf;
}
/* 链接悬停统一切换为主题强调色 */
header nav a:hover,
.markdown-body .post-item a:hover,
.markdown-body .tax-item a:hover {
  color: var(--fgColor-accent);
}