/* ============================================================
   NET RENTALS — API DOCUMENTATION
   /css/marketing/developers/api.css

   DEPENDS ON:
   /css/marketing/rentals-marketing-ui.css

   DESIGN LANGUAGE:
   - light technical documentation workspace
   - different visual authorship from /developers.html
   - dense reference navigation
   - matte off-white / cool gray surfaces
   - dark code examples
   - restrained method colors
   - desktop documentation app feel
   ============================================================ */

/* ============================================================
   01. TOKENS
   ============================================================ */

.api-docs-page {
    --api-bg: #f7f8fa;
    --api-surface: #ffffff;
    --api-surface-soft: #f2f4f7;
    --api-surface-muted: #eceff3;

    --api-text: #16181d;
    --api-text-soft: #414650;
    --api-muted: #737b88;
    --api-dim: #9ba2ad;

    --api-border: #e1e5ea;
    --api-border-strong: #d4d9e0;

    --api-blue: #2563eb;
    --api-blue-soft: #eff6ff;

    --api-green: #15803d;
    --api-green-soft: #f0fdf4;

    --api-orange: #c2410c;
    --api-orange-soft: #fff7ed;

    --api-purple: #7c3aed;
    --api-purple-soft: #f5f3ff;

    --api-red: #b91c1c;
    --api-red-soft: #fef2f2;

    --api-yellow: #a16207;
    --api-yellow-soft: #fefce8;

    --api-code-bg: #101114;
    --api-code-panel: #15171b;
    --api-code-border: #272a30;
    --api-code-text: #e6e8ec;
    --api-code-muted: #7f8794;
    --api-code-green: #86efac;
    --api-code-blue: #93c5fd;
    --api-code-purple: #c4b5fd;

    --api-sidebar-width: 270px;
    --api-toc-width: 200px;

    --api-mono:
        "SFMono-Regular",
        "SF Mono",
        "Roboto Mono",
        "Cascadia Code",
        "Liberation Mono",
        Menlo,
        Consolas,
        monospace;

    background: var(--api-bg);
}

/* ============================================================
   02. GLOBAL API DOCS
   ============================================================ */

.api-docs-page,
.api-docs-page * {
    box-sizing: border-box;
}

.api-docs-page {
    color: var(--api-text);
}

.api-docs-page code,
.api-docs-page pre,
.api-docs-page kbd {
    font-family: var(--api-mono);
}

.api-docs-page code {
    font-size: 0.88em;
}

.api-docs-page pre {
    margin: 0;
}

.api-docs-page button {
    font: inherit;
}

/* ============================================================
   03. GLOBAL HEADER OVERRIDE
   ============================================================ */

.api-docs-site-header {
    border-bottom: 1px solid var(--api-border);

    background: rgba(255,255,255,0.96);

    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.api-docs-site-header .nr-nav-link,
.api-docs-site-header .nr-nav-dropdown-button,
.api-docs-site-header .nr-header-login {
    color: #39404a;
}

.api-docs-site-header .nr-nav-link:hover,
.api-docs-site-header .nr-nav-dropdown-button:hover,
.api-docs-site-header .nr-header-login:hover {
    color: #111318;
}

.api-docs-site-header .nr-header-signup {
    border-color: #15171b;

    background: #15171b;
    color: #ffffff;
}

.api-docs-site-header .nr-header-signup:hover {
    background: #000000;
}

.api-docs-site-header .nr-menu-button span {
    background: #16181d;
}

/* ============================================================
   04. DOCS BAR
   ============================================================ */

.api-docs-bar {
    position: sticky;
    top: 72px;
    z-index: 70;

    border-bottom: 1px solid var(--api-border);

    background: rgba(247,248,250,0.96);

    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.api-docs-bar-inner {
    width: 100%;
    max-width: 1500px;
    min-height: 52px;

    display: flex;
    align-items: center;

    gap: 8px;

    margin: 0 auto;
    padding: 0 22px;
}

.api-docs-product {
    color: var(--api-muted);

    font-size: 0.78rem;
    font-weight: 650;
}

.api-docs-product:hover {
    color: var(--api-text);
}

.api-docs-product-separator {
    color: var(--api-dim);
}

.api-docs-bar-inner > strong {
    color: var(--api-text);

    font-size: 0.78rem;
    font-weight: 700;
}

.api-docs-bar nav {
    display: flex;
    align-items: center;

    gap: 22px;

    margin-left: auto;
}

.api-docs-bar nav a {
    position: relative;

    min-height: 52px;

    display: flex;
    align-items: center;

    color: var(--api-muted);

    font-size: 0.74rem;
    font-weight: 650;
}

.api-docs-bar nav a:hover,
.api-docs-bar nav a.is-active {
    color: var(--api-text);
}

.api-docs-bar nav a.is-active::after {
    content: "";

    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;

    height: 2px;

    background: #17191e;
}

/* ============================================================
   05. DOCS WORKSPACE
   ============================================================ */

.api-docs-workspace {
    width: 100%;
    max-width: 1500px;

    display: grid;
    grid-template-columns:
        var(--api-sidebar-width)
        minmax(0, 1fr)
        var(--api-toc-width);

    align-items: start;

    margin: 0 auto;

    background: var(--api-bg);
}

/* ============================================================
   06. LEFT SIDEBAR
   ============================================================ */

.api-docs-sidebar {
    position: sticky;
    top: 124px;

    height: calc(100dvh - 124px);

    border-right: 1px solid var(--api-border);

    background: var(--api-bg);
}

.api-docs-sidebar-inner {
    height: 100%;

    overflow-y: auto;

    padding:
        20px
        18px
        42px;

    overscroll-behavior: contain;

    scrollbar-width: thin;
    scrollbar-color: #d1d6dd transparent;
}

.api-docs-sidebar-search {
    min-height: 38px;

    display: grid;
    grid-template-columns:
        17px
        minmax(0, 1fr)
        auto;

    gap: 9px;

    align-items: center;

    margin-bottom: 24px;
    padding: 0 10px;

    border: 1px solid var(--api-border);
    border-radius: 7px;

    background: var(--api-surface);
    color: var(--api-muted);

    cursor: default;
}

.api-docs-sidebar-search svg {
    width: 16px;
    height: 16px;
}

.api-docs-sidebar-search span {
    font-size: 0.73rem;
}

.api-docs-sidebar-search kbd {
    min-width: 22px;
    height: 22px;

    display: grid;
    place-items: center;

    padding: 0 5px;

    border: 1px solid var(--api-border);
    border-bottom-color: var(--api-border-strong);
    border-radius: 4px;

    background: var(--api-surface-soft);
    color: var(--api-muted);

    font-size: 0.62rem;
}

.api-docs-sidebar-nav {
    display: grid;

    gap: 26px;
}

.api-docs-nav-group {
    display: grid;

    gap: 2px;
}

.api-docs-nav-label {
    display: block;

    margin-bottom: 7px;
    padding: 0 8px;

    color: var(--api-dim);

    font-size: 0.62rem;
    font-weight: 800;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.api-docs-nav-group a {
    min-height: 32px;

    display: flex;
    align-items: center;

    padding: 0 8px;

    border-radius: 6px;

    color: #555e6a;

    font-size: 0.76rem;
    font-weight: 500;

    transition:
        background 140ms ease,
        color 140ms ease;
}

.api-docs-nav-group a:hover {
    background: #eceff3;
    color: #16181d;
}

/* ============================================================
   07. MAIN CONTENT
   ============================================================ */

.api-docs-content {
    min-width: 0;

    background: var(--api-surface);
}

.api-docs-section {
    scroll-margin-top: 150px;

    max-width: 900px;

    margin: 0 auto;
    padding:
        78px
        56px;

    border-bottom: 1px solid var(--api-border);
}

.api-docs-section:last-of-type {
    border-bottom: 0;
}

/* ============================================================
   08. INTRO
   ============================================================ */

.api-docs-intro {
    padding-top: 84px;
}

.api-docs-status-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;

    gap: 10px;

    margin-bottom: 24px;

    color: var(--api-muted);

    font-size: 0.73rem;
}

.api-docs-status-badge {
    padding: 5px 8px;

    border: 1px solid #f0cbb9;
    border-radius: 999px;

    background: #fff7ed;
    color: #9a3412;

    font-size: 0.63rem;
    font-weight: 800;

    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.api-docs-intro h1 {
    margin: 0;

    color: var(--api-text);

    font-size:
        clamp(
            3.4rem,
            6vw,
            5.8rem
        );

    line-height: 0.96;
    font-weight: 620;

    letter-spacing: -0.06em;
}

.api-docs-lead {
    max-width: 720px;

    margin: 24px 0 0;

    color: var(--api-text-soft);

    font-size:
        clamp(
            1.1rem,
            1.8vw,
            1.32rem
        );

    line-height: 1.65;
}

.api-docs-base-grid {
    display: grid;
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 10px;

    margin-top: 28px;
}

.api-docs-base-grid > div {
    min-width: 0;

    padding: 16px;

    border: 1px solid var(--api-border);
    border-radius: 8px;

    background: var(--api-surface-soft);
}

.api-docs-base-grid small {
    display: block;

    margin-bottom: 7px;

    color: var(--api-muted);

    font-size: 0.61rem;
    font-weight: 800;

    letter-spacing: 0.08em;
}

.api-docs-base-grid code {
    display: block;

    overflow: hidden;

    color: #313842;

    font-size: 0.72rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

/* ============================================================
   09. NOTICE
   ============================================================ */

.api-docs-notice {
    display: grid;
    grid-template-columns:
        34px
        minmax(0, 1fr);

    gap: 14px;

    margin-top: 30px;
    padding: 18px;

    border: 1px solid #cfdcf8;
    border-radius: 9px;

    background: #f5f8ff;
}

.api-docs-notice-icon {
    width: 30px;
    height: 30px;

    display: grid;
    place-items: center;

    border: 1px solid #c6d6f7;
    border-radius: 50%;

    background: #ffffff;
    color: #315faa;

    font-size: 0.78rem;
    font-weight: 800;
}

.api-docs-notice strong {
    display: block;

    color: #25364f;

    font-size: 0.82rem;
    font-weight: 700;
}

.api-docs-notice p {
    margin: 5px 0 0;

    color: #5b6880;

    font-size: 0.79rem;
    line-height: 1.6;
}

.api-docs-notice-plain {
    border-color: var(--api-border);

    background: var(--api-surface-soft);
}

.api-docs-notice-plain .api-docs-notice-icon {
    border-color: var(--api-border);

    color: var(--api-text-soft);
}

/* ============================================================
   10. SECTION HEADINGS
   ============================================================ */

.api-docs-section-heading {
    max-width: 720px;

    margin-bottom: 34px;
}

.api-docs-section-heading > span {
    display: block;

    margin-bottom: 10px;

    color: var(--api-blue);

    font-size: 0.65rem;
    font-weight: 800;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.api-docs-section-heading h2 {
    margin: 0;

    color: var(--api-text);

    font-size:
        clamp(
            2rem,
            3.5vw,
            3rem
        );

    line-height: 1.04;
    font-weight: 620;

    letter-spacing: -0.045em;
}

.api-docs-section-heading p {
    margin: 16px 0 0;

    color: var(--api-text-soft);

    font-size: 0.96rem;
    line-height: 1.7;
}

.api-docs-subsection {
    margin-top: 40px;
}

.api-docs-subsection h3,
.api-reference-copy h3 {
    margin: 0 0 10px;

    color: var(--api-text);

    font-size: 1rem;
    font-weight: 700;
}

.api-reference-copy p {
    margin: 0;

    color: var(--api-muted);

    font-size: 0.84rem;
    line-height: 1.6;
}

/* ============================================================
   11. TABLE
   ============================================================ */

.api-docs-table {
    overflow: hidden;

    border: 1px solid var(--api-border);
    border-radius: 8px;
}

.api-docs-table > div {
    display: grid;
    grid-template-columns:
        150px
        minmax(0, 1fr)
        minmax(150px, 0.8fr);

    min-height: 54px;

    align-items: center;

    border-bottom: 1px solid var(--api-border);
}

.api-docs-table > div:last-child {
    border-bottom: 0;
}

.api-docs-table > div > * {
    min-width: 0;

    padding: 14px;
}

.api-docs-table-head {
    min-height: 42px !important;

    background: var(--api-surface-soft);
}

.api-docs-table-head span {
    color: var(--api-muted);

    font-size: 0.66rem;
    font-weight: 750;
}

.api-docs-table strong {
    color: var(--api-text);

    font-size: 0.78rem;
}

.api-docs-table code {
    overflow: hidden;

    color: #354052;

    font-size: 0.70rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.api-docs-table > div:not(.api-docs-table-head) > span {
    color: var(--api-muted);

    font-size: 0.76rem;
}

/* ============================================================
   12. REFERENCE EXAMPLES
   ============================================================ */

.api-reference-example {
    display: grid;
    grid-template-columns:
        minmax(180px, 0.74fr)
        minmax(400px, 1.26fr);

    gap: 30px;

    align-items: start;

    margin-top: 34px;
}

/* ============================================================
   13. CODE BLOCK
   ============================================================ */

.api-code-block {
    overflow: hidden;

    border: 1px solid var(--api-code-border);
    border-radius: 9px;

    background: var(--api-code-bg);
}

.api-code-block header {
    min-height: 42px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 16px;

    padding: 0 13px;

    border-bottom: 1px solid var(--api-code-border);

    background: var(--api-code-panel);
}

.api-code-block header > span {
    color: #858c97;

    font-family: var(--api-mono);
    font-size: 0.62rem;
    font-weight: 700;

    letter-spacing: 0.06em;
}

.api-copy-button {
    padding: 4px 7px;

    border: 1px solid #31343b;
    border-radius: 5px;

    background: #1c1e23;
    color: #a9afb9;

    font-family: var(--api-mono);
    font-size: 0.58rem;

    cursor: pointer;
}

.api-copy-button:hover {
    border-color: #454951;

    color: #ffffff;
}

.api-code-block pre {
    overflow-x: auto;

    padding: 18px;

    background: var(--api-code-bg);
}

.api-code-block pre code {
    color: var(--api-code-text);

    font-family: var(--api-mono);
    font-size: 0.73rem;
    line-height: 1.8;

    white-space: pre;
}

/* ============================================================
   14. KEY LIST
   ============================================================ */

.api-key-list {
    border-top: 1px solid var(--api-border);
}

.api-key-list > div {
    display: grid;
    grid-template-columns:
        160px
        minmax(0, 1fr);

    gap: 18px;

    padding: 18px 0;

    border-bottom: 1px solid var(--api-border);
}

.api-key-list > div > code {
    align-self: start;

    justify-self: start;

    padding: 5px 7px;

    border: 1px solid var(--api-border);
    border-radius: 5px;

    background: var(--api-surface-soft);
    color: #344050;

    font-size: 0.68rem;
}

.api-key-list strong {
    display: block;

    color: var(--api-text);

    font-size: 0.82rem;
}

.api-key-list p {
    margin: 5px 0 0;

    color: var(--api-muted);

    font-size: 0.78rem;
    line-height: 1.55;
}

/* ============================================================
   15. PILLS
   ============================================================ */

.api-pill-list {
    display: flex;
    flex-wrap: wrap;

    gap: 7px;

    margin-top: 20px;
}

.api-pill-list code {
    padding: 6px 8px;

    border: 1px solid var(--api-border);
    border-radius: 5px;

    background: var(--api-surface-soft);
    color: #4b5562;

    font-size: 0.65rem;
}

/* ============================================================
   16. CALLOUT LIST
   ============================================================ */

.api-docs-callout-list {
    display: grid;
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 8px;

    margin-top: 20px;
}

.api-docs-callout-list > div {
    padding: 12px;

    border: 1px solid var(--api-border);
    border-radius: 6px;

    background: var(--api-surface-soft);
}

.api-docs-callout-list code {
    color: #414b58;

    font-size: 0.68rem;
}

/* ============================================================
   17. ENDPOINT LIST
   ============================================================ */

.api-endpoint-list {
    overflow: hidden;

    border: 1px solid var(--api-border);
    border-radius: 8px;
}

.api-endpoint-list > div {
    display: grid;
    grid-template-columns:
        62px
        minmax(250px, 1fr)
        minmax(170px, 0.8fr);

    gap: 12px;

    align-items: center;

    min-height: 56px;

    padding:
        11px
        13px;

    border-bottom: 1px solid var(--api-border);

    background: #ffffff;
}

.api-endpoint-list > div:last-child {
    border-bottom: 0;
}

.api-endpoint-list > div:hover {
    background: #fafbfc;
}

.api-endpoint-list code {
    min-width: 0;

    overflow: hidden;

    color: #2f3742;

    font-size: 0.70rem;
    font-weight: 600;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.api-endpoint-list p {
    margin: 0;

    color: var(--api-muted);

    font-size: 0.73rem;
    line-height: 1.45;
}

/* ============================================================
   18. HTTP METHODS
   ============================================================ */

.api-method {
    min-width: 48px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    justify-self: start;

    padding:
        5px
        6px;

    border-radius: 5px;

    font-family: var(--api-mono);
    font-size: 0.58rem;
    font-weight: 850;

    letter-spacing: 0.03em;
}

.api-method.get {
    border: 1px solid #bbdafc;

    background: #eff6ff;
    color: #1d4ed8;
}

.api-method.post {
    border: 1px solid #bde6ca;

    background: #f0fdf4;
    color: #15803d;
}

.api-method.patch {
    border: 1px solid #d8c9fa;

    background: #f5f3ff;
    color: #6d28d9;
}

.api-method.delete {
    border: 1px solid #f3c6c6;

    background: #fef2f2;
    color: #b91c1c;
}

/* ============================================================
   19. RESOURCE SECTIONS
   ============================================================ */

.api-resource-section {
    position: relative;
}

.api-resource-section::before {
    content: "";

    position: absolute;
    top: 0;
    left: 56px;

    width: 34px;
    height: 1px;

    background: #cbd2db;
}

/* ============================================================
   20. NEXT LINK
   ============================================================ */

.api-docs-next-link {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        auto;

    grid-template-areas:
        "label arrow"
        "title arrow";

    gap:
        4px
        18px;

    align-items: center;

    margin-top: 38px;
    padding: 18px 20px;

    border: 1px solid var(--api-border);
    border-radius: 8px;

    background: var(--api-surface-soft);
}

.api-docs-next-link > span {
    grid-area: label;

    color: var(--api-muted);

    font-size: 0.65rem;
    font-weight: 750;

    text-transform: uppercase;
    letter-spacing: 0.07em;
}

.api-docs-next-link strong {
    grid-area: title;

    color: var(--api-text);

    font-size: 0.92rem;
}

.api-docs-next-link i {
    grid-area: arrow;

    color: var(--api-muted);

    font-style: normal;

    transition: transform 150ms ease;
}

.api-docs-next-link:hover {
    border-color: var(--api-border-strong);

    background: #eceff3;
}

.api-docs-next-link:hover i {
    transform: translateX(4px);
}

/* ============================================================
   21. SECURITY
   ============================================================ */

.api-docs-security {
    background: #fafafa;
}

.api-security-grid {
    display: grid;
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 12px;
}

.api-security-grid > div {
    padding: 22px;

    border: 1px solid var(--api-border);
    border-radius: 8px;

    background: var(--api-surface);
}

.api-security-grid strong {
    display: block;

    margin-bottom: 14px;

    color: var(--api-text);

    font-size: 0.84rem;
}

.api-security-grid ul {
    margin: 0;
    padding-left: 18px;

    color: var(--api-muted);
}

.api-security-grid li {
    margin-bottom: 8px;

    font-size: 0.78rem;
    line-height: 1.5;
}

.api-security-grid li:last-child {
    margin-bottom: 0;
}

/* ============================================================
   22. ROADMAP
   ============================================================ */

.api-docs-roadmap {
    background: #f7f8fa;
}

.api-roadmap-columns {
    display: grid;
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 12px;
}

.api-roadmap-columns > div {
    display: flex;
    flex-direction: column;

    gap: 7px;

    padding: 20px;

    border: 1px solid var(--api-border);
    border-radius: 8px;

    background: var(--api-surface);
}

.api-roadmap-columns > div > span {
    margin-bottom: 10px;

    color: var(--api-blue);

    font-size: 0.67rem;
    font-weight: 850;

    letter-spacing: 0.08em;
}

.api-roadmap-columns code {
    padding-bottom: 7px;

    border-bottom: 1px solid var(--api-border);

    color: #4b5562;

    font-size: 0.68rem;
    line-height: 1.4;
}

.api-roadmap-columns code:last-child {
    border-bottom: 0;
}

/* ============================================================
   23. END SECTION
   ============================================================ */

.api-docs-end {
    max-width: 900px;

    margin: 0 auto;
    padding:
        88px
        56px
        100px;

    background: #ffffff;
}

.api-docs-end > span {
    display: block;

    margin-bottom: 14px;

    color: var(--api-blue);

    font-family: var(--api-mono);
    font-size: 0.64rem;
    font-weight: 800;

    letter-spacing: 0.08em;
}

.api-docs-end h2 {
    max-width: 700px;

    margin: 0;

    color: var(--api-text);

    font-size:
        clamp(
            2.5rem,
            5vw,
            4.4rem
        );

    line-height: 0.98;
    font-weight: 620;

    letter-spacing: -0.055em;
}

.api-docs-end > p {
    margin: 18px 0 0;

    color: var(--api-muted);

    font-size: 1rem;
}

.api-docs-end > div {
    display: flex;
    flex-wrap: wrap;

    gap: 10px;

    margin-top: 28px;
}

.api-docs-end-primary,
.api-docs-end-secondary {
    min-height: 44px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0 16px;

    border-radius: 7px;

    font-size: 0.76rem;
    font-weight: 700;
}

.api-docs-end-primary {
    border: 1px solid #16181d;

    background: #16181d;
    color: #ffffff;
}

.api-docs-end-primary:hover {
    background: #000000;
}

.api-docs-end-secondary {
    border: 1px solid var(--api-border);

    background: var(--api-surface-soft);
    color: var(--api-text-soft);
}

.api-docs-end-secondary:hover {
    border-color: var(--api-border-strong);

    background: #eceff3;
}

/* ============================================================
   24. RIGHT TABLE OF CONTENTS
   ============================================================ */

.api-docs-toc {
    position: sticky;
    top: 124px;

    height: calc(100dvh - 124px);

    border-left: 1px solid var(--api-border);

    background: var(--api-bg);
}

.api-docs-toc-inner {
    padding:
        28px
        18px;
}

.api-docs-toc-inner > span {
    display: block;

    margin-bottom: 14px;

    color: var(--api-dim);

    font-size: 0.61rem;
    font-weight: 800;

    letter-spacing: 0.08em;
}

.api-docs-toc a {
    display: block;

    padding: 6px 0;

    color: var(--api-muted);

    font-size: 0.71rem;
    line-height: 1.4;
}

.api-docs-toc a:hover {
    color: var(--api-text);
}

.api-docs-toc-divider {
    height: 1px;

    margin: 14px 0;

    background: var(--api-border);
}

.api-docs-toc .api-docs-toc-next {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 10px;

    color: var(--api-text-soft);

    font-weight: 650;
}

.api-docs-toc-next span {
    transition: transform 150ms ease;
}

.api-docs-toc-next:hover span {
    transform: translateX(3px);
}

/* ============================================================
   25. FOOTER
   ============================================================ */

.api-docs-footer {
    border-top: 1px solid var(--api-border);

    background: #f2f4f7;
}

.api-docs-footer .nr-footer-group summary,
.api-docs-footer .nr-footer-description,
.api-docs-footer .nr-footer-description a,
.api-docs-footer .nr-footer-country,
.api-docs-footer .nr-footer-copyright,
.api-docs-footer .nr-footer-links a,
.api-docs-footer .nr-footer-legal a {
    color: #5f6874;
}

.api-docs-footer .nr-footer-group summary {
    color: #20242b;
}

.api-docs-footer .nr-footer-links a:hover,
.api-docs-footer .nr-footer-description a:hover,
.api-docs-footer .nr-footer-legal a:hover {
    color: #111318;
}

/* ============================================================
   26. FOCUS
   ============================================================ */

.api-docs-page a:focus-visible,
.api-docs-page button:focus-visible {
    outline: 2px solid #4f7fec;
    outline-offset: 3px;
}

/* ============================================================
   27. LARGE TABLET
   ============================================================ */

@media (max-width: 1180px) {

    .api-docs-workspace {
        grid-template-columns:
            240px
            minmax(0, 1fr);
    }

    .api-docs-toc {
        display: none;
    }

    .api-docs-section,
    .api-docs-end {
        max-width: 940px;
    }
}

/* ============================================================
   28. TABLET
   ============================================================ */

@media (max-width: 900px) {

    .api-docs-bar {
        top: 64px;
    }

    .api-docs-workspace {
        display: block;
    }

    .api-docs-sidebar {
        position: static;

        width: 100%;
        height: auto;

        border-right: 0;
        border-bottom: 1px solid var(--api-border);
    }

    .api-docs-sidebar-inner {
        height: auto;

        display: flex;
        align-items: center;

        gap: 14px;

        overflow-x: auto;
        overflow-y: hidden;

        padding:
            12px
            18px;

        scrollbar-width: none;
    }

    .api-docs-sidebar-inner::-webkit-scrollbar {
        display: none;
    }

    .api-docs-sidebar-search {
        flex: 0 0 190px;

        margin-bottom: 0;
    }

    .api-docs-sidebar-nav {
        display: flex;

        gap: 6px;
    }

    .api-docs-nav-group {
        display: contents;
    }

    .api-docs-nav-label {
        display: none;
    }

    .api-docs-nav-group a {
        min-height: 38px;

        flex: 0 0 auto;

        padding: 0 10px;

        border: 1px solid var(--api-border);
        border-radius: 6px;

        background: var(--api-surface);

        white-space: nowrap;
    }

    .api-docs-section,
    .api-docs-end {
        max-width: none;

        padding-left: 34px;
        padding-right: 34px;
    }

    .api-reference-example {
        grid-template-columns: 1fr;

        gap: 18px;
    }

    .api-resource-section::before {
        left: 34px;
    }
}

/* ============================================================
   29. MOBILE
   ============================================================ */

@media (max-width: 680px) {

    .api-docs-bar-inner {
        padding:
            0
            16px;
    }

    .api-docs-bar nav {
        gap: 14px;
    }

    .api-docs-product,
    .api-docs-product-separator {
        display: none;
    }

    .api-docs-bar-inner > strong {
        font-size: 0.72rem;
    }

    .api-docs-sidebar-inner {
        padding:
            10px
            14px;
    }

    .api-docs-sidebar-search {
        display: none;
    }

    .api-docs-section,
    .api-docs-end {
        padding:
            62px
            20px;
    }

    .api-docs-intro {
        padding-top: 64px;
    }

    .api-docs-intro h1 {
        font-size:
            clamp(
                3rem,
                15vw,
                4.5rem
            );
    }

    .api-docs-base-grid {
        grid-template-columns: 1fr;
    }

    .api-docs-table {
        overflow-x: auto;
    }

    .api-docs-table > div {
        min-width: 680px;
    }

    .api-key-list > div {
        grid-template-columns: 1fr;

        gap: 10px;
    }

    .api-docs-callout-list {
        grid-template-columns: 1fr;
    }

    .api-endpoint-list {
        overflow: visible;

        border: 0;
        border-radius: 0;
    }

    .api-endpoint-list > div {
        grid-template-columns:
            auto
            minmax(0, 1fr);

        gap:
            9px
            12px;

        padding:
            14px
            0;

        border-right: 0;
        border-left: 0;

        background: transparent;
    }

    .api-endpoint-list > div:first-child {
        border-top: 1px solid var(--api-border);
    }

    .api-endpoint-list code {
        font-size: 0.67rem;

        white-space: normal;
        overflow-wrap: anywhere;
    }

    .api-endpoint-list p {
        grid-column:
            2
            / -1;

        margin-top: -2px;
    }

    .api-security-grid,
    .api-roadmap-columns {
        grid-template-columns: 1fr;
    }

    .api-docs-notice {
        grid-template-columns: 1fr;
    }

    .api-docs-notice-icon {
        width: 28px;
        height: 28px;
    }

    .api-docs-end > div {
        display: grid;
        grid-template-columns: 1fr;
    }

    .api-docs-end-primary,
    .api-docs-end-secondary {
        width: 100%;
    }

    .api-resource-section::before {
        left: 20px;
    }
}

/* ============================================================
   30. SMALL MOBILE
   ============================================================ */

@media (max-width: 480px) {

    .api-docs-bar nav a {
        font-size: 0.68rem;
    }

    .api-docs-section-heading h2 {
        font-size:
            clamp(
                2rem,
                10vw,
                2.8rem
            );
    }

    .api-code-block pre {
        padding: 15px;
    }

    .api-code-block pre code {
        font-size: 0.66rem;
    }

    .api-pill-list code {
        font-size: 0.61rem;
    }

    .api-method {
        min-width: 44px;

        font-size: 0.54rem;
    }

    .api-docs-next-link {
        padding:
            16px;
    }
}

/* ============================================================
   31. REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    .api-docs-page *,
    .api-docs-page *::before,
    .api-docs-page *::after {
        scroll-behavior: auto !important;
    }

    .api-docs-next-link i,
    .api-docs-toc-next span {
        transition: none;
    }
}

.api-docs-site-header .nr-header-login,
.api-docs-site-header .nr-header-login:hover {
    color: #000000 !important;
}

@media (max-width: 899px) {
    .api-docs-page .nr-mobile-nav-login {
        color: var(--api-blue) !important;
    }
}