/* ─── SPECTRA dark theme for TiTiler Swagger UI ───────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@700;900&family=DM+Sans:wght@300;400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --spectra-bg:       #04080f;
  --spectra-surface:  #080f1a;
  --spectra-card:     rgba(0, 229, 255, 0.04);
  --spectra-border:   rgba(0, 229, 255, 0.12);
  --spectra-cyan:     #00e5ff;
  --spectra-violet:   #7c4dff;
  --spectra-text:     #c8dce8;
  --spectra-muted:    #4a6070;
  --spectra-get:      rgba(0, 229, 255, 0.08);
  --spectra-get-b:    #00e5ff;
  --spectra-post:     rgba(124, 77, 255, 0.12);
  --spectra-post-b:   #7c4dff;
  --spectra-delete:   rgba(255, 69, 100, 0.10);
  --spectra-delete-b: #ff4564;
  --spectra-put:      rgba(255, 166, 0, 0.10);
  --spectra-put-b:    #ffa600;
}

/* ── Base ───────────────────────────────────────────────────────────────────── */
body, .swagger-ui {
  background: var(--spectra-bg) !important;
  color: var(--spectra-text) !important;
  font-family: 'DM Sans', sans-serif !important;
}

/* ── Top bar ────────────────────────────────────────────────────────────────── */
.swagger-ui .topbar {
  background: var(--spectra-surface) !important;
  border-bottom: 1px solid var(--spectra-border) !important;
  padding: 10px 0 !important;
}
.swagger-ui .topbar .download-url-wrapper input[type=text] {
  background: rgba(0,229,255,0.05) !important;
  border: 1px solid var(--spectra-border) !important;
  color: var(--spectra-cyan) !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 12px !important;
  border-radius: 4px !important;
}
.swagger-ui .topbar .download-url-wrapper .download-url-button {
  background: var(--spectra-cyan) !important;
  color: var(--spectra-bg) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 600 !important;
  border-radius: 4px !important;
}
.swagger-ui .topbar-wrapper img { display: none !important; }
.swagger-ui .topbar-wrapper::before {
  content: 'SPECTRA · TiTiler API';
  font-family: 'Orbitron', sans-serif !important;
  font-weight: 700;
  font-size: 15px;
  color: var(--spectra-cyan);
  text-shadow: 0 0 12px rgba(0,229,255,0.5);
  letter-spacing: 0.1em;
  margin-left: 16px;
}

/* ── Info block ─────────────────────────────────────────────────────────────── */
.swagger-ui .info {
  background: var(--spectra-card) !important;
  border: 1px solid var(--spectra-border) !important;
  border-radius: 8px !important;
  padding: 24px 28px !important;
  margin-bottom: 24px !important;
  backdrop-filter: blur(8px) !important;
}
.swagger-ui .info .title {
  font-family: 'Orbitron', sans-serif !important;
  font-weight: 700 !important;
  color: var(--spectra-cyan) !important;
  text-shadow: 0 0 20px rgba(0,229,255,0.3) !important;
  font-size: 28px !important;
  letter-spacing: 0.05em !important;
}
.swagger-ui .info .base-url {
  color: var(--spectra-muted) !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 12px !important;
}
.swagger-ui .info a { color: var(--spectra-cyan) !important; }
.swagger-ui .info p,
.swagger-ui .info li { color: var(--spectra-text) !important; }

/* ── Scheme container ───────────────────────────────────────────────────────── */
.swagger-ui .scheme-container {
  background: var(--spectra-surface) !important;
  border: 1px solid var(--spectra-border) !important;
  border-radius: 6px !important;
  padding: 16px 20px !important;
  box-shadow: none !important;
}
.swagger-ui .scheme-container .schemes > label {
  color: var(--spectra-muted) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}

/* ── Tag / section headers ──────────────────────────────────────────────────── */
.swagger-ui .opblock-tag {
  border-bottom: 1px solid var(--spectra-border) !important;
  color: var(--spectra-cyan) !important;
  font-family: 'Orbitron', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
}
.swagger-ui .opblock-tag:hover {
  background: rgba(0,229,255,0.04) !important;
}
.swagger-ui .opblock-tag small {
  color: var(--spectra-muted) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 12px !important;
}

/* ── Operation blocks ───────────────────────────────────────────────────────── */
.swagger-ui .opblock {
  border-radius: 6px !important;
  margin: 6px 0 !important;
  border: 1px solid var(--spectra-border) !important;
  background: var(--spectra-card) !important;
  backdrop-filter: blur(6px) !important;
  box-shadow: none !important;
}
.swagger-ui .opblock .opblock-summary {
  border: none !important;
}
.swagger-ui .opblock.opblock-get {
  background: var(--spectra-get) !important;
  border-color: rgba(0,229,255,0.2) !important;
}
.swagger-ui .opblock.opblock-get .opblock-summary-method {
  background: var(--spectra-get-b) !important;
  color: var(--spectra-bg) !important;
}
.swagger-ui .opblock.opblock-post {
  background: var(--spectra-post) !important;
  border-color: rgba(124,77,255,0.25) !important;
}
.swagger-ui .opblock.opblock-post .opblock-summary-method {
  background: var(--spectra-post-b) !important;
  color: #fff !important;
}
.swagger-ui .opblock.opblock-delete {
  background: var(--spectra-delete) !important;
  border-color: rgba(255,69,100,0.2) !important;
}
.swagger-ui .opblock.opblock-delete .opblock-summary-method {
  background: var(--spectra-delete-b) !important;
  color: #fff !important;
}
.swagger-ui .opblock.opblock-put {
  background: var(--spectra-put) !important;
  border-color: rgba(255,166,0,0.2) !important;
}
.swagger-ui .opblock.opblock-put .opblock-summary-method {
  background: var(--spectra-put-b) !important;
  color: var(--spectra-bg) !important;
}
.swagger-ui .opblock-summary-method {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  border-radius: 4px !important;
  min-width: 72px !important;
}
.swagger-ui .opblock-summary-path,
.swagger-ui .opblock-summary-path__deprecated {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 13px !important;
  color: var(--spectra-text) !important;
}
.swagger-ui .opblock-summary-description {
  color: var(--spectra-muted) !important;
  font-size: 13px !important;
}
.swagger-ui .opblock-body {
  background: rgba(4,8,15,0.6) !important;
  border-top: 1px solid var(--spectra-border) !important;
}

/* ── Parameters & responses ─────────────────────────────────────────────────── */
.swagger-ui .parameters-col_description,
.swagger-ui .parameters-col_name,
.swagger-ui table.parameters td,
.swagger-ui table.parameters th {
  color: var(--spectra-text) !important;
  border-color: var(--spectra-border) !important;
  font-family: 'DM Sans', sans-serif !important;
}
.swagger-ui .parameter__name {
  font-family: 'JetBrains Mono', monospace !important;
  color: var(--spectra-cyan) !important;
  font-size: 13px !important;
}
.swagger-ui .parameter__type {
  font-family: 'JetBrains Mono', monospace !important;
  color: var(--spectra-violet) !important;
  font-size: 11px !important;
}
.swagger-ui .parameter__in {
  color: var(--spectra-muted) !important;
  font-size: 11px !important;
}
.swagger-ui table thead tr td,
.swagger-ui table thead tr th {
  background: rgba(0,229,255,0.06) !important;
  border-color: var(--spectra-border) !important;
  color: var(--spectra-cyan) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
}

/* ── Responses ──────────────────────────────────────────────────────────────── */
.swagger-ui .responses-inner h4,
.swagger-ui .responses-inner h5 {
  color: var(--spectra-text) !important;
  font-family: 'DM Sans', sans-serif !important;
}
.swagger-ui .response-col_status {
  font-family: 'JetBrains Mono', monospace !important;
  color: var(--spectra-cyan) !important;
}
.swagger-ui .response-col_description {
  color: var(--spectra-text) !important;
}

/* ── Code / pre / microlight ────────────────────────────────────────────────── */
.swagger-ui .microlight,
.swagger-ui pre.microlight,
.swagger-ui .highlight-code pre,
.swagger-ui .model-box,
.swagger-ui .example {
  background: rgba(0,229,255,0.04) !important;
  border: 1px solid var(--spectra-border) !important;
  border-radius: 4px !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 12px !important;
  color: var(--spectra-text) !important;
}
.swagger-ui .microlight .string { color: #a8ff78 !important; }
.swagger-ui .microlight .number { color: var(--spectra-cyan) !important; }
.swagger-ui .microlight .keyword { color: var(--spectra-violet) !important; }
.swagger-ui .microlight .primitive { color: #ffa600 !important; }

/* ── Inputs & select ────────────────────────────────────────────────────────── */
.swagger-ui input[type=text],
.swagger-ui input[type=password],
.swagger-ui input[type=search],
.swagger-ui input[type=email],
.swagger-ui textarea,
.swagger-ui select {
  background: rgba(0,229,255,0.05) !important;
  border: 1px solid var(--spectra-border) !important;
  color: var(--spectra-text) !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 12px !important;
  border-radius: 4px !important;
}
.swagger-ui input[type=text]:focus,
.swagger-ui textarea:focus {
  border-color: var(--spectra-cyan) !important;
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(0,229,255,0.15) !important;
}

/* ── Buttons ────────────────────────────────────────────────────────────────── */
.swagger-ui .btn {
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 600 !important;
  border-radius: 4px !important;
  font-size: 13px !important;
  letter-spacing: 0.03em !important;
}
.swagger-ui .btn.execute {
  background: var(--spectra-cyan) !important;
  color: var(--spectra-bg) !important;
  border-color: var(--spectra-cyan) !important;
}
.swagger-ui .btn.execute:hover {
  background: #33ecff !important;
  box-shadow: 0 0 12px rgba(0,229,255,0.35) !important;
}
.swagger-ui .btn.cancel {
  background: transparent !important;
  border-color: var(--spectra-muted) !important;
  color: var(--spectra-muted) !important;
}
.swagger-ui .btn.authorize {
  background: rgba(124,77,255,0.15) !important;
  border-color: var(--spectra-violet) !important;
  color: var(--spectra-violet) !important;
}
.swagger-ui .btn.authorize svg { fill: var(--spectra-violet) !important; }
.swagger-ui .try-out__btn {
  border-color: var(--spectra-cyan) !important;
  color: var(--spectra-cyan) !important;
}

/* ── Model / schema ─────────────────────────────────────────────────────────── */
.swagger-ui section.models {
  background: var(--spectra-card) !important;
  border: 1px solid var(--spectra-border) !important;
  border-radius: 8px !important;
}
.swagger-ui section.models h4 {
  color: var(--spectra-cyan) !important;
  font-family: 'Orbitron', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  border-bottom: 1px solid var(--spectra-border) !important;
}
.swagger-ui .model-title {
  font-family: 'JetBrains Mono', monospace !important;
  color: var(--spectra-cyan) !important;
}
.swagger-ui .model {
  color: var(--spectra-text) !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 12px !important;
}
.swagger-ui .model .property.primitive { color: var(--spectra-violet) !important; }
.swagger-ui .model span.prop-name { color: var(--spectra-text) !important; }
.swagger-ui .model span.prop-type { color: var(--spectra-cyan) !important; }
.swagger-ui .model-toggle:after {
  background: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10'><path fill='%2300e5ff' d='M0 0 L10 5 L0 10z'/></svg>") no-repeat !important;
}

/* ── Expand/collapse arrows ─────────────────────────────────────────────────── */
.swagger-ui .arrow { fill: var(--spectra-cyan) !important; }

/* ── Labels & required markers ──────────────────────────────────────────────── */
.swagger-ui label {
  color: var(--spectra-text) !important;
  font-family: 'DM Sans', sans-serif !important;
}
.swagger-ui .parameter__name.required::after {
  color: #ff4564 !important;
}

/* ── Response status codes ──────────────────────────────────────────────────── */
.swagger-ui .responses-table .response-col_status {
  color: var(--spectra-cyan) !important;
}

/* ── Links ──────────────────────────────────────────────────────────────────── */
.swagger-ui a { color: var(--spectra-cyan) !important; }
.swagger-ui a:hover { color: #33ecff !important; text-decoration: none !important; }

/* ── Dividers & misc ────────────────────────────────────────────────────────── */
.swagger-ui .wrapper { padding: 0 20px !important; }
.swagger-ui hr { border-color: var(--spectra-border) !important; }
.swagger-ui svg { fill: currentColor !important; }
.swagger-ui h1, .swagger-ui h2, .swagger-ui h3, .swagger-ui h4, .swagger-ui h5 {
  color: var(--spectra-text) !important;
  font-family: 'DM Sans', sans-serif !important;
}

/* ── Scrollbar ──────────────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--spectra-bg); }
::-webkit-scrollbar-thumb {
  background: var(--spectra-border);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover { background: var(--spectra-cyan); }