@import "../variables/main";

.multiselect {
  .multiselect__option--highlight {
    background: $primary-color !important;
    &:after {
      background: $primary-color !important;
    }
  }

  .multiselect__tag {
    background: $primary-color !important;

    .multiselect__tag-icon {
      margin: 2px;
      line-height: 20px;
      &:hover {
        background: lighten($primary-color, 15%) !important;
      }
      &:after {
        color: white !important;
      }
    }
  }

  .multiselect__select {
    right: 1px;
    bottom: 1px;
    top: auto;
  }

  .multiselect__tags {
    padding-right: 0;
    padding-left: 0;
    background: none;
    border: none;
    box-shadow: none;
    input {
      display: block;
      position: static !important;
      width: 100% !important;
    }
  }

  .multiselect__content-wrapper {
    border-radius: 4px;
    padding: 0;
    border: none;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.3);
  }
}