/* REST API v1 reference — scoped styles.
   Ported from API1/help.html's inline <style>. EVERY rule is namespaced under `.apidocs` so the doc's styles cannot
   bleed into WWW's chrome and the chrome minimally disturbs the doc. The doc's original CSS custom properties (:root)
   are declared on `.apidocs` (they cascade to descendants); the standalone-page `body`/`html` typography moves onto
   `.apidocs` too. The sidebar, originally position:fixed owning the viewport, becomes a sticky in-content column that
   sits below WWW's fixed 60px top nav. */

.apidocs {
    /* light theme tokens (were :root) */
    --bg: #ffffff;
    --bg-alt: #f7f8fa;
    --bg-sidebar: #fbfcfd;
    --panel: #f3f5f7;
    --border: #e4e7eb;
    --text: #1f2733;
    --text-muted: #5b6675;
    --heading: #0f1722;
    --link: #1d4ed8;
    --link-hover: #1e40af;
    --code-bg: #1e293b;
    --code-text: #e2e8f0;
    --code-key: #7dd3fc;
    --code-str: #86efac;
    --code-com: #94a3b8;
    --accent: #2563eb;
    --accent-soft: #eff6ff;
    --warn-bg: #fff7ed;
    --warn-border: #fdba74;
    --warn-text: #9a3412;
    --danger-bg: #fef2f2;
    --danger-border: #fca5a5;
    --danger-text: #991b1b;
    --ok: #15803d;
    --tag-get: #0369a1;
    --tag-post: #15803d;
    --tag-put: #b45309;
    --tag-del: #b91c1c;
    --tag-patch: #6d28d9;

    /* was `body` */
    background: var(--bg);
    color: var(--text);
    font-family: 'Segoe UI', system-ui, -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif;
    font-size: 15px;
    line-height: 1.6;

    /* two-column layout container (replaces the standalone page's fixed sidebar + margin-left content) */
    display: flex;
    align-items: flex-start;
    max-width: 1400px;
    margin: 0 auto;
    scroll-behavior: smooth;
}

@media (prefers-color-scheme: dark) {
    .apidocs {
        --bg: #0f151c;
        --bg-alt: #141b24;
        --bg-sidebar: #10161e;
        --panel: #1a222c;
        --border: #26303c;
        --text: #cdd6e0;
        --text-muted: #8a97a6;
        --heading: #f1f5f9;
        --link: #60a5fa;
        --link-hover: #93c5fd;
        --code-bg: #0b1119;
        --code-text: #d5dde7;
        --code-key: #7dd3fc;
        --code-str: #86efac;
        --code-com: #64748b;
        --accent: #3b82f6;
        --accent-soft: rgba(59, 130, 246, .14);
        --warn-bg: rgba(180, 83, 9, .12);
        --warn-border: rgba(217, 119, 6, .5);
        --warn-text: #fbbf24;
        --danger-bg: rgba(153, 27, 27, .16);
        --danger-border: rgba(220, 38, 38, .5);
        --danger-text: #fca5a5;
        --ok: #4ade80;
    }
}

.apidocs * { box-sizing: border-box; }
/* anchor jumps clear WWW's fixed 60px top nav */
.apidocs [id] { scroll-margin-top: 80px; }
.apidocs a { color: var(--link); text-decoration: none; }
.apidocs a:hover { color: var(--link-hover); text-decoration: underline; }

/* ---------------- layout ---------------- */
.apidocs .sidebar {
    position: sticky;
    top: 76px;
    width: 300px;
    flex-shrink: 0;
    height: calc(100vh - 76px);
    background: var(--bg-sidebar);
    border-right: 1px solid var(--border);
    display: flex;
    flex-direction: column;
    z-index: 5;
}
.apidocs .sidebar-search { padding: 12px 14px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.apidocs .sidebar-search input {
    width: 100%; padding: 8px 10px; font-size: 13px;
    background: var(--bg); border: 1px solid var(--border); border-radius: 8px;
    color: var(--text);
}
.apidocs .sidebar-search input:focus { outline: none; border-color: var(--accent); }
.apidocs .sidebar-nav { flex: 1; overflow-y: auto; padding: 10px 8px 40px; }
.apidocs .sidebar-nav .grp { margin-bottom: 4px; }
.apidocs .sidebar-nav .grp > .grp-head {
    font-size: 11px; text-transform: uppercase; letter-spacing: .06em;
    color: var(--text-muted); font-weight: 700; padding: 12px 10px 4px;
}
.apidocs .sidebar-nav a {
    display: block; padding: 5px 10px; border-radius: 6px;
    color: var(--text); font-size: 13.5px;
}
.apidocs .sidebar-nav a:hover { background: var(--panel); text-decoration: none; }
.apidocs .sidebar-nav a.active { background: var(--accent-soft); color: var(--link); font-weight: 600; }
.apidocs .sidebar-nav a.sub { padding-left: 22px; font-size: 13px; color: var(--text-muted); }
.apidocs .sidebar-nav a.sub:hover { color: var(--text); }
.apidocs .sidebar-nav .hidden { display: none; }
.apidocs .no-matches { display: none; padding: 10px; font-size: 12px; color: var(--text-muted); }

.apidocs .doc-main { flex: 1; min-width: 0; }
.apidocs .content { max-width: 1000px; padding: 28px 40px 80px; margin: 0; }
.apidocs .menu-toggle {
    display: none; position: fixed; top: 70px; left: 10px; z-index: 6;
    width: 40px; height: 40px; border-radius: 8px; border: 1px solid var(--border);
    background: var(--bg); color: var(--text); font-size: 18px; cursor: pointer;
}
@media (max-width: 900px) {
    .apidocs { display: block; }
    .apidocs .sidebar {
        position: fixed; top: 60px; left: 0; height: calc(100vh - 60px);
        transform: translateX(-100%); z-index: 35; transition: transform .2s ease;
    }
    .apidocs .sidebar.open { transform: translateX(0); }
    .apidocs .content { max-width: none; padding: 20px 16px 80px; }
    .apidocs .menu-toggle { display: block; }
}

/* ---------------- typography ---------------- */
.apidocs h1.page { font-size: 30px; color: var(--heading); margin: 8px 0 4px; letter-spacing: -.01em; }
.apidocs h2.sec {
    font-size: 23px; color: var(--heading); margin: 44px 0 10px;
    padding-top: 14px; border-top: 1px solid var(--border);
}
.apidocs h3.op { font-size: 18px; color: var(--heading); margin: 30px 0 6px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.apidocs h4 { font-size: 14px; color: var(--heading); margin: 20px 0 6px; text-transform: uppercase; letter-spacing: .04em; }
.apidocs p { margin: 8px 0; }
.apidocs .lead { color: var(--text-muted); font-size: 16px; }
.apidocs code.inline {
    background: var(--panel); padding: 1px 6px; border-radius: 5px;
    font-family: 'Cascadia Code', 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
    font-size: 13px; color: var(--heading);
}

/* http verb tags */
.apidocs .verb { font-family: 'Cascadia Code', Consolas, monospace; font-size: 12px; font-weight: 700; color: #fff; padding: 2px 8px; border-radius: 5px; letter-spacing: .03em; }
.apidocs .verb.get { background: var(--tag-get); }
.apidocs .verb.post { background: var(--tag-post); }
.apidocs .verb.put { background: var(--tag-put); }
.apidocs .verb.del { background: var(--tag-del); }
.apidocs .verb.patch { background: var(--tag-patch); }
.apidocs .path { font-family: 'Cascadia Code', Consolas, monospace; font-size: 15px; color: var(--heading); font-weight: 600; }
.apidocs .anon-badge { font-size: 11px; font-weight: 600; color: var(--ok); border: 1px solid var(--ok); border-radius: 5px; padding: 1px 6px; }

/* callouts */
.apidocs .note, .apidocs .warn, .apidocs .danger {
    border: 1px solid var(--border); border-left-width: 4px;
    border-radius: 6px; padding: 10px 14px; margin: 14px 0; font-size: 14px; background: var(--bg-alt);
}
.apidocs .note { border-left-color: var(--accent); }
.apidocs .warn { border-left-color: var(--warn-border); background: var(--warn-bg); color: var(--warn-text); }
.apidocs .danger { border-left-color: var(--danger-border); background: var(--danger-bg); color: var(--danger-text); }
.apidocs .note b, .apidocs .warn b, .apidocs .danger b { color: inherit; }

/* tables */
.apidocs .table-wrap { overflow-x: auto; margin: 12px 0; border: 1px solid var(--border); border-radius: 8px; }
.apidocs table { border-collapse: collapse; width: 100%; font-size: 13.5px; }
.apidocs th, .apidocs td { text-align: left; padding: 8px 12px; border-bottom: 1px solid var(--border); vertical-align: top; }
.apidocs th { background: var(--panel); color: var(--heading); font-weight: 600; white-space: nowrap; }
.apidocs tr:last-child td { border-bottom: none; }
.apidocs td code, .apidocs th code { font-family: 'Cascadia Code', Consolas, monospace; font-size: 12.5px; color: var(--heading); }
.apidocs td .req { color: var(--danger-text); font-weight: 700; font-size: 11px; }
.apidocs .mono { font-family: 'Cascadia Code', Consolas, monospace; font-size: 12.5px; }

/* code blocks */
.apidocs .codebox { position: relative; margin: 12px 0; border-radius: 8px; overflow: hidden; background: var(--code-bg); }
.apidocs .codebox .bar { display: flex; justify-content: space-between; align-items: center; padding: 6px 12px; background: rgba(255, 255, 255, .04); border-bottom: 1px solid rgba(255, 255, 255, .06); }
.apidocs .codebox .bar .label { color: #94a3b8; font-size: 11.5px; font-family: 'Cascadia Code', Consolas, monospace; }
.apidocs .codebox .bar .copy { background: transparent; border: 1px solid rgba(255, 255, 255, .15); color: #cbd5e1; font-size: 11px; padding: 2px 10px; border-radius: 5px; cursor: pointer; }
.apidocs .codebox .bar .copy:hover { background: rgba(255, 255, 255, .1); }
.apidocs .codebox pre { margin: 0; padding: 14px 16px; overflow-x: auto; }
.apidocs .codebox code { font-family: 'Cascadia Code', 'SFMono-Regular', Consolas, 'Liberation Mono', monospace; font-size: 12.5px; color: var(--code-text); line-height: 1.55; white-space: pre; }
.apidocs .codebox .k { color: var(--code-key); }
.apidocs .codebox .s { color: var(--code-str); }
.apidocs .codebox .c { color: var(--code-com); font-style: italic; }
.apidocs .codebox .m { color: #fca5a5; }

/* list-style is restored explicitly: WWW's Tailwind preflight sets `ul { list-style: none }`, which would strip the
   bullets the standalone page got from the browser default. */
.apidocs ul.clean { margin: 8px 0; padding-left: 22px; list-style: disc; }
.apidocs ul.clean li { margin: 3px 0; }
.apidocs .pill { display: inline-block; font-family: 'Cascadia Code', Consolas, monospace; font-size: 12px; background: var(--panel); border: 1px solid var(--border); border-radius: 5px; padding: 1px 7px; margin: 2px 3px 2px 0; color: var(--heading); }
.apidocs .footer { margin: 0; padding: 24px 40px; border-top: 1px solid var(--border); color: var(--text-muted); font-size: 13px; }
@media (max-width: 900px) { .apidocs .footer { padding: 20px 16px; } }

/* ---------------- authenticated chrome variant ----------------
   Authed users already get WWW's own LEFT sidebar + top navbar, so: the doc's title moves into the navbar (rendered
   server-side via ViewBag.NavTitle) and its in-content H1 is hidden here; the doc's TOC moves to the RIGHT (the authed
   chrome owns the left). These selectors match the base .apidocs rules at equal specificity, so they must stay AFTER
   them (source order wins). */
.apidocs--authed .content h1.page { display: none; }
/* Flip the two-column order: content left, TOC right (DOM order is sidebar-then-doc-main). */
.apidocs--authed .sidebar { order: 2; border-right: none; border-left: 1px solid var(--border); }
.apidocs--authed .doc-main { order: 1; }

@media (max-width: 900px) {
    /* Right-side drawer (the authed chrome's own mobile sidebar owns the left edge). */
    .apidocs--authed .sidebar {
        left: auto; right: 0; transform: translateX(100%);
        border-left: 1px solid var(--border); border-right: none;
    }
    .apidocs--authed .sidebar.open { transform: translateX(0); }
    .apidocs--authed .menu-toggle { left: auto; right: 10px; }
}