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


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

    --bg-color: #140402;
    --bg-color-rgb: 20, 4, 2;

    --bg-color-2: #080402;
    --bg-color-2-rgb: 8, 4, 2;

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

    --highlight-color: #DD2C30;
    --highlight-color-rgb: 221, 44, 48;
}

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

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

        --bg-color: #140402;
        --bg-color-rgb: 20, 4, 2;

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

        --highlight-color: #DD2C30;
        --highlight-color-rgb: 221, 44, 48;
    }
}

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

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

        --bg-color: #f1f1f1;
        --bg-color-rgb: 241, 241, 241;
        
        --text-color: #140402;
        --text-color-rgb: 20, 4, 2;

        --highlight-color: #DD2C30;
        --highlight-color-rgb: 221, 44, 48;
    }
}