@import url('https://fonts.googleapis.com/css2?family=Forum&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

:root {
    --main-font: 'Forum', sans-serif; /* Основной шрифт */
    --second-font: 'Montserrat', sans-serif; /* Доп. шрифт */
}



/* Лого */
.gc-main-content .logo-text {
    font-weight: 400;
    text-transform: uppercase;
    color:#140629;
    font-family: var(--main-font)!important;
    line-height: 110%;
}



/* Боковая панель */
.gc-account-leftbar, 
.gc-account-leftbar .gc-account-user-submenu-bar, 
.gc-account-leftbar .gc-account-user-submenu-bar-notifications_button_small .notification-group.notification-status-viewed {
    background: -o-linear-gradient(106deg, #22b2d3 0%, #b8ecf8 96.61%);
    background: linear-gradient(344deg, #22b2d3 0%, #b8ecf8 96.61%);
    -webkit-box-shadow: 0 23px 37px 0 rgba(255, 255, 255, 0.06);
    box-shadow: 0 23px 37px 0 rgba(255, 255, 255, 0.06);
    color:#fff;
}

.gc-account-user-menu, .gc-account-leftbar .gc-account-user-menu li a {
    background: transparent!important;
    transition: all .3s;
}


.gc-account-user-submenu-bar h3 {
    font-family: var(--main-font)!important;
    text-transform: uppercase;
    color: #181818!important;
}

.gc-account-user-submenu-bar .gc-account-user-submenu li a {
    color:#fff;
    font-family: var(--second-font)!important;
    position: relative !important;
    font-weight: 400;
    text-transform: capitalize;
    z-index: 9999;
    transition: all .3s;
}

.gc-account-leftbar .gc-account-user-menu .menu-item:not(.menu-item-profile) img {
    -webkit-filter: brightness(0) saturate(100%) invert(0%) sepia(5%) saturate(2454%) hue-rotate(349deg) brightness(90%) contrast(81%);
            filter: brightness(0) saturate(100%) invert(0%) sepia(5%) saturate(2454%) hue-rotate(349deg) brightness(90%) contrast(81%); 
}

.gc-account-user-submenu-bar.gc-account-user-submenu-bar-profile .user-balance,
.gc-account-user-submenu li:last-child a {
    color:#181818!important;
}

/* цвет текста разделов подменю при наведении */
.gc-account-user-submenu-bar .gc-account-user-submenu li a:hover {
    background: transparent!important;
    color: #24163A;
    z-index: 1;
}

/* псевдоэлемент (яркая заливка в движении слева направо) - опишем элемент */
.gc-account-user-submenu-bar .gc-account-user-submenu li::after {
    content: '';
    width: 0%;
    height: 100%;
    position: absolute;
    background: #fffffc;
    top:0;
    left:0;
    z-index: 0;
    transition: all .3s;
}

/* задаем фон псевдоэлементом (яркая заливка в движении слева направо) 
для разделов подменю при наведении */
html .gc-account-user-submenu-bar .gc-account-user-submenu li:hover::after {
    width: 100%;
}

.gc-account-user-submenu-bar .header a {
    color:#fff!important;
}


/* Иконки */
.menu-item-profile .menu-item-icon {
    border-radius:100px;
    width:50px;
    border:2px solid #181818;
    margin-top: 5px;
}


.gc-account-leftbar .menu-item-label  {
    font-size: 10px;
    font-family: var(--second-font)!important;
    margin-top:0;
}


.gc-account-leftbar .gc-account-user-menu li a:hover,
.gc-account-leftbar .gc-account-user-menu li.active a,
.gc-account-leftbar .gc-account-user-menu li.selected a
{
    background:#fff!important;
    transition: all .3s;
    border-radius:20px;
    padding-bottom:5px;
}

.gc-account-leftbar li:hover .menu-item-label, 
.gc-account-leftbar li.active .menu-item-label, 
.gc-account-leftbar li.selected .menu-item-label {
    color:#24163A!important;
    font-size:10px;
}

.gc-account-leftbar .gc-account-user-menu li:hover a img,
.gc-account-leftbar .gc-account-user-menu li.active a img,
.gc-account-leftbar .gc-account-user-menu li.selected a img {
    -webkit-filter: brightness(0) saturate(100%) invert(11%) sepia(24%) saturate(1567%) hue-rotate(222deg) brightness(93%) contrast(101%);
    filter: brightness(0) saturate(100%) invert(11%) sepia(24%) saturate(1567%) hue-rotate(222deg) brightness(93%) contrast(101%);
}

@media (max-width: 768px) {
    .gc-account-leftbar.expanded,
    .gc-page-nav-items-menu a,
    .gc-account-leftbar .toggle-link {
        background: -o-linear-gradient(106deg, #22b2d3 0%, #b8ecf8 96.61%);
        background: linear-gradient(344deg, #22b2d3 0%, #b8ecf8 96.61%);
        -webkit-box-shadow: 0 23px 37px 0 rgba(255, 255, 255, 0.06)!important;
        box-shadow: 0 23px 37px 0 rgba(255, 255, 255, 0.06)!important;
    }

}