:root {
    --font-color-rgb-values: 49, 51, 48;
    --font-color: rgb(var(--font-color-rgb-values));
    --color-teal-light: var(--font-color-rgb-values);
    --kompendium-contrast-1100: 94, 94, 108;
    --lime--gradient--1: linear-gradient(90deg, #BEE034 10.62%, #72DEF6 61.2%);
    --lime--gradient--2: linear-gradient(318deg, #BEE034 10%, transparent 70%), linear-gradient(190deg, #BEE034, transparent 40%), linear-gradient(105deg, #FEB000 40%, transparent);
}
body {
    --md-text-font-family: "Lato", sans-serif;
}

[data-md-color-scheme="teal"] {
    --md-hue: 174;
    --md-default-fg-color--light: var(--font-color);
    --md-default-bg-color: rgb(250, 250, 251);
    --md-code-bg-color: rgb(var(--kompendium-contrast-1100), 0.05);
}
[data-md-color-scheme="teal"] .md-typeset code {
    border: 1px solid rgb(var(--kompendium-contrast-1100), 0.1);
}

[data-md-color-scheme="slate"] {
    --md-primary-fg-color: rgb(25, 25, 44);
    --md-primary-fg-color--light: rgb(35, 35, 53);
    /* Slate theme uses HSL, so the hue of --md-primary-fg-color is used */
    --md-hue: 240;
    --md-default-bg-color: var(--md-primary-fg-color--light);
    --md-code-bg-color: var(--md-primary-fg-color);

    --md-accent-fg-color: rgb(30, 136, 229);
    --md-typeset-a-color: var(--md-accent-fg-color);
    --md-default-fg-color--light: hsla(var(--md-hue), 15%, 90%, 0.90);
}

[data-md-color-scheme="slate"] .md-logo {
    color: rgb(var(--color-teal-light));
}

[data-md-color-scheme="slate"] .md-nav {
    color: rgb(140, 140, 150);
    font-size: 16px;
}

[data-md-color-scheme="slate"] .md-button:not(.md-button--primary) {
    color: var(--md-primary-bg-color);
    border-color: var(--md-primary-fg-color);
}

[data-md-color-scheme="slate"] h1,
[data-md-color-scheme="slate"] h2,
[data-md-color-scheme="slate"] h3,
[data-md-color-scheme="slate"] h4,
[data-md-color-scheme="slate"] h5,
[data-md-color-scheme="slate"] h6 {
    color: rgb(232, 232, 234);
}

.md-typeset h1 {
    font-weight: 400;
}

.md-typeset h2, h3, h4, h5, h6 {
    font-weight: 500;
}

.md-header, section.tx-container {
    background: var(--lime--gradient--1);
}

[data-md-color-scheme="slate"] .md-header {
    background: var(--md-primary-fg-color);
}

.md-header svg {
    color: white;
}

.md-header nav {
    background-color: transparent;
}

[data-md-color-scheme="teal"] .md-header .md-tabs {
    color: var(--md-default-fg-color--light);
}

@media screen and (max-width: 76.2344em) {
    .md-nav--primary .md-nav__title {
        background: var(--lime--gradient--2);
        color: var(--md-default-fg-color--light);
    }

    [data-md-color-scheme="slate"] .md-nav--primary .md-nav__title {
        color: white;
    }

    .md-nav--primary .md-nav__title[for=__drawer] svg {
        color: white;
    }
}