/* ============================================================
   工程管理导论 · 站点样式（极简版）
   原则：Material 默认样式已经够干净，能不覆盖就不覆盖。
   这里只做这几件事：
   1. 课件页图（ppt-deck / ppt-fig）：幻灯片紧挨排开 + 图内工具条
   2. 讲解折叠块（紧跟页图的 details）：收起零高，展开是浅底直角面板
   3. 页图灯箱（ppt-lightbox）
   4. 顶部阅读进度条（#ch-progress）
   5. 顶部导航栏：去掉半透明与毛玻璃
   6. 配色统一：accent 与正文链接同色
   7. 打印（隐藏页图、强制浅色）
   颜色一律用 Material 主题 token，深浅色自动适配；
   图内工具条压在幻灯片上，用固定深色半透明底保证任何页面都可读。
   ============================================================ */

/* ---------- 配色统一：全站只用一种蓝 ---------- */
/* 主题的 accent 槽位默认是橙的，左侧导航当前页就用它着色，
   和正文里蓝色的链接、目录高亮撞成两套色。
   把 accent 拉回正文链接色（--md-typeset-a-color）：
   浅色 #4051b5、深色 #5488e8，随主题自动切换。
   选择器要压过调色板的 [data-md-color-accent=...]，所以带上 body 限定 */
body[data-md-color-accent] {
  --md-accent-fg-color: var(--md-typeset-a-color);
  --md-accent-fg-color--transparent: color-mix(in srgb, var(--md-typeset-a-color) 10%, transparent);
}

/* ---------- 顶部导航栏：实底 ---------- */
/* Material 默认给顶栏半透明背景 + 毛玻璃，滚动时正文会透出来；
   改成与页面同色实底，去掉模糊 */
.md-header {
  background-color: var(--md-default-bg-color);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

/* ---------- 顶栏：查找栏贴到最右 ---------- */
/* Material 默认在顶栏右侧给仓库链接留约 230px（本站没配仓库，那里是空的），
   查找栏因此停在右侧目录之前；隐藏空占位后查找栏就贴到视口最右。
   注意别动 .md-header__title 的 flex：标题文字靠它撑开，改成不撑开会塌成 0 宽 */
.md-header__source { display: none; }

/* ---------- 侧栏固定 ---------- */
/* 正文区有 1.5rem 顶边距，侧栏的起点因此比吸顶位置低 30px：
   首屏一滚动，整列会先向上跳 30px。把 sticky 的 top 对齐正文顶
   （顶栏 2.4rem + 正文上边距 1.5rem = 3.9rem），两侧导航从首屏起就不动。
   主题 JS 按顶栏高度算滚动区高度，比实际多 30px，会顶出视口；
   这里按视口算高。
   侧栏是 0 高度的 sticky 盒子，目录溢出部分在页底会压到页脚：
   --ch-sidebar-avail 由 extra.js 按页脚上沿写入，目录止于页脚之前 */
@media screen and (min-width: 76.25em) {
  .md-sidebar {
    top: 3.9rem !important;
  }
  .md-sidebar__scrollwrap {
    height: min(calc(100vh - 6.1rem), var(--ch-sidebar-avail, 100vh)) !important;
  }
}

/* ---------- 顶栏标题固定 ---------- */
/* Material 滚过 h1 后把站点名换成页面名；本站始终显示站点名 */
.md-header__title .md-header__topic:not([data-md-component="header-topic"]) {
  opacity: 1 !important;
  transform: none !important;
}
.md-header__title .md-header__topic[data-md-component="header-topic"] {
  display: none !important;
}

/* ---------- 课件页图 ---------- */
.md-typeset .ppt-deck {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  margin: 0;
}
.md-typeset .ppt-fig {
  margin: 0;
  /* Material 默认 figure 是 width:fit-content，页图会缩成图注那么宽 */
  position: relative;
  width: 100%;
  overflow: hidden;
  background: var(--md-default-bg-color);
  cursor: pointer;
  /* 每张幻灯片一圈细边框：线在边框内，相邻幻灯片间距仍是 0 */
  border: 1px solid var(--md-default-fg-color--lighter);
}
/* 正在展开解析的幻灯片描一圈内发光主色，方便对照（不占版面） */
.md-typeset .ppt-fig[aria-expanded="true"] {
  outline: 2px solid var(--md-typeset-a-color);
  outline-offset: -2px;
  border-color: var(--md-typeset-a-color);
}
.md-typeset .ppt-fig img {
  display: block;
  width: 100%;
  height: auto;
}
/* 图注退居幕后：文字仍供灯箱与搜索使用，页面上不再占版面 */
.md-typeset .ppt-fig figcaption { display: none; }

/* 幻灯片右上角页码：常显的简约角标，不拦截点击（点它等于点幻灯片） */
.md-typeset .ppt-fig .ppt-page {
  position: absolute;
  top: .45rem;
  right: .45rem;
  z-index: 2;
  pointer-events: none;
  min-width: 1.3rem;
  padding: .08rem .3rem;
  border-radius: .28rem;
  background: rgba(15, 18, 26, .5);
  border: 1px solid rgba(255, 255, 255, .16);
  color: rgba(245, 247, 250, .95);
  font-size: .66rem;
  font-weight: 600;
  line-height: 1.35;
  text-align: center;
  font-variant-numeric: tabular-nums;
  backdrop-filter: blur(3px);
}

/* 图内右下角工具条：放大按钮
   桌面悬停浮现；触摸设备（无 hover）常显，见文件末尾 */
.md-typeset .ppt-fig .ppt-tools {
  position: absolute;
  right: .4rem;
  bottom: .4rem;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: .3rem;
  pointer-events: none;
  opacity: 0;
  transition: opacity .15s;
}
.md-typeset .ppt-fig:hover .ppt-tools,
.md-typeset .ppt-fig:focus-within .ppt-tools { opacity: 1; }
.md-typeset .ppt-fig .ppt-tools button {
  pointer-events: auto;
  font-family: inherit;
  font-size: .62rem;
  line-height: 1.5;
  padding: .05rem .4rem;
  border: none;
  border-radius: 4px;
  background: rgba(15, 18, 26, .48);
  color: #e8ecf3;
  backdrop-filter: blur(3px);
}
.md-typeset .ppt-fig .ppt-tools button { cursor: pointer; }
.md-typeset .ppt-fig .ppt-tools button:hover { background: rgba(15, 18, 26, .78); }
/* ---------- 讲解区（幻灯片下的解析）：统一语言 ---------- */
/* 依据 Minimalism & Swiss Style（ui-ux-pro-max 检索结果）：border-radius 0、
   无阴影、只用站点主色一种强调色，层次靠字重与 1px 细线表达 */

/* 收起态：标题条藏掉，整块高度归零，幻灯片完全紧挨 */
.md-typeset .ppt-deck + details.note {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;
}
.md-typeset .ppt-deck + details.note > summary { display: none; }
.md-typeset .ppt-deck + details.note > :first-child { margin-top: 0; }
.md-typeset .ppt-deck + details.note > :last-child { margin-bottom: 0; }

/* 展开态：浅底直角面板，不带左侧色条 */
.md-typeset .ppt-deck + details.note[open] {
  padding: .7rem .9rem .9rem;
  background: var(--md-default-fg-color--lightest);
  border-radius: 0;
  box-shadow: none;
}

/* 首行标题：「讲解」标签（主色加粗）+ 主题 + 通栏细线 */
.md-typeset .ppt-deck + details.note[open] > summary {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  margin: 0 0 .55rem;
  padding: 0 0 .35rem;
  border-bottom: 1px solid var(--md-default-fg-color--lighter);
  font-size: .68rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--md-default-fg-color);
  cursor: pointer;
}
.md-typeset .ppt-deck + details.note[open] > summary .ppt-kind {
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--md-typeset-a-color);
}
.md-typeset .ppt-deck + details.note[open] > summary .ppt-topic {
  color: var(--md-default-fg-color--light);
}
/* 去掉 Material 默认的 note 图标与展开箭头，标题保持一行素文 */
.md-typeset .ppt-deck + details.note[open] > summary::before,
.md-typeset .ppt-deck + details.note[open] > summary::after { content: none; }

/* 必背 / 易错：去掉蓝底与圆角，改成顶部细线 + 加粗标签 */
.md-typeset .ppt-deck + details.note .admonition {
  margin: 1rem 0 .5rem;
  padding: 0;
  background: none;
  border: none;
  border-top: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0;
}
.md-typeset .ppt-deck + details.note .admonition-title {
  margin: .45rem 0 .25rem;
  padding: 0;
  font-size: .68rem;
  font-weight: 700;
  color: var(--md-typeset-a-color);
}
/* 去掉铅笔图标，标签本身就是标识 */
.md-typeset .ppt-deck + details.note .admonition-title::before { content: none; }
/* 易错保留 Material 的橙色语义色，与图标同源 */
.md-typeset .ppt-deck + details.note .admonition.warning > .admonition-title {
  color: #ff9100;
}

/* 课件原文（嵌套折叠块）：去掉蓝底与圆角，改中性描边 */
.md-typeset .ppt-deck + details.note details.note {
  margin: .9rem 0 .4rem;
  padding: 0 .8rem .7rem;
  background: none;
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0;
}
.md-typeset .ppt-deck + details.note details.note > summary {
  margin: 0;
  padding: .4rem 0;
  font-size: .66rem;
  font-weight: 600;
  color: var(--md-default-fg-color--light);
}
.md-typeset .ppt-deck + details.note details.note > summary::before { content: none; }
.md-typeset .ppt-deck + details.note details.note[open] > summary {
  border-bottom: 1px solid var(--md-default-fg-color--lightest);
}

/* ---------- 章节标题隐藏（保留锚点与目录跳转） ---------- */
/* 页面上的各级小节标题都不占版面。目录（TOC）取 h2/h3 两级，
   与课件编号一致；每页幻灯片的 p.N 标题降为 h4，只当锚点用。
   用 height:0 而不是 display:none，否则速查表的 #s1-6 这类锚点跳转会失效 */
.md-typeset h2[id^="s"],
.md-typeset h3[id^="s"],
.md-typeset h4[id^="s"] {
  height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  visibility: hidden;
  scroll-margin-top: 3.2rem;
}
/* 内容页删掉了手写 h1，Zensical 会用 frontmatter 标题自动补一个；
   紧跟隐藏小节标题的 h1 就是它，隐藏掉（首页与速查表的 h1 不受影响） */
.md-typeset h1:has(+ h2[id^="s"]) { display: none; }

/* ---------- 页图灯箱 ---------- */
.ppt-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: .8rem;
  padding: 2.5rem 1rem 1.5rem;
  background: rgba(10, 12, 16, .92);
  cursor: zoom-out;
}
.ppt-lightbox.open { display: flex; }
.ppt-lightbox img {
  max-width: min(1400px, 96vw);
  max-height: 82vh;
  border-radius: 4px;
  cursor: default;
}
.ppt-lightbox button {
  position: absolute;
  z-index: 2;
  border: 1px solid rgba(255, 255, 255, .25);
  border-radius: 6px;
  background: rgba(255, 255, 255, .08);
  color: #e6eaf0;
  font-size: 1.15rem;
  line-height: 1;
  width: 42px;
  height: 42px;
  cursor: pointer;
}
.ppt-lightbox button:hover { background: rgba(255, 255, 255, .18); }
.ppt-lightbox .lb-prev { left: .8rem; top: 50%; transform: translateY(-50%); }
.ppt-lightbox .lb-next { right: .8rem; top: 50%; transform: translateY(-50%); }
.ppt-lightbox .lb-close { right: .8rem; top: .8rem; }

/* ---------- 阅读进度条 ---------- */
#ch-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  height: 3px;
  width: 0;
  background: var(--md-typeset-a-color);
  pointer-events: none;
}

/* ---------- 手机端 ---------- */
@media (max-width: 760px) {
  /* 幻灯片平铺满全宽：顶到屏幕两边（16px = Material 手机端内容区两侧留白） */
  .md-typeset .ppt-deck {
    margin-left: -16px;
    margin-right: -16px;
  }
  /* 解析底板同样顶到屏幕两边，内边距回到正文列 */
  .md-typeset .ppt-deck + details.note[open] {
    margin-left: -16px;
    margin-right: -16px;
    padding: .6rem 16px .8rem;
  }
  .ppt-lightbox { padding: 2.2rem .5rem 1rem; }
  .ppt-lightbox .lb-prev { left: .3rem; }
  .ppt-lightbox .lb-next { right: .3rem; }
  .ppt-lightbox button { width: 38px; height: 38px; }
}

/* ---------- 触摸设备与窄屏：工具条常显，目标 32px + 8px 间距 ---------- */
@media (hover: none), (max-width: 760px) {
  .md-typeset .ppt-fig .ppt-tools {
    opacity: 1;
    gap: .35rem;
  }
  .md-typeset .ppt-fig .ppt-tools button {
    min-height: 32px;
    padding: .05rem .45rem;
    font-size: .62rem;
  }
}

/* ---------- 本地文件方式下的搜索提示 ---------- */
/* file:// 下站内搜索用不了（Chrome 禁 fetch 与 Web Worker），
   点「查找」给一条能照做的提示，别让人对着没反应的按钮发呆 */
.search-tip {
  position: fixed;
  left: 50%;
  bottom: 1.6rem;
  z-index: 10001;
  max-width: min(32rem, 92vw);
  /* left:50% 之后可用宽度只剩一半，固定定位元素会按剩余空间收缩，
     这里显式按内容宽度排版，再由 max-width 收口 */
  width: max-content;
  padding: .6rem .9rem;
  background: var(--md-default-bg-color);
  border: 1px solid var(--md-default-fg-color--lighter);
  border-radius: 0;
  color: var(--md-default-fg-color);
  font-size: .68rem;
  line-height: 1.7;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, .5rem);
  transition: opacity .2s, transform .2s;
}
.search-tip.show {
  opacity: 1;
  transform: translate(-50%, 0);
}

/* ---------- 打印 ---------- */
@media print {
  #ch-progress, .ppt-lightbox, .search-tip { display: none !important; }
  .md-typeset .ppt-deck { display: none !important; }
  /* 屏幕上隐掉的小节标题，打印时恢复，讲义才有层次 */
  .md-typeset h2[id^="s"], .md-typeset h3[id^="s"], .md-typeset h4[id^="s"] {
    height: auto;
    margin: 1em 0 .5em;
    visibility: visible;
  }
  html, body { background: #fff !important; color: #1f2933 !important; }
  .md-typeset details > *:not(summary) { display: block !important; }
  .md-typeset summary { list-style: none; }
}

/* ---------- 目录只留课件节号 ---------- */
/* 目录只取 h2/h3（锚点 sec-*）；每页幻灯片的 p.N 标题是 h4
   （第一章锚点 s1-…s6-，四至八章锚点 sl4-…sl8-），生成的目录条目藏掉。
   Zensical 0.1.0 不支持 toc_depth，只能 CSS 兜底。
   速查表回链是 ppt.html#s…（不以 # 开头），不会误伤。
   注意连 li 一起 display:none：目录列表是 flex + gap，只藏链接会留下
   (条目数-1)×gap 的幽灵空隙（1.2.5 下面藏着 8 条就空出 28px）。
   :has() 必须用 > 限死在直接子级，否则会误伤整棵目录。 */
.md-nav__item:has(> .md-nav__link[href^="#s1-"]),
.md-nav__item:has(> .md-nav__link[href^="#s2-"]),
.md-nav__item:has(> .md-nav__link[href^="#s3-"]),
.md-nav__item:has(> .md-nav__link[href^="#s4-"]),
.md-nav__item:has(> .md-nav__link[href^="#s5-"]),
.md-nav__item:has(> .md-nav__link[href^="#s6-"]),
.md-nav__item:has(> .md-nav__link[href^="#sl"]) { display: none; }

/* ---------- 公式（MathJax SVG） ---------- */
/* 长公式在窄屏内横向滚动，避免撑破正文与折叠面板 */
.md-typeset div.arithmatex {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}
/* Material 的 .md-typeset svg{max-width:100%} 会让块级公式缩成 1px，
   块级公式保持自然宽度，靠上面的容器横向滚动 */
.md-typeset div.arithmatex svg { max-width: none; }
.md-typeset mjx-container[display="true"] { margin: .6em 0; }