/* ============================================================
   GitBook Dark Theme - EXACT values from GitBook CSS files
   Downloaded from static-2c.gitbook.com/_next/static/css/

   Color system (dark mode tint scale):
   tint-1:  rgb(29,29,29)     #1d1d1d  base background
   tint-2:  rgb(34,34,35)     #222223
   tint-3:  rgb(43,44,45)     #2b2c2d  card/table background
   tint-4:  rgb(47,48,49)     #2f3031  hover background
   tint-5:  rgb(52,54,55)     #343637
   tint-6:  rgb(56,58,60)     #383a3c  borders
   tint-7:  rgb(66,68,70)     #424446
   tint-9:  rgb(127,133,144)  #7f8590  subtle text
   tint-11: rgb(190,192,197)  #bec0c5  body text (.text-tint)
   tint-12: rgb(254,255,255)  #feffff  strong text / headings

   Primary scale (dark mode):
   primary-9:  rgb(52,109,219)   #346ddb  active nav / primary solid
   primary-10: rgb(80,139,252)   #508bfc  links
   primary-11: rgb(167,193,239)  #a7c1ef  primary accent text
   ============================================================ */

/* --- Theme Variables ---
   Override ALL MkDocs Material internal variables with GitBook colors */
[data-md-color-scheme="slate"] {
  --md-hue: 220deg;
  --md-primary-fg-color: #346ddb;
  --md-primary-fg-color--light: #508bfc;
  --md-primary-fg-color--dark: #2a57b0;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: rgba(255,255,255,0.7);
  --md-accent-fg-color: #508bfc;
  --md-accent-fg-color--transparent: rgba(80,139,252,0.1);
  --md-default-bg-color: #1d1d1d;
  --md-default-bg-color--light: rgba(29,29,29,0.54);
  --md-default-bg-color--lighter: rgba(29,29,29,0.26);
  --md-default-bg-color--lightest: rgba(29,29,29,0.07);
  --md-default-fg-color: #feffff;
  --md-default-fg-color--light: #7f8590;
  --md-default-fg-color--lighter: #383a3c;
  --md-default-fg-color--lightest: rgba(255, 255, 255, 0.07);
  --md-code-bg-color: #2b2c2d;
  --md-code-fg-color: #feffff;
  --md-typeset-color: #feffff;
  --md-typeset-a-color: #508bfc;
  --md-typeset-table-color: #383a3c;
  --md-typeset-table-color--light: #2f3031;
  --md-typeset-kbd-color: rgba(255,255,255,0.12);
  --md-typeset-kbd-accent-color: rgba(255,255,255,0.2);
  --md-typeset-kbd-border-color: #1d1d1d;
  --md-typeset-mark-color: rgba(80,139,252,0.3);
  --md-admonition-fg-color: #feffff;
  --md-admonition-bg-color: #1d1d1d;
  --md-footer-bg-color: #171717;
  --md-footer-bg-color--dark: #141414;
  --md-shadow-z1: 0 0.2rem 0.5rem rgba(0,0,0,0.05), 0 0 0.05rem rgba(0,0,0,0.1);
  --md-shadow-z2: 0 0.2rem 0.5rem rgba(0,0,0,0.25), 0 0 0.05rem rgba(0,0,0,0.25);
  --md-text-font: "Inter", system-ui, arial, sans-serif;
  --md-code-font: "Roboto Mono", monospace;
}

/* --- Base Typography ---
   GitBook: .text-tint = tint-11 (#bec0c5)
   Body: text-base (16px), leading-normal (1.5) */
.md-typeset {
  font-size: 16px !important;
  line-height: 1.5 !important;
  color: #feffff !important;
  font-family: "Inter", system-ui, arial, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* --- Headings ---
   GitBook: font-semibold, no explicit color (inherits tint-11)
   Exception: page title (.text-tint-strong = tint-12 = white)
   H1: text-3xl = 30px, pt-[1em]
   H2: text-2xl = 24px, pt-[0.75em]
   H3: text-xl  = 20px, pt-[0.5em]
   H4: text-lg  = 18px
*/
.md-typeset h1 {
  font-size: 30px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  color: #feffff !important;
  margin-top: 0 !important;
  margin-bottom: 16px !important;
}

.md-typeset h2 {
  font-size: 24px !important;
  font-weight: 600 !important;
  line-height: 1.33 !important;
  margin-top: 32px !important;
  margin-bottom: 12px !important;
}

.md-typeset h3 {
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  margin-top: 24px !important;
  margin-bottom: 8px !important;
}

.md-typeset h4 {
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.55 !important;
  margin-top: 20px !important;
  margin-bottom: 8px !important;
}

/* bold = font-bold (700) in GitBook */
.md-typeset strong {
  font-weight: 700 !important;
  color: #feffff !important;
}

/* --- Paragraphs ---
   GitBook: [&>*+*]:mt-5 (20px gap) within blocks,
   space-y-3 (12px) between content blocks */
.md-typeset p {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

/* --- Lists --- */
.md-typeset ul,
.md-typeset ol {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

.md-typeset li {
  margin-bottom: 4px !important;
}

/* --- Inline Code ---
   GitBook: bg-tint-3, text-tint-12, rounded, small */
.md-typeset code {
  font-size: 0.85em !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  background: #2b2c2d !important;
  color: #feffff !important;
}

/* --- Tables ---
   GitBook structure:
   - Header: card (bg #2b2c2d, border #383a3c, rounded 8px)
   - Body: transparent, thin borders between rows
   - Gap between header card and body rows
*/
.md-typeset table:not([class]) {
  font-size: 14px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  width: 100% !important;
  display: table !important;
  margin: 12px 0 !important;
  border: none !important;
  background: transparent !important;
  overflow: visible !important;
}

/* --- Header cells --- */
.md-typeset table:not([class]) thead th {
  font-weight: 500 !important;
  text-align: left !important;
  padding: 8px 12px !important;
  color: #feffff !important;
  background: #2b2c2d !important;
  border: 1px solid #383a3c !important;
  border-left: none !important;
  border-radius: 0 !important;
}

.md-typeset table:not([class]) thead th:first-child {
  border-left: 1px solid #383a3c !important;
  border-top-left-radius: 8px !important;
}

.md-typeset table:not([class]) thead th:last-child {
  border-top-right-radius: 8px !important;
}

/* --- Body cells: full frame with column dividers --- */
.md-typeset table:not([class]) tbody td {
  padding: 8px 12px !important;
  color: #feffff !important;
  background: transparent !important;
  border: 1px solid #383a3c !important;
  border-left: none !important;
  border-top: none !important;
  border-radius: 0 !important;
}

.md-typeset table:not([class]) tbody td:first-child {
  border-left: 1px solid #383a3c !important;
}

/* Last row: round bottom corners */
.md-typeset table:not([class]) tbody tr:last-child td:first-child {
  border-bottom-left-radius: 8px !important;
}

.md-typeset table:not([class]) tbody tr:last-child td:last-child {
  border-bottom-right-radius: 8px !important;
}

/* Row hover */
.md-typeset table:not([class]) tbody tr {
  background: transparent !important;
  transition: background-color 0.15s !important;
}

.md-typeset table:not([class]) tbody tr:hover {
  background: #2f3031 !important;
}

/* --- Horizontal Rules ---
   GitBook: border-tint-subtle = tint-6 (#383a3c) */
.md-typeset hr {
  border: none !important;
  border-top: 1px solid #383a3c !important;
  margin: 24px 0 !important;
}

/* --- Links ---
   GitBook: primary-10 (#508bfc), no underline, underline on hover */
.md-typeset a {
  color: #508bfc !important;
  text-decoration: none !important;
}

.md-typeset a:hover {
  text-decoration: underline !important;
}

/* --- Blockquotes --- */
.md-typeset blockquote {
  border-left: 3px solid #383a3c !important;
  padding: 4px 0 4px 16px !important;
  margin: 12px 0 !important;
  color: #7f8590 !important;
}

/* --- Images --- */
.md-typeset div[align="center"] img {
  display: block;
  margin: 0 auto;
}

.md-typeset figure {
  text-align: center !important;
  margin: 0 0 1rem !important;
}

.md-typeset figure img {
  display: block !important;
  margin: 0 auto !important;
}

.md-typeset figcaption {
  font-size: 12px !important;
  color: #bec0c5 !important;
  margin-top: 8px !important;
  text-align: center !important;
}

/* ============================================================
   Sidebar Navigation
   GitBook Tailwind classes (from downloaded HTML):

   Section header:
     font-semibold text-xs uppercase tracking-wide
     = 600, 12px, uppercase, letter-spacing 0.025em
     No explicit color → inherits tint-11 (#bec0c5)

   Nav link:
     font-normal text-sm text-tint-strong/7
     = 400, 14px, color-mix(oklab, tint-12 64%, transparent)
     ≈ rgba(254,255,255,0.64)

   Active link:
     font-semibold text-primary-subtle
     = 600, primary-9 (#346ddb)
     before:bg-primary-solid = blue left bar

   Hover:
     hover:bg-tint-hover hover:text-tint-strong
     = bg tint-4 (#2f3031), color tint-12 (white)

   Padding: p-1.5 pl-3 = 6px all, 12px left
   Border-radius: rounded-md = 6px
   ============================================================ */

/* All sidebar nav links */
.md-nav__link {
  font-size: 14px !important;
  font-weight: 400 !important;
  color: rgba(254, 255, 255, 0.64) !important;
  padding: 6px 6px 6px 12px !important;
  border-radius: 6px !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 0.15s, background-color 0.15s !important;
}

/* Hover */
.md-nav__link:hover {
  color: #feffff !important;
  background-color: #2f3031 !important;
}

/* Active page */
.md-nav__item--active > .md-nav__link,
.md-nav__link--active {
  color: #346ddb !important;
  font-weight: 600 !important;
}

/* Active indicator - blue left bar */
.md-nav__item--active > .md-nav__link {
  position: relative;
}

.md-nav__item--active > .md-nav__link::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: #346ddb;
  border-radius: 2px;
}

/* Section headers: text-xs uppercase tracking-wide font-semibold
   No explicit color in GitBook → inherits body tint-12 (white) */
.md-nav__item--section > .md-nav__link {
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.025em !important;
  color: #feffff !important;
  padding-top: 16px !important;
  padding-bottom: 8px !important;
}

/* Section headers: no hover effect */
.md-nav__item--section > .md-nav__link:hover {
  background: transparent !important;
  color: #feffff !important;
}

/* Sub-nav items (nested): slightly dimmer */
.md-nav--secondary .md-nav__link,
.md-nav__item .md-nav .md-nav__link {
  font-size: 13px !important;
  color: rgba(254, 255, 255, 0.54) !important;
}

.md-nav__item .md-nav .md-nav__link:hover {
  color: #feffff !important;
}

/* ============================================================
   Layout
   GitBook: sidebar lg:w-72 (288px), lg:mr-12 (48px gap)
   Content: max-w-3xl (768px)
   Right TOC: @2xl:basis-56 (224px)
   ============================================================ */

@media screen and (min-width: 76.25em) {
  .md-sidebar--primary {
    width: 288px !important;
  }
  .md-sidebar--primary .md-sidebar__scrollwrap {
    width: 288px !important;
  }
}

/* Content max width: 768px (max-w-3xl) */
.md-content__inner {
  max-width: 768px !important;
}

/* Sidebar background: tint-1 */
.md-sidebar {
  background: #1d1d1d !important;
}

/* --- Header --- */
.md-header {
  background: #346ddb !important;
}

/* --- Search bar override --- */
.md-search__input {
  background: #2b2c2d !important;
  color: #bec0c5 !important;
}

/* --- Content first child no top margin --- */
.md-typeset > *:first-child {
  margin-top: 0 !important;
}

/* --- Hero section --- */
.hero {
  text-align: center;
  padding: 3rem 1rem 2rem;
}

.hero-logo {
  max-width: 220px;
  display: block;
  margin: 0 auto 1.5rem;
}

/* --- Footer/navigation links at bottom of pages --- */
.md-footer {
  background: #1d1d1d !important;
}

/* --- Scrollbar styling to match dark theme --- */
.md-sidebar__scrollwrap::-webkit-scrollbar {
  width: 4px;
}

.md-sidebar__scrollwrap::-webkit-scrollbar-thumb {
  background: #383a3c;
  border-radius: 4px;
}

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