Fix - Front-end form inputs show a double border on focus (themegrill/user-registration-pro#1896)

assets/css/user-registration.scss

@@ -4023,6 +4023,13 @@ body.user-registration-page {
 		outline-offset: 2px;
 	}
 
+	// Bordered fields already turn the border primary on focus; no gap keeps it one ring.
+	input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="image"]):focus-visible,
+	textarea:focus-visible,
+	select:focus-visible {
+		outline-offset: 0;
+	}
+
 	input[type="radio"]:focus-visible,
 	input[type="checkbox"]:focus-visible {
 		outline-style: auto !important;

tests/e2e/specs/login-forms.spec.ts

@@ -113,6 +113,30 @@ test.describe("login methods @fresh", () => {
     ).toHaveCSS("outline-style", "solid");
     await visitor.close();
   });
+
+  /**
+   * @area    login-forms
+   * @tier    fresh
+   * @guards  #1896
+   * @source  verify-fix 2026-10-08
+   * @why     A focused login field showed its primary border and, 2px outside it,
+   *          the focus ring, which read as a double border. The ring now sits
+   *          flush against the border on bordered fields while the submit button
+   *          keeps its gap. Asserts only that offset, not the ring's colour.
+   */
+  test("a focused login field has no gap between its border and focus ring @fresh @login-forms", async ({ browser }) => {
+    const visitor = await newVisitor(browser);
+    const guest = await visitor.newPage();
+    await guest.goto("/my-account/");
+
+    await guest.locator("#username").focus();
+    await expect(guest.locator("#username")).toHaveCSS("outline-offset", "0px");
+
+    const submit = guest.locator(".ur-frontend-form button[type=submit], .ur-frontend-form .ur-submit-button").first();
+    await submit.focus();
+    await expect(submit).not.toHaveCSS("outline-offset", "0px");
+    await visitor.close();
+  });
 });
 
 /**