/* Khatwa Partner API docs (docs.html). Builds on portal.css: same tokens, bar,
   buttons and focus rings, so the docs and the portal read as one site. */
.docs { max-width: 1180px; margin: 0 auto; padding: 24px 16px 80px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; }
@media (min-width: 1000px) { .docs { grid-template-columns: 240px minmax(0, 1fr); } }
.toc { font-size: 14.5px; }
@media (min-width: 1000px) { .toc { position: sticky; top: 88px; align-self: start; max-height: calc(100vh - 110px); overflow-y: auto; } }
@media (max-width: 999px) { .toc { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-card); padding: 16px 18px; } }
.toc__title { font-size: 13px; font-weight: 700; color: var(--text-2); letter-spacing: .04em; text-transform: uppercase; margin-bottom: 8px; }
.toc ol { list-style: none; padding: 0; margin: 0; }
.toc ol ol { padding-inline-start: 14px; }
.toc a { display: block; padding: 6px 0; color: var(--text-2); text-decoration: none; }
.toc a:hover { color: var(--brand-text); }
.docs__main { min-width: 0; outline: none; max-width: 860px; }
.docs__main > section { margin-top: 44px; scroll-margin-top: 84px; }
.docs__main article { scroll-margin-top: 84px; }
.docs__main h2 { font-size: 24px; font-weight: 800; margin-bottom: 12px; letter-spacing: -.01em; }
.docs__main h3 { font-size: 18px; font-weight: 700; margin: 26px 0 10px; }
.docs__main p, .docs__main li { font-size: 16px; line-height: 1.6; }
.docs__main p { margin: 0 0 12px; }
.docs__main ul, .docs__main ol { padding-inline-start: 22px; margin: 0 0 14px; }
.docs__main li { margin-bottom: 6px; }
.lede { font-size: 18px !important; color: var(--text-2); margin-top: 8px !important; }
.docs__main code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .9em; background: var(--surface-2); padding: 1px 6px; border-radius: 6px; overflow-wrap: anywhere; }
pre { position: relative; background: #16161C; color: #EDEDF2; border-radius: 14px; padding: 16px 18px; overflow-x: auto; margin: 0 0 16px; font-size: 13.5px; line-height: 1.55; }
:root[data-theme="dark"] pre { background: #0A0A0E; border: 1px solid var(--border); }
pre code { background: none !important; padding: 0 !important; font-size: inherit !important; color: inherit; white-space: pre; overflow-wrap: normal !important; }
pre.url { font-size: 16px; }
.copy-btn { position: absolute; top: 8px; inset-inline-end: 8px; min-height: 36px; padding: 0 12px; border-radius: 999px; border: 1px solid rgba(255,255,255,.2);
  background: rgba(255,255,255,.08); color: #EDEDF2; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; font-weight: 600; font-size: 13px; line-height: 1; cursor: pointer; }
.copy-btn:hover { background: rgba(255,255,255,.16); }
.copy-btn:focus-visible { outline: 3px solid #F28BA6; outline-offset: 2px; }
.endpoint { border-top: 1px solid var(--row); padding-top: 6px; margin-top: 18px; }
.endpoint h3 { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 17px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; overflow-wrap: anywhere; }
.verb { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; font-size: 12px; font-weight: 800; letter-spacing: .06em; padding: 4px 9px; border-radius: 8px; }
.verb.get { background: var(--success-soft); color: var(--success); }
.verb.post { background: var(--brand-tint); color: var(--brand-text); }
table.spec { width: 100%; border-collapse: collapse; margin: 6px 0 18px; font-size: 15px; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; display: block; overflow-x: auto; }
table.spec th, table.spec td { padding: 10px 14px; text-align: start; vertical-align: top; border-bottom: 1px solid var(--row); }
table.spec tr:last-child td { border-bottom: 0; }
table.spec th { font-size: 13px; color: var(--text-2); }
.note-box { background: var(--gold-soft); border-radius: 14px; padding: 14px 16px; }
.seq-wrap { overflow-x: auto; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-card); padding: 12px; margin-bottom: 16px; }
svg.seq { display: block; width: 100%; min-width: 640px; height: auto; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
.seq-head { fill: var(--surface-2); stroke: var(--border); }
.seq-head.brand { fill: var(--brand); }
.seq-head.brand + .seq-label { fill: #FFFFFF; }
.seq-label { fill: var(--text); font-size: 14px; font-weight: 700; }
.seq-life { stroke: var(--field); stroke-dasharray: 3 5; stroke-width: 1.2; }
.seq-msg { stroke: var(--text-2); stroke-width: 1.6; }
.seq-msg.dashed { stroke-dasharray: 6 5; }
.seq-arrow { fill: var(--text-2); }
.seq-text { fill: var(--text); font-size: 13px; }
.seq-note { fill: var(--gold-soft); stroke: var(--border); }
.flow-list li { margin-bottom: 8px; }
.pos-note { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-card); padding: 16px 18px; margin-bottom: 14px; }
.pos-note h3 { margin: 0 0 4px; }
.pos-note .sub { margin-bottom: 10px; }
.pos-note ul { margin-bottom: 8px; }
.pos-note .links { font-size: 14px; color: var(--text-2); }
.checklist li { padding-inline-start: 4px; }
/* A row label that is code stays whole (test mode's table). */
table.spec td:first-child code { overflow-wrap: normal; white-space: nowrap; }
/* Phones: the Copy button sits above the code instead of over its first line. */
@media (max-width: 700px) { pre:has(> .copy-btn) { padding-top: 52px; } }