.react-datepicker {
  &-wrapper {
    width: 100px;
  }
  &__input-container {
    input {
      width: 100%;
      border-radius: 4px;
      border: 1px solid $input-border-color;
      padding: $input-padding-y $input-padding-x;
      font-size: 1rem;
      font-weight: 400;
      line-height: 1.5;
      appearance: none;
    }
  }
  &-popper {
    z-index: 500 !important;
  }
}
.input-group {
  .react-datepicker-wrapper {
    &:not(:last-child) {
      input {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
      }
    }
    &:not(:first-child) {
      input {
        margin-left: -1px;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
      }
    }
  }
}
.input-group-sm,
.form-control-sm {
  .react-datepicker {
    &-wrapper {
      width: 80px;
    }
    &__input-container {
      input {
        min-height: calc(1.5em + 0.5rem + 2px);
        padding: 0.25rem 0.5rem;
        font-size: 0.875rem;
        border-radius: 0.2rem;
        @include condensed-text-width;
      }
    }
  }
}
