/* ===================================
   亥姆霍兹学术纪念风格 · publish.css
   设计理念：19世纪德式学术 + 现代阅读舒适度
   =================================== */

/* 1. 字体导入：经典德式衬线 + 清晰现代无衬线 */
@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,500;0,8..60,600;0,8..60,700;1,8..60,400;1,8..60,500&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

/* 2. 基础变量定义 */
body {
  /* 正文：Source Serif 4 兼具古典韵味和现代屏显优化 */
  --font-text-theme: 'Source Serif 4', 'Georgia', 'Times New Roman', serif;
  /* 界面：Inter 是学术PPT和论文摘要常用字体 */
  --font-interface-theme: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  /* 代码：JetBrains Mono 清晰且专业 */
  --font-monospace-theme: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace;
  
  /* 字号：16px是学术论文标准印刷体大小，在屏幕上正好 */
  --font-text-size: 16px;
  /* 代码块字号略小 */
  --font-code-size: 14px;
}

/* 3. Publish 布局变量 */
.published-container {
  --page-width: 1000px;        /* 稍宽，适合长文和表格 */
  --page-side-padding: 48px;   /* 留白舒适 */
  --line-height-normal: 1.7;    /* 全局行高 */
}

/* ===================================
   正文排版 —— 德式学术的严谨
   =================================== */

/* 3.1 正文核心样式 */
.markdown-preview-view p {
  text-align: justify;         /* 两端对齐，学术标准 */
  hyphens: auto;               /* 自动连字符，英文更美观 */
  -webkit-hyphens: auto;
  line-height: 1.7;            /* 略高，便于长时间阅读 */
  margin-block-start: 0.8em;
  margin-block-end: 0.8em;
}

/* 3.2 标题层级 —— 清晰而不喧宾夺主 */
.markdown-preview-view h1 {
  font-family: 'Source Serif 4', 'Georgia', serif;
  font-weight: 700;
  font-size: 2.2em;
  letter-spacing: -0.01em;
  margin-top: 1.8em;
  margin-bottom: 0.6em;
  border-bottom: none;         /* 去掉默认下划线，用粗细区分 */
  color: #1a2b3c;              /* 深蓝灰，沉稳 */
}

.markdown-preview-view h2 {
  font-weight: 600;
  font-size: 1.8em;
  margin-top: 1.5em;
  margin-bottom: 0.5em;
  border-bottom: 1px solid #d1d9e6;  /* 极浅灰下划线，致敬德式论文 */
  padding-bottom: 0.2em;
}

.markdown-preview-view h3 {
  font-weight: 600;
  font-size: 1.5em;
  margin-top: 1.3em;
}

.markdown-preview-view h4 {
  font-weight: 600;
  font-size: 1.3em;
  font-style: italic;          /* 四级标题斜体，保留学术习惯 */
}

/* 3.3 列表样式 */
.markdown-preview-view ul, 
.markdown-preview-view ol {
  padding-left: 1.8em;
  line-height: 1.7;
}

.markdown-preview-view li {
  margin: 0.3em 0;
}

/* ===================================
   学术元素专精设计
   =================================== */

/* 4.1 摘要（Callout）—— 模拟论文摘要框 */
.callout[data-callout="abstract"] {
  background-color: #f4f7fb;   /* 极浅蓝灰 */
  border-left: 4px solid #3a6ea5;  /* 普鲁士蓝，致敬德国科学 */
  border-radius: 0 8px 8px 0;
  font-family: 'Inter', sans-serif;
  font-size: 0.95em;
  box-shadow: 0 2px 8px rgba(0,20,40,0.05);
}

.callout[data-callout="abstract"] .callout-title {
  font-weight: 600;
  color: #1e3a6b;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* 4.2 Tip 类 callout（用于公式、定理） */
.callout[data-callout="tip"] {
  background-color: #f0f5fa;
  border-left: 4px solid #2c5e8c;
  border-radius: 0 8px 8px 0;
}

.callout[data-callout="tip"] .callout-title {
  font-weight: 600;
  color: #1e3a6b;
}

/* 4.3 Quote 类 callout（用于名人名言） */
.callout[data-callout="quote"] {
  background-color: #f9f7f4;   /* 羊皮纸色 */
  border-left: 4px solid #8b7355;  /* 古铜色 */
  font-style: normal;           /* 不强制斜体，保持原样 */
  font-family: 'Source Serif 4', serif;
}

.callout[data-callout="quote"] .callout-title {
  color: #5e4b3a;
}

/* 4.4 公式居中并加一点阴影，突出学术感 */
.math-block {
  text-align: center;
  font-size: 1.1em;
  padding: 0.5em 0;
  filter: drop-shadow(0 2px 2px rgba(0,0,0,0.02));
}

/* 4.5 表格 —— 干净清爽的学术三线表风格 */
.markdown-preview-view table {
  border-collapse: collapse;
  width: auto;
  margin: 1.5em auto;
  font-size: 0.95em;
  font-family: 'Inter', sans-serif;
  box-shadow: 0 2px 8px rgba(0,0,0,0.03);
}

.markdown-preview-view th {
  background-color: #eef2f7;   /* 表头浅灰 */
  font-weight: 600;
  border: none;
  border-bottom: 2px solid #2c5e8c;  /* 下粗线，三线表风格 */
  padding: 10px 14px;
  text-align: center;
}

.markdown-preview-view td {
  border: none;
  border-bottom: 1px solid #dde3ed;  /* 细线分隔 */
  padding: 8px 14px;
}

.markdown-preview-view tr:last-child td {
  border-bottom: none;
}

/* 4.6 双链和外部链接 —— 有学术味的互动 */
.markdown-preview-view a.internal-link,
.markdown-preview-view a.external-link {
  color: #1f5e8e;              /* 深邃蓝 */
  text-decoration: none;
  border-bottom: 1px dotted #a0b8d0;
  transition: border-bottom 0.2s ease, color 0.2s ease;
}

.markdown-preview-view a.internal-link:hover,
.markdown-preview-view a.external-link:hover {
  color: #0a2e4a;
  border-bottom: 1px solid #1f5e8e;
}

/* 4.7 代码块 —— 专业且克制 */
.markdown-preview-view pre {
  background-color: #f2f4f8;
  border-radius: 6px;
  padding: 16px;
  font-family: var(--font-monospace-theme);
  font-size: 0.9em;
  border: 1px solid #e2e7ed;
}

.markdown-preview-view code {
  background-color: #f0f2f5;
  color: #2d4059;
  border-radius: 4px;
  padding: 0.2em 0.4em;
  font-size: 0.9em;
}

/* 4.8 引用块 blockquote */
.markdown-preview-view blockquote {
  margin: 1.2em 0;
  padding: 0.2em 1.2em;
  border-left: 3px solid #8a9eb0;
  background-color: #f9fafc;
  color: #3e4f5e;
  font-style: italic;
}

/* ===================================
   浅色/深色模式适配
   =================================== */
.theme-light {
  --background-primary: #ffffff;
  --text-normal: #242e3b;       /* 柔黑 */
  --text-muted: #4a5568;        /* 深灰 */
  --text-faint: #7b8b9d;        /* 中灰 */
  --text-accent: #1f5e8e;       /* 主题蓝 */
  --background-secondary: #f5f7fa;
  --interactive-accent: #1f5e8e;
}

.theme-dark {
  --background-primary: #1c2026;
  --text-normal: #e3e7ed;
  --text-muted: #b6c2d0;
  --text-faint: #8895a8;
  --text-accent: #82b1d9;       /* 暗色模式下亮一些的蓝 */
  --background-secondary: #262c35;
  --interactive-accent: #82b1d9;
}

/* ===================================
   页面标题特殊处理
   =================================== */
.page-title {
  font-family: 'Source Serif 4', serif;
  font-weight: 700;
  font-size: 2.5em;
  letter-spacing: -0.01em;
  color: #1d2e44;
  border-bottom: 2px solid #d4deec;
  padding-bottom: 0.3em;
  margin-bottom: 1em;
}

.theme-dark .page-title {
  color: #dde5f0;
  border-bottom-color: #3a4455;
}

/* ===================================
   特殊元素：脚注、标记等
   =================================== */
.markdown-preview-view mark {
  background-color: #fbf3db;    /* 淡黄色高亮，像纸质书荧光笔 */
  color: inherit;
  padding: 0.1em 0.2em;
  border-radius: 3px;
}

/* 脚注 */
.footnotes {
  font-size: 0.9em;
  border-top: 1px solid #d1d9e6;
  margin-top: 3em;
  padding-top: 1.5em;
}

/* ===================================
   普鲁士蓝分层文件夹 · Publish精确版
   与亥姆霍兹学术风格完美统一
   =================================== */

/* 基础样式：所有文件夹项的平滑过渡 */
.tree-item-inner {
  transition: background-color 0.2s ease, border-left 0.2s ease;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 1px 0;
}

/* 第1层文件夹（根目录下）- 最浅的普鲁士蓝 */
.tree-item > .tree-item > .tree-item-inner {
  background-color: rgba(31, 94, 142, 0.04);  /* 4%透明度 */
  border-left: 2px solid transparent;
}

/* 第2层文件夹 - 稍深一点 */
.tree-item > .tree-item > .tree-item > .tree-item-inner {
  background-color: rgba(31, 94, 142, 0.06);  /* 6%透明度 */
}

/* 第3层文件夹 - 再深一点 */
.tree-item > .tree-item > .tree-item > .tree-item > .tree-item-inner {
  background-color: rgba(31, 94, 142, 0.08);  /* 8%透明度 */
}

/* 第4层文件夹 - 继续加深 */
.tree-item > .tree-item > .tree-item > .tree-item > .tree-item > .tree-item-inner {
  background-color: rgba(31, 94, 142, 0.10);  /* 10%透明度 */
}

/* 第5层及以上 - 最深但依然克制 */
.tree-item > .tree-item > .tree-item > .tree-item > .tree-item > .tree-item > .tree-item-inner {
  background-color: rgba(31, 94, 142, 0.12);  /* 12%透明度 */
}

/* 悬停效果：所有文件夹统一加深 */
.tree-item-inner:hover {
  background-color: rgba(31, 94, 142, 0.18) !important;
  border-left: 2px solid rgba(31, 94, 142, 0.3);
}

/* 当前选中的文件夹 - 更明显的强调 */
.tree-item.is-active > .tree-item-inner {
  background-color: rgba(31, 94, 142, 0.22) !important;
  border-left: 3px solid rgba(31, 94, 142, 0.6);
  font-weight: 500;
}

/* 展开/折叠箭头也配上主题色（可选） */
.tree-item-icon {
  color: rgba(31, 94, 142, 0.6);
  transition: transform 0.2s ease;
}

/* 文件夹名称文字微调 */
.tree-item-inner {
  font-weight: 400;
}

/* 当前选中文件夹的文字加粗 */
.tree-item.is-active > .tree-item-inner {
  font-weight: 500;
}

/* ===================================
   深色模式适配
   =================================== */
.theme-dark .tree-item > .tree-item > .tree-item-inner {
  background-color: rgba(130, 180, 230, 0.06);  /* 深色模式下用亮一点的蓝 */
}

.theme-dark .tree-item > .tree-item > .tree-item > .tree-item-inner {
  background-color: rgba(130, 180, 230, 0.08);
}

.theme-dark .tree-item > .tree-item > .tree-item > .tree-item > .tree-item-inner {
  background-color: rgba(130, 180, 230, 0.10);
}

.theme-dark .tree-item > .tree-item > .tree-item > .tree-item > .tree-item > .tree-item-inner {
  background-color: rgba(130, 180, 230, 0.12);
}

.theme-dark .tree-item > .tree-item > .tree-item > .tree-item > .tree-item > .tree-item > .tree-item-inner {
  background-color: rgba(130, 180, 230, 0.14);
}

.theme-dark .tree-item-inner:hover {
  background-color: rgba(130, 180, 230, 0.22) !important;
  border-left-color: rgba(130, 180, 230, 0.5);
}

.theme-dark .tree-item.is-active > .tree-item-inner {
  background-color: rgba(130, 180, 230, 0.28) !important;
  border-left-color: rgba(130, 180, 230, 0.7);
}

.theme-dark .tree-item-icon {
  color: rgba(130, 180, 230, 0.7);
}

/* ===================================
   可选：为特定重要文件夹添加微标记
   如果你有特定的文件夹想突出显示
   =================================== */
/*
.tree-item-inner[title="12_科学革命时期"] {
  border-left: 2px solid rgba(31, 94, 142, 0.4);
  font-weight: 500;
}
*/
/* ===================================
   移动端字体优化片段
   仅影响手机和平板显示
   =================================== */

/* 平板优化 (750px - 1000px) */
@media screen and (max-width: 1000px) {
  /* 正文字体 */
  .markdown-preview-view {
    font-size: 17px;  /* 平板端稍大，便于阅读 */
    line-height: 1.7;
  }
  
  /* 标题字体 */
  .markdown-preview-view h1 { font-size: 2.4em; }
  .markdown-preview-view h2 { font-size: 2.0em; }
  .markdown-preview-view h3 { font-size: 1.7em; }
  .markdown-preview-view h4 { font-size: 1.4em; }
}

/* 手机优化 (宽度 ≤ 750px) */
@media screen and (max-width: 750px) {
  /* ----- 正文排版 ----- */
  .markdown-preview-view {
    font-size: 18px;      /* 手机端更大字体，适合近距离阅读 */
    line-height: 1.75;     /* 行高适当增加 */
    -webkit-text-size-adjust: 100%; /* 防止iOS自动调整字体 */
  }
  
  /* 段落间距 */
  .markdown-preview-view p {
    margin-bottom: 1.2em;
  }
  
  /* ----- 标题层级 ----- */
  .markdown-preview-view h1 {
    font-size: 2.6em;      /* 一级标题更大 */
    margin-top: 1.5em;
    margin-bottom: 0.5em;
  }
  
  .markdown-preview-view h2 {
    font-size: 2.2em;
    margin-top: 1.3em;
  }
  
  .markdown-preview-view h3 {
    font-size: 1.9em;
  }
  
  .markdown-preview-view h4 {
    font-size: 1.6em;
  }
  
  /* ----- 其他元素优化 ----- */
  
  /* 引用块 */
  .markdown-preview-view blockquote {
    font-size: 1.1em;
    padding: 0.3em 1.2em;
    margin: 1.2em 0;
  }
  
  /* 列表 */
  .markdown-preview-view ul,
  .markdown-preview-view ol {
    padding-left: 1.8em;
    font-size: 1em;
  }
  
  /* 代码块 */
  .markdown-preview-view pre {
    font-size: 15px;       /* 代码块略小，但依然清晰 */
    padding: 16px;
    overflow-x: auto;      /* 横向滚动，防止代码换行 */
    -webkit-overflow-scrolling: touch; /* 流畅滚动 */
  }
  
  .markdown-preview-view code {
    font-size: 0.95em;
  }
  
  /* 表格 - 手机端可横向滑动 */
  .markdown-preview-view table {
    font-size: 15px;
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;   /* 保持列宽，允许横向滚动 */
  }
  
  /* 表格单元格 */
  .markdown-preview-view th,
  .markdown-preview-view td {
    padding: 8px 12px;
  }
  
  /* 公式块 */
  .math-block {
    font-size: 1.1em;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  /* 行内公式 */
  .math-inline {
    font-size: 1.05em;
  }
  
  /* 脚注 */
  .footnotes {
    font-size: 15px;
  }
  
  /* 提示块 (callout) */
  .callout {
    font-size: 1em;
    padding: 12px 16px;
  }
  
  .callout-title {
    font-size: 1.1em;
  }
}

/* 小屏手机优化 (宽度 ≤ 400px) */
@media screen and (max-width: 400px) {
  .markdown-preview-view {
    font-size: 17px;       /* 极窄屏稍微回调，避免一行太少字 */
  }
  
  .markdown-preview-view h1 { font-size: 2.4em; }
  .markdown-preview-view h2 { font-size: 2.0em; }
  .markdown-preview-view h3 { font-size: 1.7em; }
  .markdown-preview-view h4 { font-size: 1.4em; }
  
  /* 进一步增加内边距 */
  .published-container {
    --page-side-padding: 20px;
  }
}

/* ===================================
   深色模式下的移动端优化（可选）
   =================================== */
.theme-dark .markdown-preview-view {
  /* 深色模式下文字对比度微调 */
  color: #e0e5ec;
}