/*
 * Squid Support brand skin for the public API documentation pages.
 *
 * Every URL in this file is same-origin (issue #876): the typeface is the
 * vendored Inter next to this file rather than the web-font service the
 * marketing site uses, and the logo is a downscaled copy of the site's rather
 * than a hotlink. Any off-origin url() added here fails
 * tests/test_public_api_docs.py.
 *
 * Tokens mirror the marketing site's src/app/globals.css so /docs and /redoc
 * read as the same product as squidsupport.ai. That site has no dark palette
 * (its `.dark` variant is declared but never given colours), so this is a
 * light-only skin by design rather than by omission.
 */

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/docs/static/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --squid-background: #ffffff;
  --squid-foreground: #0f172a;
  --squid-primary: #3b82f6;
  --squid-primary-hover: #2563eb;
  --squid-primary-foreground: #ffffff;
  --squid-muted: #f8fafc;
  --squid-muted-foreground: #64748b;
  --squid-border: #e2e8f0;
  --squid-body: #334155;
  --squid-radius: 8px;
  --squid-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  /* JetBrains Mono is a token on the marketing site but is never actually
     loaded there, so the site renders the system monospace stack. Matching
     that is congruent AND avoids vendoring a second font nobody sees. */
  --squid-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
    monospace;
}

/* ------------------------------------------------------------------ header */

.squid-docs-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  padding: 0.875rem 1.5rem;
  background: var(--squid-background);
  border-bottom: 1px solid var(--squid-border);
  font-family: var(--squid-font-sans);
  position: relative;
  z-index: 100;
}

.squid-docs-header img {
  height: 30px;
  width: auto;
  display: block;
}

.squid-docs-header .squid-docs-eyebrow {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--squid-muted-foreground);
  letter-spacing: -0.01em;
  padding-left: 1rem;
  border-left: 1px solid var(--squid-border);
}

.squid-docs-header nav {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.squid-docs-header nav a {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--squid-muted-foreground);
  text-decoration: none;
  padding: 0.375rem 0.75rem;
  border-radius: var(--squid-radius);
}

.squid-docs-header nav a:hover {
  color: var(--squid-foreground);
  background: var(--squid-muted);
}

.squid-docs-header nav a.squid-docs-current {
  color: var(--squid-primary-foreground);
  background: var(--squid-primary);
}

.squid-docs-header nav a.squid-docs-current:hover {
  background: var(--squid-primary-hover);
}

/* -------------------------------------------------------------- swagger ui */

body {
  font-family: var(--squid-font-sans);
  background: var(--squid-background);
}

.swagger-ui,
.swagger-ui .info .title,
.swagger-ui .opblock-tag,
.swagger-ui .opblock .opblock-summary-operation-id,
.swagger-ui .opblock .opblock-summary-description,
.swagger-ui .btn,
.swagger-ui select,
.swagger-ui label,
.swagger-ui .parameter__name,
.swagger-ui .tab li,
.swagger-ui table thead tr td,
.swagger-ui table thead tr th {
  font-family: var(--squid-font-sans);
}

.swagger-ui .microlight,
.swagger-ui .model,
.swagger-ui .prop-type,
.swagger-ui .parameter__type,
.swagger-ui .opblock .opblock-summary-path,
.swagger-ui .opblock .opblock-summary-path__deprecated {
  font-family: var(--squid-font-mono);
}

.swagger-ui .topbar {
  display: none;
}

.swagger-ui .info .title {
  color: var(--squid-foreground);
  letter-spacing: -0.02em;
}

.swagger-ui .info .title small.version-stamp {
  background: var(--squid-primary);
}

.swagger-ui .scheme-container {
  background: var(--squid-muted);
  box-shadow: none;
  border-bottom: 1px solid var(--squid-border);
}

.swagger-ui .opblock.opblock-get {
  border-color: var(--squid-primary);
  background: rgba(59, 130, 246, 0.04);
}

.swagger-ui .opblock.opblock-get .opblock-summary-method {
  background: var(--squid-primary);
}

.swagger-ui .opblock.opblock-get .opblock-summary {
  border-color: var(--squid-primary);
}

.swagger-ui .btn.execute {
  background: var(--squid-primary);
  border-color: var(--squid-primary);
  color: var(--squid-primary-foreground);
}

.swagger-ui .btn.execute:hover {
  background: var(--squid-primary-hover);
  border-color: var(--squid-primary-hover);
}

.swagger-ui .btn.authorize {
  color: var(--squid-primary);
  border-color: var(--squid-primary);
}

.swagger-ui .btn.authorize svg {
  fill: var(--squid-primary);
}

.swagger-ui a,
.swagger-ui .info a {
  color: var(--squid-primary);
}

.swagger-ui a:hover,
.swagger-ui .info a:hover {
  color: var(--squid-primary-hover);
}

.swagger-ui .info .base-url,
.swagger-ui .info li,
.swagger-ui .info p,
.swagger-ui .info table {
  color: var(--squid-body);
}

.swagger-ui .opblock-tag {
  color: var(--squid-foreground);
  border-bottom-color: var(--squid-border);
}

/* Front-matter prose. Swagger UI renders the OpenAPI `description` as
 * markdown and styles it with its own scale (purple inline code on a near
 * black chip, no heading rhythm). These rules restate the marketing site's
 * `.docs-prose` block from src/app/globals.css so the recipes read like the
 * rest of the product's documentation. */

.swagger-ui .markdown,
.swagger-ui .renderedMarkdown {
  color: var(--squid-body);
  line-height: 1.7;
}

.swagger-ui .markdown h2,
.swagger-ui .renderedMarkdown h2 {
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 600;
  color: var(--squid-foreground);
  margin: 2.75rem 0 1rem;
}

.swagger-ui .markdown h3,
.swagger-ui .renderedMarkdown h3 {
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 600;
  color: var(--squid-foreground);
  margin: 2rem 0 0.75rem;
}

.swagger-ui .markdown strong,
.swagger-ui .renderedMarkdown strong {
  font-weight: 600;
  color: var(--squid-foreground);
}

.swagger-ui .markdown code,
.swagger-ui .renderedMarkdown code {
  background: #f1f5f9;
  color: var(--squid-foreground);
  font-family: var(--squid-font-mono);
  font-weight: 500;
  font-size: 0.875em;
  border-radius: 4px;
  padding: 0.1em 0.35em;
}

.swagger-ui .markdown pre,
.swagger-ui .renderedMarkdown pre {
  background: var(--squid-foreground);
  color: #e2e8f0;
  border-radius: var(--squid-radius);
  padding: 1rem 1.25rem;
  overflow-x: auto;
  margin: 1.25rem 0 1.75rem;
}

.swagger-ui .markdown pre code,
.swagger-ui .renderedMarkdown pre code {
  background: transparent;
  color: inherit;
  padding: 0;
  font-size: inherit;
}

/* -------------------------------------------------------------------- redoc
 *
 * ReDoc styles itself with styled-components, so its generated class names are
 * not stable enough to target. Only the two things that carry the brand and
 * survive a ReDoc upgrade are overridden here — the typeface and the accent
 * colour — and the rest of ReDoc's chrome is left as shipped.
 */

redoc,
redoc * {
  font-family: var(--squid-font-sans);
}

redoc code,
redoc pre,
redoc pre *,
redoc .redoc-json,
redoc .redoc-json * {
  font-family: var(--squid-font-mono);
}

redoc a {
  color: var(--squid-primary);
}

redoc a:hover {
  color: var(--squid-primary-hover);
}