/* Developer docs layout (/developers/api/*, /mcp-server/*): section sidebar, content column, on-this-page list. Uses tokens.css;
   sentence-case group labels, ruled link lists and dark code blocks, as in docs/brand/identity.md.
   Logical properties keep the layout correct in English (ltr) and Arabic (rtl); code, endpoints and samples always read left to right. */
.docs-shell{display:grid;grid-template-columns:220px minmax(0,1fr) 200px;gap:var(--s-6);align-items:start;padding:var(--s-6) 0 var(--s-8)}
.docs-shell.no-toc{grid-template-columns:220px minmax(0,1fr)}
.docs-side,.docs-toc{position:sticky;top:84px;max-height:calc(100vh - 100px);overflow-y:auto;font-size:var(--t-sm)}
.docs-side-menu{display:none}
.docs-side nav{display:grid;gap:var(--s-5)}
.docs-side-group{display:grid;gap:2px}
.docs-side-group strong,.docs-toc strong{display:block;font-size:var(--fs-13);font-weight:600;color:var(--ink);margin-bottom:var(--s-2)}
.docs-side a,.docs-toc a{display:block;padding:6px 10px;border-radius:var(--r-sm);color:var(--ink-2);text-decoration:none;line-height:1.35}
.docs-side a:hover,.docs-toc a:hover{color:var(--ink);background:var(--surface-3)}
.docs-side a[aria-current="page"]{color:var(--ink);background:var(--surface-3);font-weight:600;box-shadow:inset 2px 0 0 var(--ink)}
[dir=rtl] .docs-side a[aria-current="page"]{box-shadow:inset -2px 0 0 var(--ink)}
.docs-toc nav{display:grid;gap:1px;border-inline-start:1px solid var(--line);padding-inline-start:var(--s-2)}
.docs-toc a{padding:3px 8px}

.docs-main{min-width:0}
.docs-main .crumbs span{color:var(--line-strong)}
.docs-tag{margin-top:var(--s-3)}
.docs-head{padding-bottom:var(--s-5);border-bottom:1px solid var(--line)}
.docs-head h1{font-size:clamp(30px,3.6vw,44px);font-weight:600;letter-spacing:var(--track-display);line-height:1.1}
.docs-actions{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-top:var(--s-5)}

.docs-body>section{padding:var(--s-6) 0;border-bottom:1px solid var(--line);scroll-margin-top:80px}
.docs-body>section:last-child{border-bottom:0}
.docs-body h2{font-size:var(--fs-22);margin-bottom:var(--s-3)}
.docs-body h3{font-size:var(--fs-18);margin:var(--s-5) 0 var(--s-2)}
.docs-body p,.docs-body li{color:var(--ink-2);max-width:72ch;line-height:var(--lh-body)}
.docs-body a:not(.site-button){color:var(--ink);font-weight:500;text-decoration:underline;text-decoration-color:var(--brand-ink);text-underline-offset:.25em}
.docs-body a:not(.site-button):hover{color:var(--brand-ink)}
.docs-body p+p{margin-top:var(--s-3)}
.docs-body ul,.docs-body ol{padding-inline-start:1.25em;display:grid;gap:6px;margin:var(--s-2) 0}
.docs-body ul.docs-checks{list-style:none;padding-inline-start:0;margin:0}
.docs-checks li{position:relative;padding-inline-start:26px}
/* The tick is drawn with two borders and keeps its shape in both directions; only its position follows the text. */
.docs-checks li::before{content:"";position:absolute;inset-inline-start:2px;top:.45em;width:12px;height:7px;border-left:2px solid var(--palm);border-bottom:2px solid var(--palm);transform:rotate(-45deg)}
.docs-head code,.docs-body code{font:13px/1.5 var(--font-mono);background:var(--surface-3);color:var(--ink);border-radius:5px;padding:1px 5px;overflow-wrap:anywhere;direction:ltr;unicode-bidi:isolate}
.docs-body th{text-align:start}
.docs-body details{border-bottom:1px solid var(--line);padding:var(--s-3) 0}
.docs-body summary{cursor:pointer;font-weight:500;color:var(--ink)}
.docs-body details p{margin-top:var(--s-2)}

.docs-code{margin:var(--s-3) 0;background:var(--ink-bg);border:1px solid var(--ink-bg);border-radius:var(--r-md);overflow:hidden}
.docs-code figcaption{font-size:var(--fs-12);font-weight:500;color:var(--on-ink-muted);padding:12px 16px 0}
.docs-code pre{margin:0;padding:12px 16px 16px;overflow-x:auto;max-height:520px;direction:ltr;text-align:left}
.docs-code code,.docs-body .docs-code code{background:none;color:var(--on-ink);padding:0;font-size:12.5px;overflow-wrap:normal;white-space:pre}

.docs-signature{margin-bottom:var(--s-2)}
/* "GET /api/v1/…" reads left to right on Arabic pages too. */
.docs-sig{direction:ltr;unicode-bidi:isolate}
.docs-method{display:inline-block;font:600 12px var(--font-mono);border-radius:var(--r-xs);padding:3px 8px;margin-inline-end:8px;background:var(--good-soft);color:var(--good);vertical-align:middle}
.docs-method.post{background:var(--dune-soft);color:var(--dune-ink)}
.docs-endpoint{font:600 15px var(--font-mono);color:var(--ink);vertical-align:middle}
td a .docs-endpoint{color:var(--ink)}
td a{text-decoration:none}
/* 140px keeps desktop columns readable; on phones three columns must still fit the 356px reading width without scrolling. */
.docs-wrap{white-space:normal;min-width:min(140px,28vw)}

/* Link lists with a line each: ruled rows, not cards. */
.docs-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:0 var(--s-5);margin-top:var(--s-3);border-top:1px solid var(--line)}
.docs-cards article{padding:var(--s-3) 0 var(--s-4);border-bottom:1px solid var(--line)}
.docs-cards h3{margin:0 0 4px;font-size:var(--fs-16)}
.docs-cards h3 a{display:inline-block;padding-block:3px;color:var(--ink);text-decoration:none}
.docs-cards h3 a:hover{color:var(--brand-ink);text-decoration:underline;text-underline-offset:3px}
.docs-cards p{margin:0;font-size:var(--fs-15)}

.docs-note{margin:var(--s-3) 0;padding:var(--s-3) var(--s-4);border:1px solid var(--line);border-inline-start:3px solid var(--dune);background:var(--surface);border-radius:var(--r-sm);color:var(--ink-2);font-size:var(--fs-15);max-width:72ch}

.docs-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-3);margin:var(--s-2) 0 var(--s-4)}
.docs-stats div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s-4)}
.docs-stats strong{display:block;font-family:var(--font-display);font-size:var(--fs-28);font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.docs-stats span{font-size:var(--t-sm);color:var(--muted)}

.docs-plan{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:var(--s-5);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s-5)}
.docs-plan-price{font-family:var(--font-display);font-size:40px;font-weight:600;color:var(--ink)!important;font-variant-numeric:tabular-nums}

.docs-pager{display:flex;justify-content:space-between;gap:var(--s-3);margin-top:var(--s-6);padding-top:var(--s-5);border-top:1px solid var(--line)}
.docs-pager a{display:grid;gap:2px;padding:var(--s-3) var(--s-4);border:1px solid var(--line);border-radius:var(--r-md);text-decoration:none;color:var(--ink);font-weight:600;max-width:48%}
.docs-pager a.next{text-align:end;margin-inline-start:auto}
.docs-pager a:hover{border-color:var(--ink-2)}
.docs-pager small{font-size:var(--fs-12);font-weight:500;color:var(--muted)}

@media (max-width:1100px){
  .docs-shell,.docs-shell.no-toc{grid-template-columns:200px minmax(0,1fr)}
  .docs-toc{display:none}
}
@media (max-width:800px){
  .docs-shell,.docs-shell.no-toc{grid-template-columns:minmax(0,1fr);gap:var(--s-4);padding-top:var(--s-4)}
  .docs-side{display:none}
  .docs-side-menu{display:block;margin-bottom:var(--s-4);border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface)}
  .docs-side-menu summary{padding:var(--s-3) var(--s-4);font-weight:500;font-size:var(--fs-16);cursor:pointer}
  .docs-side-menu nav{display:grid;gap:var(--s-4);padding:0 var(--s-3) var(--s-4);font-size:var(--t-sm)}
  .docs-side-menu .docs-side-group a{display:flex;align-items:center;min-height:40px;padding:0 10px;border-radius:var(--r-sm);color:var(--ink-2);text-decoration:none}
  .docs-side-menu .docs-side-group a[aria-current="page"]{color:var(--ink);background:var(--surface-3);font-weight:600}
  .docs-side-menu .docs-side-group strong{display:block;font-size:var(--fs-13);font-weight:600;color:var(--ink);margin-bottom:var(--s-2)}
  .docs-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .docs-plan{grid-template-columns:1fr}
  .docs-pager a{max-width:none}
}
.docs-body td a{text-decoration-color:var(--line-strong)}