/* Hide announcement bar - not ready for production */
.bd-header-announcement,
.announcement,
#announcement,
.bd-header-announcement__content,
[class*="announcement"] {
    display: none !important;
}

/* Remove the empty top navbar and its reserved space */
:root {
    --pst-header-height: 0px;
    --pst-header-article-height: 3rem;
}

.bd-header {
    display: none !important;
}

/* Hide headerlink/permalink anchors - they show dots/symbols incorrectly */
a.headerlink {
    display: none !important;
    visibility: hidden !important;
}

/* Hide the text title when logo is present to prevent flash */
.navbar-brand__text,
.sidebar-brand-text,
.bd-sidebar-primary .site-navigation .navbar-brand p,
.bd-sidenav__home-link {
    display: none !important;
}

/* Ensure headers display properly on their own line */
h1, h2, h3, h4, h5, h6 {
    display: block !important;
}

/* =============================================================================
   ENDPOINTS LIST SCROLLABLE CONTAINERS
   ============================================================================= */

/* Main content - Endpoints section list (resource pages) */
section#endpoints > ul.simple {
    max-height: 500px;
    overflow-y: auto;
    overscroll-behavior: contain;  /* Prevent scroll chaining */
    padding-right: 0.5rem;
    margin-top: 3rem;
    margin-bottom: 8rem;
    /* Scrollbar styling */
    scrollbar-width: thin;
    scrollbar-color: var(--pst-color-border) transparent;
}

section#endpoints > ul.simple::-webkit-scrollbar {
    width: 6px;
}

section#endpoints > ul.simple::-webkit-scrollbar-track {
    background: transparent;
}

section#endpoints > ul.simple::-webkit-scrollbar-thumb {
    background-color: var(--pst-color-border);
    border-radius: 3px;
}

/* Add spacing between endpoints list and first endpoint anchor */
section#endpoints {
    margin-bottom: 3rem;
}

/* Spacing between each endpoint in the list */
section#endpoints > ul.simple > li:not(:first-child) {
    margin-top: 1.25rem;
}

/* Sidebar TOC - Endpoints nested list (fully expanded, no height limit) */
.bd-toc-nav li.toc-h2 > ul,
.page-toc li.toc-h2 > ul {
    max-height: none;  /* Fully expanded - show all endpoints */
    overflow-y: visible;
    padding-right: 0.25rem;
}

.bd-toc-nav li.toc-h2 > ul::-webkit-scrollbar,
.page-toc li.toc-h2 > ul::-webkit-scrollbar {
    width: 4px;
}

.bd-toc-nav li.toc-h2 > ul::-webkit-scrollbar-track,
.page-toc li.toc-h2 > ul::-webkit-scrollbar-track {
    background: transparent;
}

.bd-toc-nav li.toc-h2 > ul::-webkit-scrollbar-thumb,
.page-toc li.toc-h2 > ul::-webkit-scrollbar-thumb {
    background-color: var(--pst-color-border);
    border-radius: 2px;
}

.sd-col-7 {
    width: 50% !important;
    padding-right: 2rem;
    height: fit-content;
    min-height: auto;
}

.sd-col-5 {
    width: 50% !important;
}

/* Add spacing between endpoint description and parameters/examples grid */
.grid-container {
    margin-top: 3rem;
    margin-bottom: 3rem;
}

/* Add spacing beneath each endpoint section */
section > section {
    margin-bottom: 3rem;
}

/* NOTE: .example-card styles moved to critical CSS in layout.html to prevent flash.
   Additional non-critical styles are at the end of this file under LAYOUT RESTORATION */

:root {
    --tb-page-max-width: 1500px;
    /* Or whatever you prefer */
}

/* 1) Ensure the container has no background or border */
.admonition.newendpoint {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    margin: 1em 0;
}

/* 2) Ensure the title has no background, is in orange (if you want), bold, etc. */
.admonition.newendpoint>.admonition-title {
    background: transparent !important;
    color: orange !important;
    /* pick any color */
    font-weight: bold;
    margin: 0 !important;
    padding: 0 !important;
}

/* 3) Hide everything EXCEPT the title (i.e., the body) */
/* 3) Hide everything EXCEPT the title (i.e., the body) */
.admonition.newendpoint> :not(.admonition-title) {
    display: none !important;
}



/* 4) Hide any default admonition icon that might appear before the title */
.admonition.newendpoint .admonition-title::before {
    content: "" !important;
    margin: 0 !important;
}

.highlight pre {
    overflow-x: auto;
}

.div.sd-container-fluid.sd-sphinx-override.sd-mb-4.sd-p-0.grid-container.docutils>div>div.sd-col.sd-d-flex-row.sd-col-7.sd-col-xs-7.sd-col-sm-7.sd-col-md-7.sd-col-lg-7.docutils>div>div>details>div>details {
    max-height: 200px;
    /* Set a maximum height */
    overflow-y: auto;
    /* Enable vertical scrolling */
    padding: 0.25rem 0;
    font-size: 0.95rem;
    line-height: 1.2;
    margin: 0;
}

.parameters-child-content {
    margin-left: 1rem;
    padding-left: 1rem;
    border-left: 2px solid var(--pst-color-border);
    transition: all 0.3s ease;
    max-height: 300px;
    overflow-y: auto;
    overscroll-behavior: contain;  /* Prevent scroll chaining */

    /* Firefox scrollbar styles */
    scrollbar-width: thin;
    scrollbar-color: #888 #f1f1f1;
}

/* Webkit (Chrome, Safari) scrollbar styles */
.parameters-child-content::-webkit-scrollbar {
    width: 8px;
}

.parameters-child-content::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.parameters-child-content::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

.parameters-child-content::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* COLLAPSED state - hide everything */
.parameters-child-content.collapsed {
    display: none !important;  /* Force hide with !important to override inline styles */
    height: 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.parameters-child-content.collapsed .child-property-item {
    display: none !important;
}

/* EXPANDED state - show everything */
.parameters-child-content:not(.collapsed) {
    display: block !important;  /* Force show with !important to override inline styles */
    height: auto;
}

.parameters-child-content:not(.collapsed) .child-property-item {
    display: block !important;
}

.child-property-item {
    max-width: 600px;
    /* Limit the width of child items */
    margin-bottom: 1rem;
}

.example-boxes {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    position: relative;
}

.right-column-container {
    position: relative;
}

/* Card and Container styles */
.sd-card-body {
    padding: 1.5rem;
}

.sd-card-title {
    padding: 0rem 0rem;
    margin: 0;
}

.sd-card-body> :first-child {
    margin-top: 0;
    padding-top: 0rem;
}

.example-separator {
    margin: 0rem 0;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}


/* Card container styles */
.sd-card.parameters-card {
    height: fit-content;
    min-height: auto;
}

/* Card body styles */
.sd-card.parameters-card .sd-card-body {
    height: auto;
    min-height: auto;
    padding: 1.5rem;
}

.example-card,
.parameters-card {
    padding-top: 0;
    margin-top: 0;
}

/* Article Container styles */
@media (min-width: 1200px) {
    .bd-main .bd-content .bd-article-container {
        max-width: 100%;
        margin-right: 0;
    }
}

.bd-article-container {
    padding-right: 2rem;
}

/* Dropdown and Toggle styles */
.dropdown .rubric {
    cursor: pointer;
    background-color: #f5f5f5;
    padding: 10px;
    border: 1px solid #ddd;
    margin-top: 10px;
}

.dropdown .rubric+* {
    display: none;
}

.dropdown.expanded .rubric+* {
    display: block;
}

/* Admonition styles */
.admonition {
    margin-top: 0 !important;
}

.admonition>.admonition-title {
    margin-top: 0 !important;
}

.parameter-item,
.name-and-requirement,
.parameter-description {
    height: auto;
}

/* Vertical layout for parameter name, type, and requirement */
div.name-and-requirement.docutils.container {
    display: flex;
    flex-direction: column;
    /* Stack name and type-requirement vertically */
    align-items: flex-start;
    /* Align left */
    gap: 0.25rem;
    /* Small gap between rows */
    margin-bottom: 0.5rem;
}

/* Parameter name on its own line */
.parameter-name {
    font-weight: bold;
    word-break: break-word;
}

/* Type and requirement together on second line */
.parameter-type-requirement {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Increase tooltip size */
.tippy-box {
    max-width: 800px !important;
    /* Make tooltip wider */
    min-width: 400px;
    /* Set minimum width */
    height: auto;
    /* Let height adjust to content */
    z-index: 99999 !important;
    position: relative;
}

.tippy-content {
    z-index: 99999 !important;
}

/* Ensure the sidebar doesn't create a new stacking context that would interfere */
.bd-sidebar {
    z-index: 1;
}

/* ===== LIGHT MODE Tooltip Styles ===== */
/* Remove blue background from endpoint titles - LIGHT MODE ONLY */
html:not([data-theme="dark"]) .tippy-box[data-theme~='material'] {
    background-color: white;
    color: #333;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

/* Force tooltip content to have readable dark text on white background - LIGHT MODE ONLY */
html:not([data-theme="dark"]) .tippy-box,
html:not([data-theme="dark"]) .tippy-box * {
    color: #333 !important;
}

html:not([data-theme="dark"]) .tippy-box {
    background-color: white !important;
}

html:not([data-theme="dark"]) .tippy-content {
    background-color: white !important;
    color: #333 !important;
}

/* Ensure all text inside tooltips is dark - LIGHT MODE ONLY */
html:not([data-theme="dark"]) .tippy-box h1,
html:not([data-theme="dark"]) .tippy-box h2,
html:not([data-theme="dark"]) .tippy-box h3,
html:not([data-theme="dark"]) .tippy-box h4,
html:not([data-theme="dark"]) .tippy-box p,
html:not([data-theme="dark"]) .tippy-box span,
html:not([data-theme="dark"]) .tippy-box a,
html:not([data-theme="dark"]) .tippy-box li {
    color: #333 !important;
}

/* Links inside tooltips should be blue - LIGHT MODE ONLY */
html:not([data-theme="dark"]) .tippy-box a {
    color: #0066cc !important;
}

/* Adjust endpoint title styling - LIGHT MODE ONLY */
html:not([data-theme="dark"]) .tippy-box .sd-card-header {
    background: white !important;
    padding: 1.5rem;
    border-bottom: 1px solid #eee;
    color: #333 !important;
}

/* Make description area fit content - LIGHT MODE ONLY */
html:not([data-theme="dark"]) .tippy-box .sd-card-body {
    background: white !important;
    padding: 2rem;
    height: auto;
    overflow-y: visible;
    color: #333 !important;
}

/* ===== DARK MODE Tooltip Styles ===== */
[data-theme="dark"] .tippy-box,
html[data-theme="dark"] .tippy-box {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
}

[data-theme="dark"] .tippy-box *,
html[data-theme="dark"] .tippy-box * {
    color: #e0e0e0 !important;
}

[data-theme="dark"] .tippy-content,
html[data-theme="dark"] .tippy-content {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
}

[data-theme="dark"] .tippy-box h1,
[data-theme="dark"] .tippy-box h2,
[data-theme="dark"] .tippy-box h3,
[data-theme="dark"] .tippy-box h4,
html[data-theme="dark"] .tippy-box h1,
html[data-theme="dark"] .tippy-box h2,
html[data-theme="dark"] .tippy-box h3,
html[data-theme="dark"] .tippy-box h4 {
    color: #ffffff !important;
}

[data-theme="dark"] .tippy-box p,
[data-theme="dark"] .tippy-box span,
[data-theme="dark"] .tippy-box li,
html[data-theme="dark"] .tippy-box p,
html[data-theme="dark"] .tippy-box span,
html[data-theme="dark"] .tippy-box li {
    color: #e0e0e0 !important;
}

[data-theme="dark"] .tippy-box a,
html[data-theme="dark"] .tippy-box a {
    color: #6db3f2 !important;
}

[data-theme="dark"] .tippy-box .sd-card-header,
html[data-theme="dark"] .tippy-box .sd-card-header {
    background: #2d2d2d !important;
    border-bottom: 1px solid #444 !important;
    color: #ffffff !important;
}

[data-theme="dark"] .tippy-box .sd-card-body,
html[data-theme="dark"] .tippy-box .sd-card-body {
    background: #1e1e1e !important;
    color: #e0e0e0 !important;
}

/* Smooth scrolling DISABLED - causes jump/jitter issues in Firefox/Edge
   when navigating to anchors with fixed headers. Use instant jumps instead. */
html {
    scroll-behavior: auto;
}

/* =============================================================================
   SCROLL OFFSET FOR FIXED HEADER
   Prevents anchors from landing under the sticky header
   ============================================================================= */
h1[id], h2[id], h3[id], h4[id], h5[id], h6[id],
section[id], div[id].section {
    scroll-margin-top: 5rem;
}

/* Mobile-specific adjustments */
@media (max-width: 768px) {

    /* Stack grid columns vertically */
    .sd-col-7,
    .sd-col-5 {
        width: 100% !important;
        padding-right: 0;
    }

    /* Remove internal scrolling on example cards */
    .example-card {
        position: static;
        max-height: none;
        overflow-y: visible;
    }

    .parameters-card {
        width: 100%;
    }

    /* Prevent long lines from overflowing */
    pre,
    code,
    .highlight pre {
        white-space: pre-wrap;
        word-break: break-word;
    }

    /* Slightly tighter text */
    body {
        font-size: 0.9rem;
        line-height: 1.35;
    }

    /* Issue 1: Endpoint header spacing - add margin below section titles */
    section > h2:first-child,
    .bd-article-container h2 {
        margin-bottom: 1rem;
    }

    /* Issue 2: Reduce gap between Example Request and Response sections */
    hr.example-separator + h3,
    .example-card h3 {
        margin-top: 0.5rem;
    }

    /* Issue 3: Increase response badge size to match h3 text */
    .http-method.good-response.medium,
    .http-method.bad-response.medium {
        font-size: 1.3rem !important;
        padding: 3px 10px !important;
    }
}

/* ===== STANDARDIZE CODE BLOCK HEIGHTS ===== 
   Prevent layout shifts when switching between tabs
   ============================================== */

/* Set consistent height for all code blocks in tabs to match other languages */
.sphinx-tabs-panel .highlight pre {
    height: auto;
    /* Auto height for short examples */
    overflow-y: auto;
    /* Add scrollbar for content that exceeds height */
    overflow-x: auto;
    /* Keep horizontal scroll */
    resize: vertical;
    /* Allow users to resize if needed */
    min-height: 50px;
    /* Small minimum height */
    max-height: 600px;
    /* Maximum height */
}

/* Style the scrollbar for better visibility */
.sphinx-tabs-panel .highlight pre::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.sphinx-tabs-panel .highlight pre::-webkit-scrollbar-track {
    background: var(--pst-color-background-secondary, #f1f1f1);
    border-radius: 5px;
}

.sphinx-tabs-panel .highlight pre::-webkit-scrollbar-thumb {
    background: var(--pst-color-border, #888);
    border-radius: 5px;
}

.sphinx-tabs-panel .highlight pre::-webkit-scrollbar-thumb:hover {
    background: var(--pst-color-text-muted, #555);
}

/* Firefox scrollbar styling */
.sphinx-tabs-panel .highlight pre {
    scrollbar-width: thin;
    scrollbar-color: var(--pst-color-border, #888) var(--pst-color-background-secondary, #f1f1f1);
}

/* Visual indicator for scrollable content */
.sphinx-tabs-panel .highlight {
    position: relative;
    background: var(--pst-color-background);
    border-radius: 0.25rem;
}

/* Add subtle shadow at bottom when content is scrollable */
.sphinx-tabs-panel .highlight pre:not(:hover) {
    /* Gradient to indicate more content below */
    mask-image: linear-gradient(to bottom,
            black 0%,
            black calc(100% - 20px),
            transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom,
            black 0%,
            black calc(100% - 20px),
            transparent 100%);
}

/* Remove gradient on hover for better readability */
.sphinx-tabs-panel .highlight pre:hover {
    mask-image: none;
    -webkit-mask-image: none;
}

/* Ensure tab panels maintain consistent space */
.sphinx-tabs-panel {
    background: var(--pst-color-surface);
    /* Match theme background or use transparent */
    border-radius: 0.25rem;
    /* Match highlight border radius */
}

/* Prevent flash/resize when switching tabs */
.sphinx-tabs {
    position: relative;
}

/* Hide inactive panels immediately without animation */
.sphinx-tabs-panel[hidden] {
    display: none !important;
}

/* ===== ENSURE TABS DISPLAY HORIZONTALLY =====
   Fix for tabs displaying vertically instead of side-by-side
   ============================================== */

/* Tab button container - ensure horizontal layout */
.sphinx-tabs-tab-list,
.sphinx-tabs>.ui-tabs-nav,
.sphinx-tabs [role="tablist"] {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 0 !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 0.5rem 0 !important;
    border-bottom: 1px solid var(--pst-color-border, #ddd) !important;
}

/* Individual tab buttons - inline display */
.sphinx-tabs-tab,
.sphinx-tabs>.ui-tabs-nav>li,
.sphinx-tabs [role="tab"] {
    display: inline-block !important;
    margin: 0 !important;
    padding: 0.5rem 1rem !important;
    cursor: pointer !important;
    border: 1px solid transparent !important;
    border-bottom: none !important;
    background: transparent !important;
    position: relative !important;
    bottom: -1px !important;
}

/* Active tab styling */
.sphinx-tabs-tab[aria-selected="true"],
.sphinx-tabs [role="tab"][aria-selected="true"] {
    border-color: var(--pst-color-border, #ddd) !important;
    border-bottom: 1px solid var(--pst-color-background, #fff) !important;
    background: var(--pst-color-background, #fff) !important;
}

/* Tab panels - HTML uses hidden attribute, not aria-hidden */
/* Let the native hidden attribute work - don't override with display:none */
.sphinx-tabs-panel:not([hidden]) {
    display: block;
}

/* Nested tabs inside category tabs */
.sphinx-tabs-panel .sphinx-tabs {
    margin-top: 0.5rem;
}

/* Special handling for bash/curl examples */
/* Remove the flex layout that was causing line spreading */
.sphinx-tabs-panel[name="QmFzaA=="] .highlight pre,
.sphinx-tabs-panel[id*="QmFzaA"] .highlight pre {
    /* Remove flex properties that were spreading lines */
    display: block !important;
    /* Keep content at the top without stretching */
    padding-bottom: 20px;
}

/* ===== NEW ENDPOINT INDICATORS ===== 
   Visual indicators for newly added endpoints
   ============================================== */

/* Style for NEW/UPDATED badge from :new-endpoint: role */
.new-endpoint {
    display: inline-block !important;
    background-color: #dc3545;
    color: white !important;
    font-size: 0.7rem;
    font-weight: bold;
    padding: 0.15rem 0.4rem;
    margin-left: 0.5rem;
    border-radius: 3px;
    vertical-align: middle;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Dark mode adjustment */
[data-theme="dark"] .new-endpoint,
html[data-theme="dark"] .new-endpoint {
    background-color: #ff6b6b;
    color: white !important;
}

/* Style for NEW badge in parameter descriptions */
.new-endpoint-badge {
    display: inline-block;
    background-color: #dc3545;
    color: white;
    font-size: 0.65rem;
    font-weight: bold;
    padding: 0.1rem 0.35rem;
    margin-right: 0.4rem;
    border-radius: 3px;
    vertical-align: middle;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Style for NEW indicator - mobile-first approach */
.new-endpoint-indicator {
    display: inline-block !important;
    /* Force display on all devices */
    background-color: #dc3545;
    /* Bootstrap danger red */
    color: white;
    font-size: 0.7rem;
    font-weight: bold;
    padding: 0.1rem 0.4rem;
    margin-left: 0.5rem;
    border-radius: 3px;
    vertical-align: middle;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    position: relative;
    /* Ensure proper positioning */
    z-index: 1;
    /* Ensure it appears above other elements */
}

/* Style for enum/code references - readable code-like styling */
.enum-ref {
    display: inline;
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
    font-size: 0.9em;
    background-color: rgba(175, 184, 193, 0.2);
    padding: 0.15rem 0.4rem;
    border-radius: 4px;
    color: #0969da;
    font-weight: 500;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.theme-dark .enum-ref {
    background-color: rgba(110, 118, 129, 0.4);
    color: #79c0ff;
}

/* Alternative styles for different themes */
.theme-light .new-endpoint-indicator {
    background-color: #dc3545;
    color: white;
}

.theme-dark .new-endpoint-indicator {
    background-color: #ff6b6b;
    color: white;
}

/* Animate the NEW badge on hover - desktop only */
@media (hover: hover) and (pointer: fine) {
    .new-endpoint-indicator:hover {
        transform: scale(1.1);
        transition: transform 0.2s ease;
    }
}

/* Fallback approach for :has() selector - add class directly to parent li */
/* This approach works on all browsers including mobile */
.new-endpoint-item {
    position: relative;
    font-weight: 500;
    padding-left: 20px;
    /* Make room for the red border */
}

/* Red border indicator - using class-based approach */
.new-endpoint-item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 1.2em;
    width: 3px;
    background-color: #dc3545;
    border-radius: 2px;
}

/* Modern browsers with :has() support get enhanced styling */
@supports selector(:has(*)) {
    .section li:has(.new-endpoint-indicator) {
        position: relative;
        font-weight: 500;
        padding-left: 20px;
    }

    .section li:has(.new-endpoint-indicator)::before {
        content: "";
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        height: 1.2em;
        width: 3px;
        background-color: #dc3545;
        border-radius: 2px;
    }
}

/* Prevent line breaks between endpoint and NEW badge */
.section li>a.reference.internal+.new-endpoint-indicator {
    white-space: nowrap;
}

/* Mobile-specific adjustments */
@media (max-width: 768px) {
    .new-endpoint-indicator {
        font-size: 0.5rem !important;
        /* Much smaller on mobile */
        padding: 0.05rem 0.2rem !important;
        /* Minimal padding */
        margin-left: 0.25rem !important;
        /* Less margin */
        vertical-align: baseline;
        /* Align with text baseline */
        line-height: 1;
        /* Tight line height */
        display: inline !important;
        /* Force inline display */
        white-space: nowrap;
        /* Prevent wrapping within badge */
    }

    /* Keep endpoint and badge on one line */
    .new-endpoint-item,
    .section li:has(.new-endpoint-indicator) {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        width: 100%;
    }

    .new-endpoint-item>.new-endpoint-indicator,
    .section li:has(.new-endpoint-indicator)>.new-endpoint-indicator {
        margin-left: auto;
        flex-shrink: 0;
    }

    /* Remove the red border on mobile to save space */
    .new-endpoint-item::before,
    .section li:has(.new-endpoint-indicator)::before {
        display: none !important;
        /* Hide the red border on mobile */
    }

    /* Ensure proper spacing on mobile */
    .new-endpoint-item,
    .section li:has(.new-endpoint-indicator) {
        padding-left: 0;
        /* No extra padding needed */
        margin-bottom: 0.5rem;
        /* Keep vertical spacing */
    }
}

/* Even smaller for very small mobile screens */
@media (max-width: 480px) {
    .new-endpoint-indicator {
        font-size: 0.4rem !important;
        /* Tiny font */
        padding: 0.02rem 0.15rem !important;
        /* Minimal padding */
        margin-left: 0.2rem !important;
        /* Optionally, show just "N" on very small screens */
        /* content: "N"; */
    }

    /* Hide the word "NEW" and show just a dot or "N" */
    .new-endpoint-indicator {
        width: auto;
        min-width: 0;
    }

    /* Alternative: Just show a red dot */
    /*
    .new-endpoint-indicator {
        width: 6px;
        height: 6px;
        padding: 0 !important;
        border-radius: 50%;
        text-indent: -9999px;
        overflow: hidden;
    }
    */

    /* Issue 1: Endpoint header spacing - slightly less on phone */
    section > h2:first-child,
    .bd-article-container h2 {
        margin-bottom: 0.75rem;
    }

    /* Issue 2: Reduce gap between Example Request and Response sections */
    hr.example-separator + h3,
    .example-card h3 {
        margin-top: 0.25rem;
    }

    /* Issue 3: Increase response badge size (slightly less than tablet) */
    .http-method.good-response.medium,
    .http-method.bad-response.medium {
        font-size: 1.2rem !important;
        padding: 2px 8px !important;
    }
}

/* Ensure visibility in various contexts */
.toctree-wrapper .new-endpoint-indicator,
.contents .new-endpoint-indicator,
.sidebar .new-endpoint-indicator {
    display: inline-block !important;
    visibility: visible !important;
}


/* High contrast mode support */
@media (prefers-contrast: high) {
    .new-endpoint-indicator {
        border: 1px solid currentColor;
        font-weight: 900;
    }
}

/* Force column proportions to actually be used */
table.api-endpoints {
    width: 100%;
    table-layout: fixed;
}

/* Enforce the 15/40/30/15 split */
table.api-endpoints th:nth-child(1),
table.api-endpoints td:nth-child(1) {
    width: 15%;
}

table.api-endpoints th:nth-child(2),
table.api-endpoints td:nth-child(2) {
    width: 40%;
}

table.api-endpoints th:nth-child(3),
table.api-endpoints td:nth-child(3) {
    width: 30%;
}

table.api-endpoints th:nth-child(4),
table.api-endpoints td:nth-child(4) {
    width: 15%;
}

/* Prevent long paths / inline-code from blowing up the layout */
table.api-endpoints th,
table.api-endpoints td {
    overflow-wrap: anywhere;
}

table.api-endpoints code {
    white-space: normal;
    word-break: break-word;
}

/* ===== RIGHT SIDEBAR (TABLE OF CONTENTS) ADJUSTMENTS =====
   Reduce width to give more space to main content
   ============================================== */

/* Ensure left sidebar (primary navigation) stays stable */
.bd-sidebar-primary {
    width: 280px !important;
    min-width: 280px !important;
    flex: 0 0 280px !important;
}

/* Prevent sidebar jiggle/jump on page navigation */
.bd-sidebar-primary .bd-sidebar-nav,
.bd-sidebar-primary nav,
.bd-sidebar-primary .sidebar-primary-items__start,
.bd-sidebar-primary .sidebar-primary-items__end {
    scroll-behavior: auto !important;  /* Disable smooth scrolling in sidebar */
    overscroll-behavior: contain;
}

/* Disable scroll-into-view animation effect */
.bd-sidebar-primary .current,
.bd-sidebar-primary .active,
.bd-sidebar-primary .nav-link.active {
    scroll-margin-top: 0;
    scroll-margin-bottom: 0;
}

/* Make right sidebar (TOC) match requested dims: 128px width x 492px height */
/* Make right sidebar (TOC) match requested dims: 128px width x 492px height */
.bd-sidebar-secondary {
    width: 350px !important;
    min-width: 350px !important;
    max-width: 350px !important;
    max-height: 492px !important;
    /* Constrain height */
    overflow-y: auto !important;
    /* Ensure it scrolls if content exceeds height */
    overflow-x: hidden !important;
    /* Hide horizontal scrollbar */
    flex: 0 0 350px !important;
    margin-left: 1.5rem !important;
    /* Add spacing from main content */
}

/* Force one line for TOC links */
.bd-sidebar-secondary .bd-toc li a {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
}

/* Ensure the main content flexes to fill remaining space */
.bd-main .bd-content {
    flex: 1;
    min-width: 0;
}

/* TOC text styling */
.bd-sidebar-secondary .bd-toc {
    font-size: 0.85rem;
}

.bd-sidebar-secondary .bd-toc a {
    padding: 0.2rem 0;
}

/* TOC indentation */
.bd-sidebar-secondary .bd-toc ul {
    padding-left: 0.75rem;
}

/* Spacing between TOC items in right sidebar */
.toc-entry a.nav-link {
    margin-bottom: 1.15rem;
}

/* ============================================
   COLLAPSIBLE RIGHT SIDEBAR (Endpoints TOC)
   ============================================ */

/* Always show the secondary toggle button (even on desktop) */
button.sidebar-toggle.secondary-toggle {
    display: inline-block !important;
}

/* When sidebar is collapsed - support both body class (JS) and html class (early load) */
body.secondary-sidebar-collapsed .bd-sidebar-secondary,
html.secondary-sidebar-collapsed-early .bd-sidebar-secondary {
    display: none !important;
}

/* Expand main content when sidebar is collapsed */
body.secondary-sidebar-collapsed .bd-main .bd-content,
html.secondary-sidebar-collapsed-early .bd-main .bd-content {
    max-width: 100% !important;
    flex: 1 1 100% !important;
}

/* Visual feedback for toggle button when collapsed */
body.secondary-sidebar-collapsed button.secondary-toggle,
html.secondary-sidebar-collapsed-early button.secondary-toggle {
    opacity: 0.6;
}

body.secondary-sidebar-collapsed button.secondary-toggle:hover,
html.secondary-sidebar-collapsed-early button.secondary-toggle:hover {
    opacity: 1;
}

/* No transitions on content/sidebar - prevents jiggle on page navigation */


/* =============================================================================
   HTTP METHOD BADGES - PRIMARY SIDEBAR (Left Navigation)
   Text-only styling, no badge look - keeps navigation clean
   Note: Roles output class="http-method get small" (separate classes)
   ============================================================================= */

.bd-sidebar-primary .http-method,
.bd-sidebar-primary .httpmethod-small-get,
.bd-sidebar-primary .httpmethod-small-post,
.bd-sidebar-primary .httpmethod-small-put,
.bd-sidebar-primary .httpmethod-small-delete,
.bd-sidebar-primary .httpmethod-medium-get,
.bd-sidebar-primary .httpmethod-medium-post,
.bd-sidebar-primary .httpmethod-medium-put,
.bd-sidebar-primary .httpmethod-medium-delete,
.bd-sidebar-primary a span[class*="httpmethod-"],
.bd-sidebar-primary a span[class*="http-method"] {
    display: inline-block;
    font-size: 11px !important;
    padding: 1px 4px !important;
    line-height: 1.2 !important;
    border-radius: 3px !important;
    vertical-align: middle !important;
    font-weight: bold;
    margin-right: 4px;
    background: transparent !important;
}

/* Primary sidebar - colored text only (no background) */
.bd-sidebar-primary .http-method.get,
.bd-sidebar-primary .httpmethod-small-get,
.bd-sidebar-primary .httpmethod-medium-get {
    color: #49CC90 !important;
}

.bd-sidebar-primary .http-method.post,
.bd-sidebar-primary .httpmethod-small-post,
.bd-sidebar-primary .httpmethod-medium-post {
    color: #61AFFE !important;
}

.bd-sidebar-primary .http-method.put,
.bd-sidebar-primary .httpmethod-small-put,
.bd-sidebar-primary .httpmethod-medium-put {
    color: #FCA130 !important;
}

.bd-sidebar-primary .http-method.delete,
.bd-sidebar-primary .httpmethod-small-delete,
.bd-sidebar-primary .httpmethod-medium-delete {
    color: #F93E3E !important;
}

.bd-sidebar-primary .http-method.patch {
    color: #50e3c2 !important;
}

/* =============================================================================
   HTTP METHOD BADGES - SECONDARY SIDEBAR (Right TOC)
   Independent toggle via: httpmethod_sidebar_badge_style in conf.py
   Options: "standard", "compact", or "text"
   Uses data-httpmethod-sidebar-style attribute (separate from main content)
   Note: Roles output class="http-method get small" (separate classes)
   ============================================================================= */

/* Secondary sidebar - COMPACT style */
html[data-httpmethod-sidebar-style="compact"] .bd-sidebar-secondary .http-method.small,
html[data-httpmethod-sidebar-style="compact"] .bd-sidebar-secondary .httpmethod-small-get,
html[data-httpmethod-sidebar-style="compact"] .bd-sidebar-secondary .httpmethod-small-post,
html[data-httpmethod-sidebar-style="compact"] .bd-sidebar-secondary .httpmethod-small-put,
html[data-httpmethod-sidebar-style="compact"] .bd-sidebar-secondary .httpmethod-small-delete,
html[data-httpmethod-sidebar-style="compact"] .bd-toc .http-method.small,
html[data-httpmethod-sidebar-style="compact"] .bd-toc .httpmethod-small-get,
html[data-httpmethod-sidebar-style="compact"] .bd-toc .httpmethod-small-post,
html[data-httpmethod-sidebar-style="compact"] .bd-toc .httpmethod-small-put,
html[data-httpmethod-sidebar-style="compact"] .bd-toc .httpmethod-small-delete {
    display: inline-block !important;
    padding: 2px 5px !important;
    border-radius: 4px !important;
    font-size: 0.75em !important;
    font-weight: bold !important;
    color: black !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    margin-right: 5px !important;
    vertical-align: middle !important;
}

/* Secondary sidebar - STANDARD style (default) */
html[data-httpmethod-sidebar-style="standard"] .bd-sidebar-secondary .http-method.small,
html[data-httpmethod-sidebar-style="standard"] .bd-sidebar-secondary .httpmethod-small-get,
html[data-httpmethod-sidebar-style="standard"] .bd-sidebar-secondary .httpmethod-small-post,
html[data-httpmethod-sidebar-style="standard"] .bd-sidebar-secondary .httpmethod-small-put,
html[data-httpmethod-sidebar-style="standard"] .bd-sidebar-secondary .httpmethod-small-delete,
html[data-httpmethod-sidebar-style="standard"] .bd-toc .http-method.small,
html[data-httpmethod-sidebar-style="standard"] .bd-toc .httpmethod-small-get,
html[data-httpmethod-sidebar-style="standard"] .bd-toc .httpmethod-small-post,
html[data-httpmethod-sidebar-style="standard"] .bd-toc .httpmethod-small-put,
html[data-httpmethod-sidebar-style="standard"] .bd-toc .httpmethod-small-delete,
html:not([data-httpmethod-sidebar-style]) .bd-sidebar-secondary .http-method.small,
html:not([data-httpmethod-sidebar-style]) .bd-sidebar-secondary .httpmethod-small-get,
html:not([data-httpmethod-sidebar-style]) .bd-sidebar-secondary .httpmethod-small-post,
html:not([data-httpmethod-sidebar-style]) .bd-sidebar-secondary .httpmethod-small-put,
html:not([data-httpmethod-sidebar-style]) .bd-sidebar-secondary .httpmethod-small-delete,
html:not([data-httpmethod-sidebar-style]) .bd-toc .http-method.small,
html:not([data-httpmethod-sidebar-style]) .bd-toc .httpmethod-small-get,
html:not([data-httpmethod-sidebar-style]) .bd-toc .httpmethod-small-post,
html:not([data-httpmethod-sidebar-style]) .bd-toc .httpmethod-small-put,
html:not([data-httpmethod-sidebar-style]) .bd-toc .httpmethod-small-delete {
    display: inline-block !important;
    padding: 3px 8px !important;
    border-radius: 4px !important;
    font-size: 0.8em !important;
    font-weight: bold !important;
    color: black !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    margin-right: 6px !important;
    vertical-align: middle !important;
}

/* Secondary sidebar - TEXT style (colored text only, no background) */
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .http-method,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-small-get,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-small-post,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-small-put,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-small-delete,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-medium-get,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-medium-post,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-medium-put,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-medium-delete,
html[data-httpmethod-sidebar-style="text"] .bd-toc .http-method,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-small-get,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-small-post,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-small-put,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-small-delete,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-medium-get,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-medium-post,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-medium-put,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-medium-delete {
    display: inline-block !important;
    padding: 1px 4px !important;
    border-radius: 3px !important;
    font-size: 0.7em !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    margin-right: 4px !important;
    vertical-align: middle !important;
    background: transparent !important;
}

/* TEXT style - colored text */
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .http-method.get,
html[data-httpmethod-sidebar-style="text"] .bd-toc .http-method.get,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-small-get,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-small-get,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-medium-get,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-medium-get {
    color: #49CC90 !important;
}

html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .http-method.post,
html[data-httpmethod-sidebar-style="text"] .bd-toc .http-method.post,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-small-post,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-small-post,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-medium-post,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-medium-post {
    color: #61AFFE !important;
}

html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .http-method.put,
html[data-httpmethod-sidebar-style="text"] .bd-toc .http-method.put,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-small-put,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-small-put,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-medium-put,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-medium-put {
    color: #FCA130 !important;
}

html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .http-method.delete,
html[data-httpmethod-sidebar-style="text"] .bd-toc .http-method.delete,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-small-delete,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-small-delete,
html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .httpmethod-medium-delete,
html[data-httpmethod-sidebar-style="text"] .bd-toc .httpmethod-medium-delete {
    color: #F93E3E !important;
}

html[data-httpmethod-sidebar-style="text"] .bd-sidebar-secondary .http-method.patch,
html[data-httpmethod-sidebar-style="text"] .bd-toc .http-method.patch {
    color: #50e3c2 !important;
}

/* Secondary sidebar - badge colors (for compact/standard styles) */
html:not([data-httpmethod-sidebar-style="text"]) .bd-sidebar-secondary .http-method.get,
html:not([data-httpmethod-sidebar-style="text"]) .bd-toc .http-method.get,
html:not([data-httpmethod-sidebar-style="text"]) .bd-sidebar-secondary .httpmethod-small-get,
html:not([data-httpmethod-sidebar-style="text"]) .bd-toc .httpmethod-small-get {
    background-color: #49CC90 !important;
}

html:not([data-httpmethod-sidebar-style="text"]) .bd-sidebar-secondary .http-method.post,
html:not([data-httpmethod-sidebar-style="text"]) .bd-toc .http-method.post,
html:not([data-httpmethod-sidebar-style="text"]) .bd-sidebar-secondary .httpmethod-small-post,
html:not([data-httpmethod-sidebar-style="text"]) .bd-toc .httpmethod-small-post {
    background-color: #61AFFE !important;
}

html:not([data-httpmethod-sidebar-style="text"]) .bd-sidebar-secondary .http-method.put,
html:not([data-httpmethod-sidebar-style="text"]) .bd-toc .http-method.put,
html:not([data-httpmethod-sidebar-style="text"]) .bd-sidebar-secondary .httpmethod-small-put,
html:not([data-httpmethod-sidebar-style="text"]) .bd-toc .httpmethod-small-put {
    background-color: #FCA130 !important;
}

html:not([data-httpmethod-sidebar-style="text"]) .bd-sidebar-secondary .http-method.delete,
html:not([data-httpmethod-sidebar-style="text"]) .bd-toc .http-method.delete,
html:not([data-httpmethod-sidebar-style="text"]) .bd-sidebar-secondary .httpmethod-small-delete,
html:not([data-httpmethod-sidebar-style="text"]) .bd-toc .httpmethod-small-delete {
    background-color: #F93E3E !important;
}

html:not([data-httpmethod-sidebar-style="text"]) .bd-sidebar-secondary .http-method.patch,
html:not([data-httpmethod-sidebar-style="text"]) .bd-toc .http-method.patch {
    background-color: #50e3c2 !important;
}

/* Medium badges in secondary sidebar - base styles */
.bd-sidebar-secondary .http-method.medium,
.bd-sidebar-secondary .httpmethod-medium-get,
.bd-sidebar-secondary .httpmethod-medium-post,
.bd-sidebar-secondary .httpmethod-medium-put,
.bd-sidebar-secondary .httpmethod-medium-delete,
.bd-toc .http-method.medium,
.bd-toc .httpmethod-medium-get,
.bd-toc .httpmethod-medium-post,
.bd-toc .httpmethod-medium-put,
.bd-toc .httpmethod-medium-delete {
    display: inline-block !important;
    padding: 3px 8px !important;
    border-radius: 4px !important;
    font-size: 0.85em !important;
    font-weight: bold !important;
    color: black !important;
    margin-right: 6px !important;
    vertical-align: middle !important;
}

/* Medium badges - background colors */
.bd-sidebar-secondary .httpmethod-medium-get,
.bd-toc .httpmethod-medium-get,
.bd-sidebar-secondary .http-method.medium.get,
.bd-toc .http-method.medium.get {
    background-color: #49CC90 !important;
}

.bd-sidebar-secondary .httpmethod-medium-post,
.bd-toc .httpmethod-medium-post,
.bd-sidebar-secondary .http-method.medium.post,
.bd-toc .http-method.medium.post {
    background-color: #61AFFE !important;
}

.bd-sidebar-secondary .httpmethod-medium-put,
.bd-toc .httpmethod-medium-put,
.bd-sidebar-secondary .http-method.medium.put,
.bd-toc .http-method.medium.put {
    background-color: #FCA130 !important;
}

.bd-sidebar-secondary .httpmethod-medium-delete,
.bd-toc .httpmethod-medium-delete,
.bd-sidebar-secondary .http-method.medium.delete,
.bd-toc .http-method.medium.delete {
    background-color: #F93E3E !important;
}

.bd-sidebar-secondary .http-method.medium.patch,
.bd-toc .http-method.medium.patch {
    background-color: #50e3c2 !important;
}

/* =============================================================================
   CODE VERIFICATION BADGES
   Status badges for API code examples with legend
   ============================================================================= */

/* Base badge styles */
.code-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    font-size: 12px;
    font-weight: bold;
    margin-left: 8px;
    cursor: help;
    vertical-align: middle;
    color: white;
    opacity: 1;
    transition: all 0.2s ease;
    position: relative;
}

.code-status-badge:hover {
    transform: scale(1.15);
}

/* Status-specific colors */
/* Green solid = Full API test passed (actually hit the API, got 200) */
.code-status-badge-pass {
    background-color: #28a745;
}

/* Red solid = Test failed */
.code-status-badge-fail {
    background-color: #dc3545;
}

/* Gray solid = Skipped (environment not available) */
.code-status-badge-skip {
    background-color: #6c757d;
}

/* Yellow solid = Unknown/not tested */
.code-status-badge-unknown {
    background-color: #ffc107;
    color: #212529;
}

/* Blue hollow = Syntax verified only (didn't hit API, just checked syntax) */
.code-status-badge-syntax {
    background-color: transparent;
    border: 2.5px solid #0d6efd;
    color: #0d6efd;
}

/* Placeholder badge - reserves space, invisible until hydrated */
.code-status-badge--placeholder {
    background-color: transparent;
    color: transparent;
}

/* =============================================================================
   CODE STATUS BANNER
   Consolidated pass/fail indicator at top of example cards
   ============================================================================= */

.code-status-banner {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 500;
    margin-bottom: 12px;
}

.code-status-banner--placeholder {
    display: none;
}

.code-status-banner--pass {
    background-color: rgba(40, 167, 69, 0.15);
    border: 1px solid #28a745;
    color: #28a745;
}

.code-status-banner--pass .banner-icon {
    font-size: 1.1rem;
    font-weight: bold;
}

.code-status-banner--fail {
    background-color: rgba(220, 53, 69, 0.15);
    border: 1px solid #dc3545;
    color: #dc3545;
}

.code-status-banner--unknown {
    background-color: rgba(108, 117, 125, 0.15);
    border: 1px solid #6c757d;
    color: #6c757d;
}

/* Dark mode adjustments */
[data-theme="dark"] .code-status-banner--pass {
    background-color: rgba(40, 167, 69, 0.2);
    color: #5dd879;
}

[data-theme="dark"] .code-status-banner--fail {
    background-color: rgba(220, 53, 69, 0.2);
    color: #f77;
}

[data-theme="dark"] .code-status-banner--unknown {
    background-color: rgba(108, 117, 125, 0.2);
    color: #adb5bd;
}

/* =============================================================================
   VERIFICATION LEGEND
   Tooltip-style legend explaining what each badge means
   ============================================================================= */

/* Legend container - positioned near Example Request heading */
.verification-legend {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-left: 16px;
    padding: 6px 12px;
    background: var(--pst-color-background-secondary, #f8f9fa);
    border-radius: 6px;
    font-size: 0.8rem;
    vertical-align: middle;
}

/* Individual legend item */
.legend-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: help;
    position: relative;
}

/* Mini badges in legend */
.legend-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    font-size: 10px;
    font-weight: bold;
    color: white;
}

.legend-badge-pass {
    background-color: #28a745;
}

.legend-badge-syntax {
    background-color: transparent;
    border: 2px solid #0d6efd;
    color: #0d6efd;
}

.legend-badge-fail {
    background-color: #dc3545;
}

.legend-badge-skip {
    background-color: #6c757d;
}

/* Legend label */
.legend-label {
    color: var(--pst-color-text-muted, #6c757d);
    font-size: 0.75rem;
}

/* Tooltip on hover */
.legend-item::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 130%;
    left: 50%;
    transform: translateX(-50%);
    background: #333;
    color: white;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 0.75rem;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s, visibility 0.2s;
    z-index: 1000;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.legend-item::before {
    content: '';
    position: absolute;
    bottom: 115%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: #333;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s, visibility 0.2s;
    z-index: 1000;
}

.legend-item:hover::after,
.legend-item:hover::before {
    opacity: 1;
    visibility: visible;
}

/* Compact legend for inline use */
.verification-legend-compact {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: 12px;
}

.verification-legend-compact .legend-item {
    gap: 2px;
}

.verification-legend-compact .legend-label {
    display: none;
}

/* Dark mode adjustments */
[data-theme="dark"] .verification-legend,
.theme-dark .verification-legend {
    background: var(--pst-color-background-secondary, #2d2d2d);
}

[data-theme="dark"] .legend-item::after,
.theme-dark .legend-item::after {
    background: #f8f9fa;
    color: #212529;
}

[data-theme="dark"] .legend-item::before,
.theme-dark .legend-item::before {
    border-top-color: #f8f9fa;
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .verification-legend {
        display: none;
    }

    .verification-legend-compact {
        margin-left: 8px;
        gap: 4px;
    }


}

/* =============================================================================
   NEW ENUM ADMONITION (Green) #49CC90
   ============================================================================= */
.admonition.newenum {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    margin: 1em 0;
}

.admonition.newenum>.admonition-title {
    background: transparent !important;
    color: #49CC90 !important;
    /* Green */
    font-weight: bold;
    margin: 0 !important;
    padding: 0 !important;
}


.admonition.newenum> :not(.admonition-title) {
    display: none !important;
}

/* =============================================================================
   ENUM VALUE STYLING (Restoring missing styles)
   ============================================================================= */

/* Container for enum values list - scrollable box */
.parameter-values-container {
    max-height: 150px;
    overflow-y: auto;
    padding: 0.75rem;
    margin: 0.5rem 0;
    border: 1px solid var(--pst-color-border, #ddd);
    border-radius: 6px;
    background-color: var(--pst-color-surface, #fafafa);
}

/* Dark mode support for values container */
[data-theme="dark"] .parameter-values-container {
    background-color: #2d2d2d;
    border-color: #444;
}

/* Individual enum value item */
.parameter-value-item {
    margin: 0.25rem 0;
    padding: 0.25rem 0;
    line-height: 1.4;
    font-size: 0.9rem;
}

/* The enum value name badge/pill */
.parameter-value-name {
    display: inline-block;
    background-color: #e9ecef;
    color: #495057;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
    font-size: 0.85em;
    font-weight: 600;
    margin-right: 0.5rem;
}

/* Dark mode for value name badges */
[data-theme="dark"] .parameter-value-name {
    background-color: #3d3d3d;
    color: #79c0ff;
}

/* Inline parameter value (for ~value~ syntax) */
.inline-parameter-value {
    background-color: #f5f5f5;
    padding: 2px 6px;
    border-radius: 3px;
    font-family: monospace;
    color: #0969da;
    font-weight: 500;
}

[data-theme="dark"] .inline-parameter-value {
    background-color: #3d3d3d;
    color: #79c0ff;
}

/* 1. Style for the [Value] part if it is mapped to a class or code span */
/* Also handle plain <code> tags without classes (from default_role = 'literal') */
.parameter-description p code,
.parameter-description p code.docutils.literal.notranslate,
.sd-card-body p code,
.sd-card-body p code.docutils.literal.notranslate {
    background-color: var(--pst-color-surface);
    /* Light background */
    border: 1px solid var(--pst-color-border);
    border-radius: 4px;
    padding: 2px 6px;
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
    color: var(--pst-color-primary);
    /* Primary theme color */
    font-weight: 600;
}

/* 2. Specific fix for the user's issue: The text is likely just plain text in a paragraph. 
   If the previous "badge styling" relied on these being code literals, the above fixes it.
   If it relied on the 'parameter-item' directive's special handling, we ensure that's active.
*/
.parameter-item .name-and-requirement code {
    background-color: transparent;
    border: none;
    color: inherit;
    padding: 0;
}

/* This file intentionally left blank. */
.http-method {
    font-weight: bold;

    color: rgb(0, 0, 0);
    padding: 2px 5px;
    border-radius: 5px;
    /* This will round the edges */
    border: 1px solid
}


.body-content {
    font-family: Georgia, serif;
    font-size: 17px;
    background-color: #fff;
    color: #000;
    margin: 0;
    padding: 0;
}

.highlight pre {
    overflow-y: auto;
    overflow-x: auto;
    max-height: 500px;
}

.medium-titles {
    font-size: 1.8rem;
    font-weight: normal;
}

.parameters-container {
    margin-top: 1.2rem;
}

.parameter-type {
    font-weight: lighter;

    font-size: 0.9rem;

    padding-left: 2rem;
}

.parameter-item {
    display: flex;
    flex-direction: column;
    padding-bottom: 0.8rem;


}

.parameter-name {

    font-weight: bold;
    font-size: 1.1rem;


}

.name-and-requirement {
    display: flex;
    align-items: center;
    padding-bottom: 1.1rem;

}

.parameter-requirement-required-font,
.parameter-requirement-optional-font {
    /* Add some spacing between the label and the parameter name */
    padding-left: 2rem;
}




.parameter-requirement-required-font {
    color: red;
    font-weight: lighter;
}

.parameter-requirement-optional-font {
    color: rgb(20, 145, 228);
    font-weight: lighter;
}

.parameter-initial-bar {
    border-top: 2px solid #ccc;
    padding-bottom: 1rem;
}



.parameter-bottom-bar {
    border-top: 2px solid #ccc;
    padding-bottom: 1rem;
}

.parameter-description {
    padding-bottom: 1rem;
    font-size: 0.9rem;
    line-height: 1.2rem;

}


.parameter-description-next-line {
    padding-bottom: 0.5rem;
    font-size: 0.9rem;
    font-family: Arial;
    line-height: 2.5;
}

.parameter-description .parameter-small-names {
    font-size: medium;
    font-weight: bold;
    color: #acacac;
}

.dropdown .rubric {
    cursor: pointer;
    background-color: #f5f5f5;
    padding: 10px;
    border: 1px solid #ddd;
    margin-top: 10px;
}

.dropdown .rubric+* {
    display: none;
}

.dropdown.expanded .rubric+* {
    display: block;
}


.smaller-titles {
    font-size: 20px;
    font-weight: normal;
    padding-bottom: 1rem;
}


.red-text {
    color: red;
}

.blue-text {
    color: rgb(0, 81, 255);
}

table {
    min-width: 125%;

    table-layout: fixed;



}

.toctree-l2 .medium-titles {
    font-size: inherit;
    font-weight: inherit;
}


.toctree-l2 .smaller-titles {
    font-size: inherit;
    font-weight: inherit;
}

.http-method.good-response.medium {
    font-size: 1.5rem;
    background-color: rgb(230, 255, 230);
    border-style: none;
}

/* Bad response styles (4xx, 5xx error codes) - Light mode */
.http-method.bad-response {
    background-color: #fff3e0;
    color: #e65100;
    border: 1px solid #ec6502;
    border-radius: 4px;
    padding: 2px 8px;
}

.http-method.bad-response.medium {
    font-size: 1.5rem;
    background-color: #fff3e0;
    color: #e65100;
    border: 1px solid #ec6502;
}

/* Dark mode bad response */
[data-theme="dark"] .http-method.bad-response,
html[data-theme="dark"] .http-method.bad-response {
    background-color: #ffc38ed1;
    color: #000;
    border-color: #ec6502;
}

[data-theme="dark"] .http-method.bad-response.medium,
html[data-theme="dark"] .http-method.bad-response.medium {
    background-color: #ffc38ed1;
    color: #000;
    border-color: #ec6502;
}

.child-attribute {
    font-weight: bolder;
    font-size: 1.2rem;
    padding: 2px 5px;
    border-radius: 5px;
    border: 0.5px solid;
    background-color: #ececec;


}


.poss-param-values {

    font-size: 1rem;
    padding: 2px 5px;
    border-radius: 5px;

    background-color: #ececec;


}

.http-method.get {
    background-color: rgb(230, 255, 230);
    border-color: darkgreen;
}

.http-method.get.small {
    font-size: 12px;
    /* Set the font size */
    background-color: rgb(230, 255, 230);
    border-color: rgb(21, 157, 21);
}

.http-method.get.medium {
    font-size: 20px;
    /* Set the font size */
    background-color: rgb(230, 255, 230);
    border-color: darkgreen;
}

.http-method.post {
    background-color: rgb(235, 247, 255);
    border-color: rgb(127, 168, 255);
}



.http-method.post.small {
    font-size: 12px;
    /* Set the font size */
    background-color: rgb(235, 247, 255);
    border-color: rgb(127, 168, 255);

}

.scenario {
    color: rgb(0, 0, 0);
    font-weight: bold;

}

.http-method.post.medium {
    font-size: 17px;
    /* Set the font size */
    background-color: rgb(235, 247, 255);
    border-color: rgb(127, 168, 255);
}

.http-method.put {
    background-color: rgb(255, 255, 172);
    color: black;
    /* Changing text color to black for better readability on yellow background */
    border-color: gold;
}

.http-method.put.small {

    font-size: 12px;
    background-color: rgb(255, 255, 172);
    color: black;
    /* Changing text color to black for better readability on yellow background */
    border-color: gold;
}

.http-method.put.medium {

    font-size: 20px;
    background-color: rgb(255, 255, 172);
    color: black;
    /* Changing text color to black for better readability on yellow background */
    border-color: gold;
}

/* [REMOVED] The "Clear styles" block was aggressively hiding badges in the main content. 
   Removing it restores the colored badges in lists. 
*/


/* =============================================================================
   VISUAL REGRESSION FIXES
   1. Fix "Double Circle" / "Odd Loop" on Parameter Types
   2. Fix "Too far right" positioning
   3. Fix "Ugly" Code Blocks -> Premium Dark Style
   ============================================================================= */

/* Fix 1 & 2: Adjust Parameter Type Positioning and remove nested borders */
.parameter-type {
    font-weight: lighter;
    font-size: 0.9rem;
    padding-left: 0.5rem !important;
    /* Was 2rem - too far right */
    border: none !important;
    background: none !important;
}

/* Ensure no child elements (like code tags) inside the type invoke a second border/bubble */
.parameter-type code,
.parameter-type span,
.name-and-requirement code {
    background-color: transparent !important;
    border: none !important;
    padding: 0 !important;
    color: inherit !important;
    box-shadow: none !important;
}

/* Fix 3: Premium Code Blocks (VS Code-like) */
/* Base styles for code blocks */
div.highlight {
    border-radius: 8px !important;
    margin-bottom: 1rem;
}

div.highlight pre {
    font-family: Consolas, 'Courier New', monospace !important;
    font-size: 0.9em !important;
    line-height: 1.5 !important;
    padding: 1rem !important;
    border: none !important;
    margin: 0 !important;
    text-decoration: none !important;
    font-variant-ligatures: none !important;
}

/* Safety net: ensure spans inside code don't get underlined either */
div.highlight pre span {
    text-decoration: none !important;
    border-bottom: none !important;
}

/* ===== Code Block Base Styles (no color - theme handles it) ===== */
/* Colors are set explicitly in light/dark mode sections below */

/* Additional selectors for theme variations */
html:not([data-theme="dark"]) div.highlight,
[data-theme="light"] div.highlight,
body:not(.dark) div.highlight {
    background: #f8f8f8 !important;
}

html:not([data-theme="dark"]) div.highlight pre,
[data-theme="light"] div.highlight pre,
body:not(.dark) div.highlight pre {
    background: #f8f8f8 !important;
    color: #000000 !important;
}

/* ===== LIGHT MODE Syntax Highlighting (from temp/pygments.css) ===== */
html:not([data-theme="dark"]) div.highlight pre .c,
html:not([data-theme="dark"]) div.highlight pre .c1,
html:not([data-theme="dark"]) div.highlight pre .cm,
html:not([data-theme="dark"]) div.highlight pre .ch,
html:not([data-theme="dark"]) div.highlight pre .cp,
html:not([data-theme="dark"]) div.highlight pre .cpf,
html:not([data-theme="dark"]) div.highlight pre .cs,
[data-theme="light"] div.highlight pre .c,
[data-theme="light"] div.highlight pre .c1,
[data-theme="light"] div.highlight pre .cm { color: #8f5902 !important; font-style: italic; } /* Comments - brown */

html:not([data-theme="dark"]) div.highlight pre .k,
html:not([data-theme="dark"]) div.highlight pre .kc,
html:not([data-theme="dark"]) div.highlight pre .kd,
html:not([data-theme="dark"]) div.highlight pre .kn,
html:not([data-theme="dark"]) div.highlight pre .kp,
html:not([data-theme="dark"]) div.highlight pre .kr,
html:not([data-theme="dark"]) div.highlight pre .kt,
html:not([data-theme="dark"]) div.highlight pre .ow,
[data-theme="light"] div.highlight pre .k,
[data-theme="light"] div.highlight pre .kd,
[data-theme="light"] div.highlight pre .kn { color: #004461 !important; font-weight: bold; } /* Keywords - dark blue */

html:not([data-theme="dark"]) div.highlight pre .s,
html:not([data-theme="dark"]) div.highlight pre .s1,
html:not([data-theme="dark"]) div.highlight pre .s2,
html:not([data-theme="dark"]) div.highlight pre .sa,
html:not([data-theme="dark"]) div.highlight pre .sb,
html:not([data-theme="dark"]) div.highlight pre .sc,
html:not([data-theme="dark"]) div.highlight pre .dl,
html:not([data-theme="dark"]) div.highlight pre .se,
html:not([data-theme="dark"]) div.highlight pre .sh,
html:not([data-theme="dark"]) div.highlight pre .si,
html:not([data-theme="dark"]) div.highlight pre .sx,
html:not([data-theme="dark"]) div.highlight pre .sr,
html:not([data-theme="dark"]) div.highlight pre .ss,
[data-theme="light"] div.highlight pre .s,
[data-theme="light"] div.highlight pre .s1,
[data-theme="light"] div.highlight pre .s2,
[data-theme="light"] div.highlight pre .se { color: #4e9a06 !important; } /* Strings - green */

html:not([data-theme="dark"]) div.highlight pre .n,
html:not([data-theme="dark"]) div.highlight pre .nc,
html:not([data-theme="dark"]) div.highlight pre .nf,
html:not([data-theme="dark"]) div.highlight pre .nn,
html:not([data-theme="dark"]) div.highlight pre .nx,
html:not([data-theme="dark"]) div.highlight pre .nv,
html:not([data-theme="dark"]) div.highlight pre .no,
html:not([data-theme="dark"]) div.highlight pre .fm,
html:not([data-theme="dark"]) div.highlight pre .vc,
html:not([data-theme="dark"]) div.highlight pre .vg,
html:not([data-theme="dark"]) div.highlight pre .vi,
html:not([data-theme="dark"]) div.highlight pre .vm,
[data-theme="light"] div.highlight pre .nv,
[data-theme="light"] div.highlight pre .nb,
[data-theme="light"] div.highlight pre .nf { color: #000000 !important; } /* Names - black */

html:not([data-theme="dark"]) div.highlight pre .nb,
[data-theme="light"] div.highlight pre .nb { color: #004461 !important; } /* Name.Builtin - dark blue */

html:not([data-theme="dark"]) div.highlight pre .o,
[data-theme="light"] div.highlight pre .o { color: #582800 !important; } /* Operators - brown */

html:not([data-theme="dark"]) div.highlight pre .p,
html:not([data-theme="dark"]) div.highlight pre .pm,
[data-theme="light"] div.highlight pre .p { color: #000000 !important; font-weight: bold; } /* Punctuation - black bold */

html:not([data-theme="dark"]) div.highlight pre .m,
html:not([data-theme="dark"]) div.highlight pre .mi,
html:not([data-theme="dark"]) div.highlight pre .mf,
html:not([data-theme="dark"]) div.highlight pre .mb,
html:not([data-theme="dark"]) div.highlight pre .mh,
html:not([data-theme="dark"]) div.highlight pre .mo,
html:not([data-theme="dark"]) div.highlight pre .il,
[data-theme="light"] div.highlight pre .m,
[data-theme="light"] div.highlight pre .mi,
[data-theme="light"] div.highlight pre .mf { color: #990000 !important; } /* Numbers - dark red */

html:not([data-theme="dark"]) div.highlight pre .nt,
[data-theme="light"] div.highlight pre .nt { color: #004461 !important; font-weight: bold; } /* Tags - dark blue bold */

html:not([data-theme="dark"]) div.highlight pre .na,
[data-theme="light"] div.highlight pre .na { color: #c4a000 !important; } /* Attributes - gold */

html:not([data-theme="dark"]) div.highlight pre .bp,
[data-theme="light"] div.highlight pre .bp { color: #3465a4 !important; } /* Name.Builtin.Pseudo - blue */

html:not([data-theme="dark"]) div.highlight pre .nd,
[data-theme="light"] div.highlight pre .nd { color: #888888 !important; } /* Name.Decorator - gray */

html:not([data-theme="dark"]) div.highlight pre .ni,
[data-theme="light"] div.highlight pre .ni { color: #ce5c00 !important; } /* Name.Entity - orange */

html:not([data-theme="dark"]) div.highlight pre .ne,
[data-theme="light"] div.highlight pre .ne { color: #cc0000 !important; font-weight: bold; } /* Name.Exception - red bold */

html:not([data-theme="dark"]) div.highlight pre .err,
[data-theme="light"] div.highlight pre .err { color: #a40000 !important; border: 1px solid #ef2929; } /* Error */

/* ===== DARK MODE Code Blocks (VS Code Dark theme) ===== */
[data-theme="dark"] div.highlight,
html[data-theme="dark"] div.highlight {
    background-color: #1e1e1e !important;
    border: 1px solid #333 !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

[data-theme="dark"] div.highlight pre,
html[data-theme="dark"] div.highlight pre {
    background-color: #1e1e1e !important;
    color: #d4d4d4 !important;
}

/* Syntax highlighting for dark mode */
[data-theme="dark"] div.highlight pre .c,
[data-theme="dark"] div.highlight pre .c1,
[data-theme="dark"] div.highlight pre .cm { color: #6a9955 !important; } /* Comments - green */
[data-theme="dark"] div.highlight pre .k,
[data-theme="dark"] div.highlight pre .kn,
[data-theme="dark"] div.highlight pre .kd { color: #569cd6 !important; } /* Keywords - blue */
[data-theme="dark"] div.highlight pre .s,
[data-theme="dark"] div.highlight pre .s1,
[data-theme="dark"] div.highlight pre .s2,
[data-theme="dark"] div.highlight pre .se { color: #ce9178 !important; } /* Strings - orange */
[data-theme="dark"] div.highlight pre .n,
[data-theme="dark"] div.highlight pre .nx,
[data-theme="dark"] div.highlight pre .nn,
[data-theme="dark"] div.highlight pre .nc,
[data-theme="dark"] div.highlight pre .nv,
[data-theme="dark"] div.highlight pre .nb,
[data-theme="dark"] div.highlight pre .nf { color: #9cdcfe !important; } /* Names/variables/functions - light blue */
[data-theme="dark"] div.highlight pre .o,
[data-theme="dark"] div.highlight pre .p { color: #d4d4d4 !important; } /* Operators/punctuation */
[data-theme="dark"] div.highlight pre .m,
[data-theme="dark"] div.highlight pre .mi,
[data-theme="dark"] div.highlight pre .mf { color: #b5cea8 !important; } /* Numbers - light green */
[data-theme="dark"] div.highlight pre .nt { color: #569cd6 !important; } /* Tags */
[data-theme="dark"] div.highlight pre .na { color: #9cdcfe !important; } /* Attributes */

/* Fix for sphinx-tabs integration with new code styling */
.sphinx-tabs-panel div.highlight {
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    background-color: #f5f5f5 !important;
}

.sphinx-tabs-panel div.highlight pre {
    background-color: #f5f5f5 !important;
    color: #383a42 !important;
}

/* Explicit light mode for sphinx-tabs code blocks */
html:not([data-theme="dark"]) .sphinx-tabs-panel div.highlight,
[data-theme="light"] .sphinx-tabs-panel div.highlight {
    background-color: #f5f5f5 !important;
}

html:not([data-theme="dark"]) .sphinx-tabs-panel div.highlight pre,
[data-theme="light"] .sphinx-tabs-panel div.highlight pre {
    background-color: #f5f5f5 !important;
    color: #383a42 !important;
}

/* Dark mode overrides for sphinx-tabs */
[data-theme="dark"] .sphinx-tabs-panel div.highlight,
html[data-theme="dark"] .sphinx-tabs-panel div.highlight {
    background-color: #1e1e1e !important;
}

[data-theme="dark"] .sphinx-tabs-panel div.highlight pre,
html[data-theme="dark"] .sphinx-tabs-panel div.highlight pre {
    background-color: #1e1e1e !important;
    color: #d4d4d4 !important;
}

/* Dark mode syntax highlighting for sphinx-tabs */
[data-theme="dark"] .sphinx-tabs-panel div.highlight pre .n,
[data-theme="dark"] .sphinx-tabs-panel div.highlight pre .nx,
[data-theme="dark"] .sphinx-tabs-panel div.highlight pre .nn,
[data-theme="dark"] .sphinx-tabs-panel div.highlight pre .nc,
[data-theme="dark"] .sphinx-tabs-panel div.highlight pre .nv,
[data-theme="dark"] .sphinx-tabs-panel div.highlight pre .nb,
[data-theme="dark"] .sphinx-tabs-panel div.highlight pre .nf { color: #9cdcfe !important; }

/* Aggressively remove the outer border from the tab panel itself */
div.sphinx-tabs-panel {
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* =============================================================================
   BASE HTTPMETHOD STYLES (Large/Default for Endpoint Headers)
   Used by the endpoint-header directive for section titles.
   ============================================================================= */

/* Base httpmethod badge style (large/default) */
.httpmethod {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 4px;
    font-weight: bold;
    font-size: 0.9em;
    margin-right: 10px;
    vertical-align: middle;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* GET - Green */
.httpmethod.get {
    background-color: #49CC90;
    color: black;
}

/* POST - Blue */
.httpmethod.post {
    background-color: #61AFFE;
    color: black;
}

/* PUT - Orange */
.httpmethod.put {
    background-color: #FCA130;
    color: black;
}

/* DELETE - Red */
.httpmethod.delete {
    background-color: #F93E3E;
    color: black;
}

/* PATCH - Purple */
.httpmethod.patch {
    background-color: #9B59B6;
    color: black;
}

/* Dark mode variants */
[data-theme="dark"] .httpmethod.get {
    background-color: #49CC90;
}

[data-theme="dark"] .httpmethod.post {
    background-color: #61AFFE;
}

[data-theme="dark"] .httpmethod.put {
    background-color: #FCA130;
}

[data-theme="dark"] .httpmethod.delete {
    background-color: #F93E3E;
}

[data-theme="dark"] .httpmethod.patch {
    background-color: #9B59B6;
}

/* =============================================================================
   HTTP METHOD BADGES - STYLE TOGGLE SYSTEM
   Switch between "compact" (smaller, original) and "standard" (larger, matches titles)
   via conf.py: httpmethod_badge_style = "standard" | "compact"

   Note: Roles output class="http-method get small" (separate classes)
   ============================================================================= */

/* --- COMPACT STYLE (original small badges) --- */
html[data-httpmethod-style="compact"] .http-method.small,
html[data-httpmethod-style="compact"] .httpmethod-small-get,
html[data-httpmethod-style="compact"] .httpmethod-small-post,
html[data-httpmethod-style="compact"] .httpmethod-small-put,
html[data-httpmethod-style="compact"] .httpmethod-small-delete {
    display: inline-block !important;
    padding: 2px 5px !important;
    border-radius: 4px !important;
    font-size: 0.8em !important;
    font-weight: bold !important;
    color: black !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    border: none !important;
    line-height: normal !important;
    vertical-align: middle !important;
    text-decoration: none !important;
    margin-right: 6px !important;
}

/* --- STANDARD STYLE (larger badges, matches titles/sidebar) --- */
html[data-httpmethod-style="standard"] .http-method.small,
html[data-httpmethod-style="standard"] .httpmethod-small-get,
html[data-httpmethod-style="standard"] .httpmethod-small-post,
html[data-httpmethod-style="standard"] .httpmethod-small-put,
html[data-httpmethod-style="standard"] .httpmethod-small-delete,
html:not([data-httpmethod-style]) .http-method.small,
html:not([data-httpmethod-style]) .httpmethod-small-get,
html:not([data-httpmethod-style]) .httpmethod-small-post,
html:not([data-httpmethod-style]) .httpmethod-small-put,
html:not([data-httpmethod-style]) .httpmethod-small-delete {
    display: inline-block !important;
    padding: 4px 12px !important;
    border-radius: 4px !important;
    font-size: 0.9em !important;
    font-weight: bold !important;
    color: black !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border: none !important;
    line-height: normal !important;
    vertical-align: middle !important;
    text-decoration: none !important;
    margin-right: 8px !important;
}

/* --- Method colors (shared by both styles) --- */
/* For separate class format: http-method get/post/put/delete */
.http-method.get,
.httpmethod-small-get {
    background-color: #49CC90 !important;
}

.http-method.post,
.httpmethod-small-post {
    background-color: #61AFFE !important;
}

.http-method.put,
.httpmethod-small-put {
    background-color: #FCA130 !important;
}

.http-method.delete,
.httpmethod-small-delete {
    background-color: #F93E3E !important;
}

.http-method.patch {
    background-color: #50e3c2 !important;
}

/* --- Force styles in lists (both styles) --- */
li .http-method.small,
li a .http-method.small,
li .httpmethod-small-get,
li .httpmethod-small-post,
li .httpmethod-small-put,
li .httpmethod-small-delete,
li a .httpmethod-small-get,
li a .httpmethod-small-post,
li a .httpmethod-small-put,
li a .httpmethod-small-delete {
    /* Inherit toggle-based styles, just ensure visibility */
    display: inline-block !important;
    vertical-align: middle !important;
    text-decoration: none !important;
}

/* ============================================
   LIGHT MODE SPECIFIC STYLES
   ============================================ */

/* Light mode codeblock backgrounds - subtle grey */
html:not([data-theme="dark"]) .highlight,
html:not([data-theme="dark"]) .highlight pre,
html:not([data-theme="dark"]) div.highlight,
html:not([data-theme="dark"]) div.highlight pre,
html:not([data-theme="dark"]) .sphinx-tabs-panel .highlight,
html:not([data-theme="dark"]) .sphinx-tabs-panel .highlight pre,
[data-theme="light"] .highlight,
[data-theme="light"] .highlight pre,
[data-theme="light"] div.highlight,
[data-theme="light"] div.highlight pre,
[data-theme="light"] .sphinx-tabs-panel .highlight,
[data-theme="light"] .sphinx-tabs-panel .highlight pre {
    background-color: #f6f8fa !important;
    border: 1px solid #e1e4e8 !important;
}

/* Ensure code text is dark in light mode */
html:not([data-theme="dark"]) .highlight pre,
html:not([data-theme="dark"]) div.highlight pre,
html:not([data-theme="dark"]) .sphinx-tabs-panel .highlight pre,
[data-theme="light"] .highlight pre,
[data-theme="light"] div.highlight pre,
[data-theme="light"] .sphinx-tabs-panel .highlight pre {
    color: #24292e !important;
}

/* Light mode 200 Response badge - simple green highlight */
html:not([data-theme="dark"]) .http-method.good-response,
html:not([data-theme="dark"]) .http-method.good-response.medium,
[data-theme="light"] .http-method.good-response,
[data-theme="light"] .http-method.good-response.medium {
    background-color: #dcffe4 !important;
    color: #22863a !important;
    border: none !important;
    border-radius: 4px !important;
    padding: 2px 8px !important;
    font-weight: 600 !important;
    font-size: 1.1rem !important;
    box-shadow: none !important;
}

/* Light mode 4xx/5xx Response badge - simple orange highlight */
html:not([data-theme="dark"]) .http-method.bad-response,
html:not([data-theme="dark"]) .http-method.bad-response.medium,
[data-theme="light"] .http-method.bad-response,
[data-theme="light"] .http-method.bad-response.medium {
    background-color: #fff3e0 !important;
    color: #e65100 !important;
    border: none !important;
    border-radius: 4px !important;
    padding: 2px 8px !important;
    font-weight: 600 !important;
    font-size: 1.1rem !important;
    box-shadow: none !important;
}

/* Light mode example card styling */
html:not([data-theme="dark"]) .example-card,
[data-theme="light"] .example-card {
    background-color: #ffffff !important;
    border: 1px solid #e1e4e8 !important;
}

/* Light mode parameters card */
html:not([data-theme="dark"]) .parameters-card,
[data-theme="light"] .parameters-card {
    background-color: #ffffff !important;
}

/* Light mode tab styling */
html:not([data-theme="dark"]) .sphinx-tabs-tab,
[data-theme="light"] .sphinx-tabs-tab {
    background-color: #f6f8fa !important;
    color: #24292e !important;
    border: 1px solid #e1e4e8 !important;
}

html:not([data-theme="dark"]) .sphinx-tabs-tab[aria-selected="true"],
[data-theme="light"] .sphinx-tabs-tab[aria-selected="true"] {
    background-color: #ffffff !important;
    border-bottom-color: #ffffff !important;
    font-weight: 600 !important;
}

/* Light mode sphinx-tabs-panel */
html:not([data-theme="dark"]) .sphinx-tabs-panel,
[data-theme="light"] .sphinx-tabs-panel {
    background-color: #f6f8fa !important;
    border: 1px solid #e1e4e8 !important;
    border-top: none !important;
}

/* =============================================================================
   MOBILE ENHANCEMENTS
   ============================================================================= */

/* Hide secondary sidebar (Endpoints TOC) completely on mobile */
@media (max-width: 991px) {
    .bd-sidebar-secondary,
    .bd-toc,
    button.sidebar-toggle.secondary-toggle {
        display: none !important;
        visibility: hidden !important;
    }

    /* Expand main content to full width when sidebar is hidden */
    .bd-main .bd-content {
        max-width: 100% !important;
        flex: 1 1 100% !important;
    }
}

/* Disable hover effects on touch devices */
@media (hover: none), (pointer: coarse) {
    /* Disable tippy tooltips on touch */
    .tippy-box {
        display: none !important;
    }

    /* Prevent hover popups */
    .tippy-content,
    .tippy-arrow {
        display: none !important;
    }
}

/* Additional mobile-specific touch behavior */
@media (max-width: 768px) and (hover: none) {
    /* Ensure taps work properly without hover interference */
    a, button, .nav-link, .reference {
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
        touch-action: manipulation;
    }
}

/* ============================================
   MOBILE ENDPOINT LIST SIZING
   Shrink badges and text to fit on phone screens
   ============================================ */

/* Tablet/Small laptop size - moderate shrink */
@media (max-width: 1024px) {
    /* HTTP method badges in endpoint lists */
    .httpmethod-small-get,
    .httpmethod-small-post,
    .httpmethod-small-put,
    .httpmethod-small-delete,
    .http-method.small,
    .http-method.get.small,
    .http-method.post.small,
    .http-method.put.small,
    .http-method.delete.small {
        padding: 1px 4px !important;
        font-size: 0.65em !important;
        letter-spacing: 0 !important;
        margin-right: 4px !important;
    }

    /* HTTP method medium badges - moderate shrink */
    .http-method.medium,
    .http-method.get.medium,
    .http-method.post.medium,
    .http-method.put.medium,
    .http-method.delete.medium {
        font-size: 14px !important;
        padding: 2px 6px !important;
    }

    /* NEW/UPDATED badge */
    .new-endpoint {
        font-size: 0.5rem !important;
        padding: 0.1rem 0.25rem !important;
        margin-left: 0.25rem !important;
        letter-spacing: 0 !important;
    }

    /* Endpoint links - slightly smaller text */
    .section ul li .reference,
    .toctree-wrapper ul li .reference {
        font-size: 0.9em;
    }
}

/* Phone size - aggressive shrink */
@media (max-width: 768px) {
    /* HTTP method badges - very compact */
    .httpmethod-small-get,
    .httpmethod-small-post,
    .httpmethod-small-put,
    .httpmethod-small-delete,
    .http-method.small,
    .http-method.get.small,
    .http-method.post.small,
    .http-method.put.small,
    .http-method.delete.small {
        padding: 1px 3px !important;
        font-size: 0.55em !important;
        border-radius: 2px !important;
        margin-right: 3px !important;
    }

    /* HTTP method medium badges - aggressive shrink */
    .http-method.medium,
    .http-method.get.medium,
    .http-method.post.medium,
    .http-method.put.medium,
    .http-method.delete.medium {
        font-size: 12px !important;
        padding: 1px 4px !important;
    }

    /* NEW/UPDATED badge - tiny */
    .new-endpoint {
        font-size: 0.4rem !important;
        padding: 0.05rem 0.15rem !important;
        margin-left: 0.15rem !important;
        border-radius: 2px !important;
    }

    /* Endpoint links - smaller text to fit */
    .section ul li .reference,
    .toctree-wrapper ul li .reference {
        font-size: 0.85em;
    }

    /* Reduce list item spacing */
    .section ul li,
    .toctree-wrapper ul li {
        margin-bottom: 0.3rem;
        line-height: 1.3;
    }

    /* Add flexbox for endpoint list items - better wrapping */
    section#endpoints > ul.simple > li {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        gap: 0.2rem 0.25rem;  /* row-gap column-gap */
    }

    section#endpoints > ul.simple > li .reference {
        flex: 1 1 auto;
        min-width: 0;  /* Allow shrinking below content size */
    }

    /* Keep badge fixed width with extra spacing */
    section#endpoints > ul.simple > li .http-method.small {
        flex: 0 0 auto;
        margin-right: 0.2rem !important;
    }
}

/* =============================================================================
   RESPONSIVE BREAKPOINTS - PROGRESSIVE SCALING
   Mobile-first progressive enhancement for endpoint lists
   Target screen sizes:
   - Mobile: 360x640 through 430x932
   - Tablet: 768x1024 through 1280x800
   ============================================================================= */

/* -----------------------------------------------------------------------------
   LARGE PHONE (430px - 768px)
   iPhone 14 Pro Max (430x932), Galaxy S23 Ultra (412x915), Pixel 7 Pro (412x892)
   ----------------------------------------------------------------------------- */
@media (max-width: 767px) and (min-width: 431px) {
    /* HTTP method badges - compact for large phones */
    .httpmethod-small-get,
    .httpmethod-small-post,
    .httpmethod-small-put,
    .httpmethod-small-delete,
    .http-method.small,
    .http-method.get.small,
    .http-method.post.small,
    .http-method.put.small,
    .http-method.delete.small {
        padding: 1px 4px !important;
        font-size: 0.55em !important;
        border-radius: 3px !important;
        margin-right: 0.2rem !important;
        letter-spacing: 0 !important;
    }

    /* Endpoint list items - flexbox for proper spacing */
    section#endpoints > ul.simple > li,
    .section ul.simple > li {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        gap: 0.18rem 0.2rem;
        margin-bottom: 0.85rem;
        line-height: 1.45;
    }

    /* Reference links - readable but compact */
    section#endpoints > ul.simple > li .reference,
    .section ul li .reference.internal {
        font-size: 0.86em;
        word-break: break-word;
    }

    /* NEW/UPDATED badges */
    .new-endpoint,
    .new-endpoint-indicator {
        font-size: 0.45rem !important;
        padding: 0.08rem 0.2rem !important;
        margin-left: 0.2rem !important;
        letter-spacing: 0 !important;
    }

    /* Endpoint list container */
    section#endpoints > ul.simple {
        max-height: 400px;
        padding-right: 0.25rem;
    }

    /* Body text */
    body {
        font-size: 0.92rem;
        line-height: 1.4;
    }
}

/* -----------------------------------------------------------------------------
   SMALL PHONE (360px - 430px)
   iPhone SE, Galaxy S8, smaller Android devices
   ----------------------------------------------------------------------------- */
@media (max-width: 430px) and (min-width: 360px) {
    /* HTTP method badges - minimal for small screens */
    .httpmethod-small-get,
    .httpmethod-small-post,
    .httpmethod-small-put,
    .httpmethod-small-delete,
    .http-method.small,
    .http-method.get.small,
    .http-method.post.small,
    .http-method.put.small,
    .http-method.delete.small {
        padding: 1px 3px !important;
        font-size: 0.48em !important;
        border-radius: 2px !important;
        margin-right: 0.15rem !important;
        letter-spacing: -0.02em !important;
    }

    /* Endpoint list items - flexbox with spacing */
    section#endpoints > ul.simple > li,
    .section ul.simple > li {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        gap: 0.15rem 0.18rem;
        margin-bottom: 0.7rem;
        line-height: 1.35;
        padding-left: 0;
    }

    /* Reference links - compact */
    section#endpoints > ul.simple > li .reference,
    .section ul li .reference.internal {
        font-size: 0.8em;
        word-break: break-word;
        hyphens: auto;
    }

    /* NEW/UPDATED badges - minimal */
    .new-endpoint,
    .new-endpoint-indicator {
        font-size: 0.38rem !important;
        padding: 0.05rem 0.12rem !important;
        margin-left: 0.15rem !important;
        border-radius: 1px !important;
    }

    /* Endpoint list container - shorter */
    section#endpoints > ul.simple {
        max-height: 350px;
        padding-right: 0.2rem;
        margin-bottom: 4rem;
    }

    /* Body text - compact */
    body {
        font-size: 0.88rem;
        line-height: 1.35;
    }

    /* Parameter adjustments */
    .parameter-name {
        font-size: 0.95rem;
    }

    .parameter-type {
        font-size: 0.8rem;
    }

    .parameter-description {
        font-size: 0.85rem;
        line-height: 1.25;
    }
}

/* -----------------------------------------------------------------------------
   VERY SMALL PHONE (< 360px)
   Older devices, compact mode
   ----------------------------------------------------------------------------- */
@media (max-width: 359px) {
    /* HTTP method badges - abbreviate or minimal */
    .httpmethod-small-get,
    .httpmethod-small-post,
    .httpmethod-small-put,
    .httpmethod-small-delete,
    .http-method.small,
    .http-method.get.small,
    .http-method.post.small,
    .http-method.put.small,
    .http-method.delete.small {
        padding: 1px 2px !important;
        font-size: 0.42em !important;
        border-radius: 2px !important;
        margin-right: 0.12rem !important;
    }

    /* Reference links - maximum compression */
    section#endpoints > ul.simple > li .reference,
    .section ul li .reference.internal {
        font-size: 0.76em;
    }

    /* Hide NEW badges on very small screens to save space */
    .new-endpoint,
    .new-endpoint-indicator {
        display: none !important;
    }

    /* Endpoint list items - flexbox with minimal spacing */
    section#endpoints > ul.simple > li,
    .section ul.simple > li {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        gap: 0.12rem 0.15rem;
        margin-bottom: 0.5rem;
        line-height: 1.25;
    }

    body {
        font-size: 0.85rem;
    }
}

/* -----------------------------------------------------------------------------
   TABLET LANDSCAPE (1024px - 1280px)
   iPad landscape, small laptops, large tablets
   ----------------------------------------------------------------------------- */
@media (max-width: 1280px) and (min-width: 1025px) {
    /* HTTP method badges - slightly reduced */
    .httpmethod-small-get,
    .httpmethod-small-post,
    .httpmethod-small-put,
    .httpmethod-small-delete,
    .http-method.small,
    .http-method.get.small,
    .http-method.post.small,
    .http-method.put.small,
    .http-method.delete.small {
        padding: 2px 6px !important;
        font-size: 0.75em !important;
        margin-right: 5px !important;
    }

    /* Endpoint list spacing */
    section#endpoints > ul.simple > li,
    .section ul.simple > li {
        margin-bottom: 0.9rem;
        line-height: 1.45;
    }

    /* Reference links */
    section#endpoints > ul.simple > li .reference,
    .section ul li .reference.internal {
        font-size: 0.95em;
    }
}

/* -----------------------------------------------------------------------------
   TABLET PORTRAIT (768px - 1024px)
   iPad portrait, medium tablets - enhancing existing 1024px breakpoint
   ----------------------------------------------------------------------------- */
@media (max-width: 1024px) and (min-width: 769px) {
    /* Endpoint list spacing */
    section#endpoints > ul.simple > li,
    .section ul.simple > li {
        margin-bottom: 0.6rem;
        line-height: 1.35;
    }

    /* Reference links */
    section#endpoints > ul.simple > li .reference,
    .section ul li .reference.internal {
        font-size: 0.92em;
    }
}
