/*
 * Maps the brand tokens in brand.css onto Material for MkDocs variables.
 *
 * `primary: custom` / `accent: custom` in mkdocs.yml define no colours at all, so every
 * --md-primary-* and --md-accent-* value has to be set here, per scheme. Material pages only;
 * the static pages never load this file.
 */
:root,
[data-md-color-scheme="default"] {
  --md-primary-fg-color: var(--xc-primary);
  --md-primary-fg-color--light: #2A6E8B;
  --md-primary-fg-color--dark: #003348;
  --md-primary-bg-color: var(--xc-on-primary);
  --md-primary-bg-color--light: rgba(255, 255, 255, 0.7);

  --md-accent-fg-color: #2A6E8B;
  --md-accent-fg-color--transparent: rgba(0, 77, 107, 0.1);
  --md-accent-bg-color: #FFFFFF;
  --md-accent-bg-color--light: rgba(255, 255, 255, 0.7);

  --md-default-bg-color: var(--xc-bg);
  --md-default-fg-color: var(--xc-fg);
  --md-code-bg-color: var(--xc-surface-container);

  --md-text-font: var(--xc-font-sans);
  --md-code-font: var(--xc-font-mono);
}

[data-md-color-scheme="slate"] {
  --md-primary-fg-color: var(--xc-primary);
  --md-primary-fg-color--light: #7BBCD0;
  --md-primary-fg-color--dark: #2F7F99;
  /* Header text: the dark header is the light teal, so it takes dark text. */
  --md-primary-bg-color: var(--xc-on-primary);
  --md-primary-bg-color--light: rgba(0, 50, 63, 0.7);

  --md-accent-fg-color: #7BBCD0;
  --md-accent-fg-color--transparent: rgba(79, 160, 186, 0.12);
  --md-accent-bg-color: #00323F;
  --md-accent-bg-color--light: rgba(0, 50, 63, 0.7);

  /* Slate derives its background from --md-hue; pin it to the brand neutral instead. */
  --md-default-bg-color: var(--xc-bg);
  --md-default-bg-color--light: rgba(15, 20, 22, 0.7);
  --md-default-bg-color--lighter: rgba(15, 20, 22, 0.3);
  --md-default-bg-color--lightest: rgba(15, 20, 22, 0.12);
  --md-default-fg-color: var(--xc-fg);
  --md-default-fg-color--light: rgba(222, 227, 230, 0.7);
  --md-default-fg-color--lighter: rgba(222, 227, 230, 0.3);
  --md-default-fg-color--lightest: rgba(222, 227, 230, 0.12);
  --md-code-bg-color: var(--xc-surface-container);
  --md-typeset-a-color: var(--xc-primary);
  --md-footer-bg-color: var(--xc-surface-lowest);
  --md-footer-bg-color--dark: var(--xc-surface-lowest);
}

/* The wordmark is 2.6:1; Material sizes logos for a square. */
.md-header__button.md-logo svg {
  width: auto;
  height: 1.2rem;
}

.md-header__button.md-logo {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
