Suggestion:
Allow configuring the input/select font size directly in the customization settings, ideally with separate values for different breakpoints.
Why:
On iOS, the page may automatically zoom in when tapping dropdown/select fields in the Amelia booking form. This happens because iOS zooms into inputs with a font size smaller than 16px - Amelia’s font size for the dropdown/select is 15px.
This results in the page being zoomed in when focusing a select/input field on iOS. As a side effect, the layout appears to shift and becomes horizontally scrollable (similar to an overflow issue), making the page feel unstable and less polished from a user perspective.
In Amelia, select fields use the CSS variable –am-fs-select, which can result in an effective font size below 16px. Increasing this value prevents the zoom behavior.
Use the following CSS fix if you are running into this behavior:
@media (max-width: 767px) .amelia-v2-booking #amelia-container .am-select –am-fs-select: 16px !important;
}
.amelia-v2-booking #amelia-container .am-select .el-select__selected-item.el-select__placeholder span,
.amelia-v2-booking #amelia-container .am-select .el-select__input,
.amelia-v2-booking #amelia-container .am-select .el-input__inner font-size: 16px !important;
}
}
This ensures that select fields have a minimum font size of 16px on mobile devices, preventing the automatic iOS zoom on focus.