Fix select dropdown hidden behind dialogs

e2e/create-agent-dropdown.spec.ts

@@ -0,0 +1,34 @@
+import { test, expect } from "@playwright/test";
+import { loadApp } from "./helpers";
+
+test.describe("Create agent dialog", () => {
+  test("agent type dropdown opens and allows selection", async ({ page }) => {
+    await loadApp(page);
+
+    // Open the create dialog
+    await page.getByTestId("create-agent-button").click();
+    const form = page.getByTestId("create-agent-form");
+    await expect(form).toBeVisible();
+
+    // The type select should default to "Codex"
+    const typeTrigger = form.getByRole("combobox").first();
+    await expect(typeTrigger).toContainText("Codex");
+
+    // Click to open the dropdown
+    await typeTrigger.click();
+
+    // The dropdown options should be visible
+    const claudeOption = page.getByRole("option", { name: "Claude" });
+    await expect(claudeOption).toBeVisible({ timeout: 3_000 });
+
+    // Select "Claude"
+    await claudeOption.click();
+
+    // The trigger should now show "Claude"
+    await expect(typeTrigger).toContainText("Claude");
+
+    // Close dialog
+    await page.getByTestId("create-agent-cancel").click();
+    await expect(form).not.toBeVisible({ timeout: 3_000 });
+  });
+});

web/src/components/ui/select.tsx

@@ -68,7 +68,7 @@ const SelectContent = React.forwardRef<
     <SelectPrimitive.Content
       ref={ref}
       className={cn(
-        "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border border-border bg-card text-card-foreground shadow-xl",
+        "relative z-[80] max-h-96 min-w-[8rem] overflow-hidden rounded-md border border-border bg-card text-card-foreground shadow-xl",
         "data-[state=open]:animate-in data-[state=closed]:animate-out",
         "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
         "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",