$element-list-top: 2.5rem;
$element-list-left: 0;
$element-list-top-chevron: -0.2rem;
$element-list-left-chevron: 0.5rem;
$crown-top-chevron: 0.8rem;
$crown-left-chevron: 0.3rem;

.cog-container {
  position: relative;
  display: flex;
}

.element-list {
  position: absolute;
  white-space: nowrap;
  top: $element-list-top;
  left: $element-list-left;
  border-radius: 5px;
  background-color: $primary-white;
  padding: 0;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);


  &::after {
    @include chevron($element-list-top-chevron, $element-list-left-chevron);
  }

  &--item {
    list-style: none;

    &__button {
      background: none;
      padding: 0.25rem 0.85rem;
      border: none;
      color: $primary-black;
      font-size: 0.85rem;

      &:disabled {
        opacity: 0.6;
        cursor: not-allowed;
      }
    }
  }
}