/* Documentation pages — Apple-style */

.doc-page {
  background: var(--bg);
}

.docs-layout {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 0;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 22px;
  align-items: start;
}

.docs-sidebar {
  position: sticky;
  top: var(--nav-h);
  max-height: calc(100vh - var(--nav-h));
  max-height: calc(100dvh - var(--nav-h));
  overflow-y: auto;
  padding: 28px 20px 32px 0;
  border-right: 1px solid var(--border);
}

.docs-sidebar-toggle {
  display: none;
  width: 100%;
  margin-bottom: 12px;
  padding: 10px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: #fff;
  font-size: 14px;
  font-weight: 500;
  color: var(--text);
  cursor: pointer;
}

.docs-sidebar-section + .docs-sidebar-section {
  margin-top: 24px;
}

.docs-sidebar-label {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-tertiary);
}

.docs-sidebar-links {
  list-style: none;
  margin: 0;
  padding: 0;
}

.docs-sidebar-links a {
  display: block;
  padding: 6px 0;
  font-size: 14px;
  line-height: 1.35;
  color: var(--text-secondary);
  text-decoration: none;
}

.docs-sidebar-links a:hover,
.docs-sidebar-links a.is-active {
  color: var(--text);
  text-decoration: none;
}

.docs-sidebar-links a.is-active {
  font-weight: 600;
}

.docs-main {
  min-width: 0;
  max-width: 760px;
  padding: 28px 0 60px 40px;
}

.doc-content {
  padding: 0;
}

.doc-content > h1 {
  font-size: 40px;
  font-weight: 600;
  letter-spacing: -0.003em;
  line-height: 1.1;
  margin: 0 0 24px;
}

.doc-content h2 {
  font-size: 28px;
  font-weight: 600;
  margin-top: 48px;
  letter-spacing: 0.004em;
}

.doc-content h3 {
  font-size: 21px;
  font-weight: 600;
  margin-top: 32px;
}

.doc-content p,
.doc-content li {
  color: var(--text-secondary);
  font-size: 17px;
  line-height: 1.47059;
}

.doc-content a {
  color: var(--link);
}

.doc-content pre {
  margin: 1.25em 0;
  padding: 16px 18px;
  background: #1d1d1f;
  border: none;
  border-radius: var(--radius-sm);
  overflow-x: auto;
  font-family: var(--mono);
  font-size: 13px;
  line-height: 1.55;
  color: #f5f5f7;
  tab-size: 2;
}

.doc-content .highlight {
  margin: 1.25em 0;
  border-radius: var(--radius-sm);
  overflow: hidden;
  background: #1d1d1f;
}

.doc-content .highlight pre {
  margin: 0;
  background: transparent;
}

.doc-content pre code {
  display: block;
  background: none;
  padding: 0;
  border-radius: 0;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
  white-space: pre;
  word-break: normal;
  overflow-wrap: normal;
}

.doc-content code {
  font-family: var(--mono);
}

.doc-content :not(pre) > code {
  background: rgba(0, 0, 0, 0.05);
  padding: 0.1em 0.35em;
  border-radius: 4px;
  color: #bf4800;
}

/* Syntax highlighting (Pygments) — dark code panels */
.doc-content .highlight .hll { background-color: #2c2c2e; }
.doc-content .highlight .c,
.doc-content .highlight .c1,
.doc-content .highlight .cm,
.doc-content .highlight .cs { color: #8e8e93; font-style: italic; } /* comment */
.doc-content .highlight .k,
.doc-content .highlight .kd,
.doc-content .highlight .kn,
.doc-content .highlight .kp,
.doc-content .highlight .kr,
.doc-content .highlight .kt { color: #ff7ab2; } /* keyword */
.doc-content .highlight .o,
.doc-content .highlight .ow { color: #ff9f0a; } /* operator */
.doc-content .highlight .n,
.doc-content .highlight .nx,
.doc-content .highlight .nv,
.doc-content .highlight .py { color: #f5f5f7; } /* name */
.doc-content .highlight .na { color: #64d2ff; } /* attribute */
.doc-content .highlight .nb,
.doc-content .highlight .bp,
.doc-content .highlight .builtin { color: #5ac8fa; } /* builtin */
.doc-content .highlight .nc,
.doc-content .highlight .nn,
.doc-content .highlight .ne { color: #bf5af2; } /* class / exception */
.doc-content .highlight .nf,
.doc-content .highlight .fm { color: #64d2ff; } /* function */
.doc-content .highlight .nl { color: #ff9f0a; }
.doc-content .highlight .s,
.doc-content .highlight .s1,
.doc-content .highlight .s2,
.doc-content .highlight .sa,
.doc-content .highlight .sb,
.doc-content .highlight .sc,
.doc-content .highlight .sd,
.doc-content .highlight .se,
.doc-content .highlight .sh,
.doc-content .highlight .si,
.doc-content .highlight .sx,
.doc-content .highlight .sr,
.doc-content .highlight .ss { color: #30d158; } /* string */
.doc-content .highlight .m,
.doc-content .highlight .mb,
.doc-content .highlight .mf,
.doc-content .highlight .mh,
.doc-content .highlight .mi,
.doc-content .highlight .mo,
.doc-content .highlight .il { color: #ffd60a; } /* number */
.doc-content .highlight .p { color: #aeaeb2; } /* punctuation */
.doc-content .highlight .err { color: #ff453a; }
.doc-content .highlight .w { color: #f5f5f7; }
.doc-content .highlight .gp { color: #8e8e93; } /* prompt */
.doc-content .highlight .gt { color: #ff453a; }
.doc-content .highlight .ld { color: #30d158; }

.doc-content table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  margin: 24px 0;
}

.doc-content th,
.doc-content td {
  border: 1px solid var(--border);
  padding: 10px 12px;
  text-align: left;
}

.doc-content th {
  background: var(--bg-gray);
  font-weight: 600;
}

.doc-content img {
  max-width: 100%;
  border-radius: var(--radius-sm);
}

.doc-content .lede {
  font-size: 19px;
  color: var(--text-secondary);
}

.download-grid {
  display: grid;
  gap: 16px;
  margin: 32px 0;
}

.download-card {
  background: #fff;
  border-radius: var(--radius);
  padding: 24px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

.download-card h2 {
  margin: 0 0 4px !important;
  font-size: 21px !important;
}

.download-meta {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--text-tertiary);
  margin: 0;
}

.download-note {
  font-size: 14px;
  color: var(--text-secondary);
  margin: 8px 0 16px;
}

.download-btn {
  text-decoration: none;
}

.download-card .sha {
  margin-top: 12px;
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-tertiary);
  word-break: break-all;
}

.doc-section {
  margin-top: 48px;
  padding-top: 32px;
  border-top: 1px solid var(--border);
}

.doc-footer {
  margin-top: 48px;
  padding-top: 20px;
  border-top: 1px solid var(--border);
}

.doc-footer .footer-bottom {
  margin: 0;
  padding: 0;
  border-top: none;
}

.doc-footer .footer-bottom p {
  font-size: 12px;
  color: var(--text-tertiary);
}

.doc-footer .footer-bottom a {
  color: var(--text-tertiary);
  text-decoration: none;
}

.doc-footer .footer-bottom a:hover {
  color: var(--text-secondary);
}

@media (max-width: 900px) {
  .docs-layout {
    grid-template-columns: 1fr;
    padding: 0 16px;
  }

  .docs-sidebar {
    position: static;
    max-height: none;
    padding: 20px 0 0;
    border-right: none;
    border-bottom: 1px solid var(--border);
  }

  .docs-sidebar-toggle {
    display: block;
  }

  .docs-sidebar-nav {
    display: none;
    padding-bottom: 16px;
  }

  .docs-sidebar-nav.is-open {
    display: block;
  }

  .docs-main {
    padding: 24px 0 48px;
  }
}

/* Generated nav from build script */
.site-nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(251, 251, 253, 0.8);
  backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--border);
  padding: 0 22px;
  min-height: var(--nav-h);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  max-width: 100%;
}

.site-nav > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
}

.site-logo {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  text-decoration: none;
}

.nav-link {
  font-size: 12px;
  color: var(--text);
  text-decoration: none;
  opacity: 0.72;
}

.nav-link:hover,
.nav-link.active {
  opacity: 1;
  text-decoration: none;
}

.nav-section {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
