/* ---------------- Colors ---------------- */


:root {
    /* root default is dark */
    color-scheme: dark;

    --bg-color: #09001E;
    --bg-color-rgb: 9, 0, 30;

    --bg-color-2: #0B0026;
    --bg-color-2-rgb: 11, 0, 38;

    --text-color: #f1f1f1;
    --text-color-rgb: 241, 241, 241;

    --highlight-color: #621FE2;
    --highlight-color-rgb: 98, 31, 226;
}

/* Detect which mode the user prefers */
@media (prefers-color-scheme: dark) {

    /* root values for darkmode (best) users :3 */
    :root {
        color-scheme: dark;

        --bg-color: #09001E;
        --bg-color-rgb: 9, 0, 30;

        --bg-color-2: #0B0026;
        --bg-color-2-rgb: 11, 0, 38;

        --text-color: #f1f1f1;
        --text-color-rgb: 241, 241, 241;

        --highlight-color: #621FE2;
        --highlight-color-rgb: 98, 31, 226;
    }
}

@media (prefers-color-scheme: light) {

    /* root values for lightmode (eww) users... */
    :root {
        color-scheme: light;

        --bg-color: #f1f1f1;
        --bg-color-rgb: 241, 241, 241;

        --bg-color-2: #f1f1f1;
        --bg-color-2-rgb: 241, 241, 241;

        --text-color: #09001E;
        --text-color-rgb: 9, 0, 30;

        --highlight-color: #621FE2;
        --highlight-color-rgb: 98, 31, 226;
    }
}