/* ── SwapWizard Swagger UI Theme ─────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
  --sw-brand: #7C6CFF;
  --sw-brand-hover: #6B5BF0;
  --sw-bg: #14141e;
  --sw-surface: #1a1a2e;
  --sw-elevated: #222236;
  --sw-line: #2a2a40;
  --sw-ink: #e2e2f0;
  --sw-ink-secondary: #8888a0;
  --sw-ink-muted: #55556a;
  --sw-sidebar-w: 260px;
  --sw-header-h: 60px;
}

.light-mode {
  --sw-bg: #f5f5f8;
  --sw-surface: #ffffff;
  --sw-elevated: #f0f0f4;
  --sw-line: #e0e0e8;
  --sw-ink: #1a1a2e;
  --sw-ink-secondary: #666680;
  --sw-ink-muted: #9999aa;
}

/* ── Global reset ────────────────────────────────────────────────────────── */
html, body {
  margin: 0;
  padding: 0;
  background: var(--sw-bg) !important;
  color: var(--sw-ink) !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* ── BLANKET text color override for ALL swagger-ui elements ─────────────── */
.swagger-ui,
.swagger-ui * {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
.swagger-ui,
.swagger-ui div,
.swagger-ui span,
.swagger-ui p,
.swagger-ui a,
.swagger-ui li,
.swagger-ui td,
.swagger-ui th,
.swagger-ui h1, .swagger-ui h2, .swagger-ui h3,
.swagger-ui h4, .swagger-ui h5, .swagger-ui h6,
.swagger-ui label,
.swagger-ui small,
.swagger-ui pre,
.swagger-ui code {
  color: var(--sw-ink) !important;
}
.swagger-ui a { color: var(--sw-brand) !important; }
.swagger-ui .info .title small pre { background: var(--sw-elevated) !important; }

/* ── Hide default Swagger topbar ─────────────────────────────────────────── */
.swagger-ui .topbar { display: none !important; }

/* ── Shared buttons ─────────────────────────────────────────────────────── */
.sw-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  border: 1px solid var(--sw-line);
  font-family: 'Inter', sans-serif;
  line-height: 1.3;
}
.sw-btn-primary {
  background: var(--sw-brand) !important;
  border-color: var(--sw-brand) !important;
  color: #fff !important;
}
.sw-btn-primary:hover { background: var(--sw-brand-hover) !important; }
.sw-btn-primary svg { stroke: #fff; }
.sw-btn-secondary {
  background: var(--sw-elevated) !important;
  color: var(--sw-ink) !important;
}
.sw-btn-secondary:hover { background: var(--sw-line) !important; }
.sw-btn-sm {
  padding: 4px 12px;
  font-size: 12px;
  border-radius: 6px;
  background: var(--sw-elevated);
  border: 1px solid var(--sw-line);
  color: var(--sw-ink) !important;
  cursor: pointer;
  font-weight: 500;
  transition: background 0.2s;
  font-family: 'Inter', sans-serif;
}
.sw-btn-sm:hover { background: var(--sw-line); }
.sw-btn-icon {
  background: none;
  border: none;
  color: var(--sw-ink-secondary) !important;
  cursor: pointer;
  padding: 2px 4px;
  font-size: 13px;
  transition: color 0.2s;
  line-height: 1;
}
.sw-btn-icon:hover { color: var(--sw-ink) !important; }

/* ── Wallet pill (header) ───────────────────────────────────────────────── */
.sw-wallet-pill {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--sw-elevated);
  border: 1px solid var(--sw-line);
  border-radius: 10px;
  padding: 6px 8px 6px 12px;
}
.sw-wallet-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22c55e;
  flex-shrink: 0;
}
.sw-wallet-addr {
  font-family: 'Menlo', 'Consolas', monospace;
  font-size: 12px;
  color: var(--sw-ink) !important;
}

/* ── API Key panel ──────────────────────────────────────────────────────── */
#sw-apikey-panel {
  margin-top: var(--sw-header-h);
  margin-left: var(--sw-sidebar-w);
  padding: 20px 32px 0;
  background: var(--sw-bg);
}
.sw-ak-header .sw-ak-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--sw-ink) !important;
  margin: 0 0 4px;
}
.sw-ak-header p {
  font-size: 13px;
  color: var(--sw-ink-secondary) !important;
  margin: 0 0 16px;
}

.sw-ak-state {
  background: var(--sw-surface);
  border: 1px solid var(--sw-line);
  border-radius: 12px;
  padding: 24px;
  text-align: center;
}
.sw-ak-state .sw-ak-icon { font-size: 28px; margin-bottom: 10px; }
.sw-ak-state p {
  font-size: 14px;
  color: var(--sw-ink-secondary) !important;
  margin: 0 0 16px;
}
.sw-ak-state a { color: var(--sw-brand) !important; text-decoration: underline; }

.sw-ak-result {
  background: var(--sw-surface);
  border: 1px solid var(--sw-line);
  border-radius: 12px;
  padding: 20px;
}
.sw-ak-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--sw-ink) !important;
  margin-bottom: 8px;
}
.sw-ak-ok { color: #22c55e !important; font-weight: 500; margin-left: 6px; }
.sw-ak-keybox {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--sw-bg);
  border: 1px solid var(--sw-line);
  border-radius: 8px;
  padding: 10px 14px;
  margin-bottom: 8px;
}
.sw-ak-keybox code {
  flex: 1;
  overflow-x: auto;
  white-space: nowrap;
  font-family: 'Menlo', 'Consolas', monospace;
  font-size: 13px;
  color: var(--sw-ink) !important;
}
.sw-ak-hint {
  font-size: 12px;
  color: var(--sw-ink-muted) !important;
  margin: 0 0 12px;
}

.sw-spinner {
  width: 28px;
  height: 28px;
  border: 2px solid var(--sw-line);
  border-top-color: var(--sw-brand);
  border-radius: 50%;
  animation: sw-spin 0.8s linear infinite;
  margin: 0 auto 12px;
}
@keyframes sw-spin { to { transform: rotate(360deg); } }

/* ── Custom header ───────────────────────────────────────────────────────── */
#sw-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  height: var(--sw-header-h);
  background: var(--sw-surface);
  border-bottom: 1px solid var(--sw-line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 24px;
}
#sw-header .sw-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none !important;
}
#sw-header .sw-logo-text {
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
#sw-header .sw-logo-text .swap { color: var(--sw-ink) !important; }
#sw-header .sw-logo-text .wizard {
  background: linear-gradient(90deg, #e040a0, #9b59b6, #38bdf8);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
#sw-header .sw-subtitle {
  font-size: 11px;
  color: var(--sw-ink-secondary) !important;
  margin-top: -2px;
}
#sw-header .sw-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}
#sw-theme-toggle {
  background: var(--sw-elevated);
  border: 1px solid var(--sw-line);
  border-radius: 8px;
  padding: 6px 10px;
  color: var(--sw-ink);
  cursor: pointer;
  font-size: 16px;
  transition: background 0.2s;
  line-height: 1;
}
#sw-theme-toggle:hover { background: var(--sw-line); }
#sw-header .sw-version {
  font-size: 11px;
  color: var(--sw-ink-secondary) !important;
  background: var(--sw-elevated);
  border: 1px solid var(--sw-line);
  border-radius: 6px;
  padding: 4px 8px;
}

/* ── Sidebar ─────────────────────────────────────────────────────────────── */
#sw-sidebar {
  position: fixed;
  top: var(--sw-header-h);
  left: 0;
  bottom: 0;
  width: var(--sw-sidebar-w);
  background: var(--sw-surface);
  border-right: 1px solid var(--sw-line);
  overflow-y: auto;
  z-index: 90;
  padding: 16px 0;
}
#sw-sidebar::-webkit-scrollbar { width: 4px; }
#sw-sidebar::-webkit-scrollbar-thumb { background: var(--sw-line); border-radius: 4px; }

#sw-sidebar .sw-nav-fixed {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 500;
  color: var(--sw-ink) !important;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
  border-left: 2px solid transparent;
}
#sw-sidebar .sw-nav-fixed:hover { background: var(--sw-elevated); }
#sw-sidebar .sw-nav-fixed.active {
  background: rgba(124, 108, 255, 0.1);
  border-left-color: var(--sw-brand);
  color: var(--sw-brand) !important;
}
#sw-sidebar .sw-nav-sep {
  height: 1px;
  background: var(--sw-line);
  margin: 8px 16px;
}

#sw-sidebar .sw-nav-group { margin-bottom: 8px; }
#sw-sidebar .sw-nav-tag {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 16px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--sw-ink-secondary) !important;
  cursor: pointer;
  user-select: none;
  transition: color 0.15s;
}
#sw-sidebar .sw-nav-tag:hover { color: var(--sw-ink) !important; }
#sw-sidebar .sw-nav-tag .arrow {
  transition: transform 0.2s;
  font-size: 10px;
}
#sw-sidebar .sw-nav-tag.collapsed .arrow { transform: rotate(-90deg); }

#sw-sidebar .sw-nav-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 16px 6px 24px;
  font-size: 13px;
  color: var(--sw-ink) !important;
  text-decoration: none !important;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
  border-left: 2px solid transparent;
}
#sw-sidebar .sw-nav-item:hover { background: var(--sw-elevated); }
#sw-sidebar .sw-nav-item.active {
  background: rgba(124, 108, 255, 0.1);
  border-left-color: var(--sw-brand);
  color: var(--sw-brand) !important;
  font-weight: 500;
}
#sw-sidebar .sw-method-badge {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 4px;
  min-width: 36px;
  text-align: center;
  flex-shrink: 0;
}
#sw-sidebar .sw-method-badge.get { background: rgba(56,189,248,0.15); color: #38bdf8 !important; }
#sw-sidebar .sw-method-badge.post { background: rgba(34,197,94,0.15); color: #22c55e !important; }
#sw-sidebar .sw-method-badge.put { background: rgba(245,165,36,0.15); color: #f5a524 !important; }
#sw-sidebar .sw-method-badge.delete { background: rgba(242,54,69,0.15); color: #f23645 !important; }
#sw-sidebar .sw-method-badge.patch { background: rgba(157,78,221,0.15); color: #9d4edd !important; }

/* ── Main content area — layout on #swagger-ui (id), not .swagger-ui (class) */
#swagger-ui {
  margin-top: var(--sw-header-h) !important;
  margin-left: var(--sw-sidebar-w) !important;
  padding: 20px 32px !important;
  max-width: none !important;
  box-sizing: border-box !important;
  background: var(--sw-bg) !important;
}
#sw-apikey-panel ~ #swagger-ui {
  margin-top: 0 !important;
}

.swagger-ui .wrapper {
  max-width: none !important;
  padding: 0 !important;
  background: transparent !important;
}

/* ── Scheme container (Authorize bar) ────────────────────────────────────── */
.swagger-ui .scheme-container {
  background: var(--sw-surface) !important;
  border: 1px solid var(--sw-line) !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  box-shadow: none !important;
}
.sw-key-active .swagger-ui .scheme-container {
  display: none !important;
}

/* ── Opblock styles ──────────────────────────────────────────────────────── */
.swagger-ui .opblock {
  border-radius: 8px !important;
  border: 1px solid var(--sw-line) !important;
  background: var(--sw-surface) !important;
  box-shadow: none !important;
  margin-bottom: 12px !important;
}
.swagger-ui .opblock .opblock-summary {
  border: none !important;
  padding: 10px 16px !important;
}
.swagger-ui .opblock.opblock-get {
  border-color: rgba(56,189,248,0.3) !important;
  background: var(--sw-surface) !important;
}
.swagger-ui .opblock.opblock-get .opblock-summary { background: rgba(56,189,248,0.06) !important; }
.swagger-ui .opblock.opblock-post {
  border-color: rgba(34,197,94,0.3) !important;
  background: var(--sw-surface) !important;
}
.swagger-ui .opblock.opblock-post .opblock-summary { background: rgba(34,197,94,0.06) !important; }
.swagger-ui .opblock.opblock-put {
  border-color: rgba(245,165,36,0.3) !important;
  background: var(--sw-surface) !important;
}
.swagger-ui .opblock.opblock-put .opblock-summary { background: rgba(245,165,36,0.06) !important; }
.swagger-ui .opblock.opblock-delete {
  border-color: rgba(242,54,69,0.3) !important;
  background: var(--sw-surface) !important;
}
.swagger-ui .opblock.opblock-delete .opblock-summary { background: rgba(242,54,69,0.06) !important; }

.swagger-ui .opblock-body {
  background: var(--sw-surface) !important;
}
.swagger-ui .opblock .opblock-section-header {
  background: var(--sw-elevated) !important;
  border-color: var(--sw-line) !important;
}

/* ── Tag headers ─────────────────────────────────────────────────────────── */
.swagger-ui .opblock-tag {
  border-bottom: 1px solid var(--sw-line) !important;
}
.swagger-ui .opblock-tag small { color: var(--sw-ink-secondary) !important; }

/* ── Method badges keep their colors ─────────────────────────────────────── */
.swagger-ui .opblock .opblock-summary-method {
  border-radius: 4px !important;
}

/* ── Tables ──────────────────────────────────────────────────────────────── */
.swagger-ui table { background: transparent !important; }
.swagger-ui table thead tr th {
  background: var(--sw-elevated) !important;
  border-color: var(--sw-line) !important;
}
.swagger-ui table tbody tr td {
  border-color: var(--sw-line) !important;
}
.swagger-ui .parameters-col_description input,
.swagger-ui .parameters-col_description textarea,
.swagger-ui .parameters-col_description select,
.swagger-ui input[type="text"],
.swagger-ui input[type="password"],
.swagger-ui input[type="search"],
.swagger-ui input[type="email"],
.swagger-ui input[type="file"],
.swagger-ui textarea,
.swagger-ui select {
  background: var(--sw-bg) !important;
  border: 1px solid var(--sw-line) !important;
  color: var(--sw-ink) !important;
  border-radius: 6px !important;
}
.swagger-ui .parameter__name.required::after { color: #f23645 !important; }

/* ── Models section ──────────────────────────────────────────────────────── */
.swagger-ui .model-box {
  background: var(--sw-surface) !important;
  border-color: var(--sw-line) !important;
}
.swagger-ui section.models {
  border: 1px solid var(--sw-line) !important;
  border-radius: 8px !important;
  background: var(--sw-surface) !important;
}
.swagger-ui section.models.is-open h4 {
  border-color: var(--sw-line) !important;
}
.swagger-ui .model {
  color: var(--sw-ink) !important;
}
.swagger-ui .model-toggle::after {
  background: none !important;
}
.swagger-ui .prop-type { color: var(--sw-brand) !important; }
.swagger-ui .prop-format { color: var(--sw-ink-secondary) !important; }
.swagger-ui .parameter__name.required span {
  color: #f23645 !important;
}
.swagger-ui .parameter__name {
  font-weight: 600 !important;
  color: var(--sw-ink) !important;
}
.swagger-ui .parameter__type {
  color: var(--sw-brand) !important;
  font-size: 12px !important;
}
.swagger-ui .parameter__in {
  color: var(--sw-ink-muted) !important;
  font-size: 11px !important;
}
.swagger-ui table.parameters th {
  color: var(--sw-ink-secondary) !important;
  font-weight: 600 !important;
}
.swagger-ui .opblock-description-wrapper p,
.swagger-ui .opblock-external-docs-wrapper p {
  color: var(--sw-ink-secondary) !important;
}
.swagger-ui .body-param__text {
  background: var(--sw-bg) !important;
  color: var(--sw-ink) !important;
  border: 1px solid var(--sw-line) !important;
  border-radius: 6px !important;
  min-height: 200px !important;
}
.swagger-ui .model-box-control:focus,
.swagger-ui .models-control:focus {
  outline: 1px solid var(--sw-brand) !important;
}

/* ── Response body / code blocks ─────────────────────────────────────────── */
.swagger-ui .highlight-code,
.swagger-ui .microlight,
.swagger-ui pre {
  background: var(--sw-bg) !important;
  border-radius: 6px !important;
  color: var(--sw-ink) !important;
}
.swagger-ui .microlight span { color: #38bdf8 !important; }

/* ── Response status ─────────────────────────────────────────────────────── */
.swagger-ui .responses-inner { background: transparent !important; }
.swagger-ui .response-col_status { color: var(--sw-ink) !important; }
.swagger-ui .response-col_links { color: var(--sw-ink-secondary) !important; }

/* ── Tab headers ─────────────────────────────────────────────────────────── */
.swagger-ui .tab li {
  color: var(--sw-ink-secondary) !important;
}
.swagger-ui .tab li.active {
  color: var(--sw-ink) !important;
}
.swagger-ui .tab li::after {
  background: var(--sw-brand) !important;
}

/* ── Buttons ─────────────────────────────────────────────────────────────── */
.swagger-ui .btn {
  border-radius: 6px !important;
  color: var(--sw-ink) !important;
  border-color: var(--sw-line) !important;
}
.swagger-ui .btn.execute {
  background: var(--sw-brand) !important;
  border-color: var(--sw-brand) !important;
  color: #fff !important;
}
.swagger-ui .btn.execute:hover {
  background: var(--sw-brand-hover) !important;
}
.swagger-ui .btn.authorize {
  color: var(--sw-brand) !important;
  border-color: var(--sw-brand) !important;
}
.swagger-ui .btn.authorize svg { fill: var(--sw-brand) !important; }
.swagger-ui .btn.cancel { color: #f23645 !important; border-color: #f23645 !important; }

/* ── Copy to clipboard ───────────────────────────────────────────────────── */
.swagger-ui .copy-to-clipboard { background: var(--sw-elevated) !important; }
.swagger-ui .copy-to-clipboard button { background: transparent !important; }

/* ── Authorization modal ─────────────────────────────────────────────────── */
.swagger-ui .dialog-ux .modal-ux {
  background: var(--sw-surface) !important;
  border: 1px solid var(--sw-line) !important;
  border-radius: 12px !important;
}
.swagger-ui .dialog-ux .modal-ux-header {
  border-color: var(--sw-line) !important;
}
.swagger-ui .dialog-ux .modal-ux-content input {
  background: var(--sw-bg) !important;
  border-color: var(--sw-line) !important;
  color: var(--sw-ink) !important;
  border-radius: 6px !important;
}
.swagger-ui .dialog-ux .backdrop-ux {
  background: rgba(0,0,0,0.6) !important;
}

/* ── Hide filter (sidebar handles navigation) ────────────────────────────── */
.swagger-ui .filter-container { display: none !important; }

/* ── Info section spacing ────────────────────────────────────────────────── */
.swagger-ui .info { margin: 0 0 24px 0 !important; }
.swagger-ui .info hgroup.main { margin: 0 !important; }

/* ── Markdown content in descriptions ────────────────────────────────────── */
.swagger-ui .markdown p,
.swagger-ui .markdown li,
.swagger-ui .renderedMarkdown p,
.swagger-ui .renderedMarkdown li { color: var(--sw-ink) !important; }
.swagger-ui .markdown a,
.swagger-ui .renderedMarkdown a { color: var(--sw-brand) !important; }
.swagger-ui .markdown code,
.swagger-ui .renderedMarkdown code {
  background: var(--sw-elevated) !important;
  color: var(--sw-ink) !important;
  padding: 2px 6px;
  border-radius: 4px;
}
.swagger-ui .markdown table,
.swagger-ui .renderedMarkdown table {
  border-collapse: collapse;
}
.swagger-ui .markdown table th,
.swagger-ui .markdown table td,
.swagger-ui .renderedMarkdown table th,
.swagger-ui .renderedMarkdown table td {
  border: 1px solid var(--sw-line) !important;
  padding: 6px 12px;
}
.swagger-ui .markdown table th,
.swagger-ui .renderedMarkdown table th {
  background: var(--sw-elevated) !important;
}
.swagger-ui .markdown h2,
.swagger-ui .renderedMarkdown h2 {
  border-bottom: 1px solid var(--sw-line) !important;
  padding-bottom: 8px;
}

/* ── SVG icons ───────────────────────────────────────────────────────────── */
.swagger-ui svg:not(.sw-logo svg) { fill: var(--sw-ink) !important; }
.swagger-ui .locked svg { fill: var(--sw-brand) !important; }
.swagger-ui .unlocked svg { fill: var(--sw-ink-secondary) !important; }
.swagger-ui .arrow svg { fill: var(--sw-ink-secondary) !important; }

/* ── Loading ─────────────────────────────────────────────────────────────── */
.swagger-ui .loading-container { background: var(--sw-bg) !important; }

/* ── Scrollbar ───────────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--sw-line); border-radius: 4px; }

/* ── Integration guide ──────────────────────────────────────────────────── */
#sw-integration-guide {
  margin-left: var(--sw-sidebar-w);
  padding: 24px 32px;
  background: var(--sw-bg);
}
.sw-ig-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--sw-ink) !important;
  margin: 0 0 24px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--sw-line);
}
.sw-ig-section {
  margin-bottom: 32px;
}
.sw-ig-subtitle {
  font-size: 17px;
  font-weight: 600;
  color: var(--sw-ink) !important;
  margin: 0 0 12px;
}
.sw-ig-section p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--sw-ink-secondary) !important;
  margin: 0 0 12px;
}
.sw-ig-section strong {
  color: var(--sw-ink) !important;
}
.sw-ig-section code {
  background: var(--sw-elevated);
  color: var(--sw-brand) !important;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 13px;
  font-family: 'Menlo', 'Consolas', monospace;
}
.sw-ig-section ol,
.sw-ig-section ul {
  padding-left: 20px;
  margin: 0 0 12px;
}
.sw-ig-section li {
  font-size: 14px;
  line-height: 1.6;
  color: var(--sw-ink-secondary) !important;
  margin-bottom: 6px;
}
.sw-ig-section li strong {
  color: var(--sw-ink) !important;
}

.sw-ig-card {
  background: var(--sw-surface);
  border: 1px solid var(--sw-line);
  border-radius: 12px;
  padding: 20px;
  margin: 16px 0;
}
.sw-ig-card h4 {
  font-size: 14px;
  font-weight: 600;
  color: var(--sw-ink) !important;
  margin: 0 0 10px;
}
.sw-ig-highlight {
  border-color: var(--sw-brand);
  background: rgba(124, 108, 255, 0.04);
}
.sw-ig-card pre {
  background: var(--sw-bg) !important;
  border: 1px solid var(--sw-line);
  border-radius: 8px;
  padding: 14px;
  margin: 10px 0;
  overflow-x: auto;
}
.sw-ig-card pre code {
  font-family: 'Menlo', 'Consolas', monospace !important;
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--sw-ink) !important;
  background: transparent !important;
  padding: 0 !important;
}

.sw-ig-cta {
  background: var(--sw-surface);
  border: 1px solid var(--sw-line);
  border-radius: 12px;
  padding: 16px 24px;
  text-align: center;
  font-size: 14px;
  color: var(--sw-ink-secondary) !important;
}
.sw-ig-cta a {
  color: var(--sw-brand) !important;
  font-weight: 600;
  text-decoration: none;
}
.sw-ig-cta a:hover { text-decoration: underline; }

.sw-ig-flow-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--sw-ink) !important;
  margin: 24px 0 12px;
}
.sw-ig-diagram {
  background: var(--sw-surface);
  border: 1px solid var(--sw-line);
  border-radius: 12px;
  padding: 16px;
  overflow-x: auto;
  margin-bottom: 16px;
}
.sw-ig-diagram svg {
  width: 100%;
  height: auto;
  min-width: 600px;
}
.sw-ig-diagram svg text {
  font-family: 'Inter', sans-serif !important;
}
.light-mode .sw-ig-diagram svg rect {
  fill: #f0f0f4;
}
.light-mode .sw-ig-diagram svg text[fill="#e2e2f0"] {
  fill: #1a1a2e;
}
.light-mode .sw-ig-diagram svg text[fill="#8888a0"] {
  fill: #666680;
}
.light-mode .sw-ig-diagram svg line {
  stroke: #9b8aff;
}
.light-mode .sw-ig-diagram svg polygon {
  fill: #9b8aff;
}

/* Code tabs */
.sw-ig-tabs {
  display: flex;
  gap: 4px;
  margin: 16px 0 0;
  border-bottom: 1px solid var(--sw-line);
  padding-bottom: 0;
}
.sw-ig-tab {
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 500;
  color: var(--sw-ink-secondary) !important;
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  transition: color 0.15s, border-color 0.15s;
}
.sw-ig-tab:hover { color: var(--sw-ink) !important; }
.sw-ig-tab.active {
  color: var(--sw-brand) !important;
  border-bottom-color: var(--sw-brand);
}
.sw-ig-code {
  margin-bottom: 16px;
}
.sw-ig-code pre {
  background: var(--sw-surface) !important;
  border: 1px solid var(--sw-line);
  border-top: none;
  border-radius: 0 0 8px 8px;
  padding: 16px;
  margin: 0;
  overflow-x: auto;
}
.sw-ig-code code {
  font-family: 'Menlo', 'Consolas', monospace !important;
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--sw-ink) !important;
  background: transparent !important;
  padding: 0 !important;
}

/* Sidebar sub-items */
#sw-sidebar .sw-nav-sub {
  padding-left: 32px;
  font-size: 12px;
  color: var(--sw-ink-secondary) !important;
}

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  #sw-sidebar { display: none; }
  .swagger-ui { margin-left: 0 !important; padding: 16px !important; }
  #sw-apikey-panel { margin-left: 0 !important; padding: 16px !important; }
  #sw-integration-guide { margin-left: 0 !important; padding: 16px !important; }
  #sw-header .sw-actions { gap: 8px; }
}