:root {
    
    /* Основные цвета */
    --color-background_body:#FFFFFF; /* белый */
    --color-background-basic:#2A2A2A; /* черный */
    --color-second:#F2F2F2;/* серый */
    --color-accent:#fcac00;/* оранж */
    --color-white:#FFFFFF;/* белый*/
    --color-red:#990002;/* красный*/
    --filter1:invert(67%) sepia(87%) saturate(1812%) hue-rotate(2deg) brightness(101%) contrast(101%);/* оранж */
     --filter2:invert(100%) sepia(8%) saturate(3191%) hue-rotate(305deg) brightness(125%) contrast(114%);/* белый */
    /* Основные шрифт */
    --font-main: 'Montserrat', 'Roboto', 'sans-serif';
    
     
    /* Иконки меню в спокойном состоянии */
    
    /* рупор-уведомления */
    --button-small: url('/fileservice/file/download/a/837503/sc/220/h/60063c49d2cbc2f0407cffb1166c6c0a.png');
    /* сайт */
    --item-cms: url('/fileservice/file/download/a/837503/sc/43/h/10d737e82f12648a65e41103ca9b672c.png');
    /* обучение */
    --item-teach: url('/fileservice/file/download/a/837503/sc/36/h/0164aadd8df183708f519504a0e61133.png');
    /* пользователи */
    --item-user: url('/fileservice/file/download/a/837503/sc/130/h/765df59842c7df856417f85c1d81ff16.png');
    /* задачи */
    --item-tasks: url('/fileservice/file/download/a/837503/sc/121/h/09f32758c85ca3aa9d7b837f47524f86.png');
    /* сообщения */
    --item-notif: url('/fileservice/file/download/a/837503/sc/392/h/7f8374441e0ff28c4efb60fceeb7da5a.png');
    /* продажи */
    --item-sales: url('/fileservice/file/download/a/837503/sc/350/h/1d4165cff88cef2532d5b527de8dc7ec.png');
    /* приложение */
    --item-chatium: url('/fileservice/file/download/a/837503/sc/104/h/0ef97b49281581da160a690c69533fcc.png');
}

/* Боковая панель  */
.gc-account-leftbar {
       background:var(--color-background-basic);
}

/* Левая панель - контейнер с  разделами меню */
.gc-account-leftbar .gc-account-user-menu {
     background:var(--color-background-basic);
}

/* Разделы с иконками */
.gc-account-leftbar .gc-account-user-menu li a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 52px;
    height: 52px;
    background: var(--filter1);
    border-radius: 0px;
    margin: 4px auto;
 
}

/* Разделы с иконками - наведение на раздел */
.gc-account-leftbar .gc-account-user-menu li:hover a {
    background: var(--color-background-basic);
}

/* Разделы с иконками - выбор разделов */
.gc-account-leftbar .gc-account-user-menu li.selected a,
.gc-account-leftbar .gc-account-user-menu li.active a {
    /* фон под иконками */
    background:var(--color-background-basic);
}

/* Разделы с иконками - раздел Уведомления - рупор */
.gc-account-leftbar .gc-account-user-menu li.menu-item-notifications_button_small a {
     height: 52px!important;
}

/* Разделы с иконками - скрываем системные иконки Меню */
li.menu-item-notifications_button_small a img,
li.menu-item-cms a img,
li.menu-item-teach a img,
li.menu-item-user a img,
li.menu-item-tasks a img,
li.menu-item-notifications a img,
li.menu-item-sales a img,
li.menu-item-chatium a img {
    display: none;
}

/* Разделы с иконками - новые иконки через псевдоэлемент */
li.menu-item-notifications_button_small a::before,
li.menu-item.menu-item-cms a::before,
li.menu-item.menu-item-teach a::before,
li.menu-item.menu-item-user a::before,
li.menu-item.menu-item-tasks a::before,
li.menu-item.menu-item-notifications a::before,
li.menu-item.menu-item-sales a::before,
li.menu-item.menu-item-chatium a::before {  
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: block;
    width: 24px;
    height: 24px;
    -webkit-filter: var( --filter2);
            filter: var( --filter2);
}


/* Разделы с иконками - задаем ссылки на новые иконки через псевдоэлемент */
li.menu-item-notifications_button_small a::before {background-image: var(--button-small);}
li.menu-item.menu-item-cms a::before {background-image: var(--item-cms);}
li.menu-item.menu-item-teach a::before {background-image: var(--item-teach);}
li.menu-item.menu-item-user a::before {background-image: var(--item-user);}
li.menu-item.menu-item-tasks a::before {background-image: var(--item-tasks);}
li.menu-item.menu-item-notifications a::before {background-image: var(--item-notif);}
li.menu-item.menu-item-sales a::before {background-image: var(--item-sales);}
li.menu-item.menu-item-chatium a::before {background-image: var(--item-chatium);}


/* Разделы с иконками - перекрашиваем иконки в зависимости от состояний */
.gc-account-user-menu li a:hover::before,
.gc-account-user-menu li.active a::before,
.gc-account-user-menu li.selected a::before {
    -webkit-filter: var(--filter1);
            filter: var(--filter1);
}



/* Раздел с иконкой профиля - аватар */
li.menu-item-profile .menu-item-icon {
    border-radius: 100px;
    width: 52px;
    height: 52px;
    border: 2px solid var(--color-white);
}

/* Левая панель - раздел с иконкой профиля (ссылка) */
li.menu-item.menu-item-profile a {
    /* прозрачный фон */
    background: transparent!important;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

/* Раздел с аватаркой профиля при наведении/выборе */
li.menu-item.menu-item-profile a:hover,
li.menu-item.menu-item-profile.active a,
li.menu-item.menu-item-profile.selected a {
    background: none!important;
}


/* Раскрывающееся меню - подменю */
.gc-account-leftbar .gc-account-user-submenu-bar {
      background: var(--color-background-basic);
}

/* Раскрывающееся меню - Заголовок подменю */
.gc-account-user-submenu-bar h3 {
    font-size: 26px;
    font-weight: 500;
    color: var(--color-white);
    border-bottom: 1px solid var(--color-white);
    padding-bottom: 20px;
    padding-left: 20px;
    margin-top: 30px;
    margin-bottom: 10px;
}

/* Раскрывающееся меню - разделы */
.gc-account-user-submenu-bar .gc-account-user-submenu li a {
    font-size: 16px;
    font-weight: 400;
    text-transform: capitalize;
    color: var(--color-white);
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

/* Раскрывающееся меню - наведение на разделы */
.gc-account-user-submenu-bar .gc-account-user-submenu li a:hover {
    background: var(--color-blue-second);
    /* цвет текста */
    color: var(--color-white);
}

/* Cчетчик уведомлений - раздел Уведомления - рупор */
.gc-account-leftbar .gc-account-user-menu li.menu-item-notifications_button_small .notify-count {
    z-index: 2;
    font-size: 0.8em!important;
    font-weight: 700;
    text-align: center;
    color: var(--color-white);
    background: var(--color-red);
    border-radius: 30px;
    position: absolute;
    bottom: 25px;
    right: 10px;
    padding: 5px;
}

/* Счетчик уведомлений - разделы левой панели */
/* сообщения */
.gc-account-leftbar .gc-account-user-menu li.menu-item-notifications .notify-count,
/* обучение */
.gc-account-leftbar li.menu-item-teach .notify-count,
/* покупки */
.gc-account-leftbar li.menu-item.menu-item-sales .notify-count {
    z-index: 2;
    font-size: 0.8em!important;
    font-weight: 700;
    text-align: center;
    color: var(--color-white);
    background: var(--color-red);
    border-radius: 30px;
    position: absolute;
    bottom: 28px;
    right: 10px;
    padding: 5px;
}

/* Счетчик уведомлений - раскрывающееся меню */
.gc-account-leftbar .gc-account-user-submenu li .notify-count {
    z-index: 2;
    font-weight: 700;
    text-align: center;
    color: var(--color-white);
    background: var(--color-red); 
    border-radius: 30px;
}

/* Раскрывающееся меню - Бонусные рубли, депозит и монеты */
.user-balance {
    color: var(--color-white);
    margin-top: 20px!important;
    margin-bottom: 10px;
}

/* Раскрывающееся меню - Раздел Уведомления */
.gc-account-leftbar .gc-account-user-submenu-bar-notifications_button_small {
    background: var(--color-background-basic);
    color: var(--color-white);
}
.gc-account-leftbar .gc-account-user-submenu-bar-notifications_button_small .all-notifications-header-link{
    color: var(--color-white);
}

/* Мобильная адаптация */ 
@media (max-width: 768px) {
    .gc-account-leftbar.expanded {
        background: var(--color-background-basic);
    }
    /* Нижняя плашка меню */ 
    .gc-account-leftbar .toggle-link {
        background: var(--color-background-basic);
    }
    /* Надпись Действие */     
    .gc-page-nav-items-menu a {
         color: var(--color-white);
         background: var(--color-background-basic);
    }
}

@media (max-width: 460px) {
      .gc-account-user-submenu-bar h3 {
              font-size: 20px!important;
    }
    /* Разделы в раскрывающемся меню */
    .gc-account-user-submenu-bar .gc-account-user-submenu li a {
          font-size: 14px!important;
    }
}

@media (max-width: 380px) {
     .gc-account-leftbar .gc-account-user-submenu-bar-notifications_button_small {
        width: 240px;
    }
}

li.menu-item.menu-item-search {
    display: none;
}