:root {
    /*For scrollbar*/
    color-scheme: light;
    /*--background-color: #f4dfb6;*/
    /*--background-color: whitesmoke;*/
    --background-color: white;
    /*--background-color: white;*/
    /*--background-color: #d8f2fb;*/
    --background-accent-1-color: #f4f4f4;
    --background-accent-2-color: #efefef;
    --background-accent-3-color: #eaeaea;

    --lighter-accent-color: rgba(0, 0, 0, 0.1);
    --light-accent-color: #e4e4e4;
    --accent-color: #2e3e50;
    --border-accent-color: #b3bdcc;
    --border-accent-2-color: #d5d5d5;

    --section-background-color: #f4f4f4;
    --background-accent-5-color: #dcdcdc;

    /*Fonts*/
    --title-color: black;
    /*--soft-title-color: black;*/
    --font-color: rgba(0, 0, 0, 0.8);
    --secondary-font-color: rgba(0, 0, 0, 0.65);
    --secondary-font-color-2: rgba(0, 0, 0, 0.5);
    --secondary-font-color-3: rgba(0, 0, 0, 0.3);
    --font-color-inverted: whitesmoke;
    /*When element should be black in light mode or white in dark mode*/
    --black-or-white-color: black;
    --black-or-white-color-inverted: white;

    /*Filters*/
    /*Finding filters for given color https://angel-rs.github.io/css-color-filter-generator/ */
    --black-or-white-icon-filter: none;
    --black-or-white-icon-filter-inverted: invert(80%); /*a little dimmed white*/;
    --black-or-white-icon-filter-inactive: invert(40%); /*dimmed*/;

    /*Black or white rgba*/
    --bw-r: 0;
    --bw-g: 0;
    --bw-b: 0;

    /*Background color as rgb*/
    --bg-r: 255;
    --bg-g: 255;
    --bg-b: 255;

    /*Others*/
    /*--mark-color: #91b0d3;*/
    --default-box-shadow: 0 3px 25px rgba(46, 62, 80, 0.15);
    --light-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);


}

[data-theme="dark"] {
    color-scheme: dark;

    /*--background-color: #0D1117;*/
    /*--background-color: #131921;*/
    /*--background-color: #0e1217;*/
    --background-color: #0D1117;
    --background-accent-1-color: #131922;
    --section-background-color: #262b35;
    --background-accent-2-color: #1f2425;
    --background-accent-3-color: #262b31;

    --lighter-accent-color: rgba(255, 255, 255, 0.1);
    --light-accent-color: #303943;
    --accent-color: #adcdf3;
    --border-accent-color: #2e445e;
    --border-accent-2-color: #3c4143;
    --background-accent-5-color: #016cea;

    /*Fonts*/
    --title-color: whitesmoke;
    --font-color: #e6edf3;
    /*--soft-title-color: #f1f6fa;*/
    --secondary-font-color: #b1b7bc;
    --secondary-font-color-2: rgba(255, 255, 255, 0.6);
    --secondary-font-color-3: rgba(255, 255, 255, 0.4);
    --font-color-inverted: black;
    --black-or-white-color: whitesmoke;
    --black-or-white-color-inverted: black;

    /*Filters*/
    /*Finding filters for given color https://angel-rs.github.io/css-color-filter-generator/ */
    --black-or-white-icon-filter: invert(80%); /*a little dimmed white*/
    --black-or-white-icon-filter-bright: invert(100%);
    --black-or-white-icon-filter-inverted: none;
    --black-or-white-icon-filter-inactive: invert(40%);

    /*Black or white rgba*/
    --bw-r: 255;
    --bw-g: 255;
    --bw-b: 255;
    /*Background color as rgb*/
    --bg-r: 13;
    --bg-g: 17;
    --bg-b: 23;

    /*Others*/
    /*--mark-color: #7A86B8;*/
}