diff --git a/src/runtime/components/FileUpload.vue b/src/runtime/components/FileUpload.vue
index 80b3d1987b..89f7cd4357 100644
--- a/src/runtime/components/FileUpload.vue
+++ b/src/runtime/components/FileUpload.vue
@@ -125,7 +125,7 @@ export interface FileUploadSlots<M extends boolean = false> {
 
 <script setup lang="ts" generic="M extends boolean = false">
 import { computed, watch } from 'vue'
-import { Primitive } from 'reka-ui'
+import { Primitive, VisuallyHidden } from 'reka-ui'
 import { createReusableTemplate } from '@vueuse/core'
 import { useAppConfig, useLocale } from '#imports'
 import { useFormField } from '../composables/useFormField'
@@ -252,15 +252,17 @@ function removeFile(index?: number) {
 }
 
 watch(modelValue, (newValue) => {
-  const hasModelReset = !Array.isArray(newValue) || !newValue.length
+  const hasModelReset = props.multiple ? !(newValue as File[])?.length : !newValue
 
-  if (hasModelReset && inputRef.value) {
-    inputRef.value.value = ''
+  if (hasModelReset && inputRef.value?.$el) {
+    inputRef.value.$el.value = ''
   }
 })
 
 defineExpose({
-  inputRef,
+  get inputRef() {
+    return inputRef.value?.$el
+  },
   dropzoneRef
 })
 </script>
@@ -365,18 +367,18 @@ defineExpose({
       <ReuseFilesTemplate v-if="position === 'outside'" />
     </slot>
 
-    <input
+    <VisuallyHidden
       :id="id"
       ref="inputRef"
+      as="input"
       type="file"
+      feature="fully-hidden"
       :name="name"
       :accept="accept"
       :multiple="(multiple as boolean)"
       :required="required"
       :disabled="disabled"
       v-bind="{ ...$attrs, ...ariaAttrs }"
-      class="sr-only"
-      tabindex="-1"
-    >
+    />
   </Primitive>
 </template>
diff --git a/src/runtime/composables/useFileUpload.ts b/src/runtime/composables/useFileUpload.ts
index 308a8c51ce..1f04b43642 100644
--- a/src/runtime/composables/useFileUpload.ts
+++ b/src/runtime/composables/useFileUpload.ts
@@ -1,4 +1,5 @@
 import { ref, computed, unref, onMounted, watch, reactive } from 'vue'
+import type { VisuallyHidden } from 'reka-ui'
 import { useFileDialog, useDropZone } from '@vueuse/core'
 import type { MaybeRef } from '@vueuse/core'
 
@@ -45,12 +46,12 @@ export function useFileUpload(options: UseFileUploadOptions) {
     dropzone = true,
     onUpdate
   } = options
-  const inputRef = ref<HTMLInputElement>()
+  const inputRef = ref<InstanceType<typeof VisuallyHidden>>()
   const dropzoneRef = ref<HTMLDivElement>()
 
   const dataTypes = computed(() => parseAcceptToDataTypes(unref(accept)))
 
-  const onDrop = (files: FileList | File[] | null) => {
+  const onDrop = (files: FileList | File[] | null, fromDropZone = false) => {
     if (!files || files.length === 0) {
       return
     }
@@ -60,6 +61,18 @@ export function useFileUpload(options: UseFileUploadOptions) {
     if (files.length > 1 && !multiple) {
       files = [files[0]!]
     }
+
+    // Sync dropped files to the input element for proper native validation
+    if (fromDropZone && inputRef.value?.$el) {
+      try {
+        const dt = new DataTransfer()
+        files.forEach(file => dt.items.add(file))
+        inputRef.value.$el.files = dt.files
+      } catch (e) {
+        console.warn('Could not sync files to input element:', e)
+      }
+    }
+
     onUpdate(files)
   }
 
@@ -75,7 +88,7 @@ export function useFileUpload(options: UseFileUploadOptions) {
 
   onMounted(() => {
     const { isOverDropZone } = dropzone
-      ? useDropZone(dropzoneRef, { dataTypes: dataTypes.value, onDrop })
+      ? useDropZone(dropzoneRef, { dataTypes: dataTypes.value, onDrop: files => onDrop(files, true) })
       : { isOverDropZone: ref(false) }
 
     watch(isOverDropZone, (value) => {
@@ -85,13 +98,13 @@ export function useFileUpload(options: UseFileUploadOptions) {
     const { onChange, open } = useFileDialog({
       accept: unref(accept),
       multiple,
-      input: unref(inputRef),
+      input: unref(inputRef)?.$el,
       reset
     })
 
     fileDialog.open = open
 
-    onChange(fileList => onDrop(fileList))
+    onChange(fileList => onDrop(fileList, false))
   })
 
   return {
diff --git a/test/components/__snapshots__/FileUpload-vue.spec.ts.snap b/test/components/__snapshots__/FileUpload-vue.spec.ts.snap
index 612e7a7a7b..f1afc7357a 100644
--- a/test/components/__snapshots__/FileUpload-vue.spec.ts.snap
+++ b/test/components/__snapshots__/FileUpload-vue.spec.ts.snap
@@ -10,7 +10,7 @@ exports[`FileUpload > renders with accept correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="image/*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="image/*">
 </div>"
 `;
 
@@ -31,7 +31,7 @@ exports[`FileUpload > renders with actions slot correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -45,7 +45,7 @@ exports[`FileUpload > renders with ariaLabel correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" aria-label="Aria label" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" aria-label="Aria label">
 </div>"
 `;
 
@@ -59,7 +59,7 @@ exports[`FileUpload > renders with as correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </section>"
 `;
 
@@ -73,11 +73,11 @@ exports[`FileUpload > renders with class correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
-exports[`FileUpload > renders with default slot correctly 1`] = `"<div class="relative flex flex-col">Default slot<input type="file" accept="*" class="sr-only" tabindex="-1"></div>"`;
+exports[`FileUpload > renders with default slot correctly 1`] = `"<div class="relative flex flex-col">Default slot<input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*"></div>"`;
 
 exports[`FileUpload > renders with description correctly 1`] = `
 "<div class="relative flex flex-col">
@@ -89,7 +89,7 @@ exports[`FileUpload > renders with description correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -110,7 +110,7 @@ exports[`FileUpload > renders with description slot correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -124,7 +124,7 @@ exports[`FileUpload > renders with disabled correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" disabled="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" disabled="">
 </div>"
 `;
 
@@ -138,7 +138,7 @@ exports[`FileUpload > renders with disabled correctly 2`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" disabled="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" disabled="">
 </div>"
 `;
 
@@ -154,7 +154,7 @@ exports[`FileUpload > renders with file slot correctly 1`] = `
   </div>
   <div class="">
     <div class="text-xs gap-1.5 absolute inset-0 p-0">File slot</div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -173,7 +173,7 @@ exports[`FileUpload > renders with file-leading slot correctly 1`] = `
         <!--v-if-->
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button></div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -194,7 +194,7 @@ exports[`FileUpload > renders with file-name slot correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -215,7 +215,7 @@ exports[`FileUpload > renders with file-size slot correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -233,7 +233,7 @@ exports[`FileUpload > renders with file-trailing slot correctly 1`] = `
     <div class="text-xs gap-1.5 absolute inset-0 p-0"><span class="inline-flex items-center justify-center select-none align-middle bg-elevated text-base shrink-0 size-full rounded-lg"><img src="blob:mock-url-file.txt" width="32" height="32" class="h-full w-full rounded-[inherit] object-cover"></span>
       <div class="flex-col min-w-0 hidden"><span class="text-default truncate">file.txt</span><span class="text-muted truncate">0B</span></div>File trailing slot
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -254,7 +254,7 @@ exports[`FileUpload > renders with fileDelete correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -275,7 +275,7 @@ exports[`FileUpload > renders with fileDeleteIcon correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -296,7 +296,7 @@ exports[`FileUpload > renders with fileIcon correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -310,7 +310,7 @@ exports[`FileUpload > renders with files slot correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <div class="">Files slot</div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <div class="">Files slot</div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -331,7 +331,7 @@ exports[`FileUpload > renders with files-bottom slot correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div>Files bottom slot<input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div>Files bottom slot<input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -351,7 +351,7 @@ exports[`FileUpload > renders with files-top slot correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -365,7 +365,7 @@ exports[`FileUpload > renders with icon correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -379,7 +379,7 @@ exports[`FileUpload > renders with id correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input id="id" type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" id="id" type="file" accept="*">
 </div>"
 `;
 
@@ -393,7 +393,7 @@ exports[`FileUpload > renders with label correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -414,7 +414,7 @@ exports[`FileUpload > renders with label slot correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -435,7 +435,7 @@ exports[`FileUpload > renders with layout grid correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -452,7 +452,7 @@ exports[`FileUpload > renders with layout grid multiple correctly 1`] = `
     </div>
     <!--v-if-->
   </div>
-  <!--v-if--><input type="file" accept="*" multiple="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" multiple="">
 </div>"
 `;
 
@@ -473,7 +473,7 @@ exports[`FileUpload > renders with layout list correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-5"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -494,7 +494,7 @@ exports[`FileUpload > renders with layout list multiple correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-5"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" multiple="" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" multiple="">
 </div>"
 `;
 
@@ -515,7 +515,7 @@ exports[`FileUpload > renders with leading slot correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -536,7 +536,7 @@ exports[`FileUpload > renders with modelValue correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -553,7 +553,7 @@ exports[`FileUpload > renders with multiple correctly 1`] = `
     </div>
     <!--v-if-->
   </div>
-  <!--v-if--><input type="file" accept="*" multiple="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" multiple="">
 </div>"
 `;
 
@@ -567,7 +567,7 @@ exports[`FileUpload > renders with name correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" name="name" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" name="name" accept="*">
 </div>"
 `;
 
@@ -581,7 +581,7 @@ exports[`FileUpload > renders with neutral color correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -598,7 +598,7 @@ exports[`FileUpload > renders with position inside correctly 1`] = `
     </div>
     <!--v-if-->
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -615,7 +615,7 @@ exports[`FileUpload > renders with position inside multiple correctly 1`] = `
     </div>
     <!--v-if-->
   </div>
-  <!--v-if--><input type="file" accept="*" multiple="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" multiple="">
 </div>"
 `;
 
@@ -636,7 +636,7 @@ exports[`FileUpload > renders with position outside correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -653,7 +653,7 @@ exports[`FileUpload > renders with position outside multiple correctly 1`] = `
     </div>
     <!--v-if-->
   </div>
-  <!--v-if--><input type="file" accept="*" multiple="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" multiple="">
 </div>"
 `;
 
@@ -667,7 +667,7 @@ exports[`FileUpload > renders with required correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" required="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" required="">
 </div>"
 `;
 
@@ -681,7 +681,7 @@ exports[`FileUpload > renders with required correctly 2`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" required="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" required="">
 </div>"
 `;
 
@@ -702,7 +702,7 @@ exports[`FileUpload > renders with size lg correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -720,7 +720,7 @@ exports[`FileUpload > renders with size lg variant button correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -741,7 +741,7 @@ exports[`FileUpload > renders with size md correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -759,7 +759,7 @@ exports[`FileUpload > renders with size md variant button correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -780,7 +780,7 @@ exports[`FileUpload > renders with size sm correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -798,7 +798,7 @@ exports[`FileUpload > renders with size sm variant button correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -819,7 +819,7 @@ exports[`FileUpload > renders with size xl correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -837,7 +837,7 @@ exports[`FileUpload > renders with size xl variant button correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -858,7 +858,7 @@ exports[`FileUpload > renders with size xs correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -876,7 +876,7 @@ exports[`FileUpload > renders with size xs variant button correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -890,7 +890,7 @@ exports[`FileUpload > renders with ui correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -911,7 +911,7 @@ exports[`FileUpload > renders with variant area correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -929,7 +929,7 @@ exports[`FileUpload > renders with variant button correctly 1`] = `
         <!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 size-4"></svg>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -943,7 +943,7 @@ exports[`FileUpload > renders without dropzone correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -957,6 +957,6 @@ exports[`FileUpload > renders without interactive correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
diff --git a/test/components/__snapshots__/FileUpload.spec.ts.snap b/test/components/__snapshots__/FileUpload.spec.ts.snap
index 20c8d36826..c851554be5 100644
--- a/test/components/__snapshots__/FileUpload.spec.ts.snap
+++ b/test/components/__snapshots__/FileUpload.spec.ts.snap
@@ -10,7 +10,7 @@ exports[`FileUpload > renders with accept correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="image/*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="image/*">
 </div>"
 `;
 
@@ -31,7 +31,7 @@ exports[`FileUpload > renders with actions slot correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -45,7 +45,7 @@ exports[`FileUpload > renders with ariaLabel correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" aria-label="Aria label" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" aria-label="Aria label">
 </div>"
 `;
 
@@ -59,7 +59,7 @@ exports[`FileUpload > renders with as correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </section>"
 `;
 
@@ -73,11 +73,11 @@ exports[`FileUpload > renders with class correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
-exports[`FileUpload > renders with default slot correctly 1`] = `"<div class="relative flex flex-col">Default slot<input type="file" accept="*" class="sr-only" tabindex="-1"></div>"`;
+exports[`FileUpload > renders with default slot correctly 1`] = `"<div class="relative flex flex-col">Default slot<input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*"></div>"`;
 
 exports[`FileUpload > renders with description correctly 1`] = `
 "<div class="relative flex flex-col">
@@ -89,7 +89,7 @@ exports[`FileUpload > renders with description correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -110,7 +110,7 @@ exports[`FileUpload > renders with description slot correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -124,7 +124,7 @@ exports[`FileUpload > renders with disabled correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" disabled="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" disabled="">
 </div>"
 `;
 
@@ -138,7 +138,7 @@ exports[`FileUpload > renders with disabled correctly 2`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" disabled="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" disabled="">
 </div>"
 `;
 
@@ -154,7 +154,7 @@ exports[`FileUpload > renders with file slot correctly 1`] = `
   </div>
   <div class="">
     <div class="text-xs gap-1.5 absolute inset-0 p-0">File slot</div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -173,7 +173,7 @@ exports[`FileUpload > renders with file-leading slot correctly 1`] = `
         <!--v-if-->
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button></div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -194,7 +194,7 @@ exports[`FileUpload > renders with file-name slot correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -215,7 +215,7 @@ exports[`FileUpload > renders with file-size slot correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -233,7 +233,7 @@ exports[`FileUpload > renders with file-trailing slot correctly 1`] = `
     <div class="text-xs gap-1.5 absolute inset-0 p-0"><span class="inline-flex items-center justify-center select-none align-middle bg-elevated text-base shrink-0 size-full rounded-lg"><img src="blob:mock-url-file.txt" width="32" height="32" class="h-full w-full rounded-[inherit] object-cover"></span>
       <div class="flex-col min-w-0 hidden"><span class="text-default truncate">file.txt</span><span class="text-muted truncate">0B</span></div>File trailing slot
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -254,7 +254,7 @@ exports[`FileUpload > renders with fileDelete correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -275,7 +275,7 @@ exports[`FileUpload > renders with fileDeleteIcon correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:trash shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -296,7 +296,7 @@ exports[`FileUpload > renders with fileIcon correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -310,7 +310,7 @@ exports[`FileUpload > renders with files slot correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <div class="">Files slot</div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <div class="">Files slot</div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -331,7 +331,7 @@ exports[`FileUpload > renders with files-bottom slot correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div>Files bottom slot<input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div>Files bottom slot<input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -351,7 +351,7 @@ exports[`FileUpload > renders with files-top slot correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -365,7 +365,7 @@ exports[`FileUpload > renders with icon correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -379,7 +379,7 @@ exports[`FileUpload > renders with id correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input id="id" type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" id="id" type="file" accept="*">
 </div>"
 `;
 
@@ -393,7 +393,7 @@ exports[`FileUpload > renders with label correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -414,7 +414,7 @@ exports[`FileUpload > renders with label slot correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -435,7 +435,7 @@ exports[`FileUpload > renders with layout grid correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -452,7 +452,7 @@ exports[`FileUpload > renders with layout grid multiple correctly 1`] = `
     </div>
     <!--v-if-->
   </div>
-  <!--v-if--><input type="file" accept="*" multiple="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" multiple="">
 </div>"
 `;
 
@@ -473,7 +473,7 @@ exports[`FileUpload > renders with layout list correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-5" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -494,7 +494,7 @@ exports[`FileUpload > renders with layout list multiple correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-5" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" multiple="" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" multiple="">
 </div>"
 `;
 
@@ -515,7 +515,7 @@ exports[`FileUpload > renders with leading slot correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -536,7 +536,7 @@ exports[`FileUpload > renders with modelValue correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -553,7 +553,7 @@ exports[`FileUpload > renders with multiple correctly 1`] = `
     </div>
     <!--v-if-->
   </div>
-  <!--v-if--><input type="file" accept="*" multiple="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" multiple="">
 </div>"
 `;
 
@@ -567,7 +567,7 @@ exports[`FileUpload > renders with name correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" name="name" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" name="name" accept="*">
 </div>"
 `;
 
@@ -581,7 +581,7 @@ exports[`FileUpload > renders with neutral color correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -598,7 +598,7 @@ exports[`FileUpload > renders with position inside correctly 1`] = `
     </div>
     <!--v-if-->
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -615,7 +615,7 @@ exports[`FileUpload > renders with position inside multiple correctly 1`] = `
     </div>
     <!--v-if-->
   </div>
-  <!--v-if--><input type="file" accept="*" multiple="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" multiple="">
 </div>"
 `;
 
@@ -636,7 +636,7 @@ exports[`FileUpload > renders with position outside correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -653,7 +653,7 @@ exports[`FileUpload > renders with position outside multiple correctly 1`] = `
     </div>
     <!--v-if-->
   </div>
-  <!--v-if--><input type="file" accept="*" multiple="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" multiple="">
 </div>"
 `;
 
@@ -667,7 +667,7 @@ exports[`FileUpload > renders with required correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" required="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" required="">
 </div>"
 `;
 
@@ -681,7 +681,7 @@ exports[`FileUpload > renders with required correctly 2`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" required="" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*" required="">
 </div>"
 `;
 
@@ -702,7 +702,7 @@ exports[`FileUpload > renders with size lg correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -720,7 +720,7 @@ exports[`FileUpload > renders with size lg variant button correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -741,7 +741,7 @@ exports[`FileUpload > renders with size md correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -759,7 +759,7 @@ exports[`FileUpload > renders with size md variant button correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -780,7 +780,7 @@ exports[`FileUpload > renders with size sm correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -798,7 +798,7 @@ exports[`FileUpload > renders with size sm variant button correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -819,7 +819,7 @@ exports[`FileUpload > renders with size xl correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -837,7 +837,7 @@ exports[`FileUpload > renders with size xl variant button correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -858,7 +858,7 @@ exports[`FileUpload > renders with size xs correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -876,7 +876,7 @@ exports[`FileUpload > renders with size xs variant button correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -890,7 +890,7 @@ exports[`FileUpload > renders with ui correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -911,7 +911,7 @@ exports[`FileUpload > renders with variant area correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -929,7 +929,7 @@ exports[`FileUpload > renders with variant button correctly 1`] = `
         <!--v-if--><span class="iconify i-lucide:x shrink-0 size-4" aria-hidden="true"></span>
       </button>
     </div>
-  </div><input type="file" accept="*" class="sr-only" tabindex="-1">
+  </div><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -943,7 +943,7 @@ exports[`FileUpload > renders without dropzone correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;
 
@@ -957,6 +957,6 @@ exports[`FileUpload > renders without interactive correctly 1`] = `
       <!--v-if-->
     </div>
   </div>
-  <!--v-if--><input type="file" accept="*" class="sr-only" tabindex="-1">
+  <!--v-if--><input data-hidden="" tabindex="-1" style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; word-wrap: normal; top: -1px; left: -1px;" type="file" accept="*">
 </div>"
 `;