/* ============================================================================
 * Obelisk Partner API reference — Scalar theme
 *
 * Target: docs.orgo.ai (stock Mintlify "maple"), cloned literally.
 * Measured tokens: ai_docs/orgo-artifacts/orgo-docs-design-tokens.md
 * Plan: specs/obelisk-api-docs-orgo-parity.md
 *
 * DO NOT forward tokens from ai_docs/superscale-design-system.md here.
 * That file documents Obelisk's *product* system — warm chalk background,
 * light-only, orange accent — the opposite of this target. Forwarding it
 * reproduces playbook §4.1, the most expensive mistake in the port.
 *
 * Reviewer check: the two product-palette hexes named in the plan's §4 risk
 * table must not appear in this file. The literal values are deliberately
 * NOT written in this comment, so the grep cannot match itself.
 *
 * Variable names below were taken from the pinned bundle's own surface
 * (123 vars, `grep -o -- '--scalar-[a-z0-9-]*' scalar.js | sort -u`), not
 * from memory. @scalar/api-reference@1.65.1.
 * ========================================================================= */

/* --- Self-hosted Geist. Zero external origins: no Google Fonts, no CDN. ---
 * A standalone HTML page cannot use the app's bundler-driven font pipeline,
 * so the two latin variable faces are vendored under ./fonts/.
 * Code uses a system mono stack — Geist Mono is not a dependency of this
 * repo and adding one is out of scope for a look-and-feel change. */
@font-face {
  font-family: "Geist Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("./fonts/geist-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
    U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
    U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Geist Variable";
  font-style: italic;
  font-display: swap;
  font-weight: 100 900;
  src: url("./fonts/geist-latin-wght-italic.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
    U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
    U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============================================================================
 * 1. Token map
 * ========================================================================= */

.dark-mode,
.light-mode,
:root {
  /* --- Surfaces -----------------------------------------------------------
   * MEASURED: --fade-color-dark / --shiki-dark-bg = #0B0C0E on the target.
   * NOTE #141414 is the target's *accent* (colors.dark), NOT its background.
   * These two are easy to transpose; see the teardown §2. */
  --scalar-background-1: #0b0c0e;

  /* Signature #1 — untinted sidebar. The single biggest tell of the look:
   * same value as background-1, not a tinted or lifted variant. */
  --scalar-sidebar-background-1: #0b0c0e;

  /* Signature #2 — untinted panels. */
  --scalar-background-2: #0b0c0e;
  --scalar-background-3: #101216;
  --scalar-background-4: #16181d;
  --scalar-background-card: #0b0c0e;

  /* Signature #3 — flat. Affordances are borders and rings, never elevation. */
  --scalar-shadow-1: none;
  --scalar-shadow-2: none;
  --scalar-lifted-brightness: 1;
  --scalar-backdrop-brightness: 0.55;

  /* --- Ink --------------------------------------------------------------- */
  --scalar-color-1: #f7f7f8;
  --scalar-color-2: #9ca3af;
  --scalar-color-3: #6b7280;
  --scalar-color-disabled: #4b5563;
  --scalar-color-ghost: #6b7280;

  /* Accent — MEASURED colors.light #FAF7F2, a warm near-white.
   * Monochrome accent is deliberate: on this target the only saturated
   * colour on the page is the HTTP method set below. */
  --scalar-color-accent: #faf7f2;
  --scalar-background-accent: #16181d;

  --scalar-border-color: #1f2126;
  --scalar-border-width: 1px;

  /* --- Signature #5 — method colours are the ONLY saturation on the page --
   * Kept at the playbook's values: these read correctly against #0B0C0E and
   * are the one place the reference is allowed to be colourful. */
  --scalar-color-green: #2ab673;
  --scalar-color-blue: #3064e3;
  --scalar-color-orange: #da622b;
  --scalar-color-red: #cb3a32;
  --scalar-color-purple: #7c69ea;
  --scalar-color-yellow: #d4a72c;

  --scalar-color-alert: #da622b;
  --scalar-background-alert: rgba(218, 98, 43, 0.12);
  --scalar-color-danger: #cb3a32;
  --scalar-background-danger: rgba(203, 58, 50, 0.12);

  /* --- Type -------------------------------------------------------------- */
  --scalar-font: "Geist Variable", ui-sans-serif, system-ui, -apple-system,
    "Segoe UI", sans-serif;
  --scalar-font-code: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
    "Liberation Mono", monospace;

  --scalar-font-normal: 400;
  --scalar-font-medium: 500;
  --scalar-font-bold: 600;

  --scalar-heading-1: 1.75rem;
  --scalar-heading-2: 1.3125rem;
  --scalar-heading-3: 1.0625rem;
  --scalar-heading-4: 0.9375rem;

  --scalar-radius: 6px;
  --scalar-radius-lg: 10px;
  --scalar-radius-xl: 14px;

  /* --- Sidebar ----------------------------------------------------------- */
  --scalar-sidebar-color-1: #d1d5db;
  --scalar-sidebar-color-2: #8b929e;
  --scalar-sidebar-color-active: #faf7f2;
  --scalar-sidebar-border-color: #1f2126;
  --scalar-sidebar-item-hover-background: rgba(255, 255, 255, 0.04);
  --scalar-sidebar-item-hover-color: #faf7f2;
  --scalar-sidebar-item-active-background: transparent;
  --scalar-sidebar-font-weight: 400;
  --scalar-sidebar-font-weight-active: 500;
  --scalar-sidebar-search-background: #0b0c0e;
  --scalar-sidebar-search-border-color: #1f2126;
  --scalar-sidebar-search-color: #8b929e;

  /* Signature #4 — the left-rail active indicator.
   * Playbook §P1: in Scalar this is ALREADY variables. Confirmed present in
   * the pinned bundle. Do not hand-roll it with pseudo-elements. */
  --scalar-sidebar-indent-border: transparent;
  --scalar-sidebar-indent-border-hover: #2a2d34;
  --scalar-sidebar-indent-border-active: #faf7f2;

  /* --- Links ------------------------------------------------------------- */
  --scalar-link-color: #faf7f2;
  --scalar-link-color-hover: #ffffff;
  --scalar-link-color-visited: #faf7f2;
  --scalar-link-font-weight: 600;
  --scalar-text-decoration: none;
  --scalar-text-decoration-hover: none;

  --scalar-scrollbar-color: #2a2d34;
  --scalar-scrollbar-color-active: #3d424b;

  --scalar-tooltip-background: #16181d;
  --scalar-tooltip-color: #f7f7f8;
}

/* ============================================================================
 * 2. Rules that are not variables (playbook §P1 customCss list)
 * ========================================================================= */

/* --- Faux-bold active nav ---------------------------------------------------
 * Emphasises the active item WITHOUT reflowing layout, which a real weight
 * change would do (the sidebar would shift as you navigate). Cheap, and its
 * absence is oddly noticeable.
 *
 * Selector verified against the pinned bundle, which applies `.font-sidebar-active`
 * to the active item:
 *   .font-sidebar-active { font-weight: var(--scalar-sidebar-font-weight-active,
 *                                           var(--scalar-semibold)) }
 * This is why --scalar-sidebar-font-weight-active is set to 500 above rather
 * than 600: the weight bump stays small and the text-shadow supplies the rest
 * of the emphasis without changing metrics. */
.scalar-app .font-sidebar-active,
.scalar-app .text-sidebar-c-active {
  text-shadow: -0.2px 0 0 currentColor, 0.2px 0 0 currentColor;
}

/* --- Nested code frame ------------------------------------------------------
 * The most recognisable single component of the Mintlify look: a 16px-radius
 * shell with EXACTLY 2px of padding around a 14px-radius inner panel.
 *
 * IMPORTANT (measured): on this target --shiki-dark-bg EQUALS --fade-color-dark,
 * i.e. the code panel is the same fill as the page. The separation is carried
 * by this frame and its border, NOT by darkening the code background. The
 * playbook's "code sits BELOW the page" phrasing describes the *perceived*
 * result; implementing it as a darker fill here would diverge from the target. */
.scalar-card,
.examples .scalar-card,
.request-card,
.scalar-code-block {
  border-radius: 16px;
  padding: 2px;
  background: #101216;
  border: 1px solid var(--scalar-border-color);
  box-shadow: none;
}

.scalar-card > *,
.scalar-code-block > pre,
.request-card > * {
  border-radius: 14px;
  background: #0b0c0e;
}

/* --- Border-bottom prose links ---------------------------------------------
 * Weight 600, no underline, 1px accent border that thickens to 2px on hover.
 * Scoped to prose so it never touches sidebar or operation links. */
.markdown a:not(.scalar-button) {
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid rgba(250, 247, 242, 0.4);
  transition: border-bottom-color 0.15s ease, border-bottom-width 0.15s ease;
}
.markdown a:not(.scalar-button):hover {
  border-bottom: 2px solid var(--scalar-color-accent);
}

/* --- Flat everywhere --------------------------------------------------------
 * Belt-and-braces: the bundle sets a few shadows in rules rather than via the
 * shadow variables, so neutralise those too. */
.scalar-api-reference *,
.scalar-app * {
  box-shadow: none;
}
.scalar-api-reference .scalar-card,
.scalar-app .scalar-card {
  box-shadow: none;
}

/* --- Sticky header offset ---------------------------------------------------
 * Scalar folds --scalar-custom-header-height into
 *   --refs-header-height: calc(custom-header-height + header-height)
 * and offsets its own sticky sidebar and content by it. Set this or the
 * custom bar overlaps the content (playbook §P3). The value must match the
 * bar's real height in index.html. */
:root {
  --scalar-custom-header-height: 48px;
}

/* --- Custom header bar ------------------------------------------------------ */
.obelisk-docs-header {
  position: sticky;
  top: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  gap: 20px;
  height: 48px;
  padding: 0 18px;
  background: #0b0c0e;
  border-bottom: 1px solid var(--scalar-border-color);
  font-family: var(--scalar-font);
  font-size: 13px;
  color: var(--scalar-sidebar-color-1);
}

.obelisk-docs-header a {
  color: var(--scalar-sidebar-color-1);
  text-decoration: none;
  font-weight: 500;
}
.obelisk-docs-header a:hover {
  color: var(--scalar-color-accent);
}

.obelisk-docs-header__brand {
  display: flex;
  align-items: center;
  gap: 9px;
  font-weight: 600;
  color: var(--scalar-color-1);
  margin-right: 4px;
}

/* The logo inherits currentColor (see index.html, playbook §4.8) so a single
 * asset works on this dark bar and on a light surface without a second file. */
.obelisk-docs-header__brand svg {
  width: 20px;
  height: 20px;
  color: var(--scalar-color-1);
}

.obelisk-docs-header__spacer {
  flex: 1;
}

/* CSS-only disclosure menus — the page needs no script beyond the renderer. */
.obelisk-docs-header details {
  position: relative;
}
.obelisk-docs-header summary {
  list-style: none;
  cursor: pointer;
  font-weight: 500;
}
.obelisk-docs-header summary::-webkit-details-marker {
  display: none;
}
.obelisk-docs-header details[open] > summary {
  color: var(--scalar-color-accent);
}
.obelisk-docs-header details > div {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  min-width: 210px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 7px;
  background: #101216;
  border: 1px solid var(--scalar-border-color);
  border-radius: 10px;
}
.obelisk-docs-header details > div a {
  padding: 6px 9px;
  border-radius: 6px;
  font-weight: 400;
}
.obelisk-docs-header details > div a:hover {
  background: rgba(255, 255, 255, 0.05);
}

/* Collapse to a single disclosure below Scalar's OWN layout breakpoint
 * (1000px) so the bar keeps a fixed 48px height instead of wrapping — a
 * wrapped bar desynchronises --scalar-custom-header-height and the content
 * offset drifts. */
.obelisk-docs-header__nav {
  display: flex;
  align-items: center;
  gap: 20px;
}
.obelisk-docs-header__compact {
  display: none;
}

@media (max-width: 1000px) {
  .obelisk-docs-header__nav {
    display: none;
  }
  .obelisk-docs-header__compact {
    display: block;
  }
  .obelisk-docs-header details > div {
    left: auto;
    right: 0;
  }
}

/* --- Prose ------------------------------------------------------------------ */
.markdown h1,
.markdown h2,
.markdown h3 {
  letter-spacing: -0.015em;
}

.markdown table {
  border-collapse: collapse;
  font-size: 0.875rem;
}
.markdown th,
.markdown td {
  border: 1px solid var(--scalar-border-color);
  padding: 7px 11px;
}
.markdown th {
  background: #101216;
  font-weight: 600;
}
