regression: red and green color backgrounds (#8456)

packages/ui/src/form-fields/password/helper.tsx

@@ -54,11 +54,11 @@ export const getFragmentColor = (fragmentIndex: number, activeFragments: number)
 
   switch (activeFragments) {
     case 1:
-      return "bg-red-500";
+      return "bg-danger-primary";
     case 2:
       return "bg-orange-500";
     case 3:
-      return "bg-green-500";
+      return "bg-success-primary";
     default:
       return "bg-layer-1";
   }

packages/ui/src/form-fields/textarea.tsx

@@ -47,7 +47,7 @@ const TextArea = React.forwardRef(function TextArea(
           "px-3 py-2": textAreaSize === "sm",
           "p-3": textAreaSize === "md",
           "border-danger-strong": hasError,
-          "bg-red-100": hasError && mode === "primary",
+          "bg-danger-subtle": hasError && mode === "primary",
         },
         className
       )}