/* Primary and accent colors (required for primary = "custom" and accent = "custom") */
:root {
    --md-primary-fg-color: #CC0000;
    --md-primary-fg-color--light: #FF3322;
    --md-primary-fg-color--dark: #990000;
    --md-accent-fg-color: #CC0000;
}

/* Light mode */
[data-md-color-scheme="default"] {
    --md-typeset-a-color: #CC0000; /* Link color */
    --md-h1-text-color: #111111; /* Color of heading text */
    --md-h2-text-color: #333333; /* Color of heading text */
    --md-h3-text-color: #555555; /* Color of heading text */
}

/* Dark mode */
[data-md-color-scheme="slate"] {
    --md-default-bg-color: #1E2129;
    --md-primary-fg-color: #FF3322;
    --md-accent-fg-color: #FF3322; /* Active nav link color (used by .md-nav--primary .md-nav__link--active) */
    --md-accent-fg-color--transparent: rgba(255, 51, 34, 0.1); /* Active nav link background */
    --md-typeset-a-color: #FF3322; /* Link color */
    --md-h1-text-color: #EEEEEE; /* Color of heading text */
    --md-h2-text-color: #CCCCCC; /* Color of heading text */
    --md-h3-text-color: #AAAAAA; /* Color of heading text */
}

/* Applied to all headers */
.md-content :is(h1, h2, h3, h4, h5, h6) {
    scroll-margin-top: 5rem !important; /* Padding above the 'click-to' position */
}

/* H1: page title */
.md-content h1 {
    font-weight: 700;
    border-bottom: 3px solid var(--md-primary-fg-color);
    padding-bottom: 0.3rem;
    padding-top: 0.3rem;
    color: var(--md-h1-text-color);
}

/* H2: major sections */
.md-content h2 {
    font-weight: 600;
    border-bottom: 3px solid var(--md-default-fg-color--lighter);
    padding-top: 1rem;
    padding-bottom: 0.2rem;
    color: var(--md-h2-text-color);
}

/* H3: subsections */
.md-content h3 {
    font-weight: 600;
    border-bottom: 1px solid var(--md-default-fg-color--lighter);
    font-style: italic;
    color: var(--md-h3-text-color);
}


/* Padding at the bottom of each page */
.md-content__inner {
    padding-bottom: 10vh;
}


/* Make the spaces in block quotes a little wider */
.md-typeset blockquote {
    word-spacing: 0.2rem;
}


/* Site header bar - dark mode variable values frozen across all color schemes */
.md-header {
    --md-default-bg-color: #1E2129;
    --md-default-bg-color--light: rgba(30, 33, 41, 0.54);
    --md-default-fg-color: rgba(255, 255, 255, 0.82);
    --md-default-fg-color--lightest: rgba(255, 255, 255, 0.12);
    --md-default-fg-color--lighter: rgba(255, 255, 255, 0.32);
    background-color: #CC0000;
    color: white;
}


/* Change logo size and shape */
.md-header__button.md-logo img {
    margin: -0.1rem;
    height: 3.5rem;
}


/* Increase site name size and weight */
.md-header__title {
    font-size: 1.5rem; /* default is ~1rem */
}

.md-header__topic {
    font-weight: 700;
}


/* Change the enumeration symbol from "X." to "X)" */
.md-content ol {
    list-style: none !important;
    counter-reset: item;
}

.md-content ol > li {
    counter-increment: item;
}

.md-content ol > li::before {
    content: counter(item) ") ";
    font-weight: bold;
    float: left;
    margin-right: 0.3rem;
}


/* Nested ordered lists use lowercase letters */
.md-content ol ol > li::before {
    content: counter(item, lower-alpha) ") ";
}


/* Prevent visited links from changing color */
.md-typeset a:visited {
    color: var(--md-typeset-a-color);
}


/* Permalinks */
.md-typeset .headerlink {
    color: var(--md-typeset-a-color);
}

.md-typeset :target .headerlink {
    color: var(--md-typeset-a-color);
}


/* Left navigation menu */
.md-sidebar--primary {
    width: 13.5rem; /* default is ~12.1rem */
}

/* Properly hide when zooming in. max-width is the width at which the menu becomes a drawer */
@media screen and (max-width: 76.1875em) {
    .md-sidebar--primary {
        transform: translateX(-100%);
    }
}


.md-nav--primary .md-nav__item--section {
    font-size: 1.1rem;
    padding-top: 0;
}