/* ============================================================
   Find My Pack — shared API chrome + dark/red theming for the
   /docs (Swagger UI) and /redoc pages.
   ============================================================ */

:root {
  --bg: #050506;
  --panel: #08080a;
  --card: #0d0d0f;
  --card-2: #101012;
  --line: rgba(245, 245, 247, 0.08);
  --line-soft: rgba(245, 245, 247, 0.07);
  --line-strong: rgba(245, 245, 247, 0.16);
  --text: #f5f5f7;
  --text-2: #a1a1a6;
  --text-3: #86868b;
  --text-4: #6e6e73;
  --text-5: #5a5a5f;
  --red: #d22f2f;
  --red-2: #d83b3b;
  --red-hi: #e58585;
  --red-deep: #9e1c24;
  --ok: #d22f2f;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
  --sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter",
    "Helvetica Neue", Helvetica, Arial, sans-serif;
  --header: 66px;
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }

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

.fmp-topbar {
  position: sticky;
  top: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  gap: 20px;
  height: var(--header);
  padding: 0 26px 0 22px;
  background: rgba(5, 5, 6, 0.8);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--line-soft);
}

.fmp-brand {
  display: flex;
  align-items: center;
  gap: 11px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -0.012em;
  color: var(--text);
  flex: none;
}
.fmp-brand svg {
  width: 26px;
  height: 26px;
  display: block;
  filter: drop-shadow(0 0 9px rgba(200,50,50, 0.5));
}

.fmp-nav {
  flex: 1;
  display: flex;
  justify-content: center;
  gap: 30px;
  font-size: 14px;
}
.fmp-nav a { color: var(--text-3); transition: color 0.2s var(--ease); }
.fmp-nav a:hover { color: var(--text); }
.fmp-nav a.active { color: var(--text); font-weight: 500; }

.fmp-home {
  flex: none;
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 18px;
  border-radius: 999px;
  background: var(--text);
  color: #0a0a0b;
  font-size: 13.5px;
  font-weight: 600;
  transition: transform 0.2s var(--ease), filter 0.2s var(--ease);
}
.fmp-home:hover { transform: translateY(-1px); filter: brightness(0.92); }

@media (max-width: 720px) {
  .fmp-nav { display: none; }
}

/* ============================================================
   SWAGGER UI  →  dark + red
   ============================================================ */

.swagger-ui,
.swagger-ui .wrapper { background: var(--bg); color: var(--text); }

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

.swagger-ui .wrapper { max-width: 1080px; padding: 0 26px; }

/* text */
.swagger-ui,
.swagger-ui .opblock-tag,
.swagger-ui .opblock .opblock-summary-operation-id,
.swagger-ui .opblock .opblock-summary-path,
.swagger-ui .opblock .opblock-summary-path__deprecated,
.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 table thead tr td,
.swagger-ui table thead tr th,
.swagger-ui .response-col_status,
.swagger-ui .response-col_description,
.swagger-ui .responses-inner h4,
.swagger-ui .responses-inner h5,
.swagger-ui .model-title,
.swagger-ui .model,
.swagger-ui section.models h4,
.swagger-ui .info .title,
.swagger-ui .info p,
.swagger-ui .info li,
.swagger-ui .scheme-container .schemes > label,
.swagger-ui .tab li,
.swagger-ui label { color: var(--text) !important; }

.swagger-ui .opblock-tag { border-bottom-color: var(--line); }
.swagger-ui .opblock-tag small { color: var(--text-3); }
.swagger-ui .parameter__type,
.swagger-ui .prop-format,
.swagger-ui .response-col_links { color: var(--text-3) !important; }

.swagger-ui .info { margin: 34px 0 22px; }
.swagger-ui .info hgroup.main a { color: var(--text-3); }

/* scheme / servers bar */
.swagger-ui .scheme-container {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: none;
  margin: 0 0 28px;
}

/* operation blocks → our card look */
.swagger-ui .opblock {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: none;
  margin: 0 0 12px;
}
.swagger-ui .opblock .opblock-summary { border-bottom: 0; padding: 8px 20px; }
.swagger-ui .opblock.is-open .opblock-summary { border-bottom: 1px solid var(--line); }
.swagger-ui .opblock .opblock-section-header {
  background: var(--panel);
  box-shadow: none;
  border-bottom: 1px solid var(--line);
}
.swagger-ui .opblock .opblock-section-header h4,
.swagger-ui .opblock .opblock-section-header > label { color: var(--text) !important; }

/* method pills */
.swagger-ui .opblock .opblock-summary-method,
.swagger-ui .opblock.opblock-get .opblock-summary-method,
.swagger-ui .opblock.opblock-post .opblock-summary-method,
.swagger-ui .opblock.opblock-put .opblock-summary-method,
.swagger-ui .opblock.opblock-delete .opblock-summary-method {
  border-radius: 8px;
  font-family: var(--mono);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.06em;
  min-width: 78px;
  background: rgba(245, 245, 247, 0.1) !important;
  color: var(--text) !important;
  text-shadow: none;
  border: 1px solid var(--line-strong);
}
.swagger-ui .opblock.opblock-post { border-color: rgba(200,50,50, 0.28); }
.swagger-ui .opblock.opblock-post .opblock-summary-method {
  background: linear-gradient(180deg, var(--red-2), var(--red-deep)) !important;
  color: #fff !important;
  border-color: transparent;
}
.swagger-ui .opblock.opblock-post .opblock-summary { border-color: rgba(200,50,50, 0.28); }
.swagger-ui .opblock.opblock-get { border-color: var(--line); }

/* version + spec badges near the title */
.swagger-ui .info .title small,
.swagger-ui .info .title small pre {
  background: rgba(245, 245, 247, 0.1);
  color: var(--text-2);
}
.swagger-ui .info .title small.version-stamp { background: rgba(245, 245, 247, 0.1); }
.swagger-ui .info .title small.version-stamp pre { background: none; }

/* buttons */
.swagger-ui .btn {
  border-radius: 999px;
  border: 1px solid var(--line-strong);
  background: transparent;
  color: var(--text);
  box-shadow: none;
  font-weight: 600;
  transition: transform 0.2s var(--ease), filter 0.2s var(--ease),
    background 0.2s var(--ease), border-color 0.2s var(--ease);
}
.swagger-ui .btn:hover { transform: translateY(-1px); border-color: var(--text-3); }
.swagger-ui .btn.try-out__btn { background: rgba(245, 245, 247, 0.04); }
.swagger-ui .btn.execute {
  background: linear-gradient(180deg, var(--red-2), var(--red-deep));
  border-color: transparent;
  color: #fff;
  box-shadow: 0 8px 24px rgba(200,50,50, 0.28);
}
.swagger-ui .btn.execute:hover { filter: brightness(1.08); }
.swagger-ui .btn.btn-clear { color: var(--text-3); }

/* inputs */
.swagger-ui input[type=text],
.swagger-ui input[type=password],
.swagger-ui input[type=search],
.swagger-ui input[type=email],
.swagger-ui input[type=number],
.swagger-ui textarea,
.swagger-ui select {
  background: var(--panel);
  color: var(--text);
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  box-shadow: none;
}
.swagger-ui textarea { font-family: var(--mono); font-size: 13px; }
.swagger-ui .parameter__name.required span { color: var(--red-hi); }

/* code / response bodies */
.swagger-ui .highlight-code,
.swagger-ui .microlight,
.swagger-ui .responses-inner,
.swagger-ui .response-col_description__inner div.markdown,
.swagger-ui .model-example,
.swagger-ui .body-param__example,
.swagger-ui .curl-command,
.swagger-ui .request-url,
.swagger-ui .responses-table .response .response-col_description pre {
  background: var(--panel) !important;
  color: var(--text-2) !important;
  border-radius: 12px;
  border: 1px solid var(--line);
}
.swagger-ui .microlight code,
.swagger-ui .highlight-code code { color: var(--text-2) !important; }
.swagger-ui .copy-to-clipboard { background: rgba(245, 245, 247, 0.08); border-radius: 6px; }
.swagger-ui .copy-to-clipboard button { background: none; }

/* tables */
.swagger-ui table tbody tr td { border-color: var(--line); color: var(--text-2); }
.swagger-ui .parameters-col_description input { width: 100%; }
.swagger-ui .response-control-media-type--accept-controller select { min-width: 200px; }

/* models */
.swagger-ui section.models {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 16px;
}
.swagger-ui section.models .model-container { background: var(--panel); border-radius: 12px; }
.swagger-ui .model-toggle:after { background: none; }
.swagger-ui .prop-type { color: var(--red-hi); }
.swagger-ui .prop-enum,
.swagger-ui .property-row td { color: var(--text-2); }

/* misc chrome */
.swagger-ui .opblock-summary-control:focus { outline: none; }
.swagger-ui svg.arrow,
.swagger-ui .expand-operation svg,
.swagger-ui .model-toggle:after { fill: var(--text-3); }
.swagger-ui .tab li button.tablinks { color: var(--text-3); }
.swagger-ui .tab li.active button.tablinks { color: var(--text); }
.swagger-ui .response-col_status .response-undocumented { color: var(--text-4); }
.swagger-ui .errors-wrapper { background: rgba(200,50,50, 0.08); border-color: rgba(200,50,50,0.3); border-radius: 12px; }
.swagger-ui .errors-wrapper .errors h4,
.swagger-ui .errors-wrapper hgroup h4 { color: var(--red-hi) !important; }
.swagger-ui a.nostyle,
.swagger-ui .opblock-summary-path a { color: var(--text) !important; }
.swagger-ui .info a,
.swagger-ui .opblock-external-docs-wrapper a { color: var(--red-hi) !important; }

/* neutralise Swagger's per-method accent colours on the summary row */
.swagger-ui .opblock .opblock-summary,
.swagger-ui .opblock.opblock-get .opblock-summary,
.swagger-ui .opblock.opblock-post .opblock-summary,
.swagger-ui .opblock.opblock-put .opblock-summary,
.swagger-ui .opblock.opblock-delete .opblock-summary {
  border-bottom-color: var(--line) !important;
}
.swagger-ui .opblock.opblock-post .opblock-summary { border-bottom-color: rgba(200,50,50, 0.28) !important; }

/* section tabs ("Parameters" / "Responses") */
.swagger-ui .tab li,
.swagger-ui .opblock-section-header {
  border-color: var(--line) !important;
  background: transparent !important;
}
.swagger-ui .tab li.active { color: var(--text) !important; }
.swagger-ui .tab li:first-of-type::after { background: var(--line-strong); }
.swagger-ui .parameters-container .parameters-col_description,
.swagger-ui .table-container { border-color: var(--line); }

/* inline `code` chips in descriptions */
.swagger-ui .opblock-description-wrapper code,
.swagger-ui .markdown code,
.swagger-ui .renderedMarkdown code,
.swagger-ui .response-col_description code {
  background: rgba(200,50,50, 0.12);
  color: var(--red-hi);
  border: 1px solid rgba(200,50,50, 0.22);
  border-radius: 5px;
  padding: 1px 5px;
  font-family: var(--mono);
}

/* the little green "authorized/valid" + 2xx status accents */
.swagger-ui .response-col_status { color: var(--text) !important; }
.swagger-ui .responses-table .response-col_status .response-undocumented,
.swagger-ui .prop-format { color: var(--text-4) !important; }
.swagger-ui .opblock-body pre.microlight { color: var(--text-2) !important; }

/* loader */
.swagger-ui .loading-container .loading::after { border-color: var(--red) transparent var(--red) transparent; }

/* ============================================================
   SWAGGER — Authorize modal + deep interactive states
   ============================================================ */

/* dim layer behind the modal */
.swagger-ui .dialog-ux .backdrop-ux { background: rgba(0, 0, 0, 0.72); }

/* the modal shell */
.swagger-ui .dialog-ux .modal-ux {
  background: var(--card) !important;
  border: 1px solid var(--line-strong) !important;
  border-radius: 18px !important;
  box-shadow: 0 30px 90px -20px rgba(0, 0, 0, 0.85) !important;
}
.swagger-ui .dialog-ux .modal-ux-header {
  background: transparent !important;
  border-bottom: 1px solid var(--line) !important;
}
.swagger-ui .dialog-ux .modal-ux-header h3,
.swagger-ui .dialog-ux .modal-ux-content h4,
.swagger-ui .dialog-ux .modal-ux-content h4 code,
.swagger-ui .dialog-ux .modal-ux-content p,
.swagger-ui .dialog-ux .modal-ux-content label,
.swagger-ui .dialog-ux .modal-ux-content .scopes h2 { color: var(--text) !important; }
.swagger-ui .dialog-ux .modal-ux-content { background: transparent !important; }
.swagger-ui .modal-ux-header .close-modal svg { fill: var(--text-3); }
.swagger-ui .modal-ux-header .close-modal:hover svg { fill: var(--text); }

/* auth form inside the modal */
.swagger-ui .auth-container { border-bottom: 1px solid var(--line) !important; }
.swagger-ui .auth-container h4,
.swagger-ui .auth-container label,
.swagger-ui .auth-container .wrapper { color: var(--text) !important; }
.swagger-ui .auth-container input[type=text],
.swagger-ui .auth-container input[type=password] {
  background: var(--panel) !important;
  color: var(--text) !important;
  border: 1px solid var(--line-strong) !important;
  border-radius: 10px !important;
}
.swagger-ui .auth-container .errors { background: rgba(200,50,50,0.08); border-radius: 10px; color: var(--red-hi); }

/* Authorize / Logout / Close buttons — these were invisible */
.swagger-ui .auth-btn-wrapper { justify-content: flex-start; gap: 10px; }
.swagger-ui .auth-btn-wrapper .btn {
  border-radius: 999px !important;
  font-weight: 600;
  padding: 9px 22px;
}
/* the scheme-bar Authorize toggle — ghost (direct children only, so
   it never touches the modal's own Authorize button nested below) */
.swagger-ui .scheme-container > .schemes > .auth-wrapper > .authorize,
.swagger-ui .scheme-container .auth-wrapper > .authorize {
  background: transparent !important;
  border: 1px solid var(--line-strong) !important;
  color: var(--text) !important;
}
.swagger-ui .scheme-container .auth-wrapper > .authorize svg {
  fill: var(--text-2) !important;
}

/* the modal's Authorize / Logout — solid red */
.swagger-ui .modal-ux .auth-btn-wrapper .btn.modal-btn.authorize {
  background: linear-gradient(180deg, var(--red-2), var(--red-deep)) !important;
  border-color: transparent !important;
  color: #fff !important;
}
.swagger-ui .modal-ux .auth-btn-wrapper .btn.modal-btn.authorize svg {
  fill: #fff !important;
}
/* modal Close / Done — ghost */
.swagger-ui .modal-ux .auth-btn-wrapper .btn.btn-done {
  background: transparent !important;
  border: 1px solid var(--line-strong) !important;
  color: var(--text) !important;
}

/* ---- after Execute: the live response ---- */
.swagger-ui .live-responses-table .response-col_status { color: var(--text) !important; }
.swagger-ui .live-responses-table .response-col_description .microlight,
.swagger-ui .live-responses-table .response-col_description pre,
.swagger-ui .response .response-col_description .microlight,
.swagger-ui .curl-command .curl,
.swagger-ui .request-url .microlight,
.swagger-ui .responses-inner pre {
  background: var(--panel) !important;
  color: var(--text-2) !important;
  border: 1px solid var(--line);
  border-radius: 12px;
}
.swagger-ui .responses-inner table.headers td,
.swagger-ui .responses-inner .headers h4,
.swagger-ui .response-col_links,
.swagger-ui .response-controls,
.swagger-ui .responses-header td { color: var(--text-2) !important; }
.swagger-ui .download-contents {
  background: rgba(245, 245, 247, 0.08) !important;
  color: var(--text) !important;
  border-radius: 8px;
}
.swagger-ui .response-control-media-type small { color: var(--text-3); }

/* ---- models / schemas deep ---- */
.swagger-ui .model-box,
.swagger-ui section.models .model-box { background: transparent !important; }
.swagger-ui .model .property,
.swagger-ui .model .property.primitive,
.swagger-ui table.model tr.property-row td,
.swagger-ui table.model tr td,
.swagger-ui .model-title__text,
.swagger-ui .prop-name,
.swagger-ui .model .description__inner p { color: var(--text-2) !important; }
.swagger-ui .prop-type { color: var(--red-hi) !important; }
.swagger-ui .model-toggle { color: var(--text-3); }
.swagger-ui .model-hint { background: #000; color: var(--text-2); border: 1px solid var(--line-strong); }
.swagger-ui span.model .brace-open,
.swagger-ui span.model .brace-close { color: var(--text-3); }

/* ---- misc text that stayed grey-on-grey ---- */
.swagger-ui .opblock-summary-description,
.swagger-ui .parameter__in,
.swagger-ui .parameter__deprecated,
.swagger-ui .response-col_status .response-undocumented,
.swagger-ui .info .base-url,
.swagger-ui .servers-title,
.swagger-ui .servers > label { color: var(--text-3) !important; }
.swagger-ui .expand-methods svg,
.swagger-ui .expand-operation svg,
.swagger-ui .opblock-control-arrow,
.swagger-ui button .arrow { fill: var(--text-3) !important; }
.swagger-ui .checkbox input[type=checkbox] + label > .item {
  background: var(--panel);
  border: 1px solid var(--line-strong);
  box-shadow: none;
}
.swagger-ui .servers > label select { min-width: 220px; }

/* ============================================================
   REDOC container
   ============================================================ */

#redoc { background: var(--bg); }
redoc { display: block; background: var(--bg); }

/* drop the external "powered by Redocly" logo (blocked by CSP anyway) */
#redoc img[src*="redoc.ly"],
#redoc img[src*="redocly"],
#redoc a[href*="redocly.com"] { display: none !important; }

/* lift Redoc's dimmest labels ("REQUEST BODY SCHEMA", etc.) */
#redoc h3,
#redoc h5,
#redoc [class*="RequestBodyLabel"],
#redoc [class*="MimeLabel"] { color: var(--text-2) !important; }
#redoc { --redoc-fallback: 0; }
