/**
 * Redoc + portal brand alignment (loads after {{{redocHead}}}).
 * Tokens mirror app/globals.css :root
 */

/* ── Topnav (match SPA docs Mulish + CssBaseline smoothing) ── */
.portal-topnav,
.portal-topnav.topnav {
  font-family: var(--font) !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  box-sizing: border-box !important;
  height: 56px !important;
}

.portal-topnav,
.portal-topnav * {
  box-sizing: border-box !important;
}

.portal-topnav__left {
  display: flex !important;
  align-items: center !important;
  gap: 1.25rem !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

.portal-topnav .nav-links {
  display: flex !important;
  gap: 4px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  flex-shrink: 0 !important;
}

.portal-topnav .nav-links li {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.portal-topnav .nav-links a {
  font-family: var(--font) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 6px 12px !important;
  border-radius: 7px !important;
  text-decoration: none !important;
  line-height: 1.2 !important;
}

.portal-topnav .nav-links a,
.portal-topnav .btn,
.portal-topnav .glofox-brand-logo__label,
.portal-topnav .gf-redoc-search__trigger,
.portal-topnav .gf-redoc-search__trigger-label,
.portal-topnav .gf-redoc-search__hint,
.portal-topnav .user-menu-trigger,
.portal-topnav .user-menu-item {
  font-family: var(--font) !important;
}

.portal-topnav .nav-right .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  box-sizing: border-box !important;
  padding: 8px 16px !important;
  border-radius: 8px !important;
  font-family: var(--font) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

.portal-topnav .btn-outline {
  background: rgba(255, 255, 255, 0.06) !important;
  color: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
}

.portal-topnav .btn-primary {
  background: var(--gf) !important;
  color: #fff !important;
  border: 1px solid var(--gf) !important;
}

.portal-topnav .portal-topnav__brand {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
}

.portal-topnav .portal-topnav__sep {
  color: rgba(255, 255, 255, 0.3) !important;
  flex-shrink: 0 !important;
}

.portal-topnav .abc-brand-logo {
  display: inline-flex !important;
  align-items: center !important;
  line-height: 0 !important;
  text-decoration: none !important;
  flex-shrink: 0 !important;
}

.portal-topnav .abc-brand-logo--on-dark .abc-brand-logo__img {
  display: block !important;
  height: 26px !important;
  width: auto !important;
  max-width: none !important;
  object-fit: contain !important;
  filter: brightness(0) invert(1) !important;
  opacity: 0.92 !important;
}

.portal-topnav .glofox-brand-logo {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  text-decoration: none !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
}

.portal-topnav .glofox-brand-logo__img {
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  object-fit: contain !important;
  flex-shrink: 0 !important;
}

.portal-topnav .glofox-brand-logo__label {
  color: var(--gf) !important;
  font-family: var(--font) !important;
  font-weight: 800 !important;
  font-size: 15px !important;
  letter-spacing: -0.02em !important;
}

/*
 * Mobile topnav — must live in THIS file (loads last) because the rules above
 * force display:!important on .nav-links / .glofox-brand-logo and would otherwise
 * override glofox-redoc-shell.css @media (max-width: 760px) hides.
 */
@media (max-width: 760px) {
  .portal-topnav {
    padding: 0 0.75rem !important;
    gap: 0.5rem !important;
  }

  .portal-topnav__left {
    gap: 0.5rem !important;
  }

  .portal-topnav__menu-toggle {
    display: inline-flex !important;
  }

  .portal-topnav .nav-links.portal-topnav__desktop-links,
  .portal-topnav .portal-topnav__desktop-auth,
  .portal-topnav .portal-topnav__auth.portal-topnav__desktop-auth,
  .portal-topnav .portal-topnav__sep,
  .portal-topnav .glofox-brand-logo {
    display: none !important;
  }

  .portal-topnav .abc-brand-logo--on-dark .abc-brand-logo__img {
    height: 22px !important;
    max-width: 120px !important;
  }

  .portal-topnav .portal-topnav__right.nav-right {
    gap: 8px !important;
  }
}

/* ── Redoc shell layout — match portal .sidebar (220px) ── */
#redoc .menu-content {
  top: 56px !important;
  width: 220px !important;
  min-width: 220px !important;
  max-width: 220px !important;
  height: calc(100vh - 56px) !important;
  padding: 1.25rem 0 !important;
  box-sizing: border-box !important;
  background-color: var(--abc) !important;
  border-right: 1px solid rgba(255, 255, 255, 0.06) !important;
  font-family: var(--font) !important;
}

/* Collapse default Redoc logo block spacing to feel like docs sidebar */
#redoc .menu-content > div:first-child:not([role="search"]):not([class*="scrollbar"]) {
  padding: 0 1.25rem 0.5rem !important;
  margin: 0 !important;
}

#redoc .menu-content [class*="scrollbar-container"],
#redoc .menu-content [class*="scrollbar"] {
  padding: 0 !important;
}

#redoc .menu-content ul[role="menu"],
#redoc .menu-content ul {
  margin: 0 !important;
  padding: 0 !important;
}

#redoc .redoc-wrap {
  font-family: var(--font) !important;
}

/* Typography: Redoc defaults to Montserrat for headings without overrides */
#redoc h1,
#redoc h2,
#redoc h3,
#redoc h4,
#redoc h5,
#redoc p,
#redoc li,
#redoc td,
#redoc th,
#redoc label,
#redoc input,
#redoc button,
#redoc .api-content,
#redoc .api-info,
#redoc [role="menu"],
#redoc [role="menuitem"] {
  font-family: var(--font) !important;
}

#redoc h1,
#redoc h2,
#redoc h3,
#redoc h4,
#redoc h5 {
  color: var(--t1) !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em;
}

#redoc .api-content p,
#redoc .api-info p,
#redoc .api-content li,
#redoc .api-info li,
#redoc .api-content td,
#redoc .api-info td {
  color: var(--t2) !important;
  font-size: 14px !important;
  line-height: 1.75 !important;
}

/* Main documentation column — match .main-col / .content */
#redoc .api-content,
#redoc .api-info {
  background-color: var(--page) !important;
}

#redoc .api-content h1 {
  font-size: 26px !important;
}

#redoc .api-content h2 {
  font-size: 17px !important;
  border-top: 1px solid var(--border) !important;
  padding-top: 1.5rem !important;
  margin-top: 2rem !important;
}

/*
 * Markdown H1/H2 in info.description become sidebar items under section/*.
 * Redoc also applies min-height: ~100vh to those sections — collapse that
 * spacing for description sections only (tag/operation sections unchanged).
 */
#redoc [data-section-id^="section/"] {
  min-height: 0 !important;
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
}

#redoc [data-section-id^="section/"] h1,
#redoc [data-section-id^="section/"] h2 {
  margin-top: 0 !important;
  border-top: none !important;
  padding-top: 0 !important;
}

#redoc [data-section-id^="section/"] [data-section-id] > div h2 {
  border-top: 1px solid var(--border) !important;
  padding-top: 1rem !important;
  margin-top: 0.25rem !important;
  font-size: 17px !important;
}

/* Links — match docs */
#redoc .api-content a,
#redoc .api-info a {
  color: var(--gf-dark) !important;
  font-weight: 600 !important;
}

#redoc .api-content a:hover,
#redoc .api-info a:hover {
  text-decoration: underline !important;
}

/* Inline code — match docs (exclude fenced blocks; those live in <pre>) */
#redoc .api-content :not(pre) > code,
#redoc .api-info :not(pre) > code {
  background: #eef0f4 !important;
  color: var(--t1) !important;
  border-radius: 4px !important;
  padding: 2px 6px !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  font-size: 12px !important;
}

/* Fenced / indented code in the middle column — keep readable on dark pre */
#redoc .api-content pre,
#redoc .api-info pre {
  background: #1a1f1e !important;
  color: #e8eaed !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
  overflow-x: auto !important;
}

#redoc .api-content pre code,
#redoc .api-info pre code {
  background: transparent !important;
  color: inherit !important;
  padding: 0 !important;
  border-radius: 0 !important;
  font-size: 12px !important;
}

/* API Reference search modal (trigger in topnav; Redoc SearchBox when open) */
.gf-redoc-search-modal__backdrop {
  position: fixed;
  inset: 0;
  z-index: 400;
  border: 0;
  padding: 0;
  margin: 0;
  background: rgba(4, 16, 13, 0.64);
  cursor: pointer;
}

.gf-redoc-search-modal__backdrop[hidden] {
  display: none !important;
}

/* Closed: keep SearchBox in #redoc (for React events) but off-screen */
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="false"],
#redoc [role="search"][data-gf-topnav-search]:not([data-gf-search-open="true"]) {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  z-index: -1 !important;
}

/* Open: docs-style centered command palette */
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] {
  position: fixed !important;
  top: max(12vh, 4rem) !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  width: min(560px, calc(100vw - 2rem)) !important;
  height: auto !important;
  max-height: min(720px, calc(100dvh - 3rem)) !important;
  margin: 0 !important;
  padding: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  box-sizing: border-box !important;
  border-radius: 14px !important;
  background: #0f2621 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.5) !important;
  overflow: hidden !important;
  opacity: 1 !important;
  clip: auto !important;
  clip-path: none !important;
  pointer-events: auto !important;
  z-index: 401 !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] .search-icon,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] > svg {
  position: absolute !important;
  left: 26px !important;
  top: 26px !important;
  transform: none !important;
  width: 16px !important;
  height: 16px !important;
  fill: rgba(255, 255, 255, 0.55) !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] input,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] input.search-input {
  display: block !important;
  width: 100% !important;
  height: 44px !important;
  margin: 0 0 8px !important;
  box-sizing: border-box !important;
  padding: 0 44px 0 42px !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  color: #fff !important;
  font-family: var(--font) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  outline: none !important;
  box-shadow: none !important;
  flex: 0 0 auto !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] input::placeholder {
  color: rgba(255, 255, 255, 0.4) !important;
  font-weight: 600 !important;
  opacity: 1 !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] input:focus {
  border-color: var(--gf) !important;
  box-shadow: 0 0 0 3px rgba(0, 181, 136, 0.18) !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"]:focus-within .search-icon,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"]:focus-within > svg {
  fill: var(--gf) !important;
}

/* Clear (×) */
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] > div:first-child:not([data-role]):not([class*="scrollbar"]) {
  position: absolute !important;
  right: 22px !important;
  top: 22px !important;
  z-index: 3 !important;
  width: 28px !important;
  height: 28px !important;
  line-height: 28px !important;
  text-align: center !important;
  cursor: pointer !important;
  border-radius: 6px !important;
  color: rgba(255, 255, 255, 0.65) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  background: rgba(255, 255, 255, 0.06) !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] > div:first-child:not([data-role]):not([class*="scrollbar"]):hover {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
}

/*
 * Results list — match SPA docs modal (.gf-doc-search__list / __result).
 * Kill PerfectScrollbar chrome (jagged rail + double scrollbars) and the
 * sidebar-brown row backgrounds that leaked into search hits.
 */
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] .ps__rail-x,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] .ps__rail-y,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] .ps__thumb-x,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] .ps__thumb-y,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] .ps:hover > .ps__rail-x,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] .ps:hover > .ps__rail-y,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] .ps--active-x > .ps__rail-x,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] .ps--active-y > .ps__rail-y {
  display: none !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] .ps,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [class*="scrollbar-container"],
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] > div[class*="scrollbar"],
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] > div:has([data-role="search:results"]) {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  max-height: min(420px, calc(100dvh - 220px)) !important;
  margin: 0 !important;
  padding: 4px 0 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  flex: 1 1 auto !important;
  /* Defeat PerfectScrollbar’s overflow:hidden + custom rails */
  overflow: auto !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"],
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] ul,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] ul[role="menu"] {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  max-height: none !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] li,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] [role="menuitem"],
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:result"] {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-left: 0 !important;
  border-radius: 8px !important;
  box-sizing: border-box !important;
  color: rgba(255, 255, 255, 0.88) !important;
  text-decoration: none !important;
  overflow: hidden !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] label {
  display: grid !important;
  grid-template-columns: 56px minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 8px !important;
  row-gap: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 9px 10px !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-left: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  background-color: transparent !important;
  color: rgba(255, 255, 255, 0.88) !important;
  font-family: var(--font) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

/* Title-only hits (no HTTP/webhook tip) still align with titled rows */
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] label:not(:has(.operation-type)) > * {
  grid-column: 2 !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] label > span:not(.operation-type),
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] label > *:not(.operation-type) {
  grid-column: 2 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* Deprecated ops get line-through in Redoc — hide that in search hits */
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] label,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] label *,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] li,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] li * {
  text-decoration: none !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] li:hover,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] li:hover > label,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] [role="menuitem"]:hover,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] [role="menuitem"]:hover > label,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] li.active,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] li.active > label,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] [role="menuitem"].active,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] [role="menuitem"].active > label {
  background: rgba(0, 181, 136, 0.14) !important;
  background-color: rgba(0, 181, 136, 0.14) !important;
  color: #fff !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] .operation-type {
  grid-column: 1 !important;
  justify-self: stretch !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 56px !important;
  min-width: 56px !important;
  max-width: 56px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  padding: 3px 4px !important;
  border-radius: 4px !important;
  text-decoration: none !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}

/*
 * Search webhook tip: plain “Webhook” text only.
 * Sidebar uses ::after on the same .hook class — kill those pseudos here
 * so the label is not double-printed.
 */
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] .operation-type.hook {
  font-size: 8px !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
}

#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] .operation-type.hook::before,
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"] .operation-type.hook::after {
  content: none !important;
  display: none !important;
}

/* Plain “no results” copy */
#redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [data-role="search:results"]:not(:has(li)) {
  padding: 18px 12px !important;
  color: rgba(255, 255, 255, 0.55) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

@media (max-width: 760px) {
  #redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] {
    top: 0 !important;
    left: 0 !important;
    transform: none !important;
    width: 100vw !important;
    max-height: none !important;
    height: 100dvh !important;
    border-radius: 0 !important;
    border: 0 !important;
    padding-top: max(12px, env(safe-area-inset-top, 0px)) !important;
    padding-bottom: max(12px, env(safe-area-inset-bottom, 0px)) !important;
  }

  #redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] .ps,
  #redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] [class*="scrollbar-container"],
  #redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] > div[class*="scrollbar"],
  #redoc [role="search"][data-gf-topnav-search][data-gf-search-open="true"] > div:has([data-role="search:results"]) {
    max-height: none !important;
    flex: 1 1 auto !important;
  }
}

/* Mobile: hide fixed 220px sidebar; open as overlay via .is-mobile-open */
@media (max-width: 760px) {
  #redoc .menu-content {
    display: none !important;
  }

  #redoc .menu-content.is-mobile-open {
    display: flex !important;
    flex-direction: column !important;
    position: fixed !important;
    left: 0 !important;
    top: 56px !important;
    bottom: 0 !important;
    width: min(320px, 88vw) !important;
    min-width: 0 !important;
    max-width: min(320px, 88vw) !important;
    height: auto !important;
    z-index: 350 !important;
    box-shadow: 8px 0 32px rgba(0, 0, 0, 0.28) !important;
  }

  #redoc .api-content,
  #redoc .api-info {
    margin-left: 0 !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  #redoc .api-content table,
  #redoc .api-info table {
    display: block !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  #redoc .redoc-wrap {
    display: block !important;
  }
}

/*
 * Hide Redoc StickyResponsiveSidebar FAB (blue up/down chevrons, bottom-right).
 * Unique chevron SVG viewBox; hideFab theme flag is the primary switch — this is
 * a CSS fallback if the option is ignored by a given Redocly CLI version.
 * Scope to direct redoc-wrap children so we do not hide the whole document tree.
 */
#redoc .redoc-wrap > div:not(.menu-content):not(.api-content):has(svg[viewBox="0 0 926.23699 573.74994"]) {
  display: none !important;
}

#redoc .menu-content [role="menuitem"] {
  color: rgba(255, 255, 255, 0.55) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  font-family: var(--font) !important;
  border-left: 2px solid transparent !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.5 !important;
  background: transparent !important;
}

#redoc .menu-content [role="menuitem"][aria-current="page"],
#redoc .menu-content [role="menuitem"].active {
  color: var(--gf) !important;
  background: rgba(0, 181, 136, 0.1) !important;
  border-left-color: var(--gf) !important;
}

/*
 * Match portal sidebar tokens:
 * .sb-sect  — 10px / 700 / 1.5px tracking / uppercase / pad .6rem 1.25rem
 * .sb-link  — 13px / 600 / pad 7px 1.25rem
 */
#redoc .menu-content label {
  font-family: var(--font) !important;
  box-sizing: border-box !important;
  width: 100% !important;
  transition: color 0.13s ease, background 0.13s ease, border-color 0.13s ease !important;
}

#redoc .menu-content label.-depth0,
#redoc .menu-content label[class*="-depth0"] {
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.65) !important;
  padding: 0.6rem 1.25rem 0.2rem !important;
  margin-top: 0.5rem !important;
  line-height: 1.4 !important;
  background: transparent !important;
  border-left: 2px solid transparent !important;
}

#redoc .menu-content label.-depth1,
#redoc .menu-content label[class*="-depth1"] {
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  color: rgba(255, 255, 255, 0.55) !important;
  padding: 7px 1.25rem !important;
  margin: 0 !important;
  line-height: 1.5 !important;
  border-left: 2px solid transparent !important;
}

#redoc .menu-content label.-depth2,
#redoc .menu-content label[class*="-depth2"] {
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  color: rgba(255, 255, 255, 0.55) !important;
  padding: 7px 1.25rem 7px 1.5rem !important;
  margin: 0 !important;
  line-height: 1.5 !important;
  border-left: 2px solid transparent !important;
}

#redoc .menu-content label:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.07) !important;
}

#redoc .menu-content label.-depth0:hover,
#redoc .menu-content label[class*="-depth0"]:hover {
  color: rgba(255, 255, 255, 0.65) !important;
  background: transparent !important;
}

#redoc .menu-content [role="menuitem"].active > label,
#redoc .menu-content [role="menuitem"][aria-current="page"] > label,
#redoc .menu-content label.active {
  color: var(--gf) !important;
  background: rgba(0, 181, 136, 0.1) !important;
  border-left-color: var(--gf) !important;
}

/* Operation HTTP method badges — keep compact inside matched row padding */
#redoc .menu-content .operation-type {
  margin-right: 8px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  padding: 2px 5px !important;
  border-radius: 4px !important;
  vertical-align: middle !important;
}

/* Right panel — match .code-block */
#redoc .sc-jSgsbC,
#redoc [class*="right-panel"] {
  background-color: #1a1f1e !important;
}

#redoc pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
}

/* Section dividers in middle column */
#redoc .api-content tr:not(:last-child) td {
  border-color: var(--border) !important;
}

/* Webhooks sidebar — flat list under WEBHOOKS heading only (menu only) */
#redoc .menu-content [data-item-id="group/Webhooks"] > label {
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  color: rgba(255, 255, 255, 0.65) !important;
  padding: 0.6rem 1.25rem 0.2rem !important;
  margin-top: 0.5rem !important;
  pointer-events: none !important;
  cursor: default !important;
}

#redoc .menu-content [data-item-id="group/Webhooks"] > label svg {
  display: none !important;
}

/* Hide the nested expandable "Webhooks" row; keep operations visible */
#redoc .menu-content [data-item-id="tag/Webhooks"] > label {
  display: none !important;
}

#redoc .menu-content [data-item-id="tag/Webhooks"] > ul {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

#redoc .menu-content [data-item-id="tag/Webhooks"] {
  margin: 0 !important;
  padding: 0 !important;
}

/* Webhook row layout — badge + label side by side without overlap */
#redoc .menu-content [data-item-id^="tag/Webhooks/paths/"] > label {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 7px 1.25rem 7px 1.5rem !important;
}

#redoc .menu-content [data-item-id^="tag/Webhooks/paths/"] .operation-type.hook {
  flex: 0 0 48px !important;
  width: 48px !important;
  min-width: 48px !important;
  max-width: 48px !important;
  overflow: hidden !important;
  position: relative !important;
  font-size: 0 !important;
  line-height: 0 !important;
  padding: 2px 3px !important;
  box-sizing: border-box !important;
}

#redoc .menu-content [data-item-id^="tag/Webhooks/paths/"] .operation-type.hook::after {
  content: "Webhook";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 7px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  padding: 0 1px !important;
  box-sizing: border-box !important;
}

#redoc .menu-content [data-item-id^="tag/Webhooks/paths/"] > label > span:not(.operation-type) {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  white-space: normal !important;
}
