fix(ui): prevent iOS Safari auto-zoom on input focus (#7214)

1 files changed, 14 insertions, 0 deletions

diff --git a/packages/ui/src/styles/base.css b/packages/ui/src/styles/base.css
index b80398e1d..729ff045a 100644
--- a/packages/ui/src/styles/base.css
+++ b/packages/ui/src/styles/base.css
@@ -372,3 +372,17 @@ input:where([type="button"], [type="reset"], [type="submit"]),
 [hidden]:where(:not([hidden="until-found"])) {
   display: none !important;
 }
+
+/*
+  Prevent iOS Safari from auto-zooming on input focus.
+  iOS WebKit zooms on any input with font-size < 16px as an accessibility feature.
+*/
+
+@media (hover: none) and (pointer: coarse) {
+  input,
+  select,
+  textarea,
+  [contenteditable="true"] {
+    font-size: 16px !important;
+  }
+}