@import "Reactselect";

.input-tag .Select {
  .Select-control {
    padding: 16px 16px 10px 16px;
    border-radius: 0.2rem;

    .Select-multi-value-wrapper {
      .Select-value {
        padding: 0.3rem 0.6rem;
        margin: 0 4px 4px 0;
        color: #fff;
        font-size: 12px;
        font-weight: 300;
        background-color: $primary-color;
        border: none;
        border-radius: 0.2rem;
      }

      .Select-value > .Select-value-icon {
        display: none;
      }

      .Select-value > .Select-value-label {
        padding: 0;
        font-family: inherit;
        font-size: inherit;
        line-height: 17px;
      }

      .Select-input {
        margin: -1px 0 0 2px;

        > input {
          padding: 6px 0px;
        }
      }
    }
  }

  .Select-menu-outer {
    max-height: 207px;
    overflow: hidden;

    .Select-menu {
      max-height: 205px;
    }

    .Select-option {
      padding: 10px;
      font-size: 14px;
    }

    .Select-option.is-focused {
      background-color: #f2f2f2;
    }
  }

  .Select-multi-value-wrapper {
    > .Select-placeholder+.Select-input {
      margin-left: 0;
    }
  }

  .Select-arrow-zone {
    top: -3px;
  }
}