/*
 * Site colors for the "custom" primary and accent in mkdocs.yml: a deep blue header with blue
 * links and accents. Measured contrast ratios (WCAG 2) are in the comments below; every text color
 * here is at least 4.5:1 against the background it is drawn on, including the inactive navigation
 * tabs, which Material draws at 70% opacity on the header color.
 */

[data-md-color-primary="custom"] {
  /* Header and tab bar background. White on it: 8.72:1; inactive tabs (white at 70%): 5.12:1. */
  --md-primary-fg-color: #1e40af;
  --md-primary-fg-color--light: #60a5fa;
  --md-primary-fg-color--dark: #1e3a8a;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: rgba(255, 255, 255, 0.7);
}

[data-md-color-accent="custom"] {
  /* Hover and focus color. On white: 6.70:1; white text on it: 6.70:1. */
  --md-accent-fg-color: #1d4ed8;
  --md-accent-fg-color--transparent: rgba(29, 78, 216, 0.1);
  --md-accent-bg-color: #ffffff;
  --md-accent-bg-color--light: rgba(255, 255, 255, 0.7);
}

[data-md-color-scheme="default"] {
  /*
   * Secondary text: page titles, blockquotes, line numbers, and code comments and punctuation.
   * Material's 54% black measures 4.50:1 on the code background; 58% measures 5.20:1 there and
   * 5.32:1 on white.
   */
  --md-default-fg-color--light: rgba(0, 0, 0, 0.58);
}

[data-md-color-scheme="default"][data-md-color-primary="custom"] {
  /* Links, lighter than the header blue so they stand apart from body text. On white: 6.70:1. */
  --md-typeset-a-color: #1d4ed8;
}

[data-md-color-scheme="slate"] {
  /* A green-gray dark background instead of the default blue-gray. */
  --md-hue: 160deg;
  /*
   * Secondary text and code comments at 66% instead of 56%, and lighter code highlight colors:
   * Material's dark-mode defaults measure 3.99-4.42:1 on the code background, and the section
   * titles in the phone navigation drawer need 66% to clear 4.5:1 on their tinted background.
   */
  --md-default-fg-color--light: hsla(var(--md-hue), 15%, 90%, 0.66);
  --md-code-hl-number-color: #f28b7f;
  --md-code-hl-special-color: #f47fa6;
  --md-code-hl-function-color: #d99be5;
  --md-code-hl-constant-color: #ab9ff0;
  --md-code-hl-keyword-color: #8fb0f0;
}

[data-md-color-scheme="slate"][data-md-color-primary="custom"] {
  /* A darker header. White on it: 10.36:1; inactive tabs (white at 70%): 5.94:1. */
  --md-primary-fg-color: #1e3a8a;
  --md-primary-fg-color--dark: #172554;
  /* Links on the dark background: 8.31:1. */
  --md-typeset-a-color: #93c5fd;
}

[data-md-color-scheme="slate"][data-md-color-accent="custom"] {
  --md-accent-fg-color: #93c5fd;
  --md-accent-fg-color--transparent: rgba(147, 197, 253, 0.1);
  /* Text drawn on the bright accent (button hover, back-to-top hover) is dark, not white. */
  --md-accent-bg-color: #0b1a3a;
  --md-accent-bg-color--light: rgba(11, 26, 58, 0.7);
}

/*
 * The search box in the desktop header: Material draws the placeholder in 70% white, which falls
 * to 4.08:1 when the box lightens on hover. Full white measures 6.47:1 there (4.57:1 and 7.40:1 on
 * the dark scheme's darker header).
 */
@media screen and (min-width: 60em) {
  .md-search__input::placeholder {
    color: var(--md-primary-bg-color);
  }
}

/* Outlined buttons take the header blue by default, which is too dark on the dark background. */
[data-md-color-scheme="slate"] .md-typeset .md-button:not(.md-button--primary) {
  color: var(--md-typeset-a-color);
}

/*
 * Code-block titles carry full repository paths. Let them wrap anywhere, so a long path breaks
 * across lines instead of widening the page on a phone.
 */
.md-typeset .highlight span.filename {
  overflow-wrap: anywhere;
}

.md-typeset .highlighttable th.filename {
  min-width: 0;
}
