/* Monokai Pro–inspired dark palette, layered on top of Material's "slate" scheme. */

[data-md-color-scheme="slate"] {
  --md-default-bg-color: #2D2A2E;
  --md-default-fg-color: #FCFCFA;
  --md-default-fg-color--light: #C1C0C0;
  --md-default-fg-color--lighter: #939293;
  --md-default-fg-color--lightest: #727072;

  --md-primary-fg-color: #221F22;
  --md-primary-bg-color: #FCFCFA;

  --md-accent-fg-color: #FC9867;

  --md-typeset-color: #FCFCFA;

  /* --- LINKS -----------------------------------------------------------
     Single color for links, whether visited or not (on purpose - see the
     explicit rules further down). Hover reuses the accent orange so it
     stays consistent with the blockquote bar / nav hover color below. */
  --md-link-color: #5CA8E8;         /* link color (normal = visited) */
  --md-link-hover-color: #FC9867;   /* link color on hover (= accent) */
  --md-typeset-a-color: var(--md-link-color);

  --md-code-bg-color: #221F22;
  --md-code-fg-color: #FCFCFA;
  --md-code-hl-color: #AB9DF255;

  --md-footer-bg-color: #221F22;
  --md-footer-bg-color--dark: #19181A;
}

/* Headings pick up the Monokai Pro accent hues */
[data-md-color-scheme="slate"] .md-typeset h1 { color: #ED6C89; }
[data-md-color-scheme="slate"] .md-typeset h2 { color: #F9DA78; }
[data-md-color-scheme="slate"] .md-typeset h3 { color: #B4DB82; }
[data-md-color-scheme="slate"] .md-typeset h4 { color: #91DAE6; }
[data-md-color-scheme="slate"] .md-typeset h5 { color: #A99EEC; }
[data-md-color-scheme="slate"] .md-typeset h6 { color: #EE9D70; }

/* All heading levels in bold, closer to the Oh My Marktext look */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-typeset h5,
.md-typeset h6 {
  font-weight: 700;
}

/* Blockquotes (the ">" highlight style) get a colored left bar instead of plain grey */
[data-md-color-scheme="slate"] .md-typeset blockquote {
  border-left: 0.2rem solid #FC9867;
  background-color: #ffffff08;
  color: #FCFCFA;
}

/* Inline code */
[data-md-color-scheme="slate"] .md-typeset code {
  color: #fcebb6;
  background-color: #221F22;
}

/* Italic (used for prices, colored/highlighted text carried over from the source docs) */
[data-md-color-scheme="slate"] .md-typeset em {
  color: #F9DA78;
}

/* Links: same color whether visited or not, distinct color on hover,
   never underlined (in any state). */
[data-md-color-scheme="slate"] .md-typeset a,
[data-md-color-scheme="slate"] .md-typeset a:visited {
  color: var(--md-link-color);
  text-decoration: none;
}

[data-md-color-scheme="slate"] .md-typeset a:hover,
[data-md-color-scheme="slate"] .md-typeset a:focus {
  color: var(--md-link-hover-color);
  text-decoration: none;
}

.md-header {
  background-color: #221F22;
}

.md-nav__title, .md-nav__link {
  color: #C1C0C0;
}

.md-nav__link--active, .md-nav__link:focus, .md-nav__link:hover {
  color: #FC9867 !important;
}

/* --- Collapsible "On this page" TOC ------------------------------------
   Material for MkDocs has no built-in expand/collapse for nested TOC
   entries; docs/javascripts/toc-collapse.js adds the toggle button and
   this styles it as a rotating chevron, plus hides collapsed branches. */

/* Material indents each nested level with an extra .6rem of padding on
   .md-nav__list, which — combined with entries that skip the toggle
   column when they have no children — left H2/H3 text starting at a
   different x on almost every row. Cancel that per-level indent and
   give every entry (collapsible or not, at any depth) the same
   two-column layout, so all text lines up on one shared edge and only
   the toggle column (present only where there is something to open)
   moves. */
.md-nav--secondary .md-nav .md-nav__list {
  padding-left: 0;
}

.md-nav--secondary .md-nav__item {
  display: grid;
  grid-template-columns: 1rem 1fr;
  column-gap: 0.2rem;
  align-items: start;
}

.md-nav--secondary .md-nav__item > .md-nav__link {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}

.md-nav--secondary .md-nav__item--collapsible > .md-nav {
  grid-column: 1 / -1;
  grid-row: 2;
}

.md-nav--secondary .md-nav__item--collapsed > .md-nav {
  display: none;
}

.md-nav--secondary .md-nav__toc-toggle {
  grid-column: 1;
  grid-row: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1rem;
  height: 1.3em;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--md-default-fg-color--light);
  cursor: pointer;
}

.md-nav--secondary .md-nav__toc-toggle:hover {
  color: #FC9867;
}

.md-nav--secondary .md-nav__toc-toggle::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 0 4px 5px;
  border-color: transparent transparent transparent currentColor;
  transition: transform 0.2s ease;
}

.md-nav--secondary .md-nav__item--collapsible:not(.md-nav__item--collapsed) > .md-nav__toc-toggle::before {
  transform: rotate(90deg);
}

/* "Collapse all" — reset button injected above the "On this page" title,
   only on pages that actually have collapsible entries. Styled as plain
   text in the site's link color rather than a boxed button, to sit
   quietly above the TOC instead of competing with it. */
.md-nav--secondary .md-nav__collapse-all {
  display: block;
  position: sticky;
  top: 0;
  z-index: 2;
  width: 100%;
  text-align: left;
  margin: 0;
  /* Extra bottom padding matches the gap between "Blender Resources —
     ETÉREA" and "Home" in the primary sidebar (0.625em ≈ 8.75px at the
     TOC's own font-size), so "Collapse all" sits the same distance from
     "On this page" as that reference pair. */
  padding: 0.6rem 0.6rem 9px;
  border: 0;
  /* Solid background: this button is sticky and sits directly above the
     equally-sticky "On this page" title, so it needs to fully mask the
     TOC entries scrolling underneath — otherwise they show through, and
     the title's own fade shadow (which normally blends into the page
     background right below it) bleeds visibly into the button instead. */
  background: var(--md-default-bg-color);
  color: var(--md-link-color);
  font-size: 0.7rem;
  cursor: pointer;
}

.md-nav--secondary .md-nav__collapse-all:hover,
.md-nav--secondary .md-nav__collapse-all:focus {
  color: var(--md-link-hover-color);
}