/* Endress+Hauser Swagger UI theme — subtle Fabrik overlay
   Design rules: doc/superpowers/fabrik-design-system-reference.md
   Philosophy: minimal additive changes on top of swagger-ui defaults. */

:root {
  --eh-primary: #A8005C;          /* magenta-40 — filled primary action */
  --eh-primary-hover: #640036;    /* magenta-20 */
  --eh-primary-pressed: #3E0021;  /* magenta-10 */
  --eh-focus: #E5007D;            /* magenta-50 — focus ring only */
  --eh-link: #009EE3;             /* cyan-60 */
  --eh-link-hover: #177DB2;       /* cyan-50 */
  --eh-cyan-dark: #1D5A7E;        /* cyan-40 — section heading text */
  --eh-success: #53A831;          /* green-60 — 2xx response */
  --eh-error:   #DE361B;          /* red-50   — 4xx/5xx response, required */
  --eh-surface-v2: #F0F4F6;       /* neutral-95 — subtle table head bg */
  --eh-surface-v1: #F8FAFB;       /* neutral-99 — operation row hover */
  --eh-on-surface: #273237;       /* neutral-20 — primary text */
  --eh-on-primary: #FFFFFF;
  --eh-radius: 2px;
  --eh-shadow-fly: 0 2px 8px -1px rgba(25, 51, 69, 0.20);
  --eh-font-sans: "E+H Sans", "EuH", Arial, sans-serif;
}

/* ----- Typography ----- */

body,
.swagger-ui,
.swagger-ui .info,
.swagger-ui .opblock,
.swagger-ui .scheme-container,
.swagger-ui select,
.swagger-ui input,
.swagger-ui textarea,
.swagger-ui button {
  font-family: var(--eh-font-sans);
}

/* ----- Sticky topbar (keep native colors, just pin it) ----- */

.swagger-ui .topbar {
  position: sticky;
  top: 0;
  z-index: 100;
}

/* ----- Logo-row badges (added by the rswag view) ----- */

#oas_badge,
#env_info {
  display: inline-block;
  margin-left: 10px;
  padding: 4px 10px;
  border-radius: var(--eh-radius);
  color: var(--eh-on-primary);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

#oas_badge {
  background-color: var(--eh-cyan-dark);
}

#env_info {
  background-color: var(--eh-primary);
}

/* ----- Links ----- */

.swagger-ui a,
.swagger-ui .info a {
  color: var(--eh-link);
  text-decoration: none;
  transition: color 0.2s ease;
}

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

/* ----- Primary actions: top-bar Authorize, Execute, modal Authorize -----
   Only the actual confirm button is primary. Close / Logout are tonal. */

.swagger-ui .btn.authorize,
.swagger-ui .btn.execute,
.swagger-ui .auth-container .btn.modal-btn.auth.authorize {
  background-color: var(--eh-primary);
  border-color: var(--eh-primary);
  color: var(--eh-on-primary);
  border-radius: var(--eh-radius);
  box-shadow: var(--eh-shadow-fly);
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

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

.swagger-ui .btn.authorize:hover,
.swagger-ui .btn.execute:hover,
.swagger-ui .auth-container .btn.modal-btn.auth.authorize:hover {
  background-color: var(--eh-primary-hover);
  border-color: var(--eh-primary-hover);
}

.swagger-ui .btn.authorize:active,
.swagger-ui .btn.execute:active,
.swagger-ui .auth-container .btn.modal-btn.auth.authorize:active {
  background-color: var(--eh-primary-pressed);
  border-color: var(--eh-primary-pressed);
}

/* ----- Auth modal secondary buttons (Close, Logout) — tonal -----
   Logout uses .authorize.unlocked so we override the primary back to tonal. */

.swagger-ui .auth-container .btn.modal-btn.auth.btn-done,
.swagger-ui .auth-container .btn.modal-btn.auth.authorize.unlocked {
  background-color: #DFE6EA;       /* tonal-enabled (neutral-90) */
  border-color: #DFE6EA;
  color: #273237;                  /* on-surface */
  border-radius: var(--eh-radius);
  box-shadow: none;
}

.swagger-ui .auth-container .btn.modal-btn.auth.btn-done:hover,
.swagger-ui .auth-container .btn.modal-btn.auth.authorize.unlocked:hover {
  background-color: #C2CED5;       /* tonal-hover (neutral-80) */
  border-color: #C2CED5;
}

/* ----- Auth modal button row: gap between buttons ----- */

.swagger-ui .auth-btn-wrapper {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
}

/* ----- Focus ring (Fabrik: always magenta-50, 2px gap) ----- */

.swagger-ui button:focus-visible,
.swagger-ui a:focus-visible,
.swagger-ui input:focus-visible,
.swagger-ui select:focus-visible,
.swagger-ui textarea:focus-visible,
.swagger-ui .opblock-summary:focus-visible {
  outline: 2px solid var(--eh-focus);
  outline-offset: 2px;
}

/* ----- Info section: compact, inline TOS / contact links ----- */

.swagger-ui .info {
  margin: 20px 0;
}

.swagger-ui .info hgroup.main {
  margin-bottom: 8px;
}

.swagger-ui .info .description {
  margin-bottom: 8px;
  line-height: 1.4;
}

.swagger-ui .info .description p {
  margin: 4px 0;
}

.swagger-ui .info__tos,
.swagger-ui .info__contact,
.swagger-ui .info__contact > div {
  display: inline;
}

/* Insert a bullet between each top-level info link. Markup is:
   <div .info__tos><a/></div><div .info__contact><div><a/></div><a/></div>
   so the dividing points are: before .info__contact's first child, and before
   any subsequent <a> sibling inside .info__contact. */
.swagger-ui .info__contact > div::before,
.swagger-ui .info__contact > a::before {
  content: "•";
  margin: 0 10px;
  color: #8797A3;             /* neutral-60 */
  font-family: Arial, sans-serif;
}

/* ----- Section headings: subtle Fabrik accent ----- */

.swagger-ui .opblock-tag {
  color: var(--eh-cyan-dark);
  border-bottom-color: var(--eh-link);
}

/* ----- Sharp corners on interactive rectangles (Fabrik shape rule) ----- */

.swagger-ui .opblock,
.swagger-ui .opblock-summary,
.swagger-ui .btn,
.swagger-ui input,
.swagger-ui select,
.swagger-ui textarea,
.swagger-ui .modal-ux,
.swagger-ui .auth-container .auth-wrapper,
.swagger-ui .opblock-body pre,
.swagger-ui .highlight-code,
.swagger-ui .model-box,
.swagger-ui .response-col_links,
.swagger-ui table {
  border-radius: var(--eh-radius);
}

/* ----- Response status colors: green for 2xx, red for 4xx/5xx ----- */

.swagger-ui .responses-table .response-col_status {
  font-weight: 700;
}

.swagger-ui .responses-table .response-col_status:has(> div:first-child),
.swagger-ui .responses-table tr.response[data-code^="2"] .response-col_status,
.swagger-ui .responses-table tr.response[data-code^="3"] .response-col_status {
  color: var(--eh-success);
}

.swagger-ui .responses-table tr.response[data-code^="4"] .response-col_status,
.swagger-ui .responses-table tr.response[data-code^="5"] .response-col_status {
  color: var(--eh-error);
}

/* Fallback for swagger versions that don't put data-code on the row:
   the status code is rendered as plain text in the first cell. */
.swagger-ui .response-col_status {
  font-weight: 700;
}

/* ----- "Try it out" button: cyan secondary (explore vs commit) ----- */

.swagger-ui .try-out__btn {
  background-color: var(--eh-link);
  border-color: var(--eh-link);
  color: var(--eh-on-primary);
  border-radius: var(--eh-radius);
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.swagger-ui .try-out__btn:hover {
  background-color: var(--eh-link-hover);
  border-color: var(--eh-link-hover);
}

/* ----- Required parameter marker: Fabrik error red, bold ----- */

.swagger-ui .parameter__name.required span,
.swagger-ui .parameter__name.required::after,
.swagger-ui table.parameters .required {
  color: var(--eh-error);
  font-weight: 700;
}

/* ----- Version pill: cyan-50 chip matching the OAS / env badge family.
   Markup is <small><pre class="version">01.00.00</pre></small>; style the
   <small> shell and neutralize the <pre> so it doesn't paint a second chip. */

.swagger-ui .info hgroup.main h2 > span > small {
  background-color: var(--eh-link-hover);
  color: var(--eh-on-primary);
  border-radius: var(--eh-radius);
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  display: inline-block;
  vertical-align: middle;
  margin-left: 10px;
}

.swagger-ui .info hgroup.main h2 > span > small > pre.version {
  background: transparent;
  color: inherit;
  padding: 0;
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  display: inline;
}

/* The .version-stamp (OAS version) is redundant with our #oas_badge chip
   in the topbar — hide it to avoid duplication. */
.swagger-ui .info .version-stamp {
  display: none;
}

/* ----- Table heads: subtle neutral tint for scannability ----- */

.swagger-ui table thead tr td,
.swagger-ui table thead tr th {
  background-color: var(--eh-surface-v2);
  color: var(--eh-on-surface);
  font-weight: 600;
  border-bottom: 1px solid #DFE6EA;   /* stroke-soft */
}

/* ----- Operation summary hover: barely-there lift ----- */

.swagger-ui .opblock .opblock-summary {
  transition: background-color 0.15s ease;
}

.swagger-ui .opblock .opblock-summary:hover {
  background-color: var(--eh-surface-v1);
}
