/* compiled by scssphp 1.12.1 on Tue, 14 Oct 2025 19:03:12 +0000 (0.0968s) */

:root {
  --menu-icon-background-color: #fff;
  --menu-icon-color: #898989;
  --menu-top-icon-border-color: #f5f5f5;
  --menu-border-color: #3b82f680;
  --menu-border-color-with-childs: #92929480;
}
/* Shared Styles */
.app-menu .menu-top-icon .dashboard, .app-menu .menu-item .dashboard {
  -webkit-mask-image: url("../../icons/menu-top/dashboard.svg");
  mask-image: url("../../icons/menu-top/dashboard.svg");
  background: var(--menu-icon-color);
  background-size: 20px;
  mask-size: 20px;
  mask-repeat: no-repeat;
  mask-position: center;
}
.app-menu .menu-top-icon .settings, .app-menu .menu-item .settings {
  -webkit-mask-image: url("../../icons/menu-top/config.svg");
  mask-image: url("../../icons/menu-top/config.svg");
  background: var(--menu-icon-color);
  background-size: 20px;
  mask-size: 20px;
  mask-repeat: no-repeat;
  mask-position: center;
}
.app-menu .menu-top-icon .users, .app-menu .menu-item .users {
  -webkit-mask-image: url("../../icons/menu-top/users.svg");
  mask-image: url("../../icons/menu-top/users.svg");
  background: var(--menu-icon-color);
  background-size: 20px;
  mask-size: 20px;
  mask-repeat: no-repeat;
  mask-position: center;
}
.app-menu .menu-top-icon .quizzes, .app-menu .menu-item .quizzes {
  -webkit-mask-image: url("../../icons/menu-top/quiz.svg");
  mask-image: url("../../icons/menu-top/quiz.svg");
  background: var(--menu-icon-color);
  background-size: 20px;
  mask-size: 20px;
  mask-repeat: no-repeat;
  mask-position: center;
}
.app-menu .menu-top-icon .add, .app-menu .menu-item .add {
  -webkit-mask-image: url("../../icons/menu-top/add.svg");
  mask-image: url("../../icons/menu-top/add.svg");
  background: var(--menu-icon-color);
  background-size: 20px;
  mask-size: 20px;
  mask-repeat: no-repeat;
  mask-position: center;
}
.app-menu .menu-top-icon .submissions, .app-menu .menu-item .submissions {
  -webkit-mask-image: url("../../icons/menu-top/submissions.svg");
  mask-image: url("../../icons/menu-top/submissions.svg");
  background: var(--menu-icon-color);
  background-size: 20px;
  mask-size: 20px;
  mask-repeat: no-repeat;
  mask-position: center;
}
.app-menu .menu-top-icon .stats, .app-menu .menu-item .stats {
  -webkit-mask-image: url("../../icons/menu-top/statistics.svg");
  mask-image: url("../../icons/menu-top/statistics.svg");
  background: var(--menu-icon-color);
  background-size: 20px;
  mask-size: 20px;
  mask-repeat: no-repeat;
  mask-position: center;
}
.app-menu .menu-top-icon .user-home, .app-menu .menu-item .user-home {
  -webkit-mask-image: url("../../icons/menu-top/course.svg");
  mask-image: url("../../icons/menu-top/course.svg");
  background: var(--menu-icon-color);
  background-size: 20px;
  mask-size: 20px;
  mask-repeat: no-repeat;
  mask-position: center;
}
.app-menu .menu-top-icon .radar, .app-menu .menu-item .radar {
  -webkit-mask-image: url("../../icons/menu-top/radar.svg");
  mask-image: url("../../icons/menu-top/radar.svg");
  background: var(--menu-icon-color);
  background-size: 20px;
  mask-size: 20px;
  mask-repeat: no-repeat;
  mask-position: center;
}
.app-menu .menu-top-icon .folder, .app-menu .menu-item .folder {
  -webkit-mask-image: url("../../icons/menu-top/folder.svg");
  mask-image: url("../../icons/menu-top/folder.svg");
  background: var(--menu-icon-color);
  background-size: 20px;
  mask-size: 20px;
  mask-repeat: no-repeat;
  mask-position: center;
}
.app-menu .menu-top-icon .ai-agent, .app-menu .menu-item .ai-agent {
  -webkit-mask-image: url("../../icons/menu-top/ai-agent.svg");
  mask-image: url("../../icons/menu-top/ai-agent.svg");
  background: var(--menu-icon-color);
  background-size: 20px;
  mask-size: 20px;
  mask-repeat: no-repeat;
  mask-position: center;
}
.app-menu .menu-top-icon .ai, .app-menu .menu-item .ai {
  -webkit-mask-image: url("../../icons/menu-top/ai.svg");
  mask-image: url("../../icons/menu-top/ai.svg");
  background: var(--menu-icon-color);
  background-size: 20px;
  mask-size: 20px;
  mask-repeat: no-repeat;
  mask-position: center;
}
/* SIDEBAR */
.sidebar-menu-container .sidebar-menu.primary {
  border-right: 1px dashed var(--menu-border-color);
}
.sidebar-menu-container .sidebar-menu.primary.with-childs {
  border-right: 1px dashed var(--menu-border-color-with-childs);
}
.sidebar-menu-container .sidebar-menu.secondary {
  border-right: 1px dashed var(--menu-border-color);
}
.sidebar-menu-container .sidebar-menu .menu-item {
  cursor: pointer;
  min-width: 150px;
  padding: 8px 8px;
  line-height: 24px;
  font-size: 16px;
  display: flex;
  gap: 4px;
  flex-wrap: nowrap;
}
.sidebar-menu-container .sidebar-menu .menu-item.selected {
  font-weight: bold;
  --menu-icon-color: #333;
}
.sidebar-menu-container .sidebar-menu .menu-item .menu-icon {
  width: 24px;
  height: 24px;
}
/* MENU TOP */
.menu-top .menu-top-icon {
  background: var(--menu-icon-background-color);
  border-radius: 4px;
  border: 1px solid var(--menu-top-icon-border-color);
  -webkit-box-shadow: 10px 10px 35px -6px #c6c6c6;
  -moz-box-shadow: 10px 10px 35px -6px #c6c6c6;
  box-shadow: 10px 10px 35px -6px #c6c6c6;
}
.menu-top .menu-top-icon.selected {
  --menu-icon-color: #333;
}
