Loosen :is() wrapping rules in applyImportantSelector for more readable output. (#13900)

src/util/applyImportantSelector.js

@@ -5,13 +5,12 @@ export function applyImportantSelector(selector, important) {
   let sel = parser().astSync(selector)
 
   sel.each((sel) => {
-    // Wrap with :is if it's not already wrapped
-    let isWrapped =
-      sel.nodes[0].type === 'pseudo' &&
-      sel.nodes[0].value === ':is' &&
-      sel.nodes.every((node) => node.type !== 'combinator')
+    // For nesting, we only need to wrap a selector with :is() if it has a top-level combinator,
+    // e.g. `.dark .text-white`, to be independent of DOM order. Any other selector, including
+    // combinators inside of pseudos like `:where()`, are ok to nest.
+    let shouldWrap = sel.nodes.some((node) => node.type === 'combinator')
 
-    if (!isWrapped) {
+    if (shouldWrap) {
       sel.nodes = [
         parser.pseudo({
           value: ':is',