Bootstrap btn-group проблема гибкого переноса

Question

У меня возникли проблемы с формой начальной загрузки (с использованием Bootstrap 4). Мне нужно, чтобы кнопки btn-group были перенесены при изменении размера. Это работает как шарм при добавлении flex-wrap, НО есть одна проблема: нижняя часть моих кнопок скрыта .. И я не могу понять почему! Я перепробовал все (добавляя отступы для всех типов вещей), но я не могу понять это. Вот скриншот

А вот и код:

<div class="form-row">
  <div class="col-md-12 form-group mb-5 ">
    <label>Type de bien *</label><br />
    <div class="btn-group btn-group-toggle flex-wrap" data-toggle="buttons">
      <label class="btn btn-qual btn-toggle active">
        <input type="radio" name="options" id="option1" autocomplete="off" checked> Maison
      </label>
      <label class="btn btn-qual btn-toggle">
        <input type="radio" name="options" id="option2" autocomplete="off"> Appartement
      </label>
      <label class="btn btn-qual btn-toggle">
        <input type="radio" name="options" id="option3" autocomplete="off"> Duplex
      </label>
      <label class="btn btn-qual btn-toggle">
        <input type="radio" name="options" id="option3" autocomplete="off"> Triplex
      </label>
      <label class="btn btn-qual btn-toggle">
        <input type="radio" name="options" id="option3" autocomplete="off"> Loft/Atelier
      </label>
      <label class="btn btn-qual btn-toggle">
        <input type="radio" name="options" id="option3" autocomplete="off"> Hôtel Particulier
      </label>
    </div>
  </div>
</div>

У кого-нибудь есть идеи, как это исправить?