From 2cab5475ce43e11eae82aed94fc0bff458ac6bcf Mon Sep 17 00:00:00 2001
From: Kartik Labhshetwar <kartik.labhshetwar@gmail.com>
Date: Fri, 19 Dec 2025 18:38:28 +0530
Subject: [PATCH] fix: improve CustomEmailTextField styling and focus behavior
 (#26024)

---
 apps/web/components/settings/CustomEmailTextField.tsx | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/apps/web/components/settings/CustomEmailTextField.tsx b/apps/web/components/settings/CustomEmailTextField.tsx
index e4311af294..2dbb99048f 100644
--- a/apps/web/components/settings/CustomEmailTextField.tsx
+++ b/apps/web/components/settings/CustomEmailTextField.tsx
@@ -44,12 +44,14 @@ const CustomEmailTextField = ({
   return (
     <>
       <div
-        className={`border-default mt-2 flex w-full items-center rounded-[10px] border ${
-          inputFocus ? "ring-brand-default border-neutral-300 ring-2" : ""
+        className={`mt-2 flex w-full items-center rounded-[10px] border transition-all ${
+          inputFocus
+            ? "border-emphasis shadow-outline-gray-focused"
+            : "border-default hover:border-emphasis shadow-outline-gray-rested"
         }`}>
         <Input
           {...formMethods.register(formMethodFieldName)}
-          className="focus:ring-none! focus:shadow-none! flex-1 border-none bg-transparent px-3 py-1.5 text-sm outline-none"
+          className="ring-0 focus:ring-0 focus:shadow-none! flex-1 border-none bg-transparent px-3 py-1.5 text-sm outline-none"
           data-testid={dataTestId}
           onFocus={() => setInputFocus(true)}
           onBlur={() => setInputFocus(false)}