@use '../bootstrap/init' as *;

.dropdown-menu {
  color: $color-dropdown;
  svg {
    fill: $color-dropdown;
  }

  background-color: $bgcolor-dropdown;
}

.dropdown-item {
  color: $color-dropdown-link;
  svg {
    fill: $color-dropdown-link;
  }

  // TODO: hover-focus() dropped in bootstrap v5
  @include hover-focus() {
    color: $color-dropdown-link;
    svg {
      fill: $color-dropdown-link-hover;
    }

    @include gradient-bg($bgcolor-dropdown-link-hover);
  }

  &:active,
  &.active,
  &:active:hover,
  &.active:hover {
    color: $color-dropdown-link-active;
    background-color:  $bgcolor-dropdown-link-active;
    svg {
      fill: $color-dropdown-link-active;
    }
  }
}