diff --git a/src/app/_components/admin/CreateCountryForm.tsx b/src/app/_components/admin/CreateCountryForm.tsx
index 2b72471..086509a 100644
--- a/src/app/_components/admin/CreateCountryForm.tsx
+++ b/src/app/_components/admin/CreateCountryForm.tsx
@@ -22,20 +22,24 @@ export default function CreateCountryForm() {
     }
   }, [formState.message]);
   return (
-    <form action={formAction} className="flex flex-col gap-2">
-      <Input
-        name="name"
-        id="name"
-        className={clsx({ "border-red-500": formState.errors?.name })}
-      />
-      {formState.message === "success" ? (
-        <Check className="text-green-400" />
-      ) : (
-        <div className="flex items-center gap-2">
-          <CircleX className="text-red-600" />
-          <span>{formState.errors?.name}</span>{" "}
-        </div>
-      )}
+    <form ref={formRef} action={formAction} className="flex flex-col gap-2">
+      <div className="flex items-center gap-2">
+        <Input
+          name="name"
+          id="name"
+          className={clsx({ "border-red-500": formState.errors?.name })}
+        />
+        {formState.message === "success" ? (
+          <Check className="text-green-500" />
+        ) : (
+          ""
+        )}
+        {formState.message === "error" ? (
+          <CircleX className="text-red-500" />
+        ) : (
+          ""
+        )}
+      </div>
       <SubmitButton text={"Country"} />
     </form>
   );