@font-face {
  font-family: 'Shadower';
  src: url('/fileservice/file/download/h/7b08037e14cb8f17446cf6bab48a2ea4.woff/a/448026/sc/235') format('woff'),
    url('/fileservice/file/download/h/76fb08a43a847e9b7c48772bc85e4e02.ttf/a/448026/sc/161') format('truetype');
  font-style: normal;
  font-display: swap;
  text-rendering: optimizeLegibility;
  font-weight: 100 900;
}

@font-face {
  font-family: 'Tilda Sans';
  src: url('/fileservice/file/download/h/d78c5bcf3e8b1fdea6014cae49c636d4.woff/a/448026/sc/388') format('woff'),
    url('/fileservice/file/download/h/316915506a4e1e187b162b01fe3b08b0.ttf/a/448026/sc/28') format('truetype');
  font-style: normal;
  font-display: swap;
  text-rendering: optimizeLegibility;
  font-weight: 100 900;
}

:root {
  --menu-font-heading: "Shadower", sans-serif;
  --menu-font-body: "Tilda Sans", sans-serif;
  --menu-bg: #4a503f;

  --c-lime: #d4da94;
  --c-lime-10: rgba(212, 218, 148, 0.1);
  --c-lime-30: rgba(212, 218, 148, 0.3);

  --menu-icon: var(--c-lime);
  --menu-icon-active: #4a503f;

  --menu-item-bg: var(--c-lime-10);
  --menu-item-bg-hover: var(--c-lime-30);
  --menu-item-bg-active: #f9f7ef;

  --menu-profile-bg: #d6d995;
  --menu-badge-bg: #f9f7ef;

  --menu-item-size: 58px;
  --menu-item-radius: 12px;
  --menu-icon-size: 24px;
  --menu-gap: 8px;

  --icon-profile: url('https://fs.getcourse.ru/fileservice/file/download/a/448026/sc/80/h/e642e13f751b45608ae51a2a21f56b31.svg');
  --icon-search: url('https://fs.getcourse.ru/fileservice/file/download/a/448026/sc/237/h/b1168b0269eb5b1178f1f5dab1d8c84d.svg');
  --icon-bell: url('https://fs.getcourse.ru/fileservice/file/download/a/448026/sc/348/h/4ea88fc6c7753c3ddca492f3147fbbb8.svg');
  --icon-site: url('https://fs.getcourse.ru/fileservice/file/download/a/448026/sc/277/h/f57a013bb7223bd3e2eaf1f46258d7bc.svg');
  --icon-teach: url('https://fs.getcourse.ru/fileservice/file/download/a/448026/sc/169/h/9a50f83d988e292f0802d5eadd7938c5.svg');
  --icon-users: url('https://fs.getcourse.ru/fileservice/file/download/a/448026/sc/138/h/e0d513e080b75f9448ab528dcb1b2068.svg');
  --icon-tasks: url('https://fs.getcourse.ru/fileservice/file/download/a/448026/sc/136/h/9b05b4ec63880a0033f2af32762bfa77.svg');
  --icon-messages: url('https://fs.getcourse.ru/fileservice/file/download/a/448026/sc/145/h/73b339ec152423e516c5a99ca92ee0d4.svg');
  --icon-sales: url('https://fs.getcourse.ru/fileservice/file/download/a/448026/sc/21/h/8d47036e68c51d31086736cf6ef46456.svg');
  --icon-chatium: url('https://fs.getcourse.ru/fileservice/file/download/a/448026/sc/149/h/be5c5535273734fe2c4a125df8337cb9.svg');
}

html .gc-account-leftbar {
  background: var(--menu-bg);
}

.gc-account-user-submenu-bar h3 {
  font-family: var(--menu-font-heading);
  color: var(--menu-icon);
}

html .gc-account-leftbar .gc-account-user-menu li {
  padding: calc(var(--menu-gap) / 2) 0;
  border-bottom: none;
}

html .gc-account-leftbar .gc-account-user-menu li a,
html .gc-account-leftbar .gc-account-user-menu li.menu-item-notifications_button_small a {
  position: relative;
  display: block;
  width: var(--menu-item-size);
  height: var(--menu-item-size);
  margin: 0 auto;
  border: none;
  border-radius: var(--menu-item-radius);
  background-color: var(--menu-item-bg);

  transition: background-color .3s ease;
}

html .menu-item a img,
html .sub-icon .fa,
html .sub-icon img {
  display: none;
}

html .menu-item a::before,
html .sub-icon::before {
  content: '';
  position: absolute;
  inset: 0;
  margin: auto;
  width: var(--icon-size, var(--menu-icon-size));
  height: var(--icon-size, var(--menu-icon-size));

  background-color: var(--menu-icon);
  -webkit-mask-image: var(--icon);
  mask-image: var(--icon);
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;

  transition: background-color .3s ease;
}

.menu-item-profile {
  --icon: var(--icon-profile);
}

.menu-item-search {
  --icon: var(--icon-search);
}

.menu-item-notifications_button_small {
  --icon: var(--icon-bell);
}

.menu-item-cms {
  --icon: var(--icon-site);
}

.menu-item-teach {
  --icon: var(--icon-teach);
}

.menu-item-user {
  --icon: var(--icon-users);
}

.menu-item-tasks {
  --icon: var(--icon-tasks);
}

.menu-item-notifications {
  --icon: var(--icon-messages);
}

.menu-item-sales {
  --icon: var(--icon-sales);
}

.menu-item-chatium {
  --icon: var(--icon-chatium);
}

.menu-item-chatium .sub-icon {
  --icon: var(--icon-users);
  --icon-size: 16px;
}

html .gc-account-leftbar .gc-account-user-menu li.active a,
html .gc-account-leftbar .gc-account-user-menu li.selected a {
  background-color: var(--menu-item-bg-active);
}

html .menu-item.active a::before,
html .menu-item.selected a::before {
  background-color: var(--menu-icon-active);
}

html .menu-item.selected:not(.active) a::before {
  background-color: var(--menu-icon-active);
}

html .gc-account-leftbar .gc-account-user-menu li.menu-item-profile a {
  border-radius: 50%;
  background-color: var(--menu-profile-bg);
}

html .menu-item-profile a::before {
  background-color: var(--menu-icon-active);
}

html .menu-item-profile a img:not([src="/public/img/default_profile_50.png"]) {
  display: block;
  position: relative;
  z-index: 1;
  width: var(--menu-item-size);
  height: var(--menu-item-size);
  border-radius: 50%;
  object-fit: cover;
}

html .gc-account-leftbar .notify-count,
html .gc-account-leftbar .gc-account-user-menu li.menu-item-notifications_button_small .notify-count,
html .gc-account-leftbar .gc-account-user-menu li.menu-item-notifications .notify-count,
html .gc-account-leftbar .gc-account-user-menu li.menu-item-chatium .notify-count {
  bottom: 0;
  right: 0;
  background-color: var(--menu-badge-bg);
  color: var(--menu-bg);
}

html .gc-account-leftbar .gc-account-user-menu li.active .notify-count {
  background-color: var(--menu-icon);
  color: var(--menu-badge-bg);
}

html .gc-account-user-submenu-bar .gc-account-user-submenu li .notify-count {
  bottom: 10px;
  right: 10px;
}

html .gc-account-leftbar .gc-account-user-submenu-bar {
  background-color: var(--menu-bg);
}

html .gc-account-user-submenu-bar .gc-account-user-submenu li a {
  font-family: var(--menu-font-body);
  color: var(--menu-icon);
  text-transform: none;

  transition: color .3s ease, background-color .3s ease;
}

html .gc-account-user-submenu-bar .gc-account-user-submenu li a:hover {
  color: var(--menu-icon-hover);
}

html .gc-account-leftbar .gc-account-user-submenu-bar div.user-balance {
  display: none;
}

html .gc-account-leftbar .gc-account-user-submenu-bar-notifications_button_small .all-notifications-header-link,
html .gc-account-leftbar .gc-account-user-submenu-bar-notifications_button_small .mark-viewed-all,
html .gc-account-leftbar .gc-account-user-submenu-bar-notifications_button_small .all-notifications-footer-link {
  color: var(--menu-icon);
}

@media (max-width: 768px) {
  html .gc-account-leftbar .gc-account-user-menu {
    background: var(--menu-bg);
  }

  html .gc-account-leftbar .toggle-link,
  html .gc-account-leftbar.expanded .toggle-link {
    background: var(--menu-bg);
  }
}

@media (hover: hover) {
  html .gc-account-leftbar .gc-account-user-menu li:not(.active):not(.selected):not(.menu-item-profile) a:hover {
    background-color: var(--menu-item-bg-hover);
  }
}