/* codemany.com /docs sidebar (2026-10-10, Mintlify-style). The links are generated from docs/nav.json into every
 * page (go run ./deploy/site/server -write-docs site): small semibold group headings that collapse, one icon per
 * page, the current page in the accent colour on a soft tinted pill, nested pages indented under a hairline. It
 * sticks under the top bar and scrolls on its own. Under 900px it is a drawer (docs-nav.js opens it). */
.docs-side {
  position: sticky; top: var(--d-top); height: calc(100vh - var(--d-top)); height: calc(100svh - var(--d-top));
  overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding: 28px 12px 40px 0; font-size: 14px; line-height: 1.4;
}
.docs-side ul { margin: 0; padding: 0; list-style: none; }
.docs-side a {
  display: flex; align-items: center; gap: 10px; margin: 1px 0; padding: 7px 12px; border-radius: 10px;
  color: var(--d-muted); text-decoration: none; transition: background-color .12s, color .12s;
}
.docs-side a .i { color: var(--d-faint); transition: color .12s; }
.docs-side a:hover { color: var(--d-fg); background: var(--d-hover); }
.docs-side a:hover .i { color: var(--d-text); }
.docs-side a[aria-current="page"] { color: var(--d-accent); background: var(--d-accent-soft); font-weight: 600; }
.docs-side a[aria-current="page"] .i { color: var(--d-accent); }
.docs-side a.out span::after { content: " ↗"; color: var(--d-faint); font-size: 12px; }
.docs-side ul ul { margin: 2px 0 6px 20px; padding-left: 10px; border-left: 1px solid var(--d-border); }
.docs-side ul ul a { padding-top: 5px; padding-bottom: 5px; }
.docs-group { margin-top: 22px; }
.docs-group summary {
  display: flex; align-items: center; justify-content: space-between; padding: 0 12px 6px;
  list-style: none; cursor: pointer; user-select: none; font-size: 13px; font-weight: 600; color: var(--d-fg);
}
.docs-group summary::-webkit-details-marker { display: none; }
.docs-group summary::after {
  content: ""; width: 5px; height: 5px; border: solid var(--d-faint); border-width: 0 1.5px 1.5px 0;
  transform: rotate(45deg) translateY(-2px); transition: transform .15s;
}
.docs-group:not([open]) summary::after { transform: rotate(-45deg); }

@media (max-width: 1199px) { .docs-side { padding-right: 4px; } }
@media (max-width: 899px) {
  .docs-side {
    display: none; position: fixed; z-index: 45; top: var(--d-top); left: 0; bottom: 0; width: min(320px, 86vw); height: auto;
    padding: 12px 16px 32px; background: var(--d-bg); border-right: 1px solid var(--d-border); box-shadow: var(--d-shadow);
  }
  .docs-side.open { display: block; }
  .docs-scrim { position: fixed; z-index: 44; inset: var(--d-top) 0 0; background: #09090b4d; }
  body.docs-drawer { overflow: hidden; }
}
