CSS theme(): Add unit test that combines CSS variable syntax with opacity modifier (#14323)

This PR adds a new test case to the branches that test the CSS `theme()`
function with the CSS variable syntax. The new case includes an opacity
modifier and ensures that the opacity is properly added.

Author: philipp-spiess

packages/tailwindcss/src/functions.test.ts

@@ -433,6 +433,28 @@ describe('theme function', () => {
           }"
         `)
       })
+
+      test('theme(--color-red-500 / 50%)', async () => {
+        expect(
+          await compileCss(css`
+            @theme {
+              --color-red-500: #f00;
+            }
+            .red {
+              color: theme(--color-red-500 / 50%);
+            }
+          `),
+        ).toMatchInlineSnapshot(`
+          ":root {
+            --color-red-500: red;
+          }
+
+          .red {
+            color: #ff000080;
+          }"
+        `)
+      })
+
       test('theme("--color-red-500")', async () => {
         expect(
           await compileCss(css`