On mobile device can't click inside items of modal if multiple are open

[CyberCowboy404]

Environment

• Operating System: Darwin
• Node Version: v20.9.0
• Nuxt Version: 3.11.2
• CLI Version: 3.11.1
• Nitro Version: 2.9.6
• Package Manager: pnpm@9.0.0
• Builder: -
• User Config: app, runtimeConfig, stripe, devtools, modules, gtag, supabase, imports, i18n, colorMode, vue, vite
• Runtime Modules: @nuxtjs/i18n@8.3.1, @nuxtjs/supabase@1.2.1, @nuxt/ui@2.15.2, nuxt-svgo@4.0.0, nuxt-lodash@2.5.3, nuxt-gtag@2.0.5, @nuxtjs/google-fonts@3.2.0, @pinia/nuxt@0.5.1, @pinia-plugin-persistedstate/nuxt@1.2.0, @nuxt/image@1.6.0, @vueuse/nuxt@10.9.0, @unlok-co/nuxt-stripe@3.0.0
• Build Modules: -

Version

2.15.2

Reproduction

https://stackblitz.com/edit/nuxt-ui-pqemsg?file=app.vue

Description

Weird behavior with modals on mobile devices(with tap event) When I have modal opened with prevent-close attr, I cannot click anything inside modal. In element inspection I notice that touch-action: auto; adds to clicked elements.

Initially I noticed this bug on my project. By default I have modal opened on the page with prevent close attr, and when I opened another modal, on mobile devices the actions inside second modal were blocked. But during creation of reproduction, I've noticed that button don't respond even in the first modal(on mobile device)

I was able to fix it(in my project), by closing the first modal. But it's weird because on desktops everything works fine

Additional context

No response

Logs

No response