/* Custom, global CSS properties. */


:root {
    color-scheme: light dark;
    /* Colors (taken from visual identity) */
    --dim-color: #ADB5BD;
    --dark-color: black;
    --light-color: white;
    --background-color: var(--dark-color);
    --border-color: var(--light-color);
    --text-color: var(--light-color);
    --todo-background-color: #FCC419;
    --done-background-color: #63DD0E;
    --todo-text-color: var(--dark-color);
    --meup-accent-color: #E67700;
    /* Icons and images */
    --horizontal-line: url("../img/horizontal-line-light.svg");
    --logo: url("../img/swws-logo-light.svg");
    --primary-menu-icon: url("../img/primary-menu-light.svg");
    --toc-icon: url("../img/toc-light.svg");
    --close-icon: url("../img/close-light.svg");
    --mailto-icon: url("../img/mailto-light.svg");
    --main-cover: url("../img/main-cover.svg");
    --product-cover: url("../img/product-cover.svg");
    /* Fonts */
    --base-font-size: 18px;
    --text-font: "Work Sans", sans-serif;
    --title-font: "JuliaMono", monospace;
    /* Size */
    --main-content-max-width: 960px;
    --main-content-padding: 2em;
    --navbar-height: 50px;
    --toc-width: 350px;
    /* Layering */
    --modal-z-index: 10000;
}


/* TODO: Uncomment when a JavaScript theme switch is available

The following style activates the light color scheme of this CSS theme
based on system or browser's visual theme preferences. However, it is
disabled for now until there is also an explicit option in SWWS
websites that allows users to select a preferred color scheme
manually. */

/* @media (prefers-color-scheme: light) { */
/*     :root { */
/*         /\* Colors *\/ */
/*         --dim-color: #495057; */
/*         --background-color: var(--light-color); */
/*         --border-color: var(--dark-color); */
/*         --text-color: var(--dark-color); */
/*         /\* Icons and images *\/ */
/*         --horizontal-line: url("../img/horizontal-line-dark.svg"); */
/*         --logo: url("../img/swws-logo-dark.svg"); */
/*         --primary-menu-icon: url("../img/primary-menu-dark.svg"); */
/*         --toc-icon: url("../img/toc-dark.svg"); */
/*         --close-icon: url("../img/close-dark.svg"); */
/* 	--mailto-icon: url("../img/mailto-dark.svg"); */
/*     } */
/* } */