:root {
  --brand-red: #cf1229;
  --brand-red-logo: #ae0b1f;
  --brand-red-deep: #7d0715;
  --brand-ink: #0b0b0e;
  --brand-panel: #131318;
  --md-accent-fg-color: var(--brand-red);
  --md-accent-fg-color--transparent: rgba(207, 18, 41, 0.1);
}

[data-md-color-scheme="slate"] {
  --md-hue: 240;
  --md-default-bg-color: var(--brand-panel);
  --md-primary-fg-color: #0a0a0d;
  --md-primary-fg-color--light: #17171c;
  --md-primary-fg-color--dark: #000000;
  --md-accent-fg-color: var(--brand-red);
  --md-typeset-a-color: #e8556b;
}

body[data-md-color-scheme="slate"] {
  background-color: var(--brand-ink);
  background-image: url("../assets/bg-tile.png");
  background-repeat: repeat;
  background-attachment: fixed;
}

[data-md-color-scheme="slate"] .md-header {
  background-color: rgba(8, 8, 11, 0.92);
  border-bottom: 2px solid var(--brand-red-logo);
  backdrop-filter: saturate(140%) blur(6px);
}

[data-md-color-scheme="slate"] .md-tabs {
  background-color: rgba(8, 8, 11, 0.75);
}

[data-md-color-scheme="slate"] .md-footer {
  background-color: rgba(8, 8, 11, 0.92);
  border-top: 2px solid var(--brand-red-logo);
}

[data-md-color-scheme="slate"] .md-main__inner .md-content {
  background-color: rgba(19, 19, 24, 0.80);
  border-radius: 8px;
}

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

* {
  scrollbar-color: var(--brand-red-deep) transparent;
}

::selection {
  background: var(--brand-red);
  color: #fff;
}

.md-typeset h1,
.md-typeset h2 {
  letter-spacing: -0.01em;
}

.md-typeset .admonition.note,
.md-typeset details.note {
  border-color: var(--brand-red);
}

.md-typeset .note > .admonition-title,
.md-typeset .note > summary {
  background-color: rgba(207, 18, 41, 0.12);
}