/* Jennah docs — light-grey theme, drawn from the landing page (lp/styles.css).
   lp greys: --surface #f4f6fb, --border #e3e7f0, --text #14161f.
   Accent stays teal (lp --accent-2 #0d9488). No purple. */

:root {
  /* Primary (header, tabs) — light grey surface with dark text. */
  --md-primary-fg-color:        #f4f6fb;
  --md-primary-fg-color--light: #ffffff;
  --md-primary-fg-color--dark:  #e3e7f0;

  /* Accent (links hover, focus, interactive) — lp --accent-2 (teal). */
  --md-accent-fg-color:             #0d9488;
  --md-accent-fg-color--transparent: rgba(13, 148, 136, 0.1);

  /* Body links — teal, matching lp's link color. */
  --md-typeset-a-color: #0d9488;
}

/* Subtle bottom border so the light-grey header reads against white content. */
.md-header {
  border-bottom: 1px solid #e3e7f0;
}

/* The logo is a filled square that sits at its box's exact center, while the
   title's glyphs read optically high — leaving the logo looking slightly low.
   Nudge the logo up a hair so it aligns with the "Jennah Documentation" title. */
.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  position: relative;
  top: -2px;
}

/* Dark scheme (slate): neutral dark-grey header, brighter teal for contrast. */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color:        #2b2f3a;
  --md-primary-fg-color--light: #3a3f4d;
  --md-primary-fg-color--dark:  #1f2330;
  --md-accent-fg-color:         #2dd4bf; /* brighter teal for dark surfaces */
  --md-typeset-a-color:         #2dd4bf;
}

[data-md-color-scheme="slate"] .md-header {
  border-bottom-color: rgba(255, 255, 255, 0.07);
}