[v4] Expose CSS properties also to :host

[lubomirblazekcz]

What version of Tailwind CSS are you using?

For example: v4.0.0-alpha.21

Describe your issue

Currently the @theme CSS properties are exposed to :root, which is great but it would be also good to expose it to :host, like this :root, :host {}. This way the CSS properties are also available in web components.

Lets say you have a widget as web component <custom-widget></custom-widget> and inside there is CSS and tailwindcss classes in shadowroot, :root will not work - in this scenario the :host is the :root for the web component.

Eg. how it's done in Winduum here - https://github.com/winduum/winduum/blob/next/src/base/theme/default.css

[KennethHoff]

Speaking of, you should probably like/post your feedback to this CSS proposal

w3c/csswg-drafts#11000