/* https://squidfunk.github.io/mkdocs-material/setup/changing-the-fonts/?h=font#autoloading */
@font-face {
  font-family: "Space Grotesk";
  src: url("fonts/SpaceGrotesk-VariableFont_wght.ttf")
    format("truetype-variations");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Space Mono";
  src: url("fonts/SpaceMono-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
:root {
  /* Platform One brand palette */
  --bb-tactical-teal: #40826f;
  --bb-pacific-green: #3fd497;
  --bb-skyward-white: #f4f5f4;
  --bb-silver-horizon: #c7c8c7;
  --bb-midnight-ops: #1e2220;
  --bb-velocity-orange: #ff9966;
  --bb-dark-teal: #3a7060;
  --bb-deep-teal: #345e52;
  --bb-surface-dark-green: #101814;
  --bb-near-black: #0f1110;

  --md-text-font: "Space Grotesk";
  --md-code-font: "Space Mono";
  --md-clipboard-icon: url("icons/md-clipboard-icon.svg") !important;
  --md-nav-icon--prev: url("icons/md-nav-icon--prev.svg") !important;
  --md-nav-icon--next: url("icons/md-nav-icon--prev.svg") !important;
  --md-toc-icon: url("icons/md-toc-icon.svg") !important;
  --md-search-result-icon: url("icons/md-search-result-icon.svg") !important;
  --md-source-forks-icon: url("icons/md-source-forks-icon.svg") !important;
  --md-source-repositories-icon: url("icons/md-source-repositories-icon.svg") !important;
  --md-source-stars-icon: url("icons/md-source-stars-icon.svg") !important;
  --md-source-version-icon: url("icons/md-source-versoin-icon.svg") !important;
  --md-version-icon: url("icons/md-version-icon.svg") !important;
  --md-admonition-icon--note: url("icons/md-admonition-icon--note.svg") !important;
  --md-admonition-icon--abstract: url("icons/md-admonition-icon--abstract.svg") !important;
  --md-admonition-icon--info: url("icons/md-admonition-icon--info.svg") !important;
  --md-admonition-icon--tip: url("icons/md-admonition-icon--tip.svg") !important;
  --md-admonition-icon--success: url("icons/md-admonition-icon--success.svg") !important;
  --md-admonition-icon--question: url("icons/md-admonition-icon--question.svg") !important;
  --md-admonition-icon--warning: url("icons/md-admonition-icon--warning.svg") !important;
  --md-admonition-icon--failure: url("icons/md-admonition-icon--failure.svg") !important;
  --md-admonition-icon--danger: url("icons/md-admonition-icon--danger.svg") !important;
  --md-admonition-icon--bug: url("icons/md-admonition-icon--bug.svg") !important;
  --md-admonition-icon--example: url("icons/md-admonition-icon--example.svg") !important;
  --md-admonition-icon--quote: url("icons/md-admonition-icon--quote.svg") !important;
  --md-footnotes-icon: url("icons/md-footnotes-icon.svg") !important;
  --md-details-icon: url("icons/md-details-icon.svg") !important;
  --md-tasklist-icon: url("icons/md-tasklist-icon.svg") !important;
  --md-tasklist-icon--checked: url("icons/md-tasklist-icon--checked.svg") !important;
}

/* Light mode uses the P1 off-white canvas with a high-contrast dark header. */
:root > * {
  --md-primary-fg-color: var(--bb-midnight-ops);
  --md-primary-fg-color--light: var(--bb-dark-teal);
  --md-primary-fg-color--dark: var(--bb-surface-dark-green);
  --md-primary-bg-color: var(--bb-skyward-white);
  --md-primary-bg-color--light: rgba(244, 245, 244, 0.72);
  --md-accent-fg-color: var(--bb-deep-teal);
  --md-accent-fg-color--transparent: rgba(52, 94, 82, 0.12);
  --md-typeset-a-color: var(--bb-deep-teal);
  --md-default-fg-color: var(--bb-midnight-ops);
  --md-default-fg-color--light: rgba(30, 34, 32, 0.72);
  --md-default-fg-color--lighter: rgba(30, 34, 32, 0.48);
  --md-default-fg-color--lightest: rgba(30, 34, 32, 0.16);
  --md-default-bg-color: var(--bb-skyward-white);
  --md-default-bg-color--light: rgba(244, 245, 244, 0.72);
  --md-default-bg-color--lighter: rgba(244, 245, 244, 0.48);
  --md-default-bg-color--lightest: rgba(244, 245, 244, 0.16);
  --md-code-fg-color: var(--bb-midnight-ops);
  --md-code-bg-color: #e9eae9;
  --md-typeset-table-color: rgba(30, 34, 32, 0.16);
  --md-typeset-table-color--light: rgba(30, 34, 32, 0.08);
  --md-footer-fg-color: var(--bb-skyward-white);
  --md-footer-fg-color--light: rgba(244, 245, 244, 0.72);
  --md-footer-fg-color--lighter: rgba(244, 245, 244, 0.48);
  --md-footer-bg-color: var(--bb-midnight-ops);
  --md-footer-bg-color--dark: var(--bb-surface-dark-green);
}

/* Dark mode mirrors P1's default dark presentation and green interactions. */
:root [data-md-color-scheme="slate"] {
  --md-primary-fg-color: var(--bb-surface-dark-green);
  --md-primary-fg-color--light: var(--bb-midnight-ops);
  --md-primary-fg-color--dark: var(--bb-near-black);
  --md-primary-bg-color: var(--bb-skyward-white);
  --md-primary-bg-color--light: rgba(244, 245, 244, 0.72);
  --md-accent-fg-color: var(--bb-pacific-green);
  --md-accent-fg-color--transparent: rgba(63, 212, 151, 0.12);
  --md-typeset-a-color: var(--bb-pacific-green);
  --md-default-fg-color: var(--bb-skyward-white);
  --md-default-fg-color--light: rgba(244, 245, 244, 0.72);
  --md-default-fg-color--lighter: rgba(244, 245, 244, 0.48);
  --md-default-fg-color--lightest: rgba(244, 245, 244, 0.16);
  --md-default-bg-color: var(--bb-midnight-ops);
  --md-default-bg-color--light: rgba(30, 34, 32, 0.72);
  --md-default-bg-color--lighter: rgba(30, 34, 32, 0.48);
  --md-default-bg-color--lightest: rgba(30, 34, 32, 0.16);
  --md-code-fg-color: var(--bb-skyward-white);
  --md-code-bg-color: var(--bb-near-black);
  --md-typeset-table-color: rgba(244, 245, 244, 0.16);
  --md-typeset-table-color--light: rgba(244, 245, 244, 0.08);
  --md-footer-fg-color: var(--bb-skyward-white);
  --md-footer-fg-color--light: rgba(244, 245, 244, 0.72);
  --md-footer-fg-color--lighter: rgba(244, 245, 244, 0.48);
  --md-footer-bg-color: var(--bb-surface-dark-green);
  --md-footer-bg-color--dark: var(--bb-near-black);
}

::selection {
  background-color: var(--bb-pacific-green);
  color: var(--bb-near-black);
}

:focus-visible {
  outline: 3px solid var(--bb-pacific-green);
  outline-offset: 2px;
}

/* Keep MkDocs' information architecture while aligning its surfaces to P1. */
.md-header,
.md-tabs {
  box-shadow: none;
}

.md-tabs {
  border-bottom: 1px solid rgba(244, 245, 244, 0.16);
}

.md-tabs__link--active,
.md-tabs__link:focus,
.md-tabs__link:hover {
  color: var(--bb-pacific-green);
  opacity: 1;
}

.md-search__form,
.md-search__output,
.md-typeset .admonition,
.md-typeset details,
.md-typeset pre > code,
.md-typeset .md-button {
  border-radius: 0;
}

.md-typeset .md-button {
  font-weight: 600;
  letter-spacing: 0.03em;
}

.md-typeset .md-button--primary {
  background-color: var(--md-accent-fg-color);
  border-color: var(--md-accent-fg-color);
}

.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4 {
  font-weight: 500;
  letter-spacing: -0.015em;
}

.center-img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: auto;
}

.md-header__button.md-logo {
  margin: 0.2rem;
  padding: 0.2rem 0.4rem;
}

.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  width: auto;
  height: 1.55rem;
}

.p1-footer-logo {
  display: block;
  width: 9.2rem;
  height: auto;
}

.bb-footer-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.md-grid {
  max-width: 1920px;
}

.type-string code {
  color: var(--md-code-hl-string-color);
}

.type-bool code {
  color: var(--md-code-hl-special-color);
}

.type-object code {
  color: var(--md-code-hl-function-color);
}

.type-list code {
  color: var(--bb-velocity-orange);
}

.type-int code {
  color: var(--md-code-hl-constant-color);
}