



/* ------------- 
content start - root
------------- */

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root {
    --white-color: #fff;
    --dark-color: #0F0F0F;
    --dark-bg: #021417;
    --accent-color: #00F1FE;
    --light-border-color: #00F1FE33;
	--main-gradient: linear-gradient(90deg, #00676E 0%, #02F0FD 50.5%, #00676E 100%);
	--main-font: "Inter", serif;
    --clip-path-module: polygon( 10.00% 0.00%, 60.40% 0.00%, 70.00% 15.00%, 90.00% 15.00%, 100% 25.00%, 100% 85.00%, 90.00% 100%, 10.00% 100%, 0.00% 85.00%, 0.00% 15.00% );
    --clip-path-main: polygon( 0.00% 0.00%, 90.00% 0.00%, 100% 40.00%, 100% 90.00%, 100% 100%, 10.00% 100%, 0.00% 60.00%, 0.00% 10.00% );
}
/* ------------- 
content finish - root
------------- */

/* ------------- 
content start - left-panel-css
------------- */

.gc-account-leftbar {
    background: #212121;
}
.gc-account-leftbar .menu-item-label {
    display: none;
}
.gc-account-leftbar .gc-account-user-menu li:first-child {
    margin-top: 20px;
}
.gc-account-leftbar .gc-account-user-menu li a {
    width: 50px;
    height: 50px !important;
    background: #021417;
    border: 1px solid #FFFFFF33;
    transition: all .5s;
}
.gc-account-leftbar .gc-account-user-menu li a:hover,
.gc-account-leftbar .gc-account-user-menu li a:focus,
.gc-account-leftbar .gc-account-user-menu li.active a, 
.gc-account-leftbar .gc-account-user-menu li.selected a {
    background: #212121;
    border: 1px solid var(--accent-color);
}
.gc-account-leftbar .gc-account-user-menu li:not(.menu-item-profile) a img {
    width: 28px;
    height: 28px;
}
.gc-account-leftbar .gc-account-user-menu li a svg {
    transition: all .5s;
}
.gc-account-leftbar .gc-account-user-menu li a:hover svg *,
.gc-account-leftbar .gc-account-user-menu li a:focus svg *,
.gc-account-leftbar .gc-account-user-menu li.active a svg *, 
.gc-account-leftbar .gc-account-user-menu li.selected a svg * {
    fill: var(--accent-color);
}
.gc-account-leftbar .gc-account-user-menu {
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: center;
}
.gc-account-leftbar .gc-account-user-submenu-bar {
    background: var(--dark-bg);
}
.gc-account-user-submenu-bar h3 {
    font-family: var(--main-font);
    color: var(--accent-color);
    font-weight: 700;
    text-transform: uppercase;
}
.gc-account-user-submenu-bar .gc-account-user-submenu li a {
    font-family: var(--main-font);
    font-weight: 500;
    color: var(--white-color);
    margin-bottom: 8px;
    transition: all .5s;
    position: relative;
    z-index: 5;
    text-decoration: none;
}
.gc-account-user-submenu-bar .gc-account-user-submenu li a:hover {
    background: transparent;
    color: var(--dark-color);
}
.gc-account-user-submenu-bar .gc-account-user-submenu li a:before {
    content: '';
    width: 0;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--main-gradient);
    transition: all .5s;
    z-index: -5;
}
.gc-account-user-submenu-bar .gc-account-user-submenu li a:hover:before {
    width: calc(100% - 10px);
    border: 1px solid var(--white-color);
}
.gc-account-leftbar .gc-account-user-menu li.menu-item-teach a img,
.gc-account-leftbar .gc-account-user-menu li.menu-item-notifications a img,
.gc-account-leftbar .gc-account-user-menu li.menu-item-notifications_button_small a img, 
.gc-account-leftbar .gc-account-user-menu li.menu-item-chatium a img {
    display: none;
}
.gc-account-leftbar .gc-account-user-submenu-bar li.menu-item-delimiter a,
.gc-account-leftbar .gc-account-user-submenu-bar li.menu-item-help a {
    border-top: 1px solid var(--light-border-color);
}
.gc-account-leftbar .gc-account-user-submenu-bar div.user-balance {
    font-family: var(--main-font);
    color: var(--white-color);
    font-weight: 300;
}
.gc-account-leftbar .gc-account-user-menu li .notify-count {
    background: var(--main-gradient) !important;
    font-family: var(--main-font);
    font-weight: 500;
    color: var(--dark-color);
    bottom: -5px !important;
    right: -5px !important;
    top: auto !important;
    left: auto !important;
}
.gc-account-user-submenu-bar .gc-account-user-submenu li .notify-count {
    background: var(--white-color);
    color: var(--dark-color);
    font-family: var(--main-font);
    bottom: auto;
    top: 50%;
    transform: translateY(-50%);
}
.gc-account-leftbar .gc-account-user-submenu-bar-notifications_button_small .header,
.gc-account-leftbar .gc-account-user-submenu-bar-notifications_button_small .header a {
    font-family: var(--main-font);
    color: var(--white-color);
    text-decoration: none;
}
.gc-account-leftbar .gc-account-user-submenu-bar-notifications_button_small .notification-group {
    font-family: var(--main-font);
    color: var(--white-color);
    background: transparent;
    border-top: 1px solid var(--light-border-color);
}
.gc-account-leftbar .gc-account-user-submenu-bar-notifications_button_small .notification-group:hover {
	background: transparent;
}
.gc-account-leftbar .gc-account-user-submenu-bar-notifications_button_small .all-notifications-footer-link {
    font-family: var(--main-font);
    color: var(--dark-color);
    background: var(--main-gradient);
    border: 0;
}
.talks-widget-button {
    background: var(--main-gradient);
    color: var(--dark-color);
}
@media (max-width: 768px) {
    .gc-account-leftbar .gc-account-user-menu {
        background: #212121;
    }
    .gc-account-leftbar .toggle-link {
        background: #212121;
    }
    .gc-page-nav-items-menu a {
        background: #212121;
    }
    .gc-account-leftbar .toggle-link img {
        display: none;
    }
    .gc-account-leftbar .gc-account-leftbar-toggler {
        position: absolute;
        top: 50%;
        left: 10px;
        transform: translateY(-50%);
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        width: 30px;
        height: 30px;
        gap: 3px;
    }
    .gc-account-leftbar .gc-account-leftbar-toggler span {
        flex: 0 0 calc(33% - 2px);
        background: var(--main-gradient);
        width: 7px;
        height: 7px;
        position: static !important;
        transition: all .5s;
    }
    .gc-account-leftbar.expanded .gc-account-leftbar-toggler span:nth-child(2n) {
        opacity: 0;
    }
    .talks-widget-button {
        right: 0;
        bottom: 0;
        height: 45px;
        border-radius: 0;
    }
}
/* ------------- 
content finish - left-panel-css
------------- */
