// Chosen

$chosen-select-padding-y: $form-select-padding-y + .21;

.chosen-container.chosen-container-single {
  max-width: $input-max-width;
  font-size: $font-size-base;

  .chosen-single {
    display: inline-block;
    height: #{$input-height};
    padding: $chosen-select-padding-y ($form-select-padding-x + $form-select-indicator-padding) $chosen-select-padding-y $form-select-padding-x;
    line-height: 1.5;
    color: $form-select-color;
    vertical-align: middle;
    background: $form-select-bg $form-select-indicator no-repeat right $form-select-padding-x center;
    background-image: none \9;
    background-size: $form-select-bg-size;
    border: $form-select-border-width solid $form-select-border-color;
    box-shadow: none;
    appearance: none;
    @include border-radius($form-select-border-radius, 0);

    abbr {
      top: 10px;
    }

    &:focus {
      @include box-shadow($form-select-focus-box-shadow);
      border-color: $form-select-focus-border-color;
      outline: none;
    }

    &:disabled {
      color: $form-select-disabled-color;
      cursor: not-allowed;
      background-color: $form-select-disabled-bg;
    }

    div b {
      background: none !important;
    }
  }

  .chosen-drop {
    background: $white;
    border: $form-select-border-width solid $form-select-border-color;
  }

  .chosen-results li {
    line-height: calc(#{$font-size-base} + .3rem);
  }

  &.chosen-container-active .chosen-single {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
  }
}

.chosen-container.chosen-container-multi {
  .chosen-choices {
    max-width: $input-max-width;
    min-height: #{$input-height};
    font-size: $font-size-base;
    line-height: $input-line-height;
    background-image: $white;

    li.search-choice {
      $chosen-multi-close-width: 20px;

      padding: 5px (13 + $chosen-multi-close-width) 5px 10px;
      color: $white;
      background: var(--primary);
      border: 0;
      box-shadow: $cassiopeia-box-shadow;

      @if $enable-rounded {
        border-radius: $form-select-border-radius;
      } @else {
        border-radius: 0;
      }

      .search-choice-close {
        top: 0;
        right: 0;
        width: $chosen-multi-close-width;
        height: 100%;
        background: hsla(0, 0%, 0%, .2);
        background-image: none !important;

        &::before {
          position: absolute;
          top: 6px;
          right: $chosen-multi-close-width * .25;
          font-size: $font-size-base;
          color: $white;
          content: "\00d7";
        }
      }
    }
  }
}

.chosen-container-active.chosen-with-drop .chosen-single {
  box-shadow: none;
}

// TEMPORARY
.chosen-container-single {
  width: auto !important;
}

// END TEMPORARY

.card .chosen-container.chosen-container-single {
  width: 100% !important;

  .chosen-single {
    width: 100% !important;
  }
}
