refactor(ui): replace hardcoded colors with semantic tokens (#2749)

packages/ui/primitives/form/form-error-message.tsx

@@ -38,7 +38,7 @@ export const FormErrorMessage = ({ error, className }: FormErrorMessageProps) =>
             opacity: 0,
             y: 10,
           }}
-          className={cn('text-red-500 text-xs', className)}
+          className={cn('text-destructive text-xs', className)}
         >
           {errorMessage}
         </motion.p>

packages/ui/primitives/form/form.tsx

@@ -156,7 +156,7 @@ const FormMessage = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<
             y: 10,
           }}
         >
-          <p ref={ref} id={formMessageId} className={cn('text-red-500 text-xs', className)} {...props}>
+          <p ref={ref} id={formMessageId} className={cn('text-destructive text-xs', className)} {...props}>
             {body}
           </p>
         </motion.div>