@media (prefers-color-scheme: dark) {
    :root {
        --color-mode: dark;
    }

    :root:not([data-user-color-scheme]) {
        --h1-color: white;
        --font-color: #b3b9c5;
        --heading-color: #ffd479;
        --dark-font-color: #ced4da;
        --background: #1f2022;
        --medium-font-color: #dee2e6;
        --light-font-color: #868e96;
        --light-background: #2D2D31;
        --light-background-hover: #3b3b3e;
        --code-background-color: #2e2e30;
        --border: #404040;
        --link-color: #6ab0f3;
        --link-color-darker: #4a72a5;
        --link-hover-color: #e1a6f2;
        --navbar-color: #1d1d1d;
        --blockquote: #2b2b2b;
        --blockquote-left: #191919;
        --transparent-text: rgba(255, 255, 255, 0.7);
        --transparent-bg: rgba(0, 0, 0, 0.2);
        --light-transparent-bg: rgba(255, 255, 255, 0.05);
    }
}

[data-user-color-scheme='dark'] {
    --h1-color: white;
    --font-color: #b3b9c5;
    --heading-color: #ffd479;
    --dark-font-color: #ced4da;
    --background: #1f2022;
    --medium-font-color: #dee2e6;
    --light-font-color: #868e96;
    --light-background: #2D2D31;
    --light-background-hover: #3b3b3e;
    --code-background-color: #2e2e30;
    --border: #404040;
    --link-color: #6ab0f3;
    --link-color-darker: #4a72a5;
    --link-hover-color: #e1a6f2;
    --navbar-color: #1d1d1d;
    --blockquote: #2b2b2b;
    --blockquote-left: #191919;
    --transparent-text: rgba(255, 255, 255, 0.7);
    --transparent-bg: rgba(0, 0, 0, 0.2);
    --light-transparent-bg: rgba(255, 255, 255, 0.05);
}