/*$box-shadow: (*/
/**/ /*"sm": 0 0 0.375rem 0 rgba(46, 38, 61, 0.18), //*/
/**/ /*"md": 0 0 0.625rem 0 rgba(46, 38, 61, 0.2), //*/
/**/ /*"lg": 0 0 1rem 0 rgba(46, 38, 61, 0.22) //
);*/
/*
1 colore bottone
2 bordo/hover
3 testo
*/
.menuList {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  width: 100%;
  position: relative;
}
.menuList--topbar {
  flex-direction: row;
  gap: 0.5rem;
}
.menuList--sidebar {
  flex-direction: column;
  padding-right: 0.25rem;
  gap: 0.5rem;
  height: calc(100svh - 64px - 50px - 1rem);
}
.menuList__separator {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  color: var(--fg-light);
}
.menuList__separator:last-child {
  display: none;
}
.menuList__separator:has(+ .menuList__separator) {
  display: none;
}
.menuList__separator--top {
  padding-top: 0.5rem;
  position: relative;
}
.menuList__separator--top::after {
  content: "";
  position: absolute;
  top: 0;
  border-top: 1px solid var(--bg-dark);
  right: 0;
  left: 0;
}
.menuList__separator--bottom {
  padding-top: 0.5rem;
  position: relative;
}
.menuList__separator--bottom::after {
  content: "";
  position: absolute;
  bottom: 0;
  border-top: 1px solid var(--bg-dark);
  left: 0;
  right: 0;
}
.menuList__separator span {
  text-transform: uppercase;
  font-size: 0.75rem;
}
.menuList__separator::before, .menuList__separator::after {
  content: "";
  display: block;
  height: 1px;
  background-color: var(--bg-dark);
}
.menuList__separator::before {
  width: 10px;
}
.menuList__separator::after {
  width: 100%;
}
.menuList__trigger {
  display: grid;
  grid-template-columns: max-content minmax(min-content, 100%) max-content;
  gap: 0.75rem;
  align-items: center;
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  color: var(--fg);
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s;
}
.menuList__trigger:hover {
  background-color: var(--bg-dark);
  text-decoration: none;
  color: var(--fg);
}
.menuList__trigger.active {
  background-color: var(--primary);
  color: var(--white);
}
.menuList__trigger.active:has(+ .menuList__subMenu .active) {
  background: var(--bg-dark);
  color: var(--fg);
}
.menuList__trigger.active .menuList__trigger__badge i {
  transform: rotate(90deg);
}
.menuList__trigger--full {
  grid-template-columns: 0 min-content 0;
  gap: 0;
}
.menuList__trigger__icon {
  display: flex;
  justify-content: center;
}
.menuList__trigger__icon i {
  font-size: 1.1em;
}
.menuList__trigger__text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 500;
}
.menuList__trigger__badge {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  font-size: 0.85em;
}
.menuList__trigger__badge i {
  transition: transform 0.3s ease;
}
.menuList__subMenu {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s ease-out;
  padding-left: 0;
}
.menuList__subMenu .menuList {
  overflow: hidden;
}
.menuList__subMenu .menuList__trigger {
  --subMenuIcon: "\e122";
}
.menuList__subMenu .menuList__trigger__icon i {
  --fa: var(--subMenuIcon);
}
.menuList__subMenu .menuList__trigger.active i {
  --subMenuIcon: "\f192";
  --fa-secondary-opacity: 0.1;
  font-size: x-large;
}
.menuList__subMenu.subMenu--active, .menuList__subMenu:has(.active) {
  grid-template-rows: 1fr;
}

.menuSelectorPopUp {
  right: calc(100% + 1.5rem);
  width: max-content;
  top: 0;
  padding-inline: 1rem;
}

.languageFlagImage {
  width: 25px;
  height: 25px;
  border-radius: 0.5rem;
  overflow: hidden;
}

.popup:has(.menuList) {
  padding: 0.5rem 0 !important;
}
.popup:has(.menuList) .menuList__trigger {
  border-radius: 0;
}

/*# sourceMappingURL=menu.css.map */
