:root > * {
  --md-code-hl-color: #ff6f00dd;
  --md-code-hl-color--light: #ff6f0033;
}

.md-sidebar,
.md-footer {
    display: none;
}

/* The header is no longer hidden outright, because Material renders the
   light/dark toggle inside it and a `display: none` ancestor cannot be undone
   by its children. Instead it is stripped of its bar styling and lifted out of
   the layout flow, so the page keeps exactly the spacing it had before, and
   every control except the palette toggle is hidden. */
.md-header {
    position: fixed;
    top: 0;
    right: 0;
    left: auto;
    width: auto;
    /* Zero height keeps Material from offsetting the sticky table of contents
       by the header's size; the toggle simply overflows the empty box. */
    height: 0;
    overflow: visible;
    background: none;
    box-shadow: none;
    /* Header text defaults to the primary colour (white); force the normal
       foreground colour so the icon stays visible in the light scheme. */
    color: var(--md-default-fg-color);
}

.md-header__inner {
    margin: 0;
    padding: 0.4rem;
    max-width: none;
}

.md-header__inner > *:not(.md-header__option) {
    display: none;
}

.md-header__option .md-header__button {
    margin: 0;
    padding: 0.3rem;
    border: 1px solid var(--md-default-fg-color--lightest);
    border-radius: 50%;
    background-color: var(--md-default-bg-color);
    opacity: 0.85;
}

.md-header__option .md-header__button:hover {
    opacity: 1;
}

h1, h2, h3, h4 {
    font-weight: 700!important;
}

h1 {
    text-align: center;
}

h2 {
    margin-top: 3rem!important;
    margin-bottom: 1rem!important;
    padding-bottom: 0.5rem!important;
    border-bottom: 1px solid var(--md-default-fg-color);
}

.chapter-nav p {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    flex-wrap: wrap;
    margin: 1.5rem 0 2rem;
}

/* never split code blocks */
pre,
code,
.highlight,
.codehilite {
    break-inside: avoid;
    page-break-inside: avoid;
}

pre {
    white-space: pre-wrap;
}

/* Specific instructions for printing in the browser */
@media print {

    .page-break {
        break-before: page;
    }

    .no-break {
        break-inside: avoid;
    }

    h1, h2, h3 {
        break-after: avoid;
    }
    
    /* hide nav + sidebar */
    .md-sidebar,
    .md-header,
    .md-footer,
    .md-nav,
    .md-code__nav,
    .chapter-nav {
        display: none;
    }

    /* let content use full width */
    .md-content {
        margin: 0;
    }

    /* Hide scrollbar for Chrome, Safari, and Opera */
        .example::-webkit-scrollbar {
        display: none;
    }

    /* Hide scrollbar for IE, Edge, and Firefox */
    * {
        -ms-overflow-style: none;  /* IE and Edge */
        scrollbar-width: none;  /* Firefox */
    }

}
