/* ============================================================
   JarvisCore Docs — Custom Theme
   ============================================================ */

/* ---------- Material Custom Palette Overrides ---------- */
[data-md-color-primary="custom"] {
  --md-primary-fg-color: #1758F5;
  --md-primary-fg-color--light: #35B0FE;
  --md-primary-fg-color--dark: #0533AC;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: rgba(255, 255, 255, 0.7);
}

[data-md-color-accent="custom"] {
  --md-accent-fg-color: #0CF0E3;
  --md-accent-fg-color--light: rgba(12, 240, 227, 0.1);
  --md-accent-bg-color-light: rgba(12, 240, 227, 0.1);
}

/* ---------- Google Fonts ---------- */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

/* ---------- Design Tokens ---------- */
:root {
  --jc-brand: #1758F5;
  --jc-brand-light: #35B0FE;
  --jc-brand-dark: #0533AC;
  --jc-accent: #0CF0E3;
  --jc-purple: #4951F3;

  /* UI Semantic Colors */
  --jc-green: #0CC572;          /* UI Green — success, active, healthy states */
  --jc-green-subtle: rgba(12, 197, 114, 0.10);
  --jc-yellow: #E8A302;         /* UI Yellow — warnings, in-progress, caution */
  --jc-yellow-subtle: rgba(232, 163, 2, 0.10);

  --jc-surface: #f8fafc;
  --jc-border: #e2e8f0;
  --jc-text-muted: #64748b;

  --jc-gradient: linear-gradient(135deg, #35B0FE 0%, #2457F7 35%, #443ACC 68%, #752CEA 100%);
  --jc-gradient-subtle: linear-gradient(135deg, rgba(23, 88, 245, 0.06) 0%, rgba(12, 240, 227, 0.04) 100%);
  --jc-gradient-brand: linear-gradient(135deg, #0533AC 0%, #0971EE 50%, #023DF3 100%);

  --jc-radius: 10px;
  --jc-shadow: 0 4px 24px rgba(23, 88, 245, 0.10);
  --jc-shadow-hover: 0 8px 32px rgba(23, 88, 245, 0.18);
  --jc-transition: 0.22s cubic-bezier(0.4, 0, 0.2, 1);

  /* Sidebar width — wider than Material default (12rem) so labels never truncate */
  --md-sidebar-width: 15rem;
}

[data-md-color-scheme="slate"] {
  --jc-surface: #0f1117;
  --jc-border: #1e2130;
  --jc-text-muted: #94a3b8;
  --jc-gradient-subtle: linear-gradient(135deg, rgba(23, 88, 245, 0.12) 0%, rgba(12, 240, 227, 0.08) 100%);
  --jc-shadow: 0 4px 24px rgba(0, 0, 0, 0.40);
  --jc-shadow-hover: 0 8px 40px rgba(23, 88, 245, 0.25);
}

/* ---------- Base Typography ---------- */
body,
.md-content {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ── Heading scale & site-wide colour hierarchy ───────────────────────────
   H1 — page title        → default (dark/white per scheme), large + bold
   H2 — section grouper  → brand blue + left border accent
   H3 — sub-section       → brand-light blue
   H4 — individual item   → slightly muted, normal weight
   ─────────────────────────────────────────────────────────────────────── */

.md-typeset h1 {
  font-weight: 700;
  letter-spacing: -0.025em;
}

.md-typeset h2 {
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--jc-brand);
  border-left: 3px solid var(--jc-brand);
  padding-left: 0.7rem;
  margin-top: 2rem;
}

.md-typeset h3 {
  font-weight: 600;
  color: var(--jc-brand-light);
}

.md-typeset h4 {
  font-weight: 500;
  color: var(--jc-text-muted);
}

/* Dark mode heading colours */
[data-md-color-scheme="slate"] .md-typeset h2 {
  color: var(--jc-brand-light);
  border-left-color: var(--jc-brand-light);
}

[data-md-color-scheme="slate"] .md-typeset h3 {
  color: #7ec8f8;
}

[data-md-color-scheme="slate"] .md-typeset h4 {
  color: var(--jc-text-muted);
}

/* ── Body copy density — tight prose ── */
.md-typeset {
  font-size: 0.7875rem !important;
  line-height: 1.5 !important;
}

.md-typeset p {
  font-size: 0.7875rem;
  line-height: 1.5;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}

.md-typeset li {
  font-size: 0.7875rem;
  line-height: 1.45;
}

.md-typeset dt,
.md-typeset dd {
  font-size: 0.75rem;
  line-height: 1.45;
}

.md-typeset .admonition p,
.md-typeset details p {
  font-size: 0.75rem;
  line-height: 1.45;
}

.md-typeset table td,
.md-typeset table th {
  font-size: 0.75rem;
  line-height: 1.4;
}

.md-typeset table th {
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
}

.md-typeset code,
.md-typeset pre code {
  font-size: 0.72rem;
  line-height: 1.38;
}

/* Headings stay prominent but tighter */
.md-typeset h1 {
  font-size: 1.75rem;
  line-height: 1.2;
}

.md-typeset h2 {
  font-size: 1.05rem;
  line-height: 1.25;
}

.md-typeset h3 {
  font-size: 0.9rem;
  line-height: 1.3;
}

.md-typeset h4 {
  font-size: 0.85rem;
  line-height: 1.35;
}

/* ============================================================
   HEADER — adaptive: white in light mode, #0c0c0e in dark
   ============================================================ */

/* Light mode */
.md-header {
  background: #ffffff !important;
  box-shadow: none !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.md-header[data-md-state="shadow"] {
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06) !important;
}

/* Dark mode */
[data-md-color-scheme="slate"] .md-header {
  background: #0c0c0e !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

[data-md-color-scheme="slate"] .md-header[data-md-state="shadow"] {
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

/* Push theme-toggle (palette form) to the far right */
.md-header__inner {
  display: flex;
  align-items: center;
}

/* Prevent title from collapsing due to flex rules */
.md-header__title {
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  min-width: max-content !important;
  font-family: 'Inter', sans-serif;
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  color: #0c0c0e !important;
  margin-left: 0.45rem;
}

[data-md-color-scheme="slate"] .md-header__title {
  color: #fff !important;
}

/* Center the search bar absolutely in the header */
.md-header .md-header__inner.md-grid {
  position: relative !important;
}

.md-header .md-header__inner .md-search,
.md-header .md-search[data-md-component="search"] {
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 380px !important;
  max-width: calc(100vw - 16rem) !important;
  z-index: 2 !important;
}

/* On small screens, reset ALL custom desktop overrides so Material's
   native mobile layout (hamburger menu, drawer nav, overlay search) works. */
@media screen and (max-width: 59.9375em) {

  /* ── Header ── */
  /* Hide site title text on mobile — logo is enough */
  .md-header__title {
    display: none !important;
  }

  .md-header__button.md-logo img,
  .md-header__button.md-logo svg {
    height: 18px !important;
  }

  .md-header__button.md-logo {
    margin-right: 0.5rem !important;
  }

  /* Hide desktop-only header widgets */
  .jc-version-chip,
  .jc-gh-stars-btn {
    display: none !important;
  }

  /* ── Search — let Material handle the mobile overlay ── */
  .md-header .md-header__inner .md-search,
  .md-header .md-search[data-md-component="search"] {
    position: static !important;
    left: auto !important;
    transform: none !important;
    width: auto !important;
    max-width: none !important;
  }

  .md-header .md-search__form::after {
    display: none !important; /* Hide ⌘K badge */
  }

  /* Reset custom search modal — let Material's native overlay work */
  [data-md-toggle="search"]:checked ~ .md-header .md-search {
    position: fixed !important;
    padding-top: 0 !important;
  }

  [data-md-toggle="search"]:checked ~ .md-header .md-search__inner {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* ── Tabs — hidden by Material on mobile, enforce it ── */
  .md-tabs {
    display: none !important;
  }

  /* ── Content — full width, no left cut ── */
  .md-content {
    max-width: 100% !important;
    margin-left: 0 !important;
    padding: 0 1rem !important;
  }

  /* ── Sidebar — DON'T override Material's native drawer behavior.
     Only reset min-width so the desktop 15rem enforcement doesn't
     interfere with Material's transform-based hide/show. ── */
  .md-sidebar--primary {
    min-width: 0 !important;
  }

  /* ── Mobile drawer aesthetics ── */

  /* Drawer header — clean neutral bg instead of Material's branded blue */
  .md-nav--primary > .md-nav__title {
    background: #ffffff !important;
    color: var(--jc-brand) !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 700 !important;
    box-shadow: none !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
  }

  /* Hide "JARVISCORE" site name text in drawer — logo in topbar is enough.
     The .md-ellipsis span inside the primary title holds the site name. */
  .md-nav--primary > .md-nav__title .md-ellipsis {
    display: none !important;
  }

  [data-md-color-scheme="slate"] .md-nav--primary > .md-nav__title {
    background: #161618 !important;
    color: var(--jc-brand-light) !important;
    border-bottom-color: rgba(255, 255, 255, 0.08) !important;
  }

  /* Hide the repo badge inside drawer — we have our own GH widget */
  .md-nav--primary .md-source {
    display: none !important;
  }

  /* Back arrow — brand colored */
  .md-nav--primary .md-nav__title .md-nav__icon {
    color: var(--jc-brand) !important;
  }

  [data-md-color-scheme="slate"] .md-nav--primary .md-nav__title .md-nav__icon {
    color: var(--jc-brand-light) !important;
  }

  /* Active item — brand accent (light touch, no layout changes) */
  .md-nav--primary .md-nav__item--active > .md-nav__link {
    color: var(--jc-brand) !important;
  }

  /* Prevent horizontal overflow from any leaking desktop rules */
  html, body {
    overflow-x: hidden !important;
  }
}

.md-header .md-search__form {
  width: 100%;
}

/* Push right-side items (GH widget, palette toggle) to far right */
.jc-version-chip {
  margin-right: auto;
}

/* Hide Material's built-in repo source link — we don't use it */
.md-header__source {
  display: none !important;
}

/* Hide edit/view-source icon button in header */
[data-md-component="header"] .md-header__button[title*="Edit"],
[data-md-component="header"] .md-header__button[title*="View"] {
  display: none !important;
}

/* Logo */
.md-header__button.md-logo {
  padding: 0 !important;
  margin-right: 1.2rem;
  display: flex;
  align-items: center;
  width: auto !important;
}

.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  height: 18px !important;
  width: auto !important;
}

[data-md-color-scheme="slate"] .md-header__button.md-logo img {
  content: url("../assets/wordmark-white.svg");
}

/* All header icons/buttons */
.md-header .md-icon,
.md-header .md-header__button {
  color: rgba(0, 0, 0, 0.45) !important;
  transition: color 0.15s ease;
}

.md-header .md-header__button:hover {
  color: rgba(0, 0, 0, 0.8) !important;
}

[data-md-color-scheme="slate"] .md-header .md-icon,
[data-md-color-scheme="slate"] .md-header .md-header__button {
  color: rgba(255, 255, 255, 0.5) !important;
}

[data-md-color-scheme="slate"] .md-header .md-header__button:hover {
  color: #fff !important;
}

/* ============================================================
   SEARCH UI (Pill & Modal)
   ============================================================ */

/* 1. Idle Search Bar (Pill) */
.md-header .md-search__form {
  background: rgba(0, 0, 0, 0.05) !important;
  border-radius: 99px !important;
  border: none !important;
  height: 36px !important;
  position: relative;
  transition: all 0.2s ease;
}

.md-header .md-search__input {
  font-family: 'Inter', sans-serif;
  font-size: 0.85rem;
  color: #0c0c0e !important;
  padding-left: 2.2rem !important;
  padding-right: 2.5rem !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  background: transparent !important;
}

.md-header .md-search__input::placeholder {
  color: rgba(0, 0, 0, 0.4) !important;
}

/* Show the search icon */
.md-search__icon[for="__search"] {
  display: block !important;
  position: absolute;
  left: 0.7rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1rem;
  height: 1rem;
  color: rgba(0, 0, 0, 0.4);
}

/* Add the ⌘K badge */
.md-header .md-search__form::after {
  content: "⌘K";
  position: absolute;
  right: 0.8rem;
  top: 50%;
  transform: translateY(-50%);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 0.75rem;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.4);
  pointer-events: none;
}

/* 2. Active Search State (Modal) */
[data-md-toggle="search"]:checked~.md-header .md-search {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 100 !important;
  transform: none !important;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding-top: 15vh;
}

/* Modal Overlay (Blur + Click to close) */
[data-md-toggle="search"]:checked~.md-header .md-search__overlay {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background: rgba(0, 0, 0, 0.4) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  z-index: 0 !important;
  opacity: 1 !important;
  cursor: default !important;
  display: block !important;
}

/* Modal Box (Inner) */
[data-md-toggle="search"]:checked~.md-header .md-search__inner {
  position: relative !important;
  width: 600px !important;
  max-width: 90vw !important;
  background: transparent !important;
  box-shadow: none !important;
  top: 0 !important;
  transform: none !important;
  left: 0 !important;
  z-index: 10 !important;
}

/* Active Modal Header (Form) */
[data-md-toggle="search"]:checked~.md-header .md-search__form {
  background: #fff !important;
  border-radius: 12px 12px 0 0 !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
  height: 56px !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1) !important;
}

[data-md-toggle="search"]:checked~.md-header .md-search__form::after {
  display: none !important;
  /* Hide ⌘K when active */
}

/* Active Modal Body (Output/Results) */
[data-md-toggle="search"]:checked~.md-header .md-search__output {
  position: static !important;
  background: #fff !important;
  border-radius: 0 0 12px 12px !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  border-top: none !important;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15) !important;
  max-height: 60vh !important;
  overflow: hidden !important;
}

/* Dark Mode Tweaks */
[data-md-color-scheme="slate"] .md-header .md-search__form {
  background: rgba(255, 255, 255, 0.08) !important;
}

[data-md-color-scheme="slate"] .md-header .md-search__input {
  color: #fff !important;
}

[data-md-color-scheme="slate"] .md-header .md-search__input::placeholder,
[data-md-color-scheme="slate"] .md-search__icon[for="__search"],
[data-md-color-scheme="slate"] .md-header .md-search__form::after {
  color: rgba(255, 255, 255, 0.5) !important;
}

[data-md-color-scheme="slate"] [data-md-toggle="search"]:checked~.md-header .md-search__form {
  background: #1e1e1e !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-md-color-scheme="slate"] [data-md-toggle="search"]:checked~.md-header .md-search__output {
  background: #1e1e1e !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

/* ── Version chip ─────────────────────────────────────── */
.jc-version-chip {
  display: inline-flex;
  align-items: center;
  font-family: 'Inter', sans-serif;
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.03em;
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  color: rgba(0, 0, 0, 0.4);
  margin-left: 0.6rem;
  white-space: nowrap;
  flex-shrink: 0;
}

[data-md-color-scheme="slate"] .jc-version-chip {
  border-color: rgba(255, 255, 255, 0.15);
  color: rgba(255, 255, 255, 0.4);
}

/* ── GitHub stars widget ──────────────────────────────── */
.jc-gh-stars-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.5) !important;
  text-decoration: none !important;
  margin: 0 0.5rem;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
  flex-shrink: 0;
  white-space: nowrap;
}

.jc-gh-stars-btn:hover {
  border-color: var(--jc-brand);
  color: var(--jc-brand) !important;
  background: rgba(23, 88, 245, 0.05);
  text-decoration: none !important;
}

.jc-gh-repo {
  font-weight: 500;
  letter-spacing: -0.01em;
}

.jc-gh-sep {
  opacity: 0.4;
  font-size: 0.7rem;
  margin: 0 1px;
}

.jc-stars-count {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

[data-md-color-scheme="slate"] .jc-gh-stars-btn {
  border-color: rgba(255, 255, 255, 0.13);
  color: rgba(255, 255, 255, 0.48) !important;
}

[data-md-color-scheme="slate"] .jc-gh-stars-btn:hover {
  border-color: var(--jc-brand-light);
  color: var(--jc-brand-light) !important;
  background: rgba(23, 88, 245, 0.1);
}




/* ============================================================
   NAVIGATION TABS — adaptive: white light / dark in slate
   ============================================================ */

/* ============================================================
   NAVIGATION TABS — tight bottom-hugging active underline
   ============================================================ */

.md-tabs {
  background: #ffffff !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  margin-top: 0;
  min-height: 0;
}

[data-md-color-scheme="slate"] .md-tabs {
  background: #0c0c0e !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  margin-top: 0;
}

/* The tab list — zero padding so links sit flush */
.md-tabs__list {
  padding: 0;
  margin: 0;
  display: flex;
  align-items: stretch;
  /* children fill full height */
}

.md-tabs__item {
  /* let the item height be driven by the link */
  display: flex;
  align-items: stretch;
}

.md-tabs__link {
  font-family: 'Inter', sans-serif;
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0;
  color: #292929 !important;
  opacity: 1 !important;
  /* tight vertical padding — 6px top, only 4px bottom so underline is RIGHT at the bar */
  padding: 6px 12px 4px;
  position: relative;
  transition: color 0.15s ease;
  margin-top: 0 !important;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  text-decoration: none;
  /* no bottom gap — the 2px underline will touch the border */
  box-sizing: border-box;
}

[data-md-color-scheme="slate"] .md-tabs__link {
  color: rgba(255, 255, 255, 0.42) !important;
}

/* Active underline — pinned to very bottom of the tab row */
.md-tabs__link::after {
  content: '';
  position: absolute;
  bottom: -1px;
  /* sit on top of the border-bottom of .md-tabs */
  left: 12px;
  right: 12px;
  height: 2px;
  background: var(--jc-brand);
  border-radius: 2px 2px 0 0;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}

.md-tabs__link:hover {
  color: #1a1a1a !important;
  text-decoration: none;
}

[data-md-color-scheme="slate"] .md-tabs__link:hover {
  color: rgba(255, 255, 255, 0.8) !important;
}

.md-tabs__item--active .md-tabs__link {
  color: var(--jc-brand) !important;
  font-weight: 600 !important;
}

[data-md-color-scheme="slate"] .md-tabs__item--active .md-tabs__link {
  color: var(--jc-brand) !important;
}

.md-tabs__item--active .md-tabs__link::after {
  transform: scaleX(1);
}

/* Hover preview of underline */
.md-tabs__item:not(.md-tabs__item--active) .md-tabs__link:hover::after {
  transform: scaleX(0.6);
  opacity: 0.35;
}

/* ============================================================
   TAB BAR ICONS — Getting Started only (links directly to a page,
   no index, so Material can't auto-render from frontmatter).
   Concepts / Guides / Reference / Enterprise now have index pages
   with frontmatter icons — Material renders those natively.
   ============================================================ */

/* Getting Started — rocket launch (tab bar only) */
.md-tabs__link[href*="getting-started"]::before {
  content: '';
  display: inline-block;
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: middle;
  margin-right: 2px;
  opacity: 0.85;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2.81 14.12L5.64 11.29L8.17 13.82C9.78 12.5 11.5 11.39 13.5 10.62L13.57 10.69C15 8.5 17.5 7 20.23 7A9.98 9.98 0 0 1 22 12C22 17.52 17.52 22 12 22C8.91 22 6.19 20.55 4.43 18.3L6.56 16.17C7.72 17.65 9.5 18.6 11.5 18.91L11.5 15.79C9.28 15.36 7.19 14.36 5.64 13L2.81 14.12M13.5 13.43V18.91C15.5 18.6 17.28 17.65 18.44 16.17L16.36 14.09C15.5 14.82 14.53 15.22 13.5 15.43M5.5 5A2 2 0 0 0 3.5 7A2 2 0 0 0 5.5 9A2 2 0 0 0 7.5 7A2 2 0 0 0 5.5 5Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2.81 14.12L5.64 11.29L8.17 13.82C9.78 12.5 11.5 11.39 13.5 10.62L13.57 10.69C15 8.5 17.5 7 20.23 7A9.98 9.98 0 0 1 22 12C22 17.52 17.52 22 12 22C8.91 22 6.19 20.55 4.43 18.3L6.56 16.17C7.72 17.65 9.5 18.6 11.5 18.91L11.5 15.79C9.28 15.36 7.19 14.36 5.64 13L2.81 14.12M13.5 13.43V18.91C15.5 18.6 17.28 17.65 18.44 16.17L16.36 14.09C15.5 14.82 14.53 15.22 13.5 15.43M5.5 5A2 2 0 0 0 3.5 7A2 2 0 0 0 5.5 9A2 2 0 0 0 7.5 7A2 2 0 0 0 5.5 5Z'/%3E%3C/svg%3E");
}

/* ============================================================
   WELCOME PAGE — Website / Community / Blog sidebar icons
   Injected as ::before pseudo on links matching those hrefs.
   ============================================================ */
.md-sidebar--primary .md-nav__link[href="https://developers.prescottdata.io"]::before,
.md-sidebar--primary .md-nav__link[href="https://discord.gg/jarviscore"]::before,
.md-sidebar--primary .md-nav__link[href="https://developers.prescottdata.io/blog"]::before {
  content: '';
  display: inline-block;
  width: 0.85rem;
  height: 0.85rem;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  margin-right: 0.45rem;
  opacity: 0.6;
  vertical-align: middle;
}

/* Website — globe/web icon */
.md-sidebar--primary .md-nav__link[href="https://developers.prescottdata.io"]::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16.36 14C16.44 13.34 16.5 12.68 16.5 12S16.44 10.66 16.36 10H19.74C19.9 10.64 20 11.31 20 12S19.9 13.36 19.74 14M14.59 19.56C15.19 18.45 15.65 17.25 15.97 16H18.92C17.96 17.65 16.43 18.93 14.59 19.56M14.34 14H9.66C9.56 13.34 9.5 12.68 9.5 12S9.56 10.65 9.66 10H14.34C14.43 10.65 14.5 11.32 14.5 12S14.43 13.34 14.34 14M12 19.96C11.17 18.76 10.5 17.43 10.09 16H13.91C13.5 17.43 12.83 18.76 12 19.96M8 8H5.08C6.03 6.34 7.57 5.06 9.4 4.44C8.8 5.55 8.35 6.75 8 8M5.08 16H8C8.35 17.25 8.8 18.45 9.4 19.56C7.57 18.93 6.03 17.65 5.08 16M4.26 14C4.1 13.36 4 12.69 4 12S4.1 10.64 4.26 10H7.64C7.56 10.66 7.5 11.32 7.5 12S7.56 13.34 7.64 14M12 4.03C12.83 5.23 13.5 6.57 13.91 8H10.09C10.5 6.57 11.17 5.23 12 4.03M18.92 8H15.97C15.65 6.75 15.19 5.55 14.59 4.44C16.43 5.07 17.96 6.34 18.92 8M12 2C6.47 2 2 6.5 2 12A10 10 0 0 0 12 22A10 10 0 0 0 22 12A10 10 0 0 0 12 2Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16.36 14C16.44 13.34 16.5 12.68 16.5 12S16.44 10.66 16.36 10H19.74C19.9 10.64 20 11.31 20 12S19.9 13.36 19.74 14M14.59 19.56C15.19 18.45 15.65 17.25 15.97 16H18.92C17.96 17.65 16.43 18.93 14.59 19.56M14.34 14H9.66C9.56 13.34 9.5 12.68 9.5 12S9.56 10.65 9.66 10H14.34C14.43 10.65 14.5 11.32 14.5 12S14.43 13.34 14.34 14M12 19.96C11.17 18.76 10.5 17.43 10.09 16H13.91C13.5 17.43 12.83 18.76 12 19.96M8 8H5.08C6.03 6.34 7.57 5.06 9.4 4.44C8.8 5.55 8.35 6.75 8 8M5.08 16H8C8.35 17.25 8.8 18.45 9.4 19.56C7.57 18.93 6.03 17.65 5.08 16M4.26 14C4.1 13.36 4 12.69 4 12S4.1 10.64 4.26 10H7.64C7.56 10.66 7.5 11.32 7.5 12S7.56 13.34 7.64 14M12 4.03C12.83 5.23 13.5 6.57 13.91 8H10.09C10.5 6.57 11.17 5.23 12 4.03M18.92 8H15.97C15.65 6.75 15.19 5.55 14.59 4.44C16.43 5.07 17.96 6.34 18.92 8M12 2C6.47 2 2 6.5 2 12A10 10 0 0 0 12 22A10 10 0 0 0 22 12A10 10 0 0 0 12 2Z'/%3E%3C/svg%3E");
}

/* Community — Discord bubble */
.md-sidebar--primary .md-nav__link[href="https://discord.gg/jarviscore"]::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.317 4.492c-1.53-.69-3.17-1.2-4.885-1.49a.075.075 0 0 0-.079.036c-.21.369-.444.85-.608 1.23a18.566 18.566 0 0 0-5.487 0 12.36 12.36 0 0 0-.617-1.23A.077.077 0 0 0 8.562 3c-1.714.29-3.354.8-4.885 1.491a.07.07 0 0 0-.032.027C.533 9.093-.32 13.555.099 17.961a.08.08 0 0 0 .031.055 20.03 20.03 0 0 0 5.993 2.98.078.078 0 0 0 .084-.026c.462-.62.874-1.275 1.226-1.963.021-.04.001-.088-.041-.104a13.201 13.201 0 0 1-1.872-.878.075.075 0 0 1-.008-.125c.126-.093.252-.19.372-.287a.075.075 0 0 1 .078-.01c3.927 1.764 8.18 1.764 12.061 0a.075.075 0 0 1 .079.009c.12.098.245.195.372.288a.075.075 0 0 1-.006.125c-.598.344-1.22.635-1.873.877a.075.075 0 0 0-.041.105c.36.687.772 1.341 1.225 1.962a.077.077 0 0 0 .084.028 19.963 19.963 0 0 0 6.002-2.981.076.076 0 0 0 .032-.054c.5-5.094-.838-9.52-3.549-13.442a.06.06 0 0 0-.031-.028zM8.02 15.278c-1.182 0-2.157-1.069-2.157-2.38 0-1.312.956-2.38 2.157-2.38 1.21 0 2.176 1.077 2.157 2.38 0 1.312-.956 2.38-2.157 2.38zm7.975 0c-1.183 0-2.157-1.069-2.157-2.38 0-1.312.955-2.38 2.157-2.38 1.21 0 2.176 1.077 2.157 2.38 0 1.312-.946 2.38-2.157 2.38z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.317 4.492c-1.53-.69-3.17-1.2-4.885-1.49a.075.075 0 0 0-.079.036c-.21.369-.444.85-.608 1.23a18.566 18.566 0 0 0-5.487 0 12.36 12.36 0 0 0-.617-1.23A.077.077 0 0 0 8.562 3c-1.714.29-3.354.8-4.885 1.491a.07.07 0 0 0-.032.027C.533 9.093-.32 13.555.099 17.961a.08.08 0 0 0 .031.055 20.03 20.03 0 0 0 5.993 2.98.078.078 0 0 0 .084-.026c.462-.62.874-1.275 1.226-1.963.021-.04.001-.088-.041-.104a13.201 13.201 0 0 1-1.872-.878.075.075 0 0 1-.008-.125c.126-.093.252-.19.372-.287a.075.075 0 0 1 .078-.01c3.927 1.764 8.18 1.764 12.061 0a.075.075 0 0 1 .079.009c.12.098.245.195.372.288a.075.075 0 0 1-.006.125c-.598.344-1.22.635-1.873.877a.075.075 0 0 0-.041.105c.36.687.772 1.341 1.225 1.962a.077.077 0 0 0 .084.028 19.963 19.963 0 0 0 6.002-2.981.076.076 0 0 0 .032-.054c.5-5.094-.838-9.52-3.549-13.442a.06.06 0 0 0-.031-.028zM8.02 15.278c-1.182 0-2.157-1.069-2.157-2.38 0-1.312.956-2.38 2.157-2.38 1.21 0 2.176 1.077 2.157 2.38 0 1.312-.956 2.38-2.157 2.38zm7.975 0c-1.183 0-2.157-1.069-2.157-2.38 0-1.312.955-2.38 2.157-2.38 1.21 0 2.176 1.077 2.157 2.38 0 1.312-.946 2.38-2.157 2.38z'/%3E%3C/svg%3E");
}

/* Blog — RSS feed */
.md-sidebar--primary .md-nav__link[href="https://developers.prescottdata.io/blog"]::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.18 15.64A2.18 2.18 0 0 1 8.36 17.82C8.36 19 7.38 20 6.18 20C4.98 20 4 19 4 17.82A2.18 2.18 0 0 1 6.18 15.64M4 4.44A15.56 15.56 0 0 1 19.56 20H16.73A12.73 12.73 0 0 0 4 7.27V4.44M4 10.1A9.9 9.9 0 0 1 13.9 20H11.07A7.07 7.07 0 0 0 4 12.93V10.1Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.18 15.64A2.18 2.18 0 0 1 8.36 17.82C8.36 19 7.38 20 6.18 20C4.98 20 4 19 4 17.82A2.18 2.18 0 0 1 6.18 15.64M4 4.44A15.56 15.56 0 0 1 19.56 20H16.73A12.73 12.73 0 0 0 4 7.27V4.44M4 10.1A9.9 9.9 0 0 1 13.9 20H11.07A7.07 7.07 0 0 0 4 12.93V10.1Z'/%3E%3C/svg%3E");
}


/* ============================================================
   LEFT SIDEBAR — premium redesign
   ============================================================ */

/* Sidebar container */
.md-sidebar--primary .md-sidebar__scrollwrap {
  padding: 0.15rem 0 2rem;
}

/* Section group LINK labels (e.g. "GUIDES", "GETTING STARTED") — visual styles.
   Applied to both desktop sidebar and mobile drawer for consistent typography. */
.md-sidebar--primary .md-nav--primary>.md-nav__list>.md-nav__item>.md-nav__link {
  font-family: 'Inter', sans-serif;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--jc-text-muted) !important;
  padding: 0.9rem 0.75rem 0.3rem;
  opacity: 0.7;
}

/* Desktop ONLY: section labels are non-interactive group headers.
   On mobile these same elements ARE the clickable Level 1 items
   that expand to Level 2, so pointer-events must stay enabled. */
@media screen and (min-width: 60em) {
  .md-sidebar--primary .md-nav--primary>.md-nav__list>.md-nav__item>.md-nav__link {
    cursor: default;
    pointer-events: none;
  }
}

/* Desktop sidebar: top-level nav title (site name / section header label).
   Visual style only — pointer-events:none NOT applied here because the same
   .md-nav__title element inside nested navs serves as the BACK ARROW in the
   mobile drawer and must remain clickable. */
.md-sidebar--primary .md-nav__title {
  font-family: 'Inter', sans-serif;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--jc-text-muted) !important;
  opacity: 0.7;
}

/* Sidebar nav links — DESKTOP SIDEBAR ONLY.
   Scoped to .md-sidebar--primary so styles don't bleed into the
   mobile drawer which uses the same HTML but needs bigger touch targets. */
.md-sidebar--primary .md-nav__link {
  font-family: 'Inter', sans-serif;
  font-size: 0.65rem;
  font-weight: 400;
  color: var(--md-default-fg-color) !important;
  opacity: 0.88;
  padding: 0.24rem 0.6rem;
  border-radius: 6px;
  margin: 1px 0.25rem;
  display: flex;
  align-items: center;
  transition: background 0.13s ease, color 0.13s ease, opacity 0.13s ease;
  position: relative;
  text-decoration: none !important;
  white-space: normal;
  overflow: visible;
  word-break: break-word;
}

.md-sidebar--primary .md-nav__link:hover {
  background: rgba(23, 88, 245, 0.07);
  color: var(--jc-brand) !important;
  opacity: 1;
  text-decoration: none !important;
}

[data-md-color-scheme="slate"] .md-sidebar--primary .md-nav__link:hover {
  background: rgba(23, 88, 245, 0.12);
  color: var(--jc-brand-light) !important;
}

/* Active left-bar indicator — desktop sidebar only */
.md-sidebar--primary .md-nav__link--active {
  font-weight: 600;
  color: var(--jc-brand) !important;
  opacity: 1;
  background: rgba(23, 88, 245, 0.08);
}

.md-sidebar--primary .md-nav__link--active::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--jc-brand);
  border-radius: 0 2px 2px 0;
}

[data-md-color-scheme="slate"] .md-sidebar--primary .md-nav__link--active {
  color: var(--jc-brand-light) !important;
  background: rgba(23, 88, 245, 0.15);
}

/* Nested sub-items — desktop sidebar only */
.md-sidebar--primary .md-nav--secondary .md-nav__link,
.md-sidebar--primary .md-nav__item--nested .md-nav .md-nav__link {
  font-size: 0.63rem;
  opacity: 0.75;
  padding-left: 1rem;
  white-space: normal;
  overflow: visible;
  word-break: break-word;
}

.md-sidebar--primary .md-nav--secondary .md-nav__link:hover,
.md-sidebar--primary .md-nav__item--nested .md-nav .md-nav__link:hover {
  opacity: 1;
}

/* Sidebar section dividers */
.md-nav__item+.md-nav__item {
  margin-top: 0;
}

/* Remove default Material nav item bullet */
.md-nav__item {
  list-style: none;
}

/* ---------- Custom Scrollbar ---------- */
::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: var(--jc-brand);
  border-radius: 99px;
  opacity: 0.5;
}

/* ============================================================
   HERO SECTION
   ============================================================ */

.jc-hero {
  text-align: center;
  padding: 1.75rem 1.5rem 1.25rem;
  position: relative;
  overflow: hidden;
  clear: both;
}

.jc-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--jc-gradient-subtle);
  z-index: 0;
}

.jc-hero>* {
  position: relative;
  z-index: 1;
}

/* Hide the ugly ¶ anchor inside hero heading */
.jc-hero h1 .headerlink,
.jc-hero h1 a.headerlink {
  display: none !important;
}

.jc-hero-logo {
  display: block;
  margin: 0 auto 1.5rem !important;
  height: 90px !important;
  width: auto !important;
}

[data-md-color-scheme="slate"] .jc-hero-logo {
  content: url("../assets/combo-white.svg");
}

.jc-hero h1 {
  font-size: clamp(1.35rem, 3.5vw, 1.85rem) !important;
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.1;
  margin-bottom: 0.5rem !important;
  margin-top: 0 !important;
  color: var(--md-default-fg-color);
}

.jc-hero p {
  font-size: 0.74rem !important;
  color: var(--jc-text-muted);
  max-width: 480px;
  margin: 0 auto 0.85rem !important;
  line-height: 1.5;
  font-weight: 400;
}

/* Hero code block — compact, inline-ish */
.jc-hero .highlight,
.jc-hero pre {
  max-width: 420px;
  margin: 0 auto !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  border: 1px solid var(--jc-border) !important;
}

.jc-hero .highlight pre code {
  font-size: 0.8rem !important;
  padding: 0.8rem 1.2rem !important;
}

/* --- CTA Text Links --- */
.jc-cta-text {
  margin-bottom: 1.2rem;
  font-family: 'Inter', sans-serif;
  font-size: 0.82rem;
  font-weight: 500;
}

.jc-cta-text p {
  display: flex;
  gap: 1.25rem;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0;
}

.jc-cta-text a {
  color: var(--md-default-fg-color) !important;
  opacity: 0.7;
  text-decoration: none !important;
  transition: opacity 0.15s ease, color 0.15s ease;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

.jc-cta-text a:first-child {
  color: var(--jc-brand) !important;
  opacity: 1;
  font-weight: 600;
}

.jc-cta-text a:first-child::after {
  content: "→";
  margin-left: 2px;
}

.jc-cta-text a:hover {
  opacity: 1;
  color: var(--jc-brand) !important;
}

/* --- CTA Buttons --- */
.jc-cta {
  display: flex;
  gap: 0.4rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 0.6rem;
}

.jc-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.32rem 0.75rem;
  border-radius: 5px;
  font-size: 0.72rem;
  font-weight: 500;
  text-decoration: none !important;
  transition: opacity 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
  cursor: pointer;
  letter-spacing: 0;
  white-space: nowrap;
}

.jc-btn:hover {
  text-decoration: none !important;
  transform: translateY(-1px);
}

.jc-btn-primary {
  background: var(--jc-gradient);
  color: #fff !important;
  box-shadow: 0 3px 12px rgba(23, 88, 245, 0.28);
}

.jc-btn-primary:hover {
  box-shadow: 0 6px 22px rgba(23, 88, 245, 0.38);
  color: #fff !important;
}

.jc-btn-secondary {
  border: 1px solid var(--jc-border);
  color: var(--md-default-fg-color) !important;
  background: var(--md-default-bg-color);
}

.jc-btn-secondary:hover {
  border-color: var(--jc-brand);
  color: var(--jc-brand) !important;
  box-shadow: var(--jc-shadow);
}

/* GitHub CTA button */
.jc-btn-github {
  background: #0c0c0e;
  color: #fff !important;
  border: 1px solid #0c0c0e;
}

.jc-btn-github:hover {
  background: #1a1a1e;
  color: #fff !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
}

[data-md-color-scheme="slate"] .jc-btn-github {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
  color: #fff !important;
}

/* Discord CTA button */
.jc-btn-discord {
  background: #5865f2;
  color: #fff !important;
  border: 1px solid #5865f2;
}

.jc-btn-discord:hover {
  background: #4752c4;
  color: #fff !important;
  box-shadow: 0 4px 16px rgba(23, 88, 245, 0.3);
}

/* ============================================================
   FEATURE CARDS GRID
   ============================================================ */

.jc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.25rem;
  margin: 2.5rem 0;
}

.jc-card {
  background: var(--md-default-bg-color);
  border: 1px solid var(--jc-border);
  border-radius: var(--jc-radius);
  padding: 1.6rem 1.5rem;
  transition: transform var(--jc-transition), box-shadow var(--jc-transition), border-color var(--jc-transition);
  position: relative;
  overflow: hidden;
}

.jc-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 3px;
  height: 100%;
  background: var(--jc-gradient);
  opacity: 0;
  transition: opacity var(--jc-transition);
}

.jc-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--jc-shadow-hover);
  border-color: var(--jc-brand);
}

.jc-card:hover::before {
  opacity: 1;
}

.jc-card-label {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--jc-brand);
  margin-bottom: 0.85rem;
}

.jc-card h3 {
  font-size: 0.88rem;
  font-weight: 700;
  margin: 0 0 0.35rem;
  letter-spacing: -0.01em;
  color: var(--md-default-fg-color);
}

.jc-card p {
  font-size: 0.76rem;
  color: var(--jc-text-muted);
  line-height: 1.5;
  margin: 0;
}

/* ============================================================
   STAT ROW
   ============================================================ */

.jc-stats {
  display: flex;
  gap: 0;
  border: 1px solid var(--jc-border);
  border-radius: 6px;
  overflow: hidden;
  margin: 1rem 0;
  background: var(--md-default-bg-color);
}

.jc-stat {
  flex: 1;
  text-align: center;
  padding: 0.6rem 0.5rem;
  border-right: 1px solid var(--jc-border);
}

.jc-stat:last-child {
  border-right: none;
}

.jc-stat-value {
  display: block;
  font-size: 0.95rem;
  font-weight: 800;
  background: var(--jc-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  letter-spacing: -0.03em;
  line-height: 1.2;
}

.jc-stat-label {
  font-size: 0.6rem;
  color: var(--jc-text-muted);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-top: 0.1rem;
}

/* ============================================================
   ECOSYSTEM / COMMUNITY CTA SECTION
   ============================================================ */

.jc-ecosystem {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  margin: 3rem 0 1.5rem;
  padding: 2.5rem;
  background: var(--jc-gradient-subtle);
  border: 1px solid var(--jc-border);
  border-radius: var(--jc-radius);
  position: relative;
  overflow: hidden;
}

.jc-ecosystem::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 30% 50%, rgba(23, 88, 245, 0.07) 0%, transparent 60%),
    radial-gradient(ellipse at 70% 50%, rgba(23, 88, 245, 0.07) 0%, transparent 60%);
  pointer-events: none;
}

.jc-ecosystem-card {
  text-align: center;
  padding: 1.75rem 1.5rem;
  background: var(--md-default-bg-color);
  border: 1px solid var(--jc-border);
  border-radius: calc(var(--jc-radius) - 2px);
  position: relative;
  z-index: 1;
}

.jc-ecosystem-card h3 {
  font-size: 0.85rem;
  font-weight: 700;
  margin: 0 0 0.4rem !important;
  letter-spacing: -0.02em;
}

.jc-ecosystem-card p {
  font-size: 0.78rem;
  color: var(--jc-text-muted);
  line-height: 1.5;
  margin: 0 0 1rem !important;
}

/* ============================================================
   CODE BLOCKS
   ============================================================ */

.md-typeset pre>code {
  font-family: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace;
  font-size: 0.74rem;
  line-height: 1.55;
  font-feature-settings: "liga" 1, "calt" 1;
}

.md-typeset .highlight {
  border-radius: var(--jc-radius);
  overflow: hidden;
  border: 1px solid var(--jc-border);
  box-shadow: var(--jc-shadow);
}

[data-md-color-scheme="slate"] .md-typeset .highlight {
  border-color: #2a2d3e;
}

.md-typeset .highlight .filename {
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
}

/* ============================================================
   TABLES
   ============================================================ */

.md-typeset table:not([class]) {
  border-collapse: collapse;
  border-radius: var(--jc-radius);
  overflow: hidden;
  border: 1px solid var(--jc-border);
  font-size: 0.76rem;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05);
  width: 100%;
}

.md-typeset table:not([class]) th {
  background: var(--jc-gradient-subtle);
  font-weight: 600 !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  padding: 0.55rem 1rem !important;
  border-bottom: 1.5px solid var(--jc-border);
  white-space: nowrap;
}

.md-typeset table:not([class]) td {
  padding: 0.7rem 1rem;
  border-bottom: 1px solid var(--jc-border);
  vertical-align: middle;
}

.md-typeset table:not([class]) tr:last-child td {
  border-bottom: none;
}

.md-typeset table:not([class]) tr:hover td {
  background: var(--jc-gradient-subtle);
  transition: background var(--jc-transition);
}

/* ============================================================
   ADMONITIONS
   ============================================================ */

.md-typeset .admonition,
.md-typeset details {
  border-radius: var(--jc-radius);
  border-left-width: 3px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* ============================================================
   INLINE CODE
   ============================================================ */

.md-typeset code:not([class]) {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.83em;
  padding: 0.15em 0.45em;
  border-radius: 5px;
  font-weight: 500;
}

/* ============================================================
   CONTENT AREA — light mode subtle gradient wash
   ============================================================ */

.md-content__inner {
  padding-bottom: 3rem;
}

/* Subtle page-level background wash in light mode */
.md-main {
  background: linear-gradient(180deg, #fafbff 0%, #ffffff 120px) !important;
}

[data-md-color-scheme="slate"] .md-main {
  background: none !important;
}

.md-typeset h2 {
  padding-top: 0.5rem;
  padding-bottom: 0.3rem;
  border-bottom: 1.5px solid var(--jc-border);
  margin-top: 2.5rem;
}

/* ============================================================
   FOOTER
   ============================================================ */

.md-footer {
  border-top: 1px solid var(--jc-border);
}

/* ── Footer nav (prev/next arrows) ── */
.md-footer__inner {
  background: transparent !important;
  box-shadow: none !important;
}

.md-footer-nav,
.md-footer__link {
  background: transparent !important;
}

/* Prev/next title typography */
.md-footer__title {
  font-family: 'Inter', sans-serif;
  font-size: 0.8rem;
  font-weight: 500;
  opacity: 0.7;
}

.md-footer__direction {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  opacity: 0.45;
}

/* Divider between nav and meta */
.md-footer__inner {
  border-top: 1px solid var(--jc-border);
}

/* ── Footer meta (social icons + Made with...) ── */
.md-footer-meta {
  background: transparent !important;
  border-top: 1px solid var(--jc-border);
}

.md-footer-meta__inner {
  background: transparent !important;
}

/* Social icons */
.md-social {
  gap: 4px;
  padding: 0.6rem 0;
}

.md-social__link {
  color: var(--jc-text-muted) !important;
  opacity: 0.6;
  transition: color 0.2s ease, opacity 0.2s ease;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
}

.md-social__link:hover {
  color: var(--jc-brand) !important;
  opacity: 1;
  background: var(--jc-gradient-subtle);
}

.md-social__link svg {
  width: 15px;
  height: 15px;
}

/* ── Footer copyright — explicit per-scheme to beat Material's footer fg vars ── */

/* Light mode: slate grey, visible on white bg */
[data-md-color-scheme="default"] .md-copyright,
[data-md-color-scheme="default"] .md-copyright__highlight,
[data-md-color-scheme="default"] .md-copyright a,
[data-md-color-scheme="default"] .md-copyright span {
  font-family: 'Inter', sans-serif;
  font-size: 0.72rem;
  color: #64748b !important;
  opacity: 1 !important;
}

[data-md-color-scheme="default"] .md-copyright a:hover {
  color: #1758F5 !important;
}

/* Dark mode: lighter muted grey, visible on dark bg */
[data-md-color-scheme="slate"] .md-copyright,
[data-md-color-scheme="slate"] .md-copyright__highlight,
[data-md-color-scheme="slate"] .md-copyright a,
[data-md-color-scheme="slate"] .md-copyright span {
  font-family: 'Inter', sans-serif;
  font-size: 0.72rem;
  color: #94a3b8 !important;
  opacity: 1 !important;
}

[data-md-color-scheme="slate"] .md-copyright a:hover {
  color: #35B0FE !important;
}

/* ── Light mode footer backgrounds ── */
[data-md-color-scheme="default"] .md-footer,
[data-md-color-scheme="default"] .md-footer__inner,
[data-md-color-scheme="default"] .md-footer-nav,
[data-md-color-scheme="default"] .md-footer-meta,
[data-md-color-scheme="default"] .md-footer-meta__inner {
  background: var(--md-default-bg-color) !important;
  color: var(--md-default-fg-color) !important;
}

[data-md-color-scheme="default"] .md-footer__link:hover {
  background: var(--jc-gradient-subtle) !important;
}

/* ── Dark mode footer backgrounds ── */
[data-md-color-scheme="slate"] .md-footer,
[data-md-color-scheme="slate"] .md-footer__inner,
[data-md-color-scheme="slate"] .md-footer-nav,
[data-md-color-scheme="slate"] .md-footer-meta,
[data-md-color-scheme="slate"] .md-footer-meta__inner {
  background: var(--md-default-bg-color) !important;
}



/* ============================================================
   INLINE BADGES / CHIPS
   Use in markdown as: <span class="jc-badge jc-badge-primary">Primary</span>
   ============================================================ */

.jc-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.18em 0.6em;
  border-radius: 5px;
  font-family: 'Inter', sans-serif;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  line-height: 1.4;
  white-space: nowrap;
  vertical-align: middle;
  margin-left: 0.4rem;
  position: relative;
  top: -1px;
}

/* Green — primary / recommended */
.jc-badge-primary {
  background: var(--jc-green-subtle);
  color: #0a9957;
  border: 1px solid rgba(12, 197, 114, 0.25);
}

[data-md-color-scheme="slate"] .jc-badge-primary {
  background: rgba(12, 197, 114, 0.15);
  color: #2de68a;
  border-color: rgba(12, 197, 114, 0.3);
}

/* Blue — required / key */
.jc-badge-required {
  background: rgba(23, 88, 245, 0.08);
  color: #1758F5;
  border: 1px solid rgba(23, 88, 245, 0.2);
}

[data-md-color-scheme="slate"] .jc-badge-required {
  background: rgba(53, 176, 254, 0.12);
  color: #35B0FE;
  border-color: rgba(53, 176, 254, 0.25);
}

/* Grey — optional / secondary */
.jc-badge-optional {
  background: rgba(100, 116, 139, 0.08);
  color: #64748b;
  border: 1px solid rgba(100, 116, 139, 0.2);
}

[data-md-color-scheme="slate"] .jc-badge-optional {
  background: rgba(148, 163, 184, 0.1);
  color: #94a3b8;
  border-color: rgba(148, 163, 184, 0.2);
}

/* Teal/accent — free / no config */
.jc-badge-free {
  background: rgba(12, 240, 227, 0.08);
  color: #0891b2;
  border: 1px solid rgba(12, 240, 227, 0.2);
}

[data-md-color-scheme="slate"] .jc-badge-free {
  background: rgba(12, 240, 227, 0.1);
  color: #22d3ee;
  border-color: rgba(12, 240, 227, 0.2);
}

/* Yellow — beta / experimental */
.jc-badge-beta {
  background: var(--jc-yellow-subtle);
  color: #b45309;
  border: 1px solid rgba(232, 163, 2, 0.25);
}

[data-md-color-scheme="slate"] .jc-badge-beta {
  background: rgba(232, 163, 2, 0.12);
  color: #fbbf24;
  border-color: rgba(232, 163, 2, 0.3);
}

/* ============================================================
   RIGHT SIDEBAR — Table of Contents
   ============================================================ */

.md-sidebar--secondary .md-sidebar__scrollwrap {
  padding: 0.75rem 0 2rem;
  padding-left: 1.5rem;  /* gap between main content and TOC */
}

/* TOC header label */
.md-nav--secondary .md-nav__title {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--jc-text-muted) !important;
  opacity: 0.6;
  padding: 0 0 0.5rem 0;
  pointer-events: none;
  cursor: default;
}

/* TOC links */
.md-nav--secondary .md-nav__link {
  font-family: 'Inter', sans-serif;
  font-size: 0.68rem;
  font-weight: 400;
  color: var(--md-default-fg-color) !important;
  opacity: 0.55;
  padding: 0.18rem 0;
  border-left: 2px solid transparent;
  padding-left: 0.75rem;
  margin: 0;
  border-radius: 0;
  transition: opacity 0.13s ease, border-color 0.13s ease, color 0.13s ease;
  background: transparent !important;
}

.md-nav--secondary .md-nav__link::before {
  display: none;
}

.md-nav--secondary .md-nav__link:hover {
  opacity: 1;
  color: var(--jc-brand) !important;
  border-left-color: rgba(23, 88, 245, 0.35);
  background: transparent !important;
}

.md-nav--secondary .md-nav__link--active {
  color: var(--jc-brand) !important;
  font-weight: 600;
  opacity: 1;
  border-left-color: var(--jc-brand);
  background: transparent !important;
}

[data-md-color-scheme="slate"] .md-nav--secondary .md-nav__link--active {
  color: var(--jc-brand-light) !important;
  border-left-color: var(--jc-brand-light);
}

/* Nested TOC (h3 etc) */
.md-nav--secondary .md-nav__item .md-nav .md-nav__link {
  font-size: 0.645rem;
  padding-left: 1.25rem;
  opacity: 0.45;
}

.md-nav--secondary .md-nav__item .md-nav .md-nav__link:hover,
.md-nav--secondary .md-nav__item .md-nav .md-nav__link.md-nav__link--active {
  opacity: 1;
}

/* ============================================================
   CHANGELOG PAGE
   ============================================================ */

/* ── Release card ── */
.changelog-release {
  position: relative;
  padding: 1.5rem 1.75rem 1.25rem;
  margin: 0.5rem 0 1rem;
  border-radius: var(--jc-radius);
  background: var(--jc-gradient-subtle);
  border: 1px solid var(--jc-border);
  border-left: 3px solid var(--jc-brand);
  transition: border-color var(--jc-transition), box-shadow var(--jc-transition);
}

.changelog-release:hover {
  border-left-color: var(--jc-accent);
  box-shadow: var(--jc-shadow);
}

/* Version heading inside card */
.changelog-release h2 {
  margin-top: 0 !important;
  margin-bottom: 0.25rem !important;
  font-size: 1.35rem !important;
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
}

/* Date chip */
.changelog-date {
  font-size: 0.7rem;
  font-weight: 500;
  color: var(--jc-text-muted);
  background: rgba(23, 88, 245, 0.08);
  padding: 0.15rem 0.6rem;
  border-radius: 99px;
  letter-spacing: 0.02em;
  vertical-align: middle;
  white-space: nowrap;
}

[data-md-color-scheme="slate"] .changelog-date {
  background: rgba(23, 88, 245, 0.15);
}

/* ── Meta row: contributors + release link ── */
.changelog-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0.75rem 0 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--jc-border);
}

/* Contributor avatars — overlapping stack */
.changelog-contributors {
  display: flex;
  align-items: center;
}

.changelog-contributors a {
  display: inline-block;
  line-height: 0;
  border-radius: 50%;
  margin-right: -6px;
  position: relative;
  transition: transform var(--jc-transition), box-shadow var(--jc-transition), z-index 0s;
}

.changelog-contributors a:last-child {
  margin-right: 0;
}

.changelog-contributors a:hover {
  transform: scale(1.15);
  box-shadow: 0 0 0 2px var(--jc-brand-light);
  z-index: 2;
}

.changelog-contributors img {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 2px solid var(--jc-surface);
  object-fit: cover;
  background: var(--jc-surface);
}

/* GitHub release CTA */
.changelog-release-link {
  font-size: 0.7rem;
  font-weight: 500;
  color: var(--jc-brand) !important;
  border: 1px solid rgba(23, 88, 245, 0.25);
  padding: 0.3rem 0.8rem;
  border-radius: 99px;
  text-decoration: none !important;
  transition: all var(--jc-transition);
  white-space: nowrap;
}

.changelog-release-link:hover {
  background: rgba(23, 88, 245, 0.08);
  border-color: var(--jc-brand);
  color: var(--jc-brand-dark) !important;
}

/* Category labels (bold text in changelog) */
.changelog-release strong {
  color: var(--jc-brand);
  font-size: 0.65rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

/* Tighten paragraph spacing inside cards */
.changelog-release p {
  margin-top: 0.35em;
  margin-bottom: 0.45em;
}

/* Lists inside cards */
.changelog-release ul {
  margin-top: 0.25em;
  margin-bottom: 0.5em;
}

.changelog-release li {
  margin-bottom: 0.15em;
}

/* Code blocks inside cards — compact */
.changelog-release .highlight {
  margin-top: 0.4em;
  margin-bottom: 0.6em;
}

/* ── Hide the right-hand TOC on the changelog page ── */
.md-content[data-md-component="content"] .md-sidebar--secondary {
  /* Fallback: handled by front matter hide: toc */
}

/* ============================================================
   SEARCH
   ============================================================ */

.md-search__form {
  border-radius: 99px;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 600px) {
  .jc-stats {
    flex-direction: column;
  }

  .jc-stat {
    border-right: none;
    border-bottom: 1px solid var(--jc-border);
  }

  .jc-stat:last-child {
    border-bottom: none;
  }

  .jc-ecosystem {
    grid-template-columns: 1fr;
    padding: 1.5rem;
  }

  .jc-gh-stars-btn {
    display: none;
  }

  .jc-version-chip {
    display: none;
  }

  .changelog-meta {
    flex-direction: column;
    gap: 0.5rem;
    align-items: flex-start;
  }

  .changelog-release {
    padding: 1rem 1.25rem;
  }
}

/* Suppress Material's sidebar nav tooltips — labels are now fully visible.
   Target only Material's .md-tooltip component, NOT arbitrary [title] elements
   (the broad [title] selector was killing pointer-events on changelog links). */
.md-tooltip,
.md-nav__link[title]::after,
.md-nav__item .md-tooltip {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ============================================================
   LLM ASSIST WIDGET
   ============================================================ */
.jc-llm-widget {
  position: relative;
  display: inline-block;
  font-family: 'Inter', sans-serif;
}

.jc-llm-trigger {
  display: flex;
  align-items: stretch;
  background: #ffffff;
  border: 1px solid var(--jc-border);
  border-radius: 8px;
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--jc-text);
  cursor: pointer;
  transition: all 0.2s ease;
  box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}

.jc-llm-trigger:hover {
  border-color: var(--jc-brand-light);
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.jc-llm-btn-main {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  transition: background 0.15s;
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
  color: var(--jc-text-muted);
}

.jc-llm-btn-main:hover {
  background: #f8fafc;
  color: var(--jc-text);
}

.jc-llm-btn-chev {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 8px;
  border-left: 1px solid var(--jc-border);
  color: var(--jc-text-muted);
  transition: background 0.15s;
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}

.jc-llm-btn-chev:hover {
  background: #f8fafc;
  color: var(--jc-text);
}

[data-md-color-scheme="slate"] .jc-llm-trigger {
  background: #1e2130;
  border-color: rgba(255,255,255,0.1);
}
[data-md-color-scheme="slate"] .jc-llm-btn-main:hover,
[data-md-color-scheme="slate"] .jc-llm-btn-chev:hover {
  background: rgba(255,255,255,0.05);
  color: #fff;
}
[data-md-color-scheme="slate"] .jc-llm-btn-chev {
  border-left-color: rgba(255,255,255,0.1);
}

.jc-llm-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  width: 250px;
  background: #ffffff;
  border: 1px solid var(--jc-border);
  border-radius: 12px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-5px);
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 100;
  display: flex;
  flex-direction: column;
  padding: 8px;
}

.jc-llm-dropdown.open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

[data-md-color-scheme="slate"] .jc-llm-dropdown {
  background: #1e2130;
  border-color: rgba(255,255,255,0.1);
  box-shadow: 0 10px 40px rgba(0,0,0,0.5);
}

.jc-llm-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  border-radius: 8px;
  text-decoration: none !important;
  color: var(--md-default-fg-color) !important;
  transition: background 0.15s ease;
  cursor: pointer;
}

.jc-llm-item:hover {
  background: #f8fafc;
}

[data-md-color-scheme="slate"] .jc-llm-item:hover {
  background: rgba(255,255,255,0.06);
}

.jc-llm-icon-box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 1px solid var(--jc-border);
  border-radius: 8px;
  color: var(--jc-text-muted);
  flex-shrink: 0;
}

[data-md-color-scheme="slate"] .jc-llm-icon-box {
  border-color: rgba(255,255,255,0.1);
}

.jc-llm-item:hover .jc-llm-icon-box {
  border-color: var(--jc-brand-light);
  color: var(--jc-brand);
}

.jc-llm-text {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.jc-llm-text strong {
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.1;
}

.jc-llm-text span {
  font-size: 0.65rem;
  color: var(--jc-text-muted);
  line-height: 1.2;
}

/* ============================================================
   PAGE ICONS — Material `icon:` front-matter rendering
   Material for MkDocs injects an <svg> before the nav link
   text when a page has an icon: metadata key.
   ============================================================ */

/* Icon SVG inline in left sidebar nav items */
.md-nav--primary .md-nav__link .md-icon,
.md-nav--primary .md-nav__link > svg {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
  margin-right: 0.5rem;
  opacity: 0.55;
  transition: opacity 0.13s ease, color 0.13s ease;
  color: inherit;
  vertical-align: middle;
  display: inline-flex;
  align-items: center;
}

.md-nav--primary .md-nav__link:hover .md-icon,
.md-nav--primary .md-nav__link:hover > svg {
  opacity: 1;
  color: var(--jc-brand);
}

[data-md-color-scheme="slate"] .md-nav--primary .md-nav__link:hover .md-icon,
[data-md-color-scheme="slate"] .md-nav--primary .md-nav__link:hover > svg {
  color: var(--jc-brand-light);
}

.md-nav--primary .md-nav__link--active .md-icon,
.md-nav--primary .md-nav__link--active > svg {
  opacity: 1;
  color: var(--jc-brand);
}

[data-md-color-scheme="slate"] .md-nav--primary .md-nav__link--active .md-icon,
[data-md-color-scheme="slate"] .md-nav--primary .md-nav__link--active > svg {
  color: var(--jc-brand-light);
}

/* ============================================================
   LEFT vs RIGHT SIDEBAR — structural differentiation
   Left (primary) = nav tree with a subtle background tint and
   right-border. Right (secondary / TOC) = pure left-border
   inline style with no background.
   ============================================================ */

/* Primary sidebar — subtle background tint to distinguish from content */
.md-sidebar--primary {
  border-right: 1px solid rgba(0, 0, 0, 0.06);
}

[data-md-color-scheme="slate"] .md-sidebar--primary {
  border-right-color: rgba(255, 255, 255, 0.06);
}

/* Ensure TOC sidebar has NO background tint — it should float */
.md-sidebar--secondary {
  border-left: none;
  background: transparent;
}

/* Section group header in left nav — add a top hairline separator
   between major nav groups for scannability */
.md-nav--primary > .md-nav__list > .md-nav__item + .md-nav__item {
  padding-top: 0.5rem;
}

/* Nav section label treatment — pill-style group label */
.md-nav--primary > .md-nav__list > .md-nav__item > .md-nav__link {
  font-size: 0.625rem;
  letter-spacing: 0.12em;
  padding-top: 0.85rem;
  border-top: 1px solid rgba(0, 0, 0, 0.055);
  margin-top: 0.4rem;
}

[data-md-color-scheme="slate"] .md-nav--primary > .md-nav__list > .md-nav__item > .md-nav__link {
  border-top-color: rgba(255, 255, 255, 0.07);
}

/* ============================================================
   SIDEBAR WIDTH ENFORCEMENT  (desktop only)
   Override Material's default ~12rem with 15rem so all nav
   labels have room to display without truncation or ellipsis.
   ============================================================ */
@media screen and (min-width: 60em) {
  .md-sidebar--primary {
    min-width: var(--md-sidebar-width, 15rem);
    width: var(--md-sidebar-width, 15rem);
  }

  .md-sidebar--primary .md-nav {
    width: 100%;
  }
}

/* Belt-and-braces tooltip suppression for Material's ellipsis tooltip */
.md-nav__link .md-ellipsis ~ .md-tooltip,
.md-tooltip--active {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ============================================================
   HTTP METHOD BADGES  — Chat API & any endpoint reference page
   Use in markdown as: <span class="jc-http-post">POST</span>
   or wrap the heading: ## <span class="jc-http-get">GET</span> /chat/stream/{workflow_id}
   ============================================================ */

.jc-http-get,
.jc-http-post,
.jc-http-put,
.jc-http-patch,
.jc-http-delete {
  display: inline-block;
  font-family: 'JetBrains Mono', 'Fira Code', monospace;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 0.15rem 0.45rem;
  border-radius: 4px;
  vertical-align: middle;
  line-height: 1.5;
  position: relative;
  top: -1px;
}

.jc-http-get    { background: rgba(12, 197, 114, 0.12); color: #0a9e5c; border: 1px solid rgba(12, 197, 114, 0.30); }
.jc-http-post   { background: rgba(23, 88, 245, 0.10);  color: var(--jc-brand); border: 1px solid rgba(23, 88, 245, 0.25); }
.jc-http-put    { background: rgba(232, 163, 2, 0.12);  color: #b07d00; border: 1px solid rgba(232, 163, 2, 0.30); }
.jc-http-patch  { background: rgba(73, 81, 243, 0.10);  color: var(--jc-purple); border: 1px solid rgba(73, 81, 243, 0.25); }
.jc-http-delete { background: rgba(220, 38, 38, 0.10);  color: #b91c1c; border: 1px solid rgba(220, 38, 38, 0.25); }

[data-md-color-scheme="slate"] .jc-http-get    { background: rgba(12, 197, 114, 0.15); color: #34d27a; border-color: rgba(12, 197, 114, 0.25); }
[data-md-color-scheme="slate"] .jc-http-post   { background: rgba(23, 88, 245, 0.15);  color: var(--jc-brand-light); border-color: rgba(53, 176, 254, 0.25); }
[data-md-color-scheme="slate"] .jc-http-put    { background: rgba(232, 163, 2, 0.15);  color: #f0b429; border-color: rgba(232, 163, 2, 0.25); }
[data-md-color-scheme="slate"] .jc-http-patch  { background: rgba(73, 81, 243, 0.15);  color: #818cf8; border-color: rgba(73, 81, 243, 0.25); }
[data-md-color-scheme="slate"] .jc-http-delete { background: rgba(220, 38, 38, 0.15);  color: #f87171; border-color: rgba(220, 38, 38, 0.25); }

/* ============================================================
   SIDEBAR SCROLL FIX
   
   Root cause: Material's sticky sidebar labels use
   var(--md-default-bg-color) for background + box-shadow halo.
   Our custom palette never defines that variable, so it resolves
   transparent and items bleed through the sticky labels.
   
   Left sidebar (GUIDES):
     Selector: .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link
     This is a <label class="md-nav__link"> — NOT .md-nav__title
   
   Right sidebar (TABLE OF CONTENTS):
     Selector: .md-nav--secondary .md-nav__title
     This is a <label class="md-nav__title" for="__toc">
   ============================================================ */

/* Both sidebars: independent scroll within the sticky column */
.md-sidebar__scrollwrap {
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

/* ── Left sidebar: "GUIDES" / section label (the lifted variant).
   Material makes the active item's .md-nav__link sticky inside --lifted. ── */
.md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link {
  background: #ffffff !important;
  box-shadow: 0 0 .4rem .4rem #ffffff !important;
}

[data-md-color-scheme="slate"] .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link {
  background: #161618 !important;
  box-shadow: 0 0 .4rem .4rem #161618 !important;
}

/* ── Right sidebar: "TABLE OF CONTENTS" label. ── */
.md-nav--secondary .md-nav__title {
  background: #ffffff !important;
  box-shadow: 0 0 .4rem .4rem #ffffff !important;
}

[data-md-color-scheme="slate"] .md-nav--secondary .md-nav__title {
  background: #161618 !important;
  box-shadow: 0 0 .4rem .4rem #161618 !important;
}


/* Sidebar-specific scrollbar: narrow and subtle */
.md-sidebar__scrollwrap::-webkit-scrollbar {
  width: 4px;
}

.md-sidebar__scrollwrap::-webkit-scrollbar-track {
  background: transparent;
}

.md-sidebar__scrollwrap::-webkit-scrollbar-thumb {
  background: rgba(23, 88, 245, 0.25);
  border-radius: 99px;
}

.md-sidebar__scrollwrap::-webkit-scrollbar-thumb:hover {
  background: rgba(23, 88, 245, 0.5);
}

/* ---------- Heading anchor: small clean link icon instead of the pilcrow ---------- */
.md-typeset .headerlink {
  font-size: 0;                 /* hide the default pilcrow glyph */
  margin-left: 0.4em;
}

.md-typeset .headerlink::after {
  content: "";
  display: inline-block;
  width: 0.82rem;
  height: 0.82rem;
  vertical-align: -0.12em;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M3.9%2012c0-1.71%201.39-3.1%203.1-3.1h4V7H7c-2.76%200-5%202.24-5%205s2.24%205%205%205h4v-1.9H7c-1.71%200-3.1-1.39-3.1-3.1M8%2013h8v-2H8v2m9-6h-4v1.9h4c1.71%200%203.1%201.39%203.1%203.1s-1.39%203.1-3.1%203.1h-4V17h4c2.76%200%205-2.24%205-5s-2.24-5-5-5Z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M3.9%2012c0-1.71%201.39-3.1%203.1-3.1h4V7H7c-2.76%200-5%202.24-5%205s2.24%205%205%205h4v-1.9H7c-1.71%200-3.1-1.39-3.1-3.1M8%2013h8v-2H8v2m9-6h-4v1.9h4c1.71%200%203.1%201.39%203.1%203.1s-1.39%203.1-3.1%203.1h-4V17h4c2.76%200%205-2.24%205-5s-2.24-5-5-5Z'/%3E%3C/svg%3E") center / contain no-repeat;
}