/* 覆盖 vuepress 默认主题的样式 */

.home {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;

  max-width: 100vw;
  padding-top: calc(var(--navbar-height) + 2rem);

  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}

.navbar {
  background-color: var(--c-bg-lighter);
  border: none;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: var(--c-border);

  box-shadow: 0px 0px 10px 1px rgba(220, 220, 220, 0.2);
}

.navbar .navbar-items-wrapper {
  position: unset;
  width: 100%;
  max-width: unset !important;

  padding-left: 20rem;

  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: center;
}

/* 边栏展开收缩控制按钮，从 top 1.6rem下移 2 rem，避免被左上角 LOGO 和标题挡住 */
.toggle-sidebar-button {
  top: 3.6rem;
  /* 调高深度避免被同一行的导航菜单遮挡 */
  z-index: 1000;
}

.toggle-color-mode-button {
  margin: 0;
}

/* 隐藏导航栏的 LOGO 和站点名称，以便用自定义的组件替换 */
.navbar > span > a {
  display: none;
}

.navbar .site-name {
  font-size: 1.8rem !important;
}

.home .theme-default-content {
  width: 100%;
  height: 100%;
}

.home .theme-default-content > div {
  height: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}

.theme-default-content.custom {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-content: stretch;
  align-items: stretch;
  flex-wrap: nowrap;
}

.home .hero {
  width: 100%;
}

.home .hero .description{
  max-width: 48rem;
}

/* 隐藏按钮中的外部链接图标 */
.home .hero .actions a .external-link-icon{
  display: none;
}
.home .hero .actions a .external-link-icon-sr-only{
  display: none;
}

/* 兼容 vuepress 的尺寸 719px ，对导航菜单调整为两行 */
@media screen and (max-width: 719px) {
  /* 首页不显示边栏控制按钮，因此不必升高导航栏 */
  .navbar {
    height: calc(2 * var(--navbar-height));
  }

  /* 首页不显示边栏控制按钮，因此不必升高导航栏 */
  .home {
    padding-top: calc(2 * var(--navbar-height) + 2rem);
  }
  .navbar .navbar-items-wrapper {
    padding-left: 6rem;
    position: absolute;
    top: 3.6rem;
  }
}

.sidebar .sidebar-items {
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.sidebar-item.sidebar-heading {
  border-style: none;
  border-bottom-style: dashed;
  border-width: 1px;
  margin-bottom: 1rem;
  text-align: center;
  border-color: var(--c-border-darker);
}

/* 边栏目录提纲上面的文章名称两侧加上符号 */
/* .sidebar .sidebar-items .sidebar-item.sidebar-heading::before {
  content: "*";
  margin-right: 0.5rem;
}

.sidebar .sidebar-items .sidebar-item.sidebar-heading::after {
  content: "*";
  margin-left: 0.5rem;
} */

/* ------------------ 自动生成目录或标题序号：开始 ------------------ */
/* 为正文的段落标题自动加上层级序号，只加到 4 级， h1 是文章标题， h2 是1级标题，处理至 h5 四级标题 */

/* 在正文的一级标题的父级标签上声明计数器 */
.page > .theme-default-content > div > h1 {
  counter-reset: h2counter;
}
.page > .theme-default-content > div > h2:before {
  /* 每一个同类子级标签上对计数器自增 1 ，以此实现对同类子级的数量统计 */
  /* 并将计数结果显示在前:before ，并以 序号 + “.  ” 显示 */
  counter-increment: h2counter;
  content: counter(h2counter) ".\0000a0\0000a0";
}

/* 在正文的二级标题的父级标签上声明计数器 */
.page > .theme-default-content > div > h2 {
  counter-reset: h3counter;
}
.page > .theme-default-content > div > h3:before {
  /* 每一个同类子级标签上对计数器自增 1 ，以此实现对同类子级的数量统计 */
  /* 并将计数结果显示在前:before ，并以 序号 + “.  ” 显示 */
  counter-increment: h3counter;
  content: counter(h2counter) "." counter(h3counter) ".\0000a0\0000a0";
}

/* 在正文的三级标题的父级标签上声明计数器 */
.page > .theme-default-content > div > h3 {
  counter-reset: h4counter;
}
.page > .theme-default-content > div > h4:before {
  /* 每一个同类子级标签上对计数器自增 1 ，以此实现对同类子级的数量统计 */
  /* 并将计数结果显示在前:before ，并以 序号 + “.  ” 显示 */
  counter-increment: h4counter;
  content: counter(h2counter) "." counter(h3counter) "." counter(h4counter) ".\0000a0\0000a0";
}

/* 在正文的四级标题的父级标签上声明计数器 */
.page > .theme-default-content > div > h4 {
  counter-reset: h5counter;
}
.page > .theme-default-content > div > h5:before {
  /* 每一个同类子级标签上对计数器自增 1 ，以此实现对同类子级的数量统计 */
  /* 并将计数结果显示在前:before ，并以 序号 + “.  ” 显示 */
  counter-increment: h5counter;
  content: "\0000a0\0000a0"counter(h5counter) ").\0000a0";
}

/* 为边栏的目录自动加上层级序号，只加到 2 级，与正文段落标题的序号一致 */
.sidebar > .sidebar-items > li > ul.sidebar-item-children {
  /* 在一级标题的父级标签上声明计数器 */
  counter-reset: s1counter;
}

.sidebar > .sidebar-items > li > ul.sidebar-item-children > li > a:before {
  /* 每一个同类子级标签上对计数器自增 1 ，以此实现对同类子级的数量统计 */
  /* 并将计数结果显示在前:before ，并以 序号 + “.  ” 显示 */
  counter-increment: s1counter;
  content: counter(s1counter) ".\0000a0";
}

.sidebar > .sidebar-items > li > ul.sidebar-item-children > li > ul.sidebar-item-children {
  /* 在二级标题的父级标签上声明计数器 */
  counter-reset: s2counter;
}

.sidebar > .sidebar-items > li > ul.sidebar-item-children > li > ul.sidebar-item-children > li > a:before {
  /* 每一个同类子级标签上对计数器自增 1 ，以此实现对同类子级的数量统计 */
  /* 并将计数结果显示在前:before ，并以 序号 + “.  ” 显示 */
  counter-increment: s2counter;
  content: counter(s1counter) "." counter(s2counter) ".\0000a0";
}

/* ------------------ 自动生成目录或标题序号：结束 ------------------ */

/* ------------ 处理移动端自适应 ----------- */

@media screen and (max-width: 719px) {
  /* .navbar .can-hide {
      display: inherit;
  } */

  .sidebar {
    top: 7rem;
    padding-top: 0;
  }
}

@media screen and (max-width: 959px) {
  .page .theme-default-content {
    padding: 2rem;
    padding-top: 4rem;
  }
}

/* Markdown 文档内容主题样式 */

/* ----------- 关于 Markdown 提示符“>”的样式 [Start] ----------- */
.theme-default-content blockquote {
  /* color: var(--c-text-quote);
  border-left: 0.2rem solid var(--c-border-dark); */

  border-color: var(--c-tip);
  background-color: var(--c-tip-bg);
  color: var(--c-tip-text);

  padding: 0.5rem 1.5rem;
  border-left-width: 0.5rem;
  border-left-style: solid;
  margin: 1rem 0;
}

/* 当在提示符中使用 h1 ~ h6 自定义标题时，将以下设置为最高优先， */
/* 确保其样式保持与自动标题的样式一致，不受到外部样式的影响 */
.theme-default-content blockquote > :first-child:is(h1, h2, h3, h4, h5, h6) {
  margin: 0;
  padding: 0;
  display: block;
  color: var(--c-tip-title);
  margin-bottom: 0.5rem;
}

/* 当在提示符中使用 h1 ~ h6 自定义标题，并且只有标题而没有其它子元素时，不必保留标题行和内容的间隔空间 */
.theme-default-content blockquote > :only-child:is(h1, h2, h3, h4, h5, h6) {
  margin-bottom: 0;
}

/* 优化采用自定义标题时的样式 */
.theme-default-content blockquote > :not(h1, h2, h3, h4, h5, h6, hr) {
  margin: 0 !important;
}


/* 当提示符的内容第一个元素不是自定义标题 h1~h6 元素时，在其之前自动加上字符“提示”作为标题 */
/* 当第一个元素采用 h1 ~ h6 元素自定义标题时，便不会自动加入默认的标题 */
.theme-default-content blockquote > :first-child:not(h1, h2, h3, h4, h5, h6):before {
  content: "提示";
  display: block;
  color: var(--c-tip-title);
  font-weight: 600;
  margin-bottom: 0.5rem;
}

/* 当提示符的内容的语言被声明为英文 "en" 时，自动加上英文字符“TIPS”作为标题  */
/* 在提示符的任意一个父元素上声明 lang 属性可以指定内容的语言，例如：lang="en" */
.theme-default-content blockquote:lang(en) > :first-child:is(h1, h2, h3, h4, h5, h6):before {
  content: "TIPS";
}

/* 提示符中分割线的样式：上下增加空间 */
.theme-default-content blockquote hr {
  margin: 0.5rem 0;
  border-color: var(--c-border-dark);
}

/* ----------- 关于 Markdown 提示符“>”的样式 [End] ----------- */

/* 代码块颜色 */
.theme-default-content code {
  color: chocolate;
}
