/* Moonlit: global brand colors */
:root {
  --moonlit-primary: #652aef; /* requested */
  --moonlit-accent:  #9b70ff; /* requested */
}

/* Light mode (default) */
[data-md-color-scheme="moonlit"] {
  /* brand */
  --md-primary-fg-color: var(--moonlit-primary);
  --md-primary-fg-color--light: color-mix(in oklab, var(--moonlit-primary), white 20%);
  --md-primary-fg-color--dark:  color-mix(in oklab, var(--moonlit-primary), black 20%);
  --md-accent-fg-color:  var(--moonlit-accent);

  /* links */
  --md-typeset-a-color: var(--moonlit-primary);

  /* surfaces */
  /* keep Material defaults for light; override only if you want a tinted header/footer */
  /* --md-primary-bg-color: #fff; */
}

/* Dark mode (Material "slate" base) */
[data-md-color-scheme="slate"] {
  /* preserve slate tonality, apply brand */
  --md-primary-fg-color: var(--moonlit-primary);
  --md-primary-fg-color--light: color-mix(in oklab, var(--moonlit-primary), white 25%);
  --md-primary-fg-color--dark:  color-mix(in oklab, var(--moonlit-primary), black 25%);
  --md-accent-fg-color:  var(--moonlit-accent);
  --md-typeset-a-color: var(--moonlit-accent);
}

/* OLED: mirror Slate colors; only backgrounds are black */
[data-md-color-scheme="oled"] {
  color-scheme: dark;

  /* brand (same as Slate) */
  --md-primary-fg-color: #652aef;
  --md-primary-fg-color--light: color-mix(in oklab, #652aef, white 25%);
  --md-primary-fg-color--dark:  color-mix(in oklab, #652aef, black 25%);
  --md-accent-fg-color:  #9b70ff;
  --md-typeset-a-color:  #9b70ff;

  /* foregrounds (copy Slate) */
  --md-default-fg-color: #e6e6e6;
  --md-default-fg-color--light: #cfcfcf;
  --md-default-fg-color--lighter: #b3b3b3;
  --md-default-fg-color--lightest: #9a9a9a;
  --md-typeset-color: var(--md-default-fg-color); /* body text */

  /* backgrounds: pure black surfaces only */
  --md-default-bg-color: #000000;  /* page + nav */
  --md-code-bg-color:    #000000;
  --md-footer-bg-color:  #000000;

  /* header text on primary stays light */
  --md-primary-bg-color: #ffffff;  /* on-primary (icon/text) */

  /* code color + borders */
  --md-code-fg-color: var(--md-default-fg-color);
  --md-border-color: #1a1a1a;
}


/* Optional: improve focus rings to match brand */
:where([data-md-color-scheme]) *:focus-visible {
  outline: 2px solid var(--moonlit-accent);
  outline-offset: 2px;
}

/* Optional: tweak code selection and kbd */
[data-md-color-scheme="oled"] ::selection {
  background: color-mix(in oklab, var(--moonlit-accent), black 60%);
  color: #ffffff;
}
[data-md-color-scheme="slate"] ::selection,
[data-md-color-scheme="moonlit"] ::selection {
  background: color-mix(in oklab, var(--moonlit-accent), white 70%);
  color: #1a1a1a;
}

/* OLED admonitions: dark surfaces + tinted titles */
[data-md-color-scheme="oled"] .md-typeset .admonition,
[data-md-color-scheme="oled"] .md-typeset details {
  background-color: #000;
  color: var(--md-default-fg-color);
  border: 1px solid #1a1a1a;
}

/* Title row stays dark and readable */
[data-md-color-scheme="oled"] .md-typeset .admonition > .admonition-title,
[data-md-color-scheme="oled"] .md-typeset details > summary {
  color: var(--md-default-fg-color);
  background-color: rgba(155, 112, 255, 0.10); /* neutral fallback tint */
  border-bottom: 1px solid #1a1a1a;
}

/* Icons in title row */
[data-md-color-scheme="oled"] .md-typeset .admonition > .admonition-title::before,
[data-md-color-scheme="oled"] .md-typeset details > summary::before {
  background-color: currentColor;
  filter: none;
}

/* Code blocks inside admonitions keep black */
[data-md-color-scheme="oled"] .md-typeset .admonition pre,
[data-md-color-scheme="oled"] .md-typeset .admonition code {
  background-color: #000;
}

/* Variant tints (mirrors Slate intent) */
[data-md-color-scheme="oled"] .md-typeset .admonition.note,
[data-md-color-scheme="oled"] .md-typeset .admonition.abstract,
[data-md-color-scheme="oled"] .md-typeset .admonition.todo,
[data-md-color-scheme="oled"] .md-typeset .admonition.question {
  border-color: #9b70ff;
}
[data-md-color-scheme="oled"] .md-typeset .admonition.note > .admonition-title,
[data-md-color-scheme="oled"] .md-typeset .admonition.abstract > .admonition-title,
[data-md-color-scheme="oled"] .md-typeset .admonition.todo > .admonition-title,
[data-md-color-scheme="oled"] .md-typeset .admonition.question > .admonition-title {
  background-color: rgba(155, 112, 255, 0.12);
}

[data-md-color-scheme="oled"] .md-typeset .admonition.info {
  border-color: #64b5f6;
}
[data-md-color-scheme="oled"] .md-typeset .admonition.info > .admonition-title {
  background-color: rgba(100, 181, 246, 0.12);
}

[data-md-color-scheme="oled"] .md-typeset .admonition.tip,
[data-md-color-scheme="oled"] .md-typeset .admonition.success {
  border-color: #66bb6a;
}
[data-md-color-scheme="oled"] .md-typeset .admonition.tip > .admonition-title,
[data-md-color-scheme="oled"] .md-typeset .admonition.success > .admonition-title {
  background-color: rgba(102, 187, 106, 0.12);
}

[data-md-color-scheme="oled"] .md-typeset .admonition.warning,
[data-md-color-scheme="oled"] .md-typeset .admonition.caution,
[data-md-color-scheme="oled"] .md-typeset .admonition.attention {
  border-color: #ffb74d;
}
[data-md-color-scheme="oled"] .md-typeset .admonition.warning > .admonition-title,
[data-md-color-scheme="oled"] .md-typeset .admonition.caution > .admonition-title,
[data-md-color-scheme="oled"] .md-typeset .admonition.attention > .admonition-title {
  background-color: rgba(255, 183, 77, 0.12);
}

[data-md-color-scheme="oled"] .md-typeset .admonition.failure,
[data-md-color-scheme="oled"] .md-typeset .admonition.danger,
[data-md-color-scheme="oled"] .md-typeset .admonition.bug {
  border-color: #ef5350;
}
[data-md-color-scheme="oled"] .md-typeset .admonition.failure > .admonition-title,
[data-md-color-scheme="oled"] .md-typeset .admonition.danger > .admonition-title,
[data-md-color-scheme="oled"] .md-typeset .admonition.bug > .admonition-title {
  background-color: rgba(239, 83, 80, 0.12);
}

[data-md-color-scheme="oled"] .md-typeset .admonition.example,
[data-md-color-scheme="oled"] .md-typeset .admonition.quote {
  border-color: #9a9a9a;
}
[data-md-color-scheme="oled"] .md-typeset .admonition.example > .admonition-title,
[data-md-color-scheme="oled"] .md-typeset .admonition.quote > .admonition-title {
  background-color: rgba(154, 154, 154, 0.12);
}

/* OLED: improve "question" admonitions */
[data-md-color-scheme="oled"] .md-typeset .admonition.question,
[data-md-color-scheme="oled"] .md-typeset details.question {
  border-color: #9b70ff;
}

[data-md-color-scheme="oled"] .md-typeset .admonition.question > .admonition-title,
[data-md-color-scheme="oled"] .md-typeset details.question > summary {
  background-color: rgba(155, 112, 255, 0.18); /* stronger brand tint */
  color: #f3efff;                               /* readable on purple tint */
  border-bottom: 1px solid #1a1a1a;
}

/* keep the question icon in accent even if title text is light */
[data-md-color-scheme="oled"] .md-typeset .admonition.question > .admonition-title::before,
[data-md-color-scheme="oled"] .md-typeset details.question > summary::before {
  background-color: #9b70ff !important;
}

/* body stays black, links use accent */
[data-md-color-scheme="oled"] .md-typeset .admonition.question {
  background-color: #000;
}
[data-md-color-scheme="oled"] .md-typeset .admonition.question a {
  color: #9b70ff;
}