fix(clerk-js): Fix the input box-shadow on iOS 16 devices

Author: anagstef

.changeset/light-doors-teach.md

@@ -0,0 +1,5 @@
+---
+'@clerk/clerk-js': patch
+---
+
+Fix the input box-shadow on iOS 16 devices

packages/clerk-js/src/ui/primitives/Input.tsx

@@ -21,9 +21,12 @@ const { applyVariants, filterProps } = createVariants((theme, props) => ({
     accentColor: theme.colors.$primary500,
     ...common.textVariants(theme).body,
     ...common.disabled(theme),
+    // This is a workaround to prevent zooming on iOS when focusing an input
     [mqu.ios]: {
       fontSize: theme.fontSizes.$lg,
     },
+    // This is a fix for iOS webkit on iOS below 16, where the input is not respecting the box-shadow
+    WebkitAppearance: 'none',
     ':autofill': {
       animationName: 'onAutoFillStart',
     },