.dropdown {
  position: relative;
}

.dropdown-button > div {
  display: flex;
  align-items: center;
  gap: 3px;
}

.dropdown-menu {
  display: flex;
  flex-direction: column;
  padding: 10px;
  overflow: visible;
  position: absolute;
  border-radius: 12px;
  z-index: 9;
  background: var(--background);
  filter: brightness(97%);
  transition: 600ms;
  flex-grow: 1;
  top: 35px;

  &.orientation-right {
    right: 0;
  }

  &.orientation-left {
    left: 0;
  }

  min-width: max-content;
}

.dropdown-header, .dropdown-item {
  display: flex;
  align-items: center;
  gap: 3px;
  text-wrap: nowrap;


}

.dropdown-header {
  padding: 10px;
}

.dropdown-item {
  font-size: 14px;
  padding: 3px 10px;
  &:hover{
    background: var(--background);
    filter: brightness(97%);
    border-radius: 12px;
  }
  .button-icon {
    flex-shrink: 0;

  }
}