fix(ui): render Select arrow independently of icon CSS

packages/ui/test/ui.test.ts

@@ -1372,6 +1372,26 @@ test("basic fields suppress native popups and render package constraint messages
   expect(selectSource).toContain("wrn-next__select-indicator");
 });
 
+test("Select renders its own directional indicator without app icon CSS", async () => {
+  const source = readFileSync(uiComponentPath("Select"), "utf8");
+  const dom = mountHtml(
+    await renderComponent(source, {
+      name: "method",
+      value: "totp",
+      options: [{ label: "Authenticator app", value: "totp" }],
+    }),
+  );
+  const indicator = dom.querySelector("svg.wrn-next__select-indicator");
+  expect(indicator?.getAttribute("width")).toBe("16");
+  expect(indicator?.getAttribute("height")).toBe("16");
+  expect(indicator?.getAttribute("aria-hidden")).toBe("true");
+  expect(indicator?.querySelector("path")?.getAttribute("d")).toBe("m6 9 6 6 6-6");
+  expect(source).toContain("inset-inline-end: 0.85rem");
+  expect(source).not.toContain("icon-[lucide--chevron-down]");
+  const multiple = mountHtml(await renderComponent(source, { multiple: true }));
+  expect(multiple.querySelector(".wrn-next__select-indicator")).toBeNull();
+});
+
 test("OTP inputs accept six digits and show custom inline errors without native popups", async () => {
   const source = readFileSync(uiComponentPath("Input"), "utf8");
   const dom = mountHtml(