/* Raw CSS bypassing PostCSS — keeps -webkit-text-size-adjust intact
   so Blink (Chrome Android) actually disables its text autosizer. */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body, main, article, article *, pre, pre *, code, code * {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* ── Navbar gate: type:'html' anchors carry .nav-auth-wrap directly in
   the HTML value (docusaurus.config.js). clientModule authGate.js tags
   wrapper divs too, so both desktop and mobile items are exempted
   deterministically. */

/* Desktop: hide menu items unless tagged */
html.anon .navbar__items > .navbar__item:not(.nav-auth-wrap),
html.anon .navbar__items > a.navbar__item.navbar__link,
html.anon .navbar .dropdown {
  display: none !important;
}

/* Mobile sidebar: hide items whose wrapper OR inner anchor has no nav-auth-wrap.
   Using :has() so the wrapper div generated by Docusaurus for type:'html'
   items (before authGate.js tags it) is still exempt via its anchor. */
html.anon .navbar-sidebar .menu__list > li:not(.nav-auth-wrap):not(:has(.nav-auth-wrap)),
html.anon .navbar-sidebar .menu__list > div:not(.nav-auth-wrap):not(:has(.nav-auth-wrap)) {
  display: none !important;
}

/* Force visibility of auth anchors in mobile sidebar — some Docusaurus
   defaults hide plain .navbar__link inside .menu__list. */
.navbar-sidebar .nav-auth-wrap,
.navbar-sidebar .nav-auth-wrap a,
.navbar-sidebar a.nav-auth-wrap {
  display: flex !important;
  align-items: center;
  visibility: visible !important;
}

/* Toggle login/logout button visibility by auth state (desktop + mobile).
   Override the force-visibility above for the opposite-state button. */
html.anon .nav-auth-logout,
html.anon .nav-auth-logout a,
html.anon .navbar-logout-btn { display: none !important; }
html.authed .nav-auth-login,
html.authed .nav-auth-login a,
html.authed .navbar-login-btn { display: none !important; }

/* Pill style for auth buttons (desktop + mobile) */
.navbar-login-btn,
.navbar-logout-btn {
  border-radius: 999px;
  padding: 6px 14px !important;
  margin-left: 8px;
  font-weight: 600;
  font-size: 13px;
  background: linear-gradient(135deg, #5b6cff, #7a5fff);
  color: #fff !important;
  transition: transform .15s ease, box-shadow .15s ease;
  box-shadow: 0 8px 18px -8px rgba(91,108,255,.5);
}
.navbar-login-btn:hover,
.navbar-logout-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px -8px rgba(91,108,255,.65);
  color: #fff !important;
}
html[data-theme='dark'] .navbar-login-btn,
html[data-theme='dark'] .navbar-logout-btn {
  background: linear-gradient(135deg, #6a7cff, #9066ff);
}

/* Mobile pill tweak: don't rely on margin-left in stacked list */
.navbar-sidebar .navbar-login-btn,
.navbar-sidebar .navbar-logout-btn {
  margin-left: 0 !important;
  margin: 8px 12px !important;
  justify-content: center;
}

/* Hide Explore shortcut cards on homepage when anon */
html.anon .auth-gated-explore { display: none !important; }

/* NAV-NARROW-V2 ── Narrow-desktop navbar (portrait monitors) ──
   Between Docusaurus mobile breakpoint (996px) and ~1400px, too many navbar
   items overlap. Shrink padding/font on BOTH left and right groups, and let
   the right group wrap to a second row when it doesn't fit. Mobile (≤996px)
   still uses the hamburger. */
@media (min-width: 997px) and (max-width: 1400px) {
  .navbar__inner {
    flex-wrap: wrap;
    row-gap: 4px;
  }
  .navbar__items {
    flex-wrap: wrap;
    column-gap: 2px;
    row-gap: 2px;
    min-width: 0;
  }
  .navbar__items .navbar__link,
  .navbar__items .dropdown > .navbar__link {
    padding: 0 7px !important;
    font-size: 0.86rem !important;
    line-height: 1.8;
    white-space: nowrap;
  }
  .navbar__brand {
    margin-right: 8px !important;
  }
  .navbar__brand .navbar__title {
    font-size: 0.95rem !important;
  }
  /* Pill buttons shrink too */
  .navbar-login-btn,
  .navbar-logout-btn {
    padding: 4px 10px !important;
    font-size: 12px !important;
    margin-left: 4px !important;
  }
}

/* Tighter below 1200px — right-group starts to really crowd */
@media (min-width: 997px) and (max-width: 1200px) {
  .navbar__items .navbar__link,
  .navbar__items .dropdown > .navbar__link {
    padding: 0 5px !important;
    font-size: 0.8rem !important;
  }
  .navbar__brand .navbar__title {
    font-size: 0.88rem !important;
  }
}

/* Tightest 997-1050px */
@media (min-width: 997px) and (max-width: 1050px) {
  .navbar__items .navbar__link,
  .navbar__items .dropdown > .navbar__link {
    padding: 0 4px !important;
    font-size: 0.75rem !important;
  }
}

/* Wider content on large monitors + overflow safety */
:root {
  --ifm-container-width-xl: 1600px;
}

/* Docs article area — use more width but keep reading line readable */
.theme-doc-markdown {
  max-width: none !important;
}
.theme-doc-markdown > * {
  max-width: none; /* PATCHED: was 80ch — let body fill column */
}
/* Wide-content elements (images, iframes, code, tables) get full column width */
.theme-doc-markdown > img,
.theme-doc-markdown > p > img,
.theme-doc-markdown > iframe,
.theme-doc-markdown > p > iframe,
.theme-doc-markdown > pre,
.theme-doc-markdown table,
.theme-doc-markdown .theme-admonition,
.theme-doc-markdown figure {
  max-width: none !important;
  width: 100%;
}

/* Prevent long URL/code lines from forcing horizontal scroll of the page */
.theme-doc-markdown img,
.theme-doc-markdown iframe {
  max-width: 100%;
  height: auto;
}
.theme-doc-markdown pre {
  overflow-x: auto;
  max-width: 100%;
}
.theme-doc-markdown table {
  display: block;
  overflow-x: auto;
  max-width: 100%;
}
.theme-doc-markdown a[href] {
  word-break: break-word;
  overflow-wrap: anywhere;
}

/* LAYOUT-WIDER-V2 */
/* Use nearly full viewport on wide monitors — minimize side margins. */
:root {
  --ifm-container-width-xl: 100%;
  --ifm-spacing-horizontal: 0.8rem;
}

.main-wrapper,
.container,
.theme-doc-markdown {
  max-width: 100% !important;
}

/* Docs layout: left sidebar + article — allow article to fill remaining width */
.theme-doc-markdown {
  max-width: none !important;
  padding-right: 1rem;
}
/* Keep text paragraphs narrow-ish for readability, but not images/code/tables */
.theme-doc-markdown > p,
.theme-doc-markdown > ul,
.theme-doc-markdown > ol,
.theme-doc-markdown > blockquote,
.theme-doc-markdown > h1,
.theme-doc-markdown > h2,
.theme-doc-markdown > h3,
.theme-doc-markdown > h4 {
  max-width: none; /* PATCHED: was 90ch — let body fill column */
}

/* Wide-content elements get full column */
.theme-doc-markdown img,
.theme-doc-markdown iframe,
.theme-doc-markdown pre,
.theme-doc-markdown table,
.theme-doc-markdown .theme-admonition,
.theme-doc-markdown figure,
.theme-doc-markdown video {
  max-width: 100% !important;
  width: auto;
}
.theme-doc-markdown iframe {
  width: 100%;
}
.theme-doc-markdown pre {
  overflow-x: auto;
}
.theme-doc-markdown table {
  display: block;
  overflow-x: auto;
}
.theme-doc-markdown a[href] {
  word-break: break-word;
  overflow-wrap: anywhere;
}

/* Cap super-wide monitors at 2200px so text lines don't stretch absurdly */
@media (min-width: 2300px) {
  .main-wrapper > div > .container,
  .main-wrapper > div > .row {
    max-width: 2200px !important;
    margin: 0 auto;
  }
}


/* TOC-TOGGLE-V2 */
/* When the user toggles TOC off via the floating button, also expand the
   article column to fill the freed space. Docusaurus uses Infima grid with
   col--6/col--9/col--3 (fractions of 12). Override with !important. */
html.toc-hidden .theme-doc-toc-desktop {
  display: none !important;
}
html.toc-hidden [class*="docItemCol_"],
html.toc-hidden .col.col--9,
html.toc-hidden .col.col--6 {
  max-width: 100% !important;
  flex: 0 0 100% !important;
  flex-basis: 100% !important;
}


/* P-FONT-RESPONSIVE-V1 — desktop-only paragraph enlargement.
   Mobile (<997px) is left untouched (default 1rem) — user said it looks right.
   Bump on desktop where the wide column makes default text feel small. */
@media (min-width: 997px) {
  .theme-doc-markdown p,
  .theme-doc-markdown li,
  .theme-doc-markdown blockquote {
    font-size: 1.08rem;
    line-height: 1.72;
  }
}
@media (min-width: 1400px) {
  .theme-doc-markdown p,
  .theme-doc-markdown li,
  .theme-doc-markdown blockquote {
    font-size: 1.13rem;
  }
}
