/* Dark mode background color */
.dark-mode {
  --scalar-background-1: #040410;
  --scalar-background-2: #040410;
  --scalar-background-3: #040410;
  --scalar-sidebar-background-1: #040410;
  --scalar-header-background-1: #040410;
}

/* Compact wordmark in the header/sidebar, Stripe-style */
.logo {
  max-height: 16px !important;
  width: auto !important;
}

/* Append a muted "API" label next to the logo */
a:has(> .logo) {
  display: inline-flex;
  align-items: center;
}

a:has(> .logo)::after {
  content: "API";
  margin-left: 8px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--scalar-color-accent, var(--scalar-color-3));
}
/* Hide "Powered by Scalar" branding wherever it renders */
[class*="powered-by" i],
[class*="poweredBy" i],
a[href*="scalar.com"][class*="footer" i],
.scalar-footer-powered,
footer [href*="scalar.com"] {
  display: none !important;
}

/* Move the dark-mode / color-scheme toggle to the top of the sidebar,
   aligned to the right of the logo (Stripe-style header row). */
.sidebar,
aside[class*="sidebar" i] {
  position: relative;
}

/* Pull the color-scheme toggle out of its default bottom position and
   anchor it next to the logo in the sidebar header. */
[class*="color-scheme-toggle" i],
[class*="colorSchemeToggle" i],
button[aria-label*="color scheme" i],
button[aria-label*="dark mode" i],
button[aria-label*="theme" i] {
  position: absolute !important;
  top: 12px;
  right: 16px;
  bottom: auto !important;
  left: auto !important;
  z-index: 10;
}

/* Ensure the sidebar logo area has room for the toggle on the right */
[class*="sidebar-header" i],
[class*="sidebarHeader" i] {
  padding-right: 56px;
}

/* Styled callout blocks (tip / warning) */
.callout {
  margin: 1.25em 0;
  padding: 0.85em 1.1em;
  border-left: 3px solid;
  border-radius: 6px;
  font-size: 0.95em;
}

.callout > p:first-child {
  margin-top: 0;
}

.callout > p:last-child {
  margin-bottom: 0;
}

.callout-title {
  display: block;
  margin: 0 0 0.4em 0;
  font-weight: 600;
  font-size: 0.78em;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.callout-tip {
  background: rgba(22, 163, 74, 0.08);
  border-left-color: #16a34a;
}

.callout-tip .callout-title {
  color: #16a34a;
}

.dark-mode .callout-tip {
  background: rgba(34, 197, 94, 0.12);
  border-left-color: #4ade80;
}

.dark-mode .callout-tip .callout-title {
  color: #4ade80;
}

.callout-warning {
  background: rgba(245, 158, 11, 0.09);
  border-left-color: #f59e0b;
}

.callout-warning .callout-title {
  color: #b45309;
}

.dark-mode .callout-warning {
  background: rgba(251, 191, 36, 0.12);
  border-left-color: #fbbf24;
}

.dark-mode .callout-warning .callout-title {
  color: #fbbf24;
}