/* ============================================================
   pages/api-doc.css — REST API documentation template
   Reuses .hooks-layout / .hooks-toc / .codeblock from hooks-doc.css,
   which this page also links. Adds endpoint + method-badge styles.
   ============================================================ */

/* HTTP method badges */
.method{display:inline-flex;align-items:center;font-family:var(--font-mono);font-size:var(--t-xs);font-weight:var(--fw-bold);letter-spacing:.04em;padding:4px 9px;border-radius:var(--r-sm);text-transform:uppercase}
.method--get{background:rgba(16,155,114,.14);color:var(--accent)}
.method--post{background:rgba(31,76,209,.14);color:var(--primary)}
.method--put{background:rgba(181,116,10,.16);color:var(--warning)}
.method--delete{background:rgba(204,51,64,.14);color:var(--error)}
.method--patch{background:rgba(124,77,255,.16);color:#7c4dff}

/* endpoints overview table */
.endpoint-table .data-table td:first-child{white-space:nowrap}
.endpoint-table code{font-family:var(--font-mono);font-size:.85em;color:var(--text)}

/* endpoint section */
.endpoint{border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);padding:var(--s5);margin-bottom:var(--s5);scroll-margin-top:calc(var(--header-h) + 16px)}
.endpoint__head{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap;margin-bottom:var(--s3)}
.endpoint__path{font-family:var(--font-mono);font-size:var(--t-base);font-weight:var(--fw-semibold);color:var(--text);word-break:break-all}
.endpoint__desc{color:var(--text-muted);font-size:var(--t-sm);margin-bottom:var(--s4)}
.endpoint .hook-sub{font-family:var(--font-mono);font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--text-subtle);margin:var(--s4) 0 10px}

/* auth callout / key block */
.auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5)}
@media (max-width:760px){.auth-grid{grid-template-columns:1fr}}

/* PENDING banner */
.pending-banner{display:flex;gap:var(--s4);padding:var(--s6);border-radius:var(--r-xl);border:1px dashed var(--border-strong);background:var(--bg-subtle);align-items:flex-start;margin-bottom:var(--s6)}
.pending-banner .pb-ico{width:44px;height:44px;flex:0 0 auto;border-radius:var(--r-md);background:var(--warning-soft);color:var(--warning);display:grid;place-items:center}
.pending-banner .pb-ico svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.pending-banner h3{font-size:var(--t-lg);margin-bottom:6px}
.pending-banner p{color:var(--text-muted);font-size:var(--t-sm)}
.pending-tag{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:var(--t-xs);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.08em;color:var(--warning);background:var(--warning-soft);padding:4px 10px;border-radius:var(--r-full);margin-bottom:var(--s4)}
.is-placeholder{opacity:.62;filter:saturate(.6)}
.is-placeholder::after{content:"Sample structure — full content pending";display:block;font-family:var(--font-mono);font-size:var(--t-xs);color:var(--text-subtle);margin-top:var(--s3)}