// NG Select
// https://github.com/ng-select/ng-select
.ng-select {
  @extend .flex-1,
          .d-flex;

  .ng-select-container {
    @extend .form-control,
            .ml-0;

    .ng-placeholder {
      @extend .position-absolute;

      color: $input-placeholder-color;
    }

    .ng-input {
      @extend .position-relative;

      input {
        @extend .p-0;
        color: $input-color;
        &:focus {
          outline: 0;
        }
      }
    }
  }

  &.ng-select-focused {
    .ng-select-container {
      @include x-form-control-focus;

      z-index: 3;
    }
    &:not(:first-child) {
      .ng-select-container {
        @include border-left-radius(0);
      }
    }
    &:not(:last-child) {
      .ng-select-container {
        @include border-right-radius(0);
      }
    }
  }

  .ng-has-value .ng-placeholder {
    @extend .d-none;
  }

}

.ng-value {
  .ng-select-multiple & {
    @extend .mr-2,
            .p-0,
            .x-badge-tag,
            .badge-light;
  }

  .ng-select-single & {
    @extend .position-absolute,
            .w-100;
  }
}

.ng-dropdown-panel {
  @extend %zindex-dropdown;


  &.ng-select-bottom {
    top: 100%;
    margin-left: 6px;
  }

  &.ng-select-top {
    bottom: 100%;
  }

  .ng-dropdown-panel-items {
    @extend .w-100,
            .py-0,
            .list-group,
            .list-group-flush,
            .dropdown-menu,
            .show;

    .ng-option {
      @extend %white-space-normal,
              .dropdown-item,
              .list-group-item,
              .list-group-item-action,
              .px-3;

      &.ng-option-selected {
        @extend .list-group-item-info;
      }

      &:last-child:not(:first-child):not(.selected) {
        @extend .border-top;

      }
    }
  }
}