/* =========================================================
   Longview Archive｜观势档案
   Material for MkDocs Custom CSS
   Version: clean-book-layout-01

   目标：
   - 顶部保持干净
   - 左侧目录更宽，不轻易换行
   - 左侧目录有书籍目录层级感
   - 隐藏右侧文章目录
   - 正文区域更舒展
   - 当前章节高亮更清楚
   ========================================================= */


/* =========================================================
   1. 全局页面宽度
   ========================================================= */

.md-grid {
  max-width: 1680px !important;
}


/* =========================================================
   2. 顶部栏
   ========================================================= */

.md-header {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.md-header__title {
  font-weight: 700;
  letter-spacing: 0.2px;
}

.md-search__form {
  border-radius: 3px;
}


/* =========================================================
   3. 隐藏左侧重复站名
   ========================================================= */

.md-nav--primary > .md-nav__title {
  display: none !important;
}


/* =========================================================
   4. 隐藏右侧文章目录
   ========================================================= */

.md-sidebar--secondary {
  display: none !important;
}


/* =========================================================
   5. 主体布局：左侧目录 + 正文
   ========================================================= */

.md-main__inner {
  gap: 4rem !important;
}

/* 左侧目录加宽，防止“长线观势文章”换行 */
.md-sidebar--primary {
  width: 23rem !important;
}

/* 左侧目录滚动区域 */
.md-sidebar__scrollwrap {
  scrollbar-width: thin;
}

.md-sidebar__scrollwrap::-webkit-scrollbar {
  width: 6px;
}

.md-sidebar__scrollwrap::-webkit-scrollbar-thumb {
  background: #c7c7c7;
  border-radius: 6px;
}

.md-sidebar__scrollwrap::-webkit-scrollbar-track {
  background: transparent;
}


/* =========================================================
   6. 正文区域
   ========================================================= */

.md-content {
  max-width: none !important;
}

.md-content__inner {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0.8rem;
  padding-right: 2rem;
}

/* 控制正文阅读宽度，不让文字无限拉长 */
.md-typeset {
  max-width: 1050px;
}


/* =========================================================
   7. 左侧目录：基础字体与间距
   ========================================================= */

.md-nav {
  font-size: 0.86rem;
  line-height: 1.85;
}

/* 所有目录链接 */
.md-nav__link {
  color: #2f2f2f;
  font-size: 0.86rem;
  line-height: 1.85;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-top: 0.12rem;
  padding-bottom: 0.12rem;
}

/* 鼠标悬停 */
.md-nav__link:hover {
  color: #2f5f6b !important;
}


/* =========================================================
   8. 左侧目录：一级栏目
   Home / Core Terms / Longview Essays / Aster Vale Notes
   ========================================================= */

.md-nav__item--section > .md-nav__link {
  font-size: 0.96rem;
  font-weight: 750;
  color: #555;
  letter-spacing: 0.2px;
  margin-top: 0.95rem;
  margin-bottom: 0.35rem;
}

/* 一级栏目允许自然显示，但不强制挤压 */
.md-nav__item--section > .md-nav__link .md-ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


/* =========================================================
   9. 左侧目录：子层级缩进线
   ========================================================= */

.md-nav__list .md-nav__list {
  margin-left: 0.55rem;
  padding-left: 1.05rem;
  border-left: 1px solid rgba(0, 0, 0, 0.10);
}

/* 第二层、第三层条目稍微轻一点 */
.md-nav__list .md-nav__list .md-nav__link {
  font-size: 0.84rem;
  color: #333;
}


/* =========================================================
   10. Reality / Future 这种可展开目录
   ========================================================= */

.md-nav__item .md-nav__toggle ~ .md-nav__link {
  font-weight: 650;
  color: #333;
}

/* 展开箭头不要太抢眼 */
.md-nav__icon {
  color: #555;
}


/* =========================================================
   11. 当前选中目录项
   ========================================================= */

.md-nav__link--active {
  font-weight: 700 !important;
  color: #2f5f6b !important;
  background: rgba(47, 95, 107, 0.08);
  border-radius: 6px;
  padding-left: 0.45rem;
  padding-right: 0.45rem;
}

/* 当前选中项左侧档案标记 */
.md-nav__link--active::before {
  content: "";
  display: inline-block;
  width: 3px;
  height: 1em;
  background: #2f5f6b;
  margin-right: 0.45rem;
  vertical-align: -0.12em;
}


/* =========================================================
   12. 面包屑路径
   ========================================================= */

.md-path {
  font-size: 0.74rem;
  color: #777;
  margin-bottom: 0.9rem;
}


/* =========================================================
   13. 正文标题层级
   ========================================================= */

.md-typeset h1 {
  font-size: 2.15rem;
  font-weight: 700;
  letter-spacing: 0.6px;
  color: #5a5a5a;
  margin-top: 0.8rem;
  margin-bottom: 1.6rem;
}

.md-typeset h2 {
  font-size: 1.45rem;
  font-weight: 700;
  color: #333;
  margin-top: 2.2rem;
  margin-bottom: 0.9rem;
  padding-bottom: 0.3rem;
  border-bottom: 1px solid #eeeeee;
}

.md-typeset h3 {
  font-size: 1.16rem;
  font-weight: 650;
  color: #333;
  margin-top: 1.7rem;
  margin-bottom: 0.7rem;
}


/* =========================================================
   14. 正文段落与列表
   ========================================================= */

.md-typeset p {
  font-size: 0.98rem;
  line-height: 1.88;
  color: #222;
}

.md-typeset ul,
.md-typeset ol {
  font-size: 0.96rem;
  line-height: 1.78;
}

.md-typeset li {
  margin-top: 0.15rem;
  margin-bottom: 0.15rem;
}


/* =========================================================
   15. 正文链接
   ========================================================= */

.md-typeset a {
  color: #2f5f6b;
}

.md-typeset a:hover {
  color: #1f4852;
}


/* =========================================================
   16. 页脚
   ========================================================= */

.md-footer {
  margin-top: 2rem;
}

.md-footer-meta {
  background: #111 !important;
}


/* =========================================================
   17. 移动端适配
   ========================================================= */

@media screen and (max-width: 1220px) {
  .md-sidebar--primary {
    width: 19rem !important;
  }

  .md-main__inner {
    gap: 2.5rem !important;
  }
}

@media screen and (max-width: 960px) {
  .md-sidebar--primary {
    width: 12rem !important;
  }

  .md-main__inner {
    gap: 1rem !important;
  }

  .md-content__inner {
    padding-left: 0.4rem;
    padding-right: 0.4rem;
  }

  .md-typeset {
    max-width: none;
  }

  .md-typeset h1 {
    font-size: 1.7rem;
  }

  .md-typeset h2 {
    font-size: 1.3rem;
  }
}