* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #000000; }
::-webkit-scrollbar-thumb { background: #1e1e1e; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #333; }
* { scrollbar-width: thin; scrollbar-color: #1e1e1e #000000; }

html {
  background: #0d0d0d;
}
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  background: radial-gradient(ellipse at 50% 0%, #1a1a1a 0%, #0d0d0d 40%, #0a0a0a 100%);
  background-attachment: fixed;
  color: #ffffff;
  min-height: 100vh;
}

/* ── Our navbar ── */
header {
  position: fixed;
  top: 0; left: 0; right: 0;
  width: 100%;
  z-index: 1000;
  background: radial-gradient(ellipse at 50% 0%, rgba(30,30,30,0.75) 0%, rgba(10,10,10,0.92) 100%);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  transition: transform 0.4s ease, opacity 0.4s ease;
}
header.header-hidden {
  transform: translateY(-120%);
  opacity: 0;
  pointer-events: none;
}
header .container { max-width: 1400px; margin: 0 auto; padding: 0 32px; }
.header-inner {
  display: flex;
  align-items: center;
  height: 56px;
  position: relative;
}
.header-nav {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: 6px;
}
.logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: #fff;
  line-height: 1;
}
.logo img {
  width: 28px;
  height: 28px;
  display: block;
  border-radius: 7px;
  flex-shrink: 0;
}
.logo-text {
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: -0.3px;
  background: linear-gradient(180deg, #ffffff 0%, #888888 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  white-space: nowrap;
}
.logo-text span { font-weight: 400; opacity: 0.45; }
.nav-link {
  color: rgba(255,255,255,0.55);
  text-decoration: none;
  font-weight: 500;
  font-size: 0.82rem;
  transition: color 0.2s;
  padding: 6px 10px;
  display: flex;
  align-items: center;
  line-height: 1;
}
.nav-link:hover { color: #fff; }
.btn-header-signup {
  background: #ffffff;
  border: none;
  color: #000;
  padding: 7px 16px;
  border-radius: 9999px;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  font-size: 0.82rem;
  line-height: 1;
  cursor: pointer;
  transition: opacity 0.2s;
  margin-left: 8px;
}
.btn-header-signup:hover { opacity: 0.88; }

@media (max-width: 768px) {
  .logo-text { display: none !important; }
  .nav-link { font-size: 0.74rem !important; padding: 6px 8px !important; }
  .btn-header-signup { font-size: 0.74rem !important; padding: 6px 12px !important; }
}

/* ── Scalar root offset ── */
#scalar-root {
  padding-top: 56px;
  min-height: 100vh;
}

/* ── Scalar CSS vars — dark grey theme throughout ── */
:root,
.dark-mode,
.scalar-api-reference {
  --scalar-background-1: #0d0d0d;
  --scalar-background-2: #111113;
  --scalar-background-3: #161618;
  --scalar-background-4: #1a1a1c;
  --scalar-border-color: rgba(255,255,255,0.07);
  --scalar-color-1: #ffffff;
  --scalar-color-2: #b4b4b4;
  --scalar-color-3: #6a6a6a;
  --scalar-color-accent: #ffffff;
  --scalar-background-accent: #1a1a1c;
  --scalar-sidebar-background-1: #080809;
  --scalar-sidebar-item-hover-background: rgba(255,255,255,0.04);
  --scalar-sidebar-item-active-background: rgba(255,255,255,0.06);
  --scalar-sidebar-color-1: #ffffff;
  --scalar-sidebar-color-2: #b4b4b4;
  --scalar-sidebar-border-color: rgba(255,255,255,0.06);
  --scalar-font: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --scalar-font-code: 'JetBrains Mono', 'Fira Code', monospace;
  --scalar-radius: 10px;
  --scalar-radius-lg: 12px;
  --refs-header-height: 56px;
  --scalar-custom-header-height: 56px;
}

/* ── Global font override ── */
.scalar-app, .scalar-api-reference, .scalar-api-reference * {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
code, pre, .scalar-api-reference code, .scalar-api-reference pre {
  font-family: 'JetBrains Mono', 'Fira Code', monospace !important;
}

/* ── Utility bg classes → grey tones ── */
.bg-b-1, [class~="bg-b-1"] { background-color: #0d0d0d !important; }
.bg-b-2, [class~="bg-b-2"] { background-color: #111113 !important; }
.bg-b-3, [class~="bg-b-3"] { background-color: #161618 !important; }
.bg-sidebar-b-1, [class~="bg-sidebar-b-1"] { background-color: #080809 !important; }

/* ── Scalar layout backgrounds ── */
.scalar-app,
.scalar-api-reference,
.scalar-api-reference .references-layout,
.scalar-api-reference .references-editor,
.scalar-api-reference .references-rendered,
.scalar-api-reference .references-classic,
.t-doc, .t-doc__content {
  background: transparent !important;
}

/* ── Sidebar fixed to below our navbar ── */
.t-doc__sidebar {
  top: 56px !important;
  height: calc(100vh - 56px) !important;
  background-color: #080809 !important;
  border-right: 1px solid rgba(255,255,255,0.06) !important;
}
body.bh-header-hidden .t-doc__sidebar {
  top: 0 !important;
  height: 100vh !important;
}

/* ── Main content area ── */
.t-doc__content, .references-rendered {
  background: transparent !important;
}

/* ── Endpoint cards ── */
.scalar-api-reference [class*="endpoint"],
.scalar-api-reference [class*="section-container"],
.scalar-api-reference .document,
.scalar-api-reference .collapsible-section {
  background: transparent !important;
  border-color: rgba(255,255,255,0.06) !important;
}

/* Operation header (GET /api/...) */
.scalar-app .scalar-api-reference .rounded-t-xl,
[class*="endpoint-header"] {
  background: #161618 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 10px 10px 0 0 !important;
}
.scalar-app .scalar-api-reference .rounded-b-xl,
.scalar-app .scalar-api-reference .rounded-t-xl + div,
[class*="endpoint-body"] {
  background: #111113 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-top: none !important;
  border-radius: 0 0 10px 10px !important;
  margin-bottom: 12px !important;
}
.scalar-app .scalar-api-reference .border-b-0 { border-bottom-width: 0 !important; }

/* Right panel (curl / auth) */
.scalar-api-client,
.scalar-api-client-modal,
.scalar-api-reference-modal,
.scalar-client-app,
.scalar-client {
  background: #0d0d0d !important;
  border-left: 1px solid rgba(255,255,255,0.06) !important;
}

/* Modals */
.scalar-modal,
.scalar-modal-layout,
.scalar-modal-layout-full,
.scalar-modal-body,
.scalar-modal-search,
.command-palette {
  background: #111113 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 12px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.7) !important;
}
.scalar-modal-header {
  background: #111113 !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}
[aria-modal="true"]::backdrop,
.scalar-modal::backdrop { background: rgba(0,0,0,0.7) !important; }

/* AI agent panel */
.agent-scalar, .agent-scalar-container {
  background: #0d0d0d !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
}
.agent-scalar-overlay { background: rgba(0,0,0,0.7) !important; }

/* ── Hide unwanted Scalar UI ── */
.api-reference-toolbar,
.references-developer-tools,
[aria-label="Developer Tools"],
.t-doc__header,
.scalar-mcp-layer,
.scalar-mcp-layer-link,
.darklight-reference { display: none !important; }

/* Search bar background */
.bg-sidebar-b-search {
  background-color: #111113 !important;
  border-color: rgba(255,255,255,0.08) !important;
}
/* Ask AI button style */
button.bg-sidebar-b-search {
  color: rgba(255,255,255,0.45) !important;
}

/* ── Buttons → pill shape ── */
button, [class*="btn"], [role="button"] { border-radius: 9999px !important; }

/* Send button */
[class*="send-request"], [class*="sendRequest"], [class*="send-button"],
button[class*="Send"] {
  background: linear-gradient(180deg, #ffffff 0%, #aaaaaa 100%) !important;
  color: #000 !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: 9999px !important;
}
[class*="send-request"]:hover, [class*="send-button"]:hover { opacity: 0.88 !important; }

/* ── Sidebar collapse (bh-group) ── */
.bh-group-head {
  cursor: pointer !important;
  user-select: none;
  position: relative;
  color: var(--scalar-sidebar-color-2, #b4b4b4) !important;
  font-weight: 500 !important;
}
.bh-group-head *, .bh-group-head .font-bold {
  font-weight: 500 !important;
  color: var(--scalar-sidebar-color-2, #b4b4b4) !important;
}
.bh-group-head:hover, .bh-group-head:hover * { color: #fff !important; }
.scalar-api-reference {
  --scalar-sidebar-font-weight-active: 500 !important;
  --scalar-sidebar-color-active: #b4b4b4 !important;
  --scalar-sidebar-item-active-background: transparent !important;
}
.bh-group-head::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 1.5px solid rgba(255,255,255,0.45);
  border-bottom: 1.5px solid rgba(255,255,255,0.45);
  transform: translateY(-70%) rotate(45deg);
  transition: transform 0.2s ease;
}
.bh-group-head.bh-collapsed::after { transform: translateY(-30%) rotate(-45deg); }
.bh-group-hidden { display: none !important; }

/* ── Mobile scroll behavior ── */
@media (max-width: 768px) {
  body.bh-header-hidden #scalar-root [class*="sticky"],
  body.bh-header-hidden #scalar-root .t-doc__mobile-header {
    transform: translateY(-100%) !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
}