/* Developer docs (/docs/): one layout for the hub, the JavaScript reference and Redoc on /docs/api/ (a full-width bar, a 260 px
   section menu, the content column), on the app's own tokens so both themes follow. Redoc's theme in templates/docs/api.html
   mirrors these values: sidebar = --muted (--card in dark), code panel = --sidebar, accent = --brand. */
.docs-header { position: sticky; top: 0; z-index: 30; border-bottom: 1px solid var(--border); background: var(--background); }
.docs-header-row { display: flex; align-items: center; gap: 1rem; height: 3.5rem; padding: 0 1rem; }
.docs-mobile-nav { display: flex; overflow-x: auto; padding: 0 1rem 0.75rem; }
.docs-mobile-nav svg { display: none; }
.docs-desktop-nav { display: none; }
.docs-layout { display: flex; width: 100%; }
.docs-aside { display: none; }
@media (max-width: 1023px) { .docs-aside.docs-aside-open { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 25; overflow-y: auto; background: var(--muted); border-top: 1px solid var(--border); } }
@media (max-width: 1023px) { .docs-main [id] { scroll-margin-top: 8rem; } }
.docs-main { min-width: 0; flex: 1; padding: 2.5rem 1rem 4rem; }
.docs-column { max-width: 52rem; }
@media (min-width: 1024px) {
  .docs-mobile-nav { display: none; }
  .docs-desktop-nav { display: inline-flex; margin-left: 1rem; }
  .docs-header-row { padding: 0 1.25rem; }
  .docs-aside { display: block; position: sticky; top: 3.5rem; align-self: flex-start; width: 260px; flex-shrink: 0; height: calc(100vh - 3.5rem); overflow-y: auto; padding: 0.5rem 0 2rem; background: var(--muted); border-right: 1px solid var(--border); }
  .docs-main { padding: 2.5rem 2.5rem 4rem; }
}
.dark .docs-aside { background: var(--card); }
.docs-toc ul { list-style: none; margin: 0; padding: 0; }
.docs-toc a { display: block; padding: 0.8rem 1.25rem; font-size: 0.875rem; line-height: 1.4; color: var(--foreground); }
.docs-toc a:hover { color: var(--brand); }
#redoc-ui .redoc-markdown :is(ul, ol) { list-style: revert; }

.docs-prose { font-size: 0.9375rem; line-height: 1.7; color: var(--foreground); }
.docs-prose > :first-child { margin-top: 0; }
.docs-prose > h1 { font-size: 1.875rem; font-weight: 600; letter-spacing: -0.02em; margin: 0 0 1rem; }
.docs-prose > h2 { font-size: 1.375rem; font-weight: 600; letter-spacing: -0.01em; margin: 3rem 0 0.75rem; padding-top: 1.5rem; border-top: 1px solid var(--border); scroll-margin-top: 5rem; }
.docs-prose > h3 { font-size: 1.0625rem; font-weight: 600; margin: 2rem 0 0.5rem; scroll-margin-top: 5rem; }
.docs-prose > h4 { font-size: 0.9375rem; font-weight: 600; margin: 1.5rem 0 0.5rem; }
.docs-prose > :is(p, ul, ol, table, div, img) { margin: 0 0 1rem; }
.docs-prose > ul, .docs-prose > ul ul { list-style: disc; padding-left: 1.25rem; }
.docs-prose > ol { list-style: decimal; padding-left: 1.25rem; }
.docs-prose > :is(ul, ol) li { margin-top: 0.25rem; }
.docs-prose :is(p, li, td, th, h2, h3, h4) > code { border-radius: 0.25rem; background: var(--muted); padding: 0.125rem 0.3rem; font-family: "Geist Mono", ui-monospace, monospace; font-size: 0.8125em; overflow-wrap: anywhere; }
.docs-prose :is(p, li, td) > a:not(.btn) { color: var(--brand); text-underline-offset: 4px; }
.docs-prose :is(p, li, td) > a:not(.btn):hover { text-decoration: underline; }
.docs-prose > table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; font-size: 0.8125rem; line-height: 1.5; }
.docs-prose > table :is(th, td) { border: 1px solid var(--border); padding: 0.5rem 0.75rem; text-align: left; vertical-align: top; }
.docs-prose > table th { background: var(--muted); font-weight: 600; }
.docs-prose > table td:first-child code { white-space: nowrap; }
.docs-prose > blockquote { margin: 0 0 1rem; border-left: 3px solid var(--brand); padding-left: 1rem; color: var(--muted-foreground); }
.docs-prose .code-block { border-radius: 12px; font-size: 13px; }
.docs-prose > img.docs-shot { display: block; width: auto; max-width: 100%; height: auto; border: 1px solid var(--border); border-radius: 0.75rem; }

html:has(#redoc-ui) { scroll-behavior: auto; }
html:has(.docs-header) { scroll-behavior: auto; }
