:root {
    /*
    --accent: #ed333b;
    --accent-bg: #bab3ab;
    --bg: #f6f5f4;
    --enabled:#ffffff;
    --disabled:#ffffff;
    --toggle-enable: #ffffff;
    --toggle-disable: #ffffff;
    */
    /*--accent: #118B50;
    --accent-bg: #5DB996;
    --bg: #FBF6E9;
    --enabled: #5DB996;
    --disabled: #E3F0AF;
    --toggle-enable: #5DB996;
    --toggle-disable: #E3F0AF;
    */
    --accent: #0D2832;
    --accent-bg: #9CCBDD;
    --bg: #F3F8E1;
    --enabled: #B4D831;
    --disabled: #E04638;
    --toggle-enable: #E04638;
    --toggle-disable: #B4D831;
}

@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: light;
        --text: #212121;
        --text-light: #585858;
        --accent: #0d47a1;
        --accent-hover: #1266e2;
        --accent-text: var(--bg);
        --code: #d81b60;
        --preformatted: #444;
        --marked: #ffdd33;
        --disabled: #efefef;
        --accent: #0D2832;
        --accent-bg: #9CCBDD;
        --bg: #F3F8E1;
        --enabled: #B4D831;
        --disabled: #E04638;
        --toggle-enable: #E04638;
        --toggle-disable: #B4D831;
    }
}

/* this is because two_factor prints forms as_tables -_- */
table:not(.table) tr,
table:not(.table) th,
table:not(.table) td {
    background-color: var(--bg);
    border: 0;
}


/* hide "hidden" things in flexbox */
[hidden] {
    display: none;
}