/* docs.clawcu.ai 左侧导航 + 右侧「本页目录」(SPEC-apps-docs-nav,2026-10-11;参照 DeepSeek API 文档的三栏布局)。
   只在带导航的页面加载(由 scripts/gen-docs-nav.py 写进 <head>),所以这里可以放心改页头等全局样式。
   颜色走页面已有变量:普通文档页是 app.css 的令牌,Jev 页是它自己内联的令牌;变量缺失时用兜底色。
   断点:≥1200 三栏(导航 | 正文 | 目录);921–1199 两栏(目录隐藏);≤920(Jev 原有断点)单栏,导航变成左侧抽屉(☰ 由 docs-nav.js 创建)。 */

/* ── 普通文档页:页头吸顶、全宽(内容对齐下面的版心) ── */
html { scroll-padding-top: 76px; }
/* app.css 给 body 定了 height:100%(= 一屏高),吸顶元素只在第一屏内有效;这里放开 */
body.help { height: auto; min-height: 100%; }
.help-top {
  position: sticky; top: 0; z-index: 40; max-width: none; margin: 0;
  padding: 12px max(24px, calc((100% - 1360px) / 2 + 24px));
  background: var(--bg, #fff); border-bottom: 1px solid var(--line, rgba(9, 9, 11, .12));
}
.docs-layout {
  display: grid; grid-template-columns: 248px minmax(0, 1fr) 208px; gap: 40px;
  max-width: 1360px; margin: 0 auto; padding: 0 24px; align-items: start;
}
.docs-layout > .help-wrap { max-width: 820px; width: 100%; margin: 0; padding: 26px 0 72px; }
.help-foot { max-width: 1360px; padding-left: calc(max(24px, (100% - 1360px) / 2 + 24px) + 288px); }

/* ── 左侧导航(两种页面共用) ── */
.docs-side {
  position: sticky; top: var(--nav-h, 61px); align-self: start;
  max-height: calc(100vh - var(--nav-h, 61px)); overflow-y: auto; overscroll-behavior: contain;
  padding: 18px 12px 40px 0; border-right: 1px solid var(--line-soft, var(--line, rgba(9, 9, 11, .07)));
  font-size: 13.5px; line-height: 1.4;
}
.docs-side-group + .docs-side-group { margin-top: 14px; }
.docs-side-t {
  margin: 6px 10px 4px; color: var(--ink-mute, #71717a);
  font-size: 12px; font-weight: 600; letter-spacing: .02em;
}
.docs-side a {
  display: block; padding: 7px 10px; border-radius: 8px;
  color: var(--ink-soft, #52525b); text-decoration: none;
}
.docs-side a:hover { background: var(--surface-3, var(--bg-soft, #f4f4f5)); color: var(--ink, #18181b); text-decoration: none; }
.docs-side a[aria-current="page"] {
  background: color-mix(in srgb, var(--primary, var(--accent, #e2542a)) 10%, transparent);
  color: var(--primary, var(--accent-deep, #e2542a)); font-weight: 600;
}

/* ── 右侧本页目录(普通文档页;Jev 用它自带的 .toc) ── */
.docs-toc {
  position: sticky; top: var(--nav-h, 61px); align-self: start;
  max-height: calc(100vh - var(--nav-h, 61px)); overflow-y: auto; padding: 26px 0 40px; font-size: 13px; line-height: 1.45;
}
.docs-toc-t { margin: 0 0 10px 12px; color: var(--ink-mute, #71717a); font-size: 12px; font-weight: 600; }
.docs-toc a {
  display: block; padding: 5px 0 5px 12px; border-left: 2px solid var(--line, rgba(9, 9, 11, .12));
  color: var(--ink-soft, #52525b); text-decoration: none;
}
.docs-toc a:hover { color: var(--ink, #18181b); border-left-color: var(--ink-mute, #71717a); }
.docs-toc a.on { color: var(--primary, #e2542a); border-left-color: var(--primary, #e2542a); font-weight: 600; }

/* ── Jev 页:导航插在它的 .doc 网格最前面,网格改三栏、自带目录放右栏(div.doc 只有 Jev 页有;其余页的 .doc 在 <main> 上) ── */
.nav .nav-in { max-width: 1360px; }
div.doc { max-width: 1360px; grid-template-columns: 232px minmax(0, 1fr) 200px; gap: 40px; }
div.doc > .docs-side { grid-column: 1; grid-row: 1; padding-top: 32px; }
div.doc > main { grid-column: 2; grid-row: 1; }
div.doc > .toc { grid-column: 3; grid-row: 1; }

/* ── 手机抽屉按钮与遮罩(docs-nav.js 创建) ── */
.docs-menu-btn {
  display: none; align-items: center; justify-content: center; flex: 0 0 auto;
  width: 34px; height: 32px; margin-right: 2px; padding: 0;
  border: 1px solid var(--line, rgba(9, 9, 11, .12)); border-radius: 8px;
  background: transparent; color: var(--ink, #18181b); font: inherit; font-size: 16px; line-height: 1; cursor: pointer;
}
.docs-shade { display: none; }

@media (max-width: 1199px) {
  .docs-layout { grid-template-columns: 232px minmax(0, 1fr); }
  .docs-toc { display: none; }
  div.doc { grid-template-columns: 232px minmax(0, 1fr); }
  div.doc > .toc { display: none; }
}

@media (max-width: 920px) {
  .help-top { padding: 10px 16px; }
  .docs-layout { display: block; padding: 0; }
  .docs-layout > .help-wrap { max-width: none; padding: 12px 16px 56px; }
  .help-foot { padding-left: 16px; }
  .docs-menu-btn { display: inline-flex; }
  .docs-side {
    position: fixed; top: 0; bottom: 0; left: 0; z-index: 60; width: min(300px, 84vw); max-height: none;
    padding: 18px 14px 40px; border-right: 1px solid var(--line, rgba(9, 9, 11, .12));
    background: var(--surface, #fff); box-shadow: 0 10px 40px rgba(0, 0, 0, .18);
    transform: translateX(-105%); transition: transform .2s ease; visibility: hidden;
  }
  .docs-side-open .docs-side { transform: none; visibility: visible; }
  .docs-side-open .docs-shade { display: block; position: fixed; inset: 0; z-index: 55; background: rgba(0, 0, 0, .32); }
  .docs-side-open body { overflow: hidden; }
  /* Jev:目录回到正文上方变成横向标签(沿用它原来 ≤920 的样式) */
  div.doc { grid-template-columns: minmax(0, 1fr); gap: 0; }
  div.doc > .toc { display: block; grid-column: 1; grid-row: 1; }
  div.doc > main { grid-column: 1; grid-row: 2; }
}

@media (prefers-reduced-motion: reduce) { .docs-side { transition: none; } }
