/* Partial hyperhive reskin for the vendored Swagger UI at /api/docs —
   the operator asked for this as a follow-up to the OpenAPI/Swagger-UI
   docs work. Scope is deliberately bounded per her steer ("its not
   about making it completely vibec0re, apply theme colors only"):
   recolor the page chrome (background, topbar, borders, links,
   headings, inputs) to match the rest of the dashboard; leave Swagger's
   own semantic HTTP-method colours (GET/POST/PUT/DELETE badges) and the
   execute/cancel action-button colours alone — those carry real meaning
   to anyone who already knows Swagger UI, not just hyperhive branding.

   Loaded after swagger-ui.css (see index.html) so these rules win the
   cascade on shared selectors without `!important`; only reaching for
   `!important` where Swagger's own CSS is more specific than a same-
   specificity override can beat (documented per-rule below).

   Follows stylix live, same as every other dashboard page: index.html
   links the dashboard's own themed `colors.css` (served from
   `/static/`, same origin) directly ahead of this file, so the
   `--baseNN` custom properties below resolve to whatever the operator's
   current stylix scheme actually is — no hardcoded hex, nothing to
   drift out of sync when the theme changes. See
   frontend/packages/shared/src/colors.css for the base16 contract. */

/* Page chrome */
html,
body {
  background: var(--base00);
}
.swagger-ui {
  color: var(--base05);
  font-family: "JetBrains Mono", "Fira Code", "Cascadia Code",
    "Source Code Pro", monospace;
}

/* Topbar — replaces Swagger's default green bar. */
.swagger-ui .topbar {
  background: var(--base01);
  border-bottom: 1px solid var(--base02);
}
.swagger-ui .topbar .download-url-wrapper input[type="text"] {
  border-color: var(--base02);
  background: var(--base00);
  color: var(--base05);
}
.swagger-ui .topbar .download-url-wrapper .download-url-button {
  background: var(--base0E);
  color: var(--base01);
}

/* Info block (spec title/description) + links throughout. */
.swagger-ui .info .title,
.swagger-ui .info li,
.swagger-ui .info p,
.swagger-ui .info table {
  color: var(--base05);
}
.swagger-ui a.nostyle,
.swagger-ui a.nostyle:visited,
.swagger-ui .info a {
  color: var(--base0D);
}
.swagger-ui .opblock-tag {
  color: var(--base05);
  border-bottom-color: var(--base02);
}
.swagger-ui .opblock-tag:hover {
  background: color-mix(in srgb, var(--base0E) 8%, transparent);
}

/* Scheme/server selector bar. */
.swagger-ui .scheme-container {
  background: var(--base01);
  box-shadow: none;
  border-bottom: 1px solid var(--base02);
}

/* Endpoint rows — keep the method-colour left border (GET/POST/etc, it's
   Swagger's own semantic language) but recolour the card body so it
   doesn't sit on stock white. */
.swagger-ui .opblock {
  background: var(--base01);
  border-color: var(--base02);
}
.swagger-ui .opblock .opblock-summary-description,
.swagger-ui .opblock .opblock-summary-path,
.swagger-ui .opblock .opblock-summary-path__deprecated {
  color: var(--base05);
}
.swagger-ui .opblock .opblock-section-header {
  background: var(--base00);
}
.swagger-ui .opblock-description-wrapper p,
.swagger-ui .opblock-external-docs-wrapper p,
.swagger-ui .opblock-title_normal p,
.swagger-ui .parameter__name,
.swagger-ui .parameter__type,
.swagger-ui .parameter__deprecated,
.swagger-ui .parameter__in,
.swagger-ui table.model tr.property-row td {
  color: var(--base05);
}
.swagger-ui .tab li,
.swagger-ui .opblock .opblock-section-header h4,
.swagger-ui .opblock .opblock-section-header label {
  color: var(--base05);
}

/* Response / model tables. */
.swagger-ui table thead tr td,
.swagger-ui table thead tr th {
  color: var(--base05);
  border-bottom-color: var(--base02);
}
.swagger-ui .responses-inner h4,
.swagger-ui .responses-inner h5 {
  color: var(--base05);
}
.swagger-ui .response-col_status {
  color: var(--base05);
}
.swagger-ui .model-box,
.swagger-ui section.models {
  background: var(--base01);
}
.swagger-ui section.models {
  border-color: var(--base02);
}
.swagger-ui section.models h4 {
  color: var(--base05);
}
.swagger-ui .model {
  color: var(--base05);
}

/* Form controls — inputs/selects/textareas default to Swagger's stock
   white regardless of surrounding recolour; without this they'd be the
   one visibly wrong element on the page. */
.swagger-ui 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 {
  background: var(--base00);
  color: var(--base05);
  border-color: var(--base02);
}

/* Generic (non-semantic) buttons — "Try it out" / "Reset" / "Clear" /
   "Authorize" close etc. Execute (green) and Cancel (red) keep Swagger's
   own colours; only the ones that were plain-white-on-white before. */
.swagger-ui .btn {
  color: var(--base05);
  border-color: var(--base02);
  background: var(--base00);
}
.swagger-ui .btn.authorize {
  color: var(--base0E);
  border-color: var(--base0E);
}
.swagger-ui .btn.authorize svg {
  fill: var(--base0E);
}

/* `!important` needed here: Swagger's own `.swagger-ui .highlight-code`
   syntax-highlighting rules ship at equal-or-higher specificity and are
   emitted after the cascade point our stylesheet link occupies is
   evaluated (they're re-asserted per-token by highlight.js's inline
   theme), so a plain override loses. Scoped narrowly to the response/
   request code-sample background only — token colours stay as
   highlight.js's own theme provides, this is just the block bg. */
.swagger-ui .highlight-code {
  background: var(--base00) !important;
}
.swagger-ui .microlight {
  color: var(--base05);
}