#registerModal .otp-inline-row{
  display:flex;
  align-items:flex-end;
  gap:8px;
  flex-wrap: wrap;
  width:100%;
  min-width:0;
}

#registerModal .otp-inline-row .input-group-prepend{ order:5;  flex:0 0 auto; }
#registerModal .otp-inline-row .input-group-append{ order:20; flex:0 0 auto; }

#registerModal .otp-inline-row select[name="callingCode"]{
  width:96px !important;
  min-width:80px;
  text-align:center;
  padding-right:16px;
}

#registerModal .otp-inline-row input[name="email"]{
  order:10;
  flex: 1 1 330px;
  min-width: 260px;
  width:auto !important;
}

#registerModal .otp-inline-row input[name="phoneNumber"]{
  order:10;
  flex: 1 1;
  min-width: 260px;
  width:auto !important;
}

#registerModal .otp-inline-row .input-group-append .otp-btn{
  white-space:nowrap;
  width:168px;
  padding:6px 10px;
  font-size:13px;
}
#registerModal .otp-inline-row .input-group-append .otp-btn .text{
  display:block;
  font-variant-numeric: tabular-nums;
}

#registerModal .otp-inline-row label.error,
#registerModal .otp-inline-row .invalid-feedback{
  order:30;
  flex:0 0 100%;
  max-width:100%;
  margin-top:4px;
}

#registerModal .otp-inline-row .invalid-feedback:empty{
  display:none !important;
}

@media (max-width: 635px){
  #registerModal .otp-inline-row input[name="phoneNumber"],
  #registerModal .otp-inline-row input[name="email"]{
    flex:1 1 100%;
    min-width:0;
  }
  #registerModal .otp-inline-row .input-group-append{
    flex:1 1 100%;
  }
  #registerModal .otp-inline-row .input-group-append .otp-btn{
    width:100%;
    margin-top:6px;
  }
  #registerModal .otp-inline-row select[name="callingCode"]{ width:80px !important; }

  #registerModal .otp-inline-row button { width:100%; }
}

#registerModal.modal-dialog.form-login.form-sign{
  width:100%;
  max-width: 620px;
}

#registerModal .otp-inline-row input[name="smsOtp"],
#registerModal .otp-inline-row input[name="emailOtp"]{
  order:10;
  flex: 1 1 330px;
  min-width: 260px;
  width:auto !important;
}

/* 預設寬度（小於 635px 時會被上面覆蓋為 100%） */
#registerModal .otp-inline-row button{
  width: 168px;
}

@media screen and (max-aspect-ratio: 13 / 9) and (max-width: 767px) and (orientation: portrait) and (hover: none) {
  .bg-login {
    padding-top: 0;
  }
}

@media screen and (max-aspect-ratio: 13 / 9) and (max-width: 767px) and (orientation: portrait) and (hover: none) {
  .bg-login .modal.d-flex {
    max-height: unset;
    padding: 7px;
  }
}
