How to detect if <html> tag has a class in child Angular component

I have a dynamic class which is applied on html tag when user presses the button to switch view to dark mode: <html lang="en" class="app-dark-theme">

Now in child Angular component I need to check if this class exists on html tag to style one particular class in this child component.

How can I achive this? I tried :has() pseudo-selector but it didn't work for me.

html:has(.app-dark-theme) {
.test-class {
border: 1px solid var(--p-blue-200);
}
}


Prefferable solution is pure CSS/SCSS if possible.

Thanks.

Continue reading...