/* ===========================================================================
   DOCS page — sidebar layout, doc prose, code, parameter & method tables
   =========================================================================== */
.docs-shell { display: grid; grid-template-columns: 268px 1fr; gap: 56px; align-items: start; max-width: 1240px; margin-inline: auto; padding-inline: 28px; padding-block: 48px 90px; }

/* sidebar */
.docs-side { position: sticky; top: calc(var(--nav-h) + 24px); align-self: start; }
.docs-search { display:flex; align-items:center; gap:10px; padding:10px 14px; border-radius:var(--r-md); background:#fff; box-shadow:inset 0 0 0 1px var(--line-strong); color:var(--ink-300); font-size:14.5px; margin-block-end:22px; }
.docs-search svg { width:17px; height:17px; }
.docs-nav-group { margin-block-end: 24px; }
.docs-nav-group > .gh { font-family:var(--font-head); font-weight:600; font-size:12.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-300); margin-block-end:10px; padding-inline-start:14px; }
.docs-nav-group a { display:block; font-size:15px; color:var(--ink-500); padding:8px 14px; border-radius:var(--r-sm); border-inline-start:2px solid transparent; transition:color .15s, background .15s; }
.docs-nav-group a:hover { color:var(--blue-700); background:var(--blue-50); }
.docs-nav-group a.active { color:var(--blue-700); background:var(--blue-50); border-inline-start-color:var(--blue-600); font-weight:500; }

/* main */
.docs-main { min-width: 0; max-width: 760px; }
.docs-eyebrow { color:var(--blue-600); font-family:var(--font-head); font-weight:500; font-size:14px; letter-spacing:.04em; }
.docs-main h1 { font-size: 40px; margin-block: 6px 16px; letter-spacing:-.02em; }
.docs-main > .intro { font-size: 19px; color: var(--ink-400); margin-block-end: 12px; text-wrap:pretty; }

.docs-section { padding-block-start: 56px; scroll-margin-top: calc(var(--nav-h) + 24px); }
.docs-section > h2 { font-size: 28px; padding-block-end: 14px; border-bottom: 1px solid var(--line); margin-block-end: 22px; }
.docs-section h3 { font-size: 20px; margin-block: 30px 10px; }
.docs-section p { font-size: 16.5px; color: var(--ink-500); margin-block-end: 14px; line-height: 1.7; }
.docs-section ol, .docs-section ul.doc-ul { margin-inline-start: 4px; display: grid; gap: 10px; margin-block-end: 16px; }
.docs-section ol { counter-reset: step; }
.docs-section ol li { display:flex; gap:13px; align-items:flex-start; font-size:16px; color:var(--ink-500); }
.docs-section ol li::before { counter-increment: step; content: counter(step); flex:none; width:25px; height:25px; border-radius:50%; background:var(--blue-50); color:var(--blue-700); font-family:var(--font-mono); font-size:13px; font-weight:500; display:grid; place-items:center; }
.docs-section ul.doc-ul li { display:flex; gap:11px; align-items:flex-start; font-size:16px; color:var(--ink-500); }
.docs-section ul.doc-ul li::before { content:""; flex:none; width:6px; height:6px; border-radius:50%; background:var(--blue-500); margin-block-start:10px; }
.docs-section code.ic { font-family:var(--font-mono); font-size:.88em; background:var(--blue-50); color:var(--blue-700); padding:2px 7px; border-radius:6px; direction:ltr; unicode-bidi:isolate; }

/* doc code card reuses .code-card from module.css */
.docs-section .code-card { margin-block: 8px 22px; }

/* method/endpoint table */
.api-table { width:100%; border-collapse:collapse; margin-block: 4px 22px; border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; font-size:15px; }
.api-table th, .api-table td { padding:13px 16px; text-align:start; border-bottom:1px solid var(--line); vertical-align:top; }
.api-table thead th { background:var(--surface); font-family:var(--font-head); font-weight:600; color:var(--ink-700); font-size:14px; }
.api-table tr:last-child td { border-bottom:0; }
.api-table td.mono, .api-table td .mono { font-family:var(--font-mono); font-size:13.5px; color:var(--ink-700); direction:ltr; unicode-bidi:isolate; }
.api-table td { color:var(--ink-500); }
.method { font-family:var(--font-mono); font-weight:600; font-size:12.5px; padding:3px 9px; border-radius:6px; display:inline-block; }
.method.post { background:var(--green-100); color:var(--green-600); }
.method.get { background:var(--blue-100); color:var(--blue-700); }
.req { font-size:12px; color:var(--amber-600); font-family:var(--font-head); font-weight:500; }
.opt { font-size:12px; color:var(--ink-300); font-family:var(--font-head); }

.docs-section .callout { margin-block: 16px 8px; }

/* prev/next + on-page footer */
.docs-foot { margin-block-start: 56px; padding-block-start: 28px; border-top: 1px solid var(--line); display:flex; justify-content:space-between; gap:16px; font-size:14.5px; color:var(--ink-400); }

/* mobile docs nav */
.docs-mobnav { display:none; }
@media (max-width: 900px) {
  .docs-shell { grid-template-columns: 1fr; gap: 0; padding-block-start: 24px; }
  .docs-side { position: static; margin-block-end: 28px; }
  .docs-side .docs-search { display:none; }
  .docs-mobnav { display:block; }
  .docs-nav-wrap { display:none; }
  .docs-nav-wrap.open { display:block; }
  .docs-mobnav-btn { width:100%; display:flex; align-items:center; justify-content:space-between; padding:14px 18px; background:#fff; border-radius:var(--r-md); box-shadow:inset 0 0 0 1px var(--line-strong); font-family:var(--font-head); font-weight:500; color:var(--ink-700); font-size:15.5px; margin-block-end:14px; }
  .docs-mobnav-btn svg { width:18px; height:18px; }
  .docs-main h1 { font-size: 32px; }
}

/* API tables read left-to-right (method | path | description) in ALL page
   languages (owner rule 2026-07-19); each cell's text still renders in its
   own natural direction via plaintext bidi. The thresholds table stays RTL. */
.api-table[dir="ltr"] { direction: ltr; }
.api-table[dir="ltr"] th, .api-table[dir="ltr"] td { text-align: left; unicode-bidi: plaintext; }