/* ============================================================
   Grainulator docs theme
   ============================================================ */

/* Material color overrides */
[data-md-color-scheme="default"] {
  --md-primary-fg-color: #1a1a2e;
  --md-primary-fg-color--light: #2d2d44;
  --md-primary-fg-color--dark: #0d0d1f;
  --md-accent-fg-color: #f4a300;
}

/* Body font: keep Material's default Roboto for readability.
   Headings: a more distinctive serif/sans pairing. */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3 {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.md-typeset h1 {
  font-size: 2.2rem;
  border-bottom: 2px solid var(--md-accent-fg-color);
  padding-bottom: 0.3rem;
}

/* ============================================================
   Nerd box admonition
   "The math, for the curious" — distinctive sidebar style.
   Use as: !!! note nerd "The math, for the curious"
   ============================================================ */

.md-typeset .admonition.nerd,
.md-typeset details.nerd {
  border-left: 4px solid #6a4caf;
  background: linear-gradient(
    to right,
    rgba(106, 76, 175, 0.08),
    rgba(106, 76, 175, 0.02)
  );
}

.md-typeset .nerd > .admonition-title,
.md-typeset .nerd > summary {
  background: rgba(106, 76, 175, 0.15);
  font-weight: 600;
}

.md-typeset .nerd > .admonition-title::before,
.md-typeset .nerd > summary::before {
  background-color: #6a4caf;
  -webkit-mask-image: var(--md-admonition-icon--note);
          mask-image: var(--md-admonition-icon--note);
}

/* Parameter name inline style — looks like a UI control label */
.md-typeset code.param,
.md-typeset .control-name {
  background: #1a1a2e;
  color: #f4a300;
  padding: 0.1rem 0.4rem;
  border-radius: 3px;
  font-family: 'JetBrains Mono', 'Menlo', monospace;
  font-size: 0.85em;
  font-weight: 500;
}

/* Comparison tables in reverb-models / filter-models chapters */
.md-typeset table.compare {
  font-size: 0.85rem;
}

.md-typeset table.compare th {
  background: var(--md-primary-fg-color);
  color: white;
}
