Don’t allow not to be used with variants that have siblings

Author: thecrypticace

packages/tailwindcss/src/compile.ts

@@ -219,6 +219,15 @@ export function applyVariant(
     let result = applyVariant(isolatedNode, variant.variant, variants, depth + 1)
     if (result === null) return null
 
+    if (variant.root === 'not' && isolatedNode.nodes.length > 1) {
+      // The `not` variant cannot negate sibling rules / at-rules because these
+      // are an OR relationship. Doing so would require transforming sibling
+      // nodes into nesting while negating them. This isn't possible with the
+      // current implementation of the `not` variant or with how variants are
+      // applied in general (on a per-node basis).
+      return null
+    }
+
     for (let child of isolatedNode.nodes) {
       // Only some variants wrap children in rules. For example, the `force`
       // variant is a noop on the AST. And the `has` variant modifies the

packages/tailwindcss/src/variants.test.ts

@@ -1644,6 +1644,30 @@ test('not', async () => {
             }
           }
         }
+        @custom-variant parallel-style-rules {
+          &:hover {
+            @slot;
+          }
+          &:focus {
+            @slot;
+          }
+        }
+        @custom-variant parallel-at-rules {
+          @media foo {
+            @slot;
+          }
+          @media bar {
+            @slot;
+          }
+        }
+        @custom-variant parallel-mixed-rules {
+          &:hover {
+            @slot;
+          }
+          @media bar {
+            @slot;
+          }
+        }
         @tailwind utilities;
       `,
       [
@@ -1660,6 +1684,10 @@ test('not', async () => {
         'not-multiple-media-conditions:flex',
         'not-starting:flex',
 
+        'not-parallel-style-rules:flex',
+        'not-parallel-at-rules:flex',
+        'not-parallel-mixed-rules:flex',
+
         // The following built-in variants don't have not-* versions because
         // there is no sensible negative version of them.