/* https://mui.com/material-ui/customization/color/ */

/*
@media (prefers-color-scheme: dark) {
    :root {

    }
}
*/

/* var(--blue); */
:root {

    --font-size: 1rem;
    /* --line-height: 1.15rem; */
    --line-height: 1.5rem;


    --font-color: #222222;
        --dark_font-color: #dddddd;
    --background: #eeeeee;
        --dark_background: #141314;/* #141314 */
        --dark-background: #141314;/* #141314 */
    --background-block: #fefefe;
        --dark-background-block: #1e1e1e;
        --dark-background_block: #1e1e1e;


    --height-tiny: 28px;
    --height: 36px;
    --height-big: 44px;
    --height-huge: 52px;

    --rounded: 0.25rem;

    /* https://m2.material.io/design/color/the-color-system.html#tools-for-picking-colors */

    /* blue / submit */
    --blue-default: #2196F3;
    --blue-hover: #1a75d2;
    --blue-focus: #1a75d2;
    --blue-active: #1a75d2;
    --blue-300: #63b4f6;
    --blue-500: #2196F3;
    --blue-700: #1a75d2;

    /*  */
    --green-default: #4CAF50;
    --green-hover: #388e3b;
    --green-focus: #388e3b;
    --green-active: #388e3b;
    --green-300: #81c784;
    --green-500: #4CAF50;
    --green-700: #388e3b;
    /* --green-700: #E8F5E9; C8E6C9 */

    /*  */
    --orange-default: #FF9800;
    --orange-hover: #F57C00;
    --orange-focus: #F57C00;
    --orange-active: #F57C00;
    --orange-300: #FFB74D;
    --orange-500: #FF9800;
    --orange-700: #F57C00;

    /* red / delete / error */
    --red-default: #F44336;
    --red-hover: #D32F2F;
    --red-focus: #D32F2F;
    --red-active: #D32F2F;
    --red-300: #E57373;
    --red-500: #F44336;
    --red-700: #D32F2F;

    /* deepPurple / info */
    --deeppurple-default: #673AB7;
    --deeppurple-hover: #512DA8;
    --deeppurple-focus: #512DA8;
    --deeppurple-active: #512DA8;
    --deeppurple-300: #9575CD;
    --deeppurple-500: #673AB7;
    --deeppurple-700: #512DA8;
}
