.trip-type-selector,
.passenger-selector {
  display: inline-block;
  vertical-align: middle;
}

.trip-type-selector {
  max-width: 300px;
  margin-right: 15px; /* gap between both */
}

.banner-content {
  text-align: center;
}

/* ===============================
   DESKTOP & LAPTOP (Above 768px)
================================ */
@media (min-width: 769px) {
  #full-booking-form .mt-30 {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
  }

  #full-booking-form .mt-30 > .col-xl-3 {
    flex: 0 0 25%;
    max-width: 25%;
  }

  #full-booking-form .mt-30 > .col-xl-12 {
    flex: 0 0 100%;
    max-width: 100%;
  }

  /* Departure + Return side by side */
  #full-booking-form .mt-30 .row {
    flex-direction: row;
  }
}

/* ===============================
   TABLET & MOBILE (768px & Below)
================================ */
@media (max-width: 768px) {
  /* Main booking row */
  #full-booking-form .mt-30 {
    display: flex;
    flex-direction: column;
  }

  /* All fields one by one */
  #full-booking-form .mt-30 > div {
    width: 100%;
    max-width: 100%;
    order: unset; /* 🔥 reverse issue fix */
  }

  /* Departure & Return also vertical */
  #full-booking-form .mt-30 .row {
    display: flex;
    flex-direction: column;
  }

  #full-booking-form .mt-30 .row > div {
    width: 100%;
    max-width: 100%;
  }

  /* Button center */
  #continueBtn {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
}

/* ===============================
   SMALL MOBILE (Below 480px)
================================ */
@media (max-width: 480px) {
  #full-booking-form label {
    font-size: 14px;
  }

  #full-booking-form .form--control,
  #full-booking-form .form-select {
    font-size: 14px;
    /* padding: 10px; */
  }
}