[Bug Report][3.6.8] v-overlay-container problem with Shadow DOM.

[joelmandell]

Environment

Vuetify Version: 3.6.8
Vue Version: 3.4.27
Browsers: Safari 17.5
OS: Mac OS 10.15.7

Steps to reproduce

If you run an http-server in the folder repro you can find the thing that is not working.
We use bootstrap in an ASP.NET MVC Web app. But the CSS interferes between vuetify and bootstrap. I have partly solved it by mounting it on shadow dom.

Expected Behavior

Expect v-overlay-container to be attached in the shadow dom so it would work with css isolation.

Actual Behavior

The v-overlay-container is attached to document.body instead. And you can find the items for v-select below on the page when you scroll down after clicking v-select.

Reproduction Link

https://github.com/joelmandell/shadow_dom

Other comments

I might fix an PR for this if I find the time and can find out why it behaves like this.
For the moment this is a show stopper of our usage and progressive migration over to vuetify 3.
We need it to work in shadow dom.

[joelmandell]

So in the main.js file the app is mounted to the Shadow DOM and the built css-file is added to it as well...