// Prevent the focus on the dropdown toggle when closing dropdowns

.wswg-dropdown__menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 999;
  display: none; // none by default, but block on "open" of the menu
  min-width: 55px;
  padding: 5px 0;
  margin: 2px 0 0; // override default ul
  list-style: none;
  font-size: 14px;
  text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
  background-color: $dropdown-bg;
  box-shadow: 0 4px 20px 0 rgba(#000, .45);
  border-radius: 0;
  background-clip: padding-box;
  max-height: 335px;
  overflow-x: hidden;
  overflow-y: auto;
  list-style: none;

  a {
    display: block;
    font-weight: 400;
    line-height: 1.428571429;
    font-size: 13px;
    color: #3B3B3B;
    padding: 3px 15px;
    white-space: nowrap; // prevent links from randomly breaking onto new lines

    &:hover,
    &:focus {
      text-decoration: none;
      background-color: #FAFAFA;
    }
  }

  .disabled a {

    &:hover,
    &:focus {
      color: $dropdown-link-disabled-color;
      text-decoration: none;
      background-color: transparent;
      background-image: none; // Remove CSS gradient
      cursor: $cursor-disabled;
    }
  }

  .active.active a {

    &:hover,
    &:focus {
      color: $main-color-green;
      text-decoration: none;
      outline: 0;
      background-color: $white;
    }
  }
}

.wswg-btn__dropdown {
  position: relative;
  padding-right: 26px;
  border: 0;
  border-radius: 0;
  height: 35px;

  &:after {
    content: "";
    position: absolute;
    right: 10px;
    top: 47%;
    border-right: 3px solid rgba(#000, 0);
    border-left: 3px solid rgba(#000, 0);
    border-top: 3px solid #999;
    transition: transform .2s;
    will-change: transform;
  }

  &:focus {
    outline-color: $main-color-green;
    z-index: 1;
  }
}

.open {

  .dropdown-menu {
    display: block;
  }

  .wswg-dropdown--bullets-dropdown {
    display: flex;
  }
}

.wswg-link__dropdown__select.wswg-link__dropdown__select.wswg-link__dropdown__select {
  border-width: 2px;
}

.wswg-btn__label {
  font-weight: $font-weight-bold;
}

// For line used line-height

.wswg-dropdown__item--checked {
  background-color: #E6E6E6;
}