/* /docs pages only (page-only stylesheet, keeps site.css inside its budget). Layout = the reading page (.read). */

/* docs nav: an underlined strip like the setup tabs; chips that wrap on phones */
.docs-nav{padding-top:28px}
.docs-nav ul{display:flex;gap:8px;border-bottom:1px solid var(--line)}
.docs-nav a{position:relative;display:block;padding:8px 8px 11px;font-size:14px;color:var(--fg-3);white-space:nowrap;transition:color .15s ease}
.docs-nav li:first-child a{padding-left:0}
.docs-nav a:hover{color:var(--fg)}
.docs-nav a[aria-current]{color:var(--fg);font-weight:500}
.docs-nav a[aria-current]::after{content:"";position:absolute;left:8px;right:8px;bottom:-1px;height:2px;border-radius:2px;background:var(--fg)}
.docs-nav li:first-child a::after{left:0}
.docs-nav + .page-head{padding-top:32px}

/* spacing for the blocks the docs add to .prose */
.prose .code,.prose .tabs,.prose .faq,.prose .emb,.prose .prompts,.prose .docs-steps,.prose .docs-map,.prose .docs-dl,.prose .docs-api,
.prose .code + p,.prose .tabs + p,.prose .docs-steps + p,.prose .docs-map + p,.prose .code + ul,.prose .table-wrap + .code{margin-top:12px}
.prose h3 + .tabs{margin-top:4px}
.prose .tabs + h3{margin-top:32px}
.prose .panel ol.g-steps{display:grid;gap:8px;padding-left:0;list-style:none}
.prose .panel li{font-size:14px}
.prose .panel .g-link{margin-top:12px}

.prose .prompts{padding:0;list-style:none}
.prose .prompts li{font-size:14px}

/* quick start */
.prose .docs-steps{gap:0;padding:0;list-style:none;counter-reset:ds;border:1px solid var(--line);border-radius:var(--r)}
.docs-steps>li{position:relative;padding:16px 20px 16px 56px;counter-increment:ds}
.docs-steps>li + li{border-top:1px solid var(--line)}
.docs-steps>li::before{content:counter(ds);position:absolute;left:18px;top:16px;display:grid;place-items:center;width:24px;height:24px;border:1px solid var(--line-2);border-radius:50%;font:500 12px/1 var(--mono);color:var(--fg-2)}
.prose .docs-steps h3{margin:0 0 4px;font-size:15px;line-height:24px}
.docs-steps p{font-size:14px;line-height:1.6}

/* map of the docs */
.prose .docs-map{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:0;list-style:none}
.docs-map a{display:flex;flex-direction:column;gap:4px;height:100%;padding:16px;border:1px solid var(--line);border-radius:var(--r);font-size:14px;line-height:1.55;color:var(--fg-2);transition:border-color .15s ease,background-color .15s ease}
.docs-map-t{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:15px;font-weight:600;color:var(--fg)}
.docs-map-t .i{color:var(--fg-3);transition:transform .15s ease,color .15s ease}

/* definitions and endpoint lists */
.docs-dl,.docs-api{border-top:1px solid var(--line)}
.docs-dl>div,.docs-api>div{display:grid;grid-template-columns:168px minmax(0,1fr);gap:4px 24px;padding:12px 0;border-bottom:1px solid var(--line)}
.docs-dl dt{font-weight:600;color:var(--fg)}
.docs-dl-sm>div{grid-template-columns:136px minmax(0,1fr)}
.docs-dl-sm dt,.docs-dl-sm dd{font-size:14px}
.docs-api>div{grid-template-columns:minmax(0,1fr)}
.docs-api dt code{font:500 13.5px/1.5 var(--mono);color:var(--fg);overflow-wrap:anywhere}
.docs-api dd{font-size:14px}

/* previous / next */
.docs-pn{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:56px;padding-top:24px;border-top:1px solid var(--line)}
.docs-pn a{display:flex;flex-direction:column;gap:2px;padding:12px 16px;border:1px solid var(--line);border-radius:var(--r);font-size:15px;font-weight:500;color:var(--fg);transition:border-color .15s ease,background-color .15s ease}
.docs-pn span{font-size:13px;font-weight:400;color:var(--fg-3)}
.docs-pn-next{grid-column:2;align-items:flex-end;text-align:right}

@media (hover:hover){
  .docs-map a:hover,.docs-pn a:hover{border-color:var(--line-2);background:var(--bg-2)}
  .docs-map a:hover .i{color:var(--fg);transform:translateX(2px)}
}
@media (max-width:559px){
  .docs-nav{padding-top:20px}
  .docs-nav ul{flex-wrap:wrap;border:0}
  .docs-nav a,.docs-nav li:first-child a{display:flex;align-items:center;height:32px;padding:0 12px;border:1px solid var(--line-2);border-radius:999px;font-size:13px;font-weight:500;color:var(--fg-2)}
  .docs-nav a[aria-current],.docs-nav li:first-child a[aria-current]{background:var(--fg);border-color:var(--fg);color:var(--bg)}
  .docs-nav a[aria-current]::after{content:none}
  .docs-nav + .page-head{padding-top:24px}
  .prose .docs-map,.docs-pn{grid-template-columns:minmax(0,1fr)}
  .docs-pn-next{grid-column:1}
  .docs-dl>div{grid-template-columns:minmax(0,1fr)}
  .docs-steps>li{padding:16px 16px 16px 52px}
  .docs-steps>li::before{left:16px}
}
@media (prefers-reduced-motion:reduce){.docs-map-t .i{transition:none}.docs-map a:hover .i{transform:none}}
@media (forced-colors:active){
  .docs-nav a[aria-current]::after{forced-color-adjust:none;background:Highlight}
  .docs-map a,.docs-pn a{border-color:CanvasText}
}
@media (forced-colors:active) and (max-width:559px){
  .docs-nav a[aria-current],.docs-nav li:first-child a[aria-current]{forced-color-adjust:none;background:Highlight;color:HighlightText;border-color:Highlight}
}
@media print{.docs-nav,.docs-pn{display:none}}