/* 基础样式设置 */
.markdown-body {
  /* 引入背景图片，设置固定不滚动并居中 */
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  padding: 2rem;
  min-height: 100vh;
  transition: background-color 0.3s ease;
}

/* 内容容器 - 有文字的区域 */
.markdown-content {
  /* 日间模式背景为白色 */
  background-color: #fff;
  border-radius: 8px;
  padding: 2rem;
  max-width: 800px;
  margin: 0 auto;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transition: background-color 0.3s ease, color 0.3s ease;
}


.markdown-body.dark-mode .markdown-content {
  /* 夜间模式背景为深色 */
  background-color: #1a1a1a;
  color: #f0f0f0;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
}

/* 为 Markdown 中的缩进内容添加层级样式 */
/* 适用于普通文本缩进（如列表、代码块外的文本缩进） */
.markdown-body p,
.markdown-body ul,
.markdown-body ol {
  /* 基础行高，增强可读性 */
  line-height: 1.8;
}

/* 一级缩进（通常是 4 个空格或 1 个 Tab） */
.markdown-body p-indent-1,
.markdown-body ul-indent-1,
.markdown-body ol-indent-1 {
  padding-left: 2rem; /* 左侧缩进距离 */
  color: #555; /* 可选：用颜色区分层级 */
}

/* 二级缩进 */
.markdown-body p-indent-2,
.markdown-body ul-indent-2,
.markdown-body ol-indent-2 {
  padding-left: 4rem;
  color: #777;
}

/* 对列表项的特殊处理 */
.markdown-body ul li {
  margin: 0.5rem 0;
}
.markdown-body ul li ul li {
  /* 二级列表项 */
  padding-left: 0.5rem;
  list-style-type: circle; /* 用不同符号区分层级 */
}
.markdown-body ul li ul li ul li {
  /* 三级列表项 */
  list-style-type: square;
}

/* 代码块样式 */
.markdown-body pre code {
  font-family: Consolas, Monaco, monospace;
  line-height: 1.6;
  display: block;
  padding: 1rem;
  border-radius: 4px;
  overflow-x: auto;
}

/* 夜间模式下的文本和代码块调整 */
.markdown-body.dark-mode p-indent-1,
.markdown-body.dark-mode ul-indent-1,
.markdown-body.dark-mode ol-indent-1 {
  color: #bbb;
}

.markdown-body.dark-mode p-indent-2,
.markdown-body.dark-mode ul-indent-2,
.markdown-body.dark-mode ol-indent-2 {
  color: #999;
}

.markdown-body.dark-mode pre code {
  background-color: #2d2d2d;
  color: #ccc;
}