// bootstrap does flex-grow: 1 by default which makes the
// text input roughly the same size as the select in many cases
.input-group > .search-q {
  flex-grow: 4;
}

.input-group > .search-autocomplete-wrapper {
  @extend .form-control;
  display: inline-block;
  flex-grow: 4;
  padding: 0;
  position: relative;

  .search-q {
    border: 0;
    height: 100%;
    width: 100%;
  }

  ul {
    display: block;
  }
}

.search-btn {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  display: flex;
}