/* Переопределения для светлой и тёмной темы */
* {
    transition: all 0.125s;
}

:root {
    /* Основной цвет */
    --color-primary: #6674c4;
    --color-primary-contrast: #ffffff;

    /* https://maketintsandshades.com/#4051B5 */
    --color-primary-dark-1: #7985cb;
    --color-primary-dark-2: #8c97d3;
    --color-primary-dark-3: #a0a8da;
    --color-primary-dark-4: #b3b9e1;
    --color-primary-dark-5: #c6cbe9;
    --color-primary-dark-6: #d9dcf0;
    --color-primary-dark-7: #eceef8;

    --color-primary-light-1: #5362bc;
    --color-primary-light-2: #4051b5;
    --color-primary-light-3: #3a49a3;
    --color-primary-light-4: #334191;
    --color-primary-light-5: #2d397f;
    --color-primary-light-6: #26316d;
    --color-primary-light-7: #20295b;

    --color-primary-alpha-10: #6674c419;
    --color-primary-alpha-20: #6674c433;
    --color-primary-alpha-30: #6674c44b;
    --color-primary-alpha-40: #6674c466;
    --color-primary-alpha-50: #6674c480;
    --color-primary-alpha-60: #6674c499;
    --color-primary-alpha-70: #6674c4b3;
    --color-primary-alpha-80: #6674c4cc;
    --color-primary-alpha-90: #6674c4e1;
}

/* Переопределения для светлой темы */
@media (prefers-color-scheme: light) {
    :root {}

    #navbar-logo {
        padding: 5px !important;
        background: #14151A;
    }
    
    #navbar-logo img {
        width: 27px !important;
        height: 27px !important;
    }
    
    #navbar-logo:hover {
        background: #14151A !important;   
    }
    
}

/* Переопределения для тёмной темы */
@media (prefers-color-scheme: dark) {
    :root {
        /* Шапка */
        --color-nav-bg: #14151A;
        --color-secondary-nav-bg: #14151A;
        --color-nav-text: #BEC1C6;
        --color-nav-hover-bg: #272A35;

        /* Тёмно-серый фон основной */
        --color-body: #1E2129;
        
        --color-input-background: #14151A;
        --color-menu: #14151A;
        --color-card: #14151A;
        --color-button: #14151A;
    }
}