// Imports Project Config File with wariables/mixins/functions
@import "../../assets/scss/config";
@import "../../assets/scss/icofont";

.ant-select {
  @extend %input-wrap;
  margin-bottom: 18px;

  .ant-select-selection {
    @extend %input;
    padding: 0px 14px;
    height: auto;
    min-height: 32px;
    margin-bottom: 0;
    font-size: 13px;

    &:hover {
      border-color: es-color(black, 6);
    }
    &__choice__content {
      span {
        display: none;
      }
    }
    &__choice__remove {
      top: 1px;
    }
  }

  &.ant-select-open {
    .ant-select-selection {
      border-color: es-color(black, 6);
      box-shadow: none;
    }
  }

  &:before {
    @include es-icon(
      icon-arrow-up-down,
      10px,
      absolute,
      $position: (right: 10px, top: 12px)
    );
  }
}

div.ant-select-selection--multiple {
  .ant-select-selection__rendered {
    margin: 0;
    width: 100%;

    > ul > li {
      margin-top: 3px;
      margin-bottom: 3px;
    }
  }

  .ant-select-selection__placeholder {
    margin-left: 0;
  }
}

.ant-select-dropdown.ant-select-dropdown--multiple {
  .ant-select-dropdown-menu-item {
    p {
    }
    span {
      font-size: 11px;
      color: es-color(green);
    }
    &:hover,
    &.ant-select-dropdown-menu-item-active,
    &.ant-select-dropdown-menu-item-selected,
    &.ant-select-dropdown-menu-item-selected:hover {
      background-color: es-color(green);
      color: $white;
      font-weight: normal;

      &:after {
        color: $white;
      }
      span {
        color: $white;
      }
    }
  }
}
