/* =============================================================================
   VrilsoftApi — Premium Swagger UI theme
   Mirrors _Layout.cshtml: animated navbar gradient (JS + .swagger-vrilsoft-gradient-bg), glow/shimmer, Tabler-like tokens,
   glass surfaces. Animations use the same keyframe names as the main site where
   possible; decorative motion respects prefers-reduced-motion.
   ============================================================================= */

/* --- Keyframes (site-aligned + Swagger-specific) --------------------------- */
@keyframes glow-pulse {
    0%, 100% { opacity: 0.35; transform: scale(1); }
    50% { opacity: 0.65; transform: scale(1.06); }
}

@keyframes swagger-shimmer-line {
    0% { background-position: -100% 0; }
    100% { background-position: 200% 0; }
}

@keyframes vril-mesh-drift {
    0% { opacity: 1; transform: scale(1) translate(0, 0); }
    100% { opacity: 0.88; transform: scale(1.04) translate(-1.5%, 0.5%); }
}

/* --- Design tokens = _Layout :root / [data-bs-theme] ----------------------- */
html[data-bs-theme="light"] {
    --card-bg: #ffffff;
    --bg-surface: #f8f9fa;
    --bg-body: #ffffff;
    --body-color: #1e293b;
    --secondary: #64748b;
    --muted: #94a3b8;
    --border-color: #e2e8f0;
    --primary: #667eea;
    --primary-rgb: 102, 126, 234;
    --accent: #764ba2;
    --accent-rgb: 118, 75, 162;
    --glow-color: rgba(102, 126, 234, 0.15);
    --sw-get: #3b82f6;
    --sw-post: #10b981;
    --sw-put: #f59e0b;
    --sw-delete: #ef4444;
    --sw-patch: #06b6d4;
    --sw-glass-surface: rgba(255, 255, 255, 0.72);
    --sw-glass-border: rgba(102, 126, 234, 0.22);
}

html[data-bs-theme="dark"] {
    --card-bg: #1e293b;
    --bg-surface: #0f172a;
    --bg-body: #0a0f1a;
    --body-color: #f1f5f9;
    --secondary: #94a3b8;
    --muted: #64748b;
    --border-color: #334155;
    --primary: #818cf8;
    --primary-rgb: 129, 140, 248;
    --accent: #a78bfa;
    --accent-rgb: 167, 139, 250;
    --glow-color: rgba(129, 140, 248, 0.2);
    --sw-get: #60a5fa;
    --sw-post: #34d399;
    --sw-put: #fbbf24;
    --sw-delete: #f87171;
    --sw-patch: #22d3ee;
    --sw-glass-surface: rgba(30, 41, 59, 0.75);
    --sw-glass-border: rgba(129, 140, 248, 0.28);
}

html {
    color-scheme: light dark;
}

/* --- Ambient page background (premium mesh, like site hero accents) -------- */
body {
    margin: 0 !important;
    min-height: 100vh;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    color: var(--body-color) !important;
    background-color: var(--bg-body) !important;
    position: relative;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: var(--bg-body);
}

html[data-bs-theme="light"] body::before {
    background:
        radial-gradient(ellipse 100% 80% at 0% -25%, rgba(102, 126, 234, 0.14), transparent 55%),
        radial-gradient(ellipse 90% 70% at 100% 0%, rgba(118, 75, 162, 0.1), transparent 50%),
        radial-gradient(ellipse 70% 50% at 50% 100%, rgba(79, 172, 254, 0.08), transparent 45%),
        var(--bg-body);
}

html[data-bs-theme="dark"] body::before {
    background:
        radial-gradient(ellipse 120% 90% at 0% -30%, rgba(129, 140, 248, 0.22), transparent 58%),
        radial-gradient(ellipse 100% 80% at 100% 5%, rgba(167, 139, 250, 0.16), transparent 52%),
        radial-gradient(ellipse 80% 60% at 40% 105%, rgba(79, 172, 254, 0.12), transparent 48%),
        var(--bg-body);
}

@media (prefers-reduced-motion: no-preference) {
    html[data-bs-theme="light"] body::before,
    html[data-bs-theme="dark"] body::before {
        animation: vril-mesh-drift 22s ease-in-out infinite alternate !important;
        will-change: transform, opacity;
    }
}

/*
 * Swagger UI 5: `.swagger-ui` uses `container-type: inline-size` + Tachyons cols
 * (`Row` = `.wrapper`, `Col` = `section.col-*`). Without a full-width root, or
 * when floats interact with our overrides, the info panel can shrink to one
 * side. Pin the root and reset the information row to block/flex full width.
 */
#swagger-ui,
#swagger-ui .swagger-ui {
    position: relative;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

#swagger-ui {
    z-index: 1;
}

.swagger-ui {
    color: var(--body-color) !important;
}

/* All Swagger “rows” (wrapper) — horizontal gutter only; vertical rhythm per section */
.swagger-ui .wrapper {
    max-width: min(96vw, 1480px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 1.25rem !important;
    box-sizing: border-box !important;
}

/* --- Information hero: full-width card, centered (fixes left-cling + empty right) */
.swagger-ui .information-container {
    width: 100% !important;
    max-width: min(96vw, 1480px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
    clear: both !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
}

/* Tachyons column inside info row — override float/width so content spans the card */
.swagger-ui .information-container > section,
.swagger-ui .information-container > .block,
.swagger-ui .information-container [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 auto !important;
    float: none !important;
    display: block !important;
    box-sizing: border-box !important;
}

.swagger-ui .information-container .info {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* =============================================================================
   TOP BAR — matches main app navbar.
   Gradient motion: real DIV (.swagger-vrilsoft-gradient-bg) + JS rAF updates
   background-position (Swagger’s CSS often kills @keyframes on ::before).
   ============================================================================= */
.swagger-ui .topbar {
    position: relative !important;
    isolation: isolate !important;
    overflow: visible !important;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    padding: 0.75rem 0 !important;
    box-shadow:
        0 10px 40px rgba(var(--primary-rgb), 0.32),
        0 0 100px rgba(var(--primary-rgb), 0.08) inset !important;
}

/* Disable pseudo gradient — JS-driven layer replaces it (reliable animation) */
.swagger-ui .topbar::before {
    content: none !important;
    display: none !important;
}

/* Injected first; same stops as _Layout .navbar */
/*
 * IMPORTANT: do not use `background: linear-gradient(...) !important` here.
 * The shorthand makes every background longhand !important, so inline
 * backgroundPosition updates from JS cannot override — the bar looks “frozen”.
 * Use background-image + separate size/repeat; position is driven by JS (same
 * motion as VrilHosting .premium-header: 300% size, sweep on X).
 */
.swagger-ui .topbar .swagger-vrilsoft-gradient-bg {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    background-color: transparent !important;
    background-image: linear-gradient(135deg, #667eea 0%, #764ba2 25%, #f093fb 50%, #4facfe 75%, #00f2fe 100%) !important;
    background-size: 300% 300% !important;
    background-repeat: no-repeat !important;
    background-position: 0% 50%;
    will-change: background-position;
}

/* Soft moving highlight (same idea as .navbar::before) */
.swagger-ui .topbar .swagger-vrilsoft-nav-glow {
    position: absolute;
    top: -50%;
    left: -50%;
    right: -50%;
    bottom: -50%;
    z-index: 1;
    pointer-events: none;
    background:
        radial-gradient(circle at 30% 50%, rgba(255, 255, 255, 0.28) 0%, transparent 55%),
        radial-gradient(circle at 70% 50%, rgba(255, 255, 255, 0.18) 0%, transparent 55%);
}

@media (prefers-reduced-motion: no-preference) {
    .swagger-ui .topbar .swagger-vrilsoft-nav-glow {
        animation: glow-pulse 6s ease-in-out infinite !important;
        will-change: opacity, transform;
    }
}

/* Bottom shimmer line — matches .navbar::after */
.swagger-ui .topbar::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 2px !important;
    z-index: 3 !important;
    pointer-events: none !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.55),
        transparent
    ) !important;
    background-size: 200% 100% !important;
    background-repeat: no-repeat !important;
}

@media (prefers-reduced-motion: no-preference) {
    .swagger-ui .topbar::after {
        animation: swagger-shimmer-line 3.5s ease-in-out infinite !important;
        will-change: background-position;
    }
}

.swagger-ui .topbar .wrapper {
    position: relative !important;
    z-index: 4 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 1rem 1.5rem !important;
    max-width: min(96vw, 1480px) !important;
    margin: 0 auto !important;
    padding: 0 1.25rem !important;
}

/* Hide default Swagger branding (img + SVG + nested spans) */
.swagger-ui .topbar a.link img,
.swagger-ui .topbar a.link svg,
.swagger-ui .topbar .topbar-wrapper img,
.swagger-ui .topbar .topbar-wrapper svg {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    visibility: hidden !important;
}

/* Glass brand chip — mirrors .navbar-brand */
.swagger-ui .topbar a.link {
    order: -1 !important;
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: none !important;
    font-size: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    margin-right: auto !important;
    border-radius: 0.75rem !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease, background 0.3s ease !important;
}

.swagger-ui .topbar a.link::after {
    content: "VrilsoftApi" !important;
    font-size: 1.25rem !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    color: #fff !important;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.35) !important;
    padding: 0.5rem 1rem !important;
    background: rgba(255, 255, 255, 0.15) !important;
    border-radius: 0.75rem !important;
    border: 2px solid rgba(255, 255, 255, 0.22) !important;
    backdrop-filter: blur(12px) saturate(1.2) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.2) !important;
}

.swagger-ui .topbar a.link:hover {
    transform: translateY(-2px) !important;
}

.swagger-ui .topbar a.link:hover::after {
    background: rgba(255, 255, 255, 0.25) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
}

.swagger-ui .topbar a:not(.link),
.swagger-ui .topbar .link {
    color: #fff !important;
}

/* Definition selector — glass control */
.swagger-ui .topbar .download-url-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 0.65rem !important;
    margin: 0 !important;
    padding: 0 !important;
}

.swagger-ui .topbar .download-url-wrapper .select-label {
    color: rgba(255, 255, 255, 0.95) !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.25) !important;
}

.swagger-ui .topbar .download-url-wrapper input[type="text"] {
    border-radius: 0.65rem !important;
    border: 2px solid rgba(255, 255, 255, 0.35) !important;
    background: rgba(255, 255, 255, 0.18) !important;
    color: #fff !important;
    backdrop-filter: blur(10px) !important;
}

.swagger-ui .topbar .download-url-wrapper select {
    border-radius: 0.65rem !important;
    border: 2px solid rgba(255, 255, 255, 0.35) !important;
    background: rgba(255, 255, 255, 0.95) !important;
    color: #1e293b !important;
    font-weight: 600 !important;
    padding: 0.35rem 2rem 0.35rem 0.65rem !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12) !important;
}

/* =============================================================================
   Glass cards & content
   ============================================================================= */
.swagger-ui .information-container,
.swagger-ui .scheme-container {
    background: var(--sw-glass-surface) !important;
    backdrop-filter: blur(18px) saturate(1.25) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.25) !important;
    border: 1px solid var(--sw-glass-border) !important;
    border-radius: 1rem !important;
    box-shadow:
        0 12px 48px rgba(0, 0, 0, 0.18),
        0 0 0 1px rgba(255, 255, 255, 0.04) inset !important;
    margin: 1.5rem auto !important;
    padding: 1.5rem !important;
}

/* Scheme bar: same horizontal alignment as info */
.swagger-ui .scheme-container {
    width: 100% !important;
    max-width: min(96vw, 1480px) !important;
    float: none !important;
    clear: both !important;
    box-sizing: border-box !important;
}

.swagger-ui .info .title {
    color: var(--body-color) !important;
}

.swagger-ui .info .title small pre {
    color: var(--secondary) !important;
}

.swagger-ui .info p,
.swagger-ui .info li,
.swagger-ui .info table {
    color: var(--secondary) !important;
}

.swagger-ui .info a,
.swagger-ui a.nostyle {
    color: var(--primary) !important;
    font-weight: 600 !important;
    transition: color 0.35s ease, opacity 0.35s ease, filter 0.35s ease !important;
}

.swagger-ui .info a:hover,
.swagger-ui a.nostyle:hover {
    color: var(--accent) !important;
    filter: brightness(1.08);
}

.swagger-ui .info hgroup.main a {
    color: var(--accent) !important;
}

/* Tag blocks */
.swagger-ui .opblock-tag {
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--accent) !important;
    font-weight: 700 !important;
    font-size: 1.05rem !important;
    letter-spacing: -0.02em !important;
}

.swagger-ui .opblock-tag:hover {
    background: rgba(var(--primary-rgb), 0.06) !important;
}

.swagger-ui .opblock {
    border-radius: 1rem !important;
    border: 1px solid var(--border-color) !important;
    background: var(--card-bg) !important;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.12),
        0 0 0 1px rgba(var(--primary-rgb), 0.06) inset !important;
    margin-bottom: 0.85rem !important;
    overflow: hidden;
    transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
}

html[data-bs-theme="dark"] .swagger-ui .opblock {
    box-shadow:
        0 12px 40px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(var(--primary-rgb), 0.12) inset !important;
}

.swagger-ui .opblock:hover {
    border-color: rgba(var(--primary-rgb), 0.45) !important;
    box-shadow:
        0 12px 40px rgba(var(--primary-rgb), 0.12),
        0 0 0 1px rgba(var(--primary-rgb), 0.15) inset !important;
}

.swagger-ui .opblock .opblock-summary {
    border: none !important;
}

.swagger-ui .opblock .opblock-summary-method {
    border-radius: 0.45rem !important;
    font-weight: 800 !important;
    min-width: 4.75rem !important;
    text-align: center !important;
}

.swagger-ui .opblock.opblock-get .opblock-summary-method { background: var(--sw-get) !important; }
.swagger-ui .opblock.opblock-post .opblock-summary-method { background: var(--sw-post) !important; }
.swagger-ui .opblock.opblock-put .opblock-summary-method { background: var(--sw-put) !important; color: #0f172a !important; }
.swagger-ui .opblock.opblock-delete .opblock-summary-method { background: var(--sw-delete) !important; }
.swagger-ui .opblock.opblock-patch .opblock-summary-method { background: var(--sw-patch) !important; color: #0f172a !important; }

.swagger-ui .opblock .opblock-summary-path__description,
.swagger-ui .opblock .opblock-summary-path,
.swagger-ui .opblock .opblock-summary-description {
    color: var(--body-color) !important;
}

.swagger-ui .opblock .opblock-section-header {
    background: var(--bg-surface) !important;
    border-bottom: 1px solid var(--border-color) !important;
}

.swagger-ui .opblock .opblock-section-header h4,
.swagger-ui .opblock .opblock-section-header label {
    color: var(--body-color) !important;
}

.swagger-ui .opblock-body {
    background: var(--card-bg) !important;
}

.swagger-ui .opblock-description-wrapper,
.swagger-ui .opblock-body p,
.swagger-ui .opblock-body .response-col_status,
.swagger-ui table thead tr th,
.swagger-ui table tbody tr td {
    color: var(--body-color) !important;
}

.swagger-ui .parameter__name,
.swagger-ui .parameter__type,
.swagger-ui .prop-type {
    color: var(--accent) !important;
}

.swagger-ui input[type="text"],
.swagger-ui input[type="password"],
.swagger-ui input[type="search"],
.swagger-ui textarea,
.swagger-ui select {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--body-color) !important;
    border-radius: 0.55rem !important;
}

.swagger-ui .btn {
    border-radius: 0.55rem !important;
    font-weight: 600 !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.swagger-ui .btn.execute {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}

.swagger-ui .btn.execute:hover {
    filter: brightness(1.06);
    transform: translateY(-1px);
}

.swagger-ui .btn.cancel {
    background: transparent !important;
    border-color: var(--border-color) !important;
    color: var(--body-color) !important;
}

.swagger-ui .btn.authorize {
    background: rgba(255, 255, 255, 0.2) !important;
    border: 2px solid rgba(255, 255, 255, 0.35) !important;
    color: #fff !important;
    backdrop-filter: blur(8px) !important;
}

.swagger-ui .scheme-container .btn.authorize {
    background: rgba(var(--primary-rgb), 0.15) !important;
    border-color: var(--primary) !important;
    color: var(--primary) !important;
}

.swagger-ui .responses-inner h4,
.swagger-ui .responses-inner h5 {
    color: var(--body-color) !important;
}

.swagger-ui .response-col_links .response-undocumented {
    color: var(--secondary) !important;
}

.swagger-ui .highlight-code pre,
.swagger-ui .microlight,
.swagger-ui pre.microlight {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 0.55rem !important;
    color: var(--body-color) !important;
}

.swagger-ui .model-box,
.swagger-ui section.models {
    background: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 1rem !important;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1) !important;
}

html[data-bs-theme="dark"] .swagger-ui .model-box,
html[data-bs-theme="dark"] .swagger-ui section.models {
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.35) !important;
}

.swagger-ui section.models.is-open h4 {
    border-bottom: 1px solid var(--border-color) !important;
}

.swagger-ui .model-title,
.swagger-ui .model .property,
.swagger-ui .model .property-row {
    color: var(--body-color) !important;
}

.swagger-ui .dialog-ux {
    background: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 1rem !important;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.35) !important;
}

.swagger-ui .dialog-ux .modal-ux-header h3,
.swagger-ui .dialog-ux label {
    color: var(--body-color) !important;
}

.swagger-ui .version-stamp {
    color: var(--secondary) !important;
}

/* Errors / loading */
.swagger-ui .errors-wrapper {
    background: rgba(239, 68, 68, 0.1) !important;
    border: 1px solid rgba(239, 68, 68, 0.35) !important;
    border-radius: 0.75rem !important;
}

/* =============================================================================
   Theme toggle — glass chip like .theme-toggle-wrapper
   ============================================================================= */
#swagger-theme-toggle {
    position: fixed;
    bottom: 1.25rem;
    right: 1.25rem;
    z-index: 10000;
    padding: 0.6rem 1.1rem;
    border-radius: 2rem;
    border: 2px solid var(--sw-glass-border);
    background: var(--sw-glass-surface);
    color: var(--body-color);
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    cursor: pointer;
    backdrop-filter: blur(16px) saturate(1.2);
    -webkit-backdrop-filter: blur(16px) saturate(1.2);
    box-shadow:
        0 10px 36px rgba(0, 0, 0, 0.2),
        0 0 0 1px rgba(255, 255, 255, 0.06) inset;
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
}

#swagger-theme-toggle:hover {
    transform: translateY(-3px);
    border-color: var(--primary);
    color: var(--primary);
    box-shadow:
        0 14px 44px rgba(var(--primary-rgb), 0.25),
        0 0 0 1px rgba(var(--primary-rgb), 0.2) inset;
}

@media (prefers-reduced-motion: reduce) {
    .swagger-ui .topbar::after,
    .swagger-ui .topbar .swagger-vrilsoft-nav-glow,
    html[data-bs-theme="light"] body::before,
    html[data-bs-theme="dark"] body::before,
    .swagger-ui .information-container,
    .swagger-ui .scheme-container {
        animation: none !important;
    }

    #swagger-theme-toggle:hover {
        transform: none;
    }
}