:root {
  --doweb-charcoal: #404041;
  --doweb-red: #980000;
}

/*
 * The public DoWEB site uses a white surface, charcoal type, and its
 * distinctive red as the action colour. Keeping the header light lets the
 * official charcoal-and-red logo remain legible in both colour modes.
 */
[data-md-color-scheme="default"],
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #ffffff;
  --md-primary-fg-color--light: #f5f5f5;
  --md-primary-fg-color--dark: #e7e7e7;
  --md-primary-bg-color: var(--doweb-charcoal);
  --md-primary-bg-color--light: var(--doweb-charcoal);
  --md-accent-fg-color: var(--doweb-red);
  --md-typeset-a-color: var(--doweb-red);
}

.md-header,
.md-tabs {
  background-color: #ffffff;
  color: var(--doweb-charcoal);
}

.md-header {
  border-bottom: 1px solid #e5e5e5;
  box-shadow: none;
}

.md-header__button,
.md-header__topic,
.md-tabs__link,
.md-search__icon,
.md-search__input {
  color: var(--doweb-charcoal);
}

.md-header__button.md-logo {
  margin: 0.15rem 0.25rem 0.15rem 0;
  padding: 0;
}

.md-header__button.md-logo img {
  height: 1.65rem;
  width: auto;
}

.md-search__form {
  background-color: #f3f3f3;
}

.md-search__input::placeholder {
  color: #6e6e70;
}

.md-typeset a:focus,
.md-typeset a:hover {
  color: #700000;
}

/*
 * Group labels in the primary sidebar are controls, not document links.
 * Give them a visibly different treatment so the navigation hierarchy is
 * immediately clear beside normal page links.
 */
.md-sidebar--primary .md-nav--primary > .md-nav__list > .md-nav__item--nested > .md-nav__link {
  border-bottom: 2px solid var(--doweb-red);
  color: var(--doweb-charcoal);
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  margin-top: 0.9rem;
  padding: 0.2rem 0rem;
  text-transform: uppercase;
}

.md-sidebar--primary .md-nav--primary > .md-nav__list > .md-nav__item--nested > .md-nav__link:is(:focus, :hover) {
  background-color: #f5eeee;
  color: var(--doweb-red);
}