Changing styles inside shadow-root

[Jeremiah]

I have this problem of changing font styling inside this shadow root. I need to change stuff inside that popup. And yeah also because this is a shopify app I can not edit its HTML so I have to use JS, CSS etc.

Screnshot of the popup + dom

I tried waiting for the shadow root to open, searched about it a lot but no real results so far (I even tried solutions from stackoverflow). Any help would be greatly appreciated.

And yeah I also forgot to mention that most of the stuff in the shadow root appears after around 5 seconds of the page load because it is a popup.

Here is dom before and after pop loads

Before popup loads

After popup loads

 

[VBService]

Check this: What is shadow root and how to use it ?

 

[alexcray]

Check this: What is shadow root and how to use it ?

Styles and scripts defined within the shadow root are scoped to that specific tree, preventing unintended side effects on the rest of the page. This allows for greater flexibility and customization within individual components.