/* ── Header / AppBar — directly targeted, same dark bar in both modes ───── */
.md-header {
  background-color: #1e1b2e;
  color: #f0ede8;
}

.md-header__title,
.md-header__button {
  color: #f0ede8;
}

/* ── Dark mode — mirrors darkTheme palette ──────────────────────────────── */
[data-md-color-scheme="slate"] {
  /* AppBar */
  --md-primary-bg-color: #0a1020;

  /* Content background — bg.default / bg.paper */
  --md-default-bg-color:          #080e1c;
  --md-default-bg-color--light:   #0f1829;
  --md-default-bg-color--lighter: rgba(255, 255, 255, 0.04);
  --md-default-bg-color--lightest:rgba(255, 255, 255, 0.02);

  /* Text — text.primary / secondary / disabled */
  --md-default-fg-color:          #e8e4dc;
  --md-default-fg-color--light:   rgba(232, 228, 220, 0.6);
  --md-default-fg-color--lighter: rgba(232, 228, 220, 0.38);
  --md-default-fg-color--lightest:rgba(232, 228, 220, 0.28);

  /* Accent — primary.main in dark */
  --md-accent-fg-color:              #4ecca3;
  --md-accent-fg-color--transparent: rgba(78, 204, 163, 0.1);
  --md-accent-bg-color:              rgba(78, 204, 163, 0.1);

  /* Links */
  --md-typeset-a-color: #4ecca3;

  /* Code blocks — bg.paper for background, text.primary for text */
  --md-code-fg-color:  #e8e4dc;
  --md-code-bg-color:  #0f1829;
}

/* ── Light mode — mirrors lightTheme palette ────────────────────────────── */
[data-md-color-scheme="default"] {
  /* Content background */
  --md-default-bg-color:          #f5f0ea;
  --md-default-bg-color--light:   #e8e4de;
  --md-default-bg-color--lighter: #f5f2ed;
  --md-default-bg-color--lightest:#ffffff;

  /* Text */
  --md-default-fg-color:          #1a1a1a;
  --md-default-fg-color--light:   rgba(26, 26, 26, 0.7);
  --md-default-fg-color--lighter: rgba(26, 26, 26, 0.54);
  --md-default-fg-color--lightest:rgba(26, 26, 26, 0.32);

  /* Accent */
  --md-accent-fg-color:              #4ecca3;
  --md-accent-fg-color--transparent: rgba(78, 204, 163, 0.1);
  --md-accent-bg-color:              rgba(78, 204, 163, 0.1);

  /* Links — dark enough to pass contrast on #f5f0ea */
  --md-typeset-a-color: #1e6b52;

  /* Code blocks */
  --md-code-fg-color:  #1a1a1a;
  --md-code-bg-color:  #ffffff;
}

/* ── Dark mode AppBar overrides ─────────────────────────────────────────── */
[data-md-color-scheme="slate"] .md-header {
  background-color: #0a1020;
  border-bottom: 1px solid rgba(78, 236, 163, 0.18);
  box-shadow: none;
}

/* ── Divider / border color in dark mode ────────────────────────────────── */
[data-md-color-scheme="slate"] .md-nav__item--nested > .md-nav__link,
[data-md-color-scheme="slate"] .md-sidebar__scrollwrap {
  border-color: rgba(78, 236, 163, 0.12);
}

/* ── Footer — match AppBar ───────────────────────────────────────────────── */
.md-footer {
  background-color: #1e1b2e;
  color: #f0ede8;
}
[data-md-color-scheme="slate"] .md-footer {
  background-color: #0a1020;
}

/* ── Scrollbar — mirrors gm-app global.css ───────────────────────────────── */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(78, 204, 163, 0.2) transparent;
}
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background-color: rgba(78, 204, 163, 0.2);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background-color: rgba(78, 204, 163, 0.4);
}