/* Brand system ---------------------------------------------------------
 * Canonical course blue: #659AD2.
 * Interactive hover/focus states use the darker #4A79AB, never Material's
 * default indigo accent. Mermaid has its own neutral variables in
 * mermaid-viewer.css and is intentionally isolated from these brand colors.
 */
:root,
[data-md-color-scheme="default"] {
  --alp-brand: #659AD2;
  --alp-brand-dark: #4A79AB;
  --alp-brand-light: #8BB5E2;
  --alp-on-brand: #ffffff;
  --alp-on-brand-dark: #ffffff;
  --alp-focus-ring: rgba(74, 121, 171, .28);

  --md-primary-fg-color: var(--alp-brand);
  --md-primary-fg-color--light: var(--alp-brand-light);
  --md-primary-fg-color--dark: var(--alp-brand-dark);
  --md-primary-bg-color: var(--alp-on-brand);
  --md-primary-bg-color--light: rgba(255, 255, 255, .74);

  /* Material uses accent for hovered links, controls and scrollbars. */
  --md-accent-fg-color: var(--alp-brand-dark);
  --md-accent-fg-color--transparent: rgba(74, 121, 171, .12);
  --md-accent-bg-color: #ffffff;
  --md-accent-bg-color--light: rgba(255, 255, 255, .74);
  --md-typeset-a-color: var(--alp-brand-dark);
}

[data-md-color-scheme="slate"] {
  --alp-brand: #659AD2;
  --alp-brand-dark: #4A79AB;
  --alp-brand-light: #8BB5E2;
  --alp-on-brand: #ffffff;
  --alp-on-brand-dark: #ffffff;
  --alp-focus-ring: rgba(139, 181, 226, .30);

  --md-primary-fg-color: var(--alp-brand);
  --md-primary-fg-color--light: var(--alp-brand-light);
  --md-primary-fg-color--dark: var(--alp-brand-dark);
  --md-primary-bg-color: var(--alp-on-brand);
  --md-primary-bg-color--light: rgba(255, 255, 255, .76);

  --md-accent-fg-color: var(--alp-brand-light);
  --md-accent-fg-color--transparent: rgba(139, 181, 226, .14);
  --md-accent-bg-color: #ffffff;
  --md-accent-bg-color--light: rgba(255, 255, 255, .76);
  --md-typeset-a-color: var(--alp-brand-light);
}

/* Header and tabs use the canonical blue surface with the requested white text. */
.md-header,
.md-tabs {
  color: var(--alp-on-brand);
}

.md-header__title,
.md-header__button,
.md-header__button.md-logo,
.md-tabs__link {
  color: var(--alp-on-brand);
}

.md-header svg,
.md-tabs svg {
  fill: currentColor;
}

.md-tabs__link:hover,
.md-tabs__link:focus-visible,
.md-tabs__link--active {
  color: var(--alp-on-brand);
  opacity: 1;
}

/* Text links and navigation: no default indigo interaction states. */
.md-typeset a:not(.md-button):hover,
.md-typeset a:not(.md-button):focus-visible,
.md-nav__link:hover,
.md-nav__link:focus-visible,
.md-nav__link--active,
.md-nav__item .md-nav__link--active,
.md-search-result__link:hover,
.md-search-result__link:focus-visible,
.md-typeset .headerlink:hover,
.md-typeset .headerlink:focus-visible {
  color: var(--alp-brand-dark);
}

/* Primary and secondary Material buttons share the course-blue interaction model. */
.md-typeset .md-button--primary {
  background-color: var(--alp-brand);
  border-color: var(--alp-brand);
  color: var(--alp-on-brand);
}

.md-typeset .md-button--primary:hover,
.md-typeset .md-button--primary:focus-visible,
.md-typeset .md-button:not(.md-button--primary):hover,
.md-typeset .md-button:not(.md-button--primary):focus-visible {
  background-color: var(--alp-brand-dark);
  border-color: var(--alp-brand-dark);
  color: var(--alp-on-brand-dark);
}

.md-typeset .md-button:not(.md-button--primary) {
  border-color: var(--alp-brand);
  color: var(--alp-brand-dark);
}

/* Icon controls inherit the accent but keep a visible keyboard focus ring. */
.md-header__button:focus-visible,
.md-search__input:focus,
.md-typeset a:focus-visible,
.md-typeset button:focus-visible,
.alp-mermaid-tool:focus-visible {
  outline: 2px solid var(--alp-brand-dark);
  outline-offset: 2px;
}

/* Home/module cards stay neutral until hover, then use the darker brand blue. */
a.alp-item:hover,
a.alp-item:focus-visible {
  border-color: var(--alp-brand-dark);
  color: var(--md-default-fg-color);
}

a.alp-item:hover .alp-item__num,
a.alp-item:focus-visible .alp-item__num {
  color: var(--alp-brand-dark);
}

::selection {
  background: color-mix(in srgb, var(--alp-brand) 28%, transparent);
}