/* CTA button — solid dark pill in light mode, inverted in dark mode */
#topbar-cta-button a {
  background-color: #141414 !important;
  color: #ffffff !important;
  padding: 0.5rem 1.25rem !important;
  border-radius: 8px;
  font-weight: 600;
  transition: opacity 0.15s ease;
}

#topbar-cta-button a:hover {
  opacity: 0.85 !important;
}

:is(.dark, [data-theme="dark"]) #topbar-cta-button a {
  background-color: #ffffff !important;
  color: #141414 !important;
}

/* Center the tab links */
.nav-tabs {
  justify-content: center;
  flex: 1;
}

/*
 * HACK: Hide the "Overview" sidebar group header in the Developers tab.
 *
 * Mintlify requires every page to be inside a named group, and the tab's
 * landing page is always the first page of the first group. We want the
 * Developer Overview page to be the tab landing without showing a lonely
 * "Overview" group header above a single item.
 *
 * We use :has() to scope the rule to only the sidebar group that contains
 * the developers/introduction link, so other tabs are unaffected.
 */
div:has(> .sidebar-group a[href="/developers/introduction"]),
div:has(> .sidebar-group a[href="/user-guide/introduction"]) {
  display: none;
}

/* Remove the top margin on the group that follows the hidden overview group,
   so it sits flush at the top of the sidebar without a gap. */
div:has(> .sidebar-group a[href="/developers/introduction"]) + div,
div:has(> .sidebar-group a[href="/user-guide/introduction"]) + div {
  margin-top: 0 !important;
}