feat: style invalid input

src/components/Input.tsx

@@ -24,12 +24,16 @@ export function Input({
   return (
     <FormControl w="$full" mb="$4" isInvalid={invalid}>
       <GSInput
+        isInvalid={invalid}
         h="$14"
         borderColor="$gray700"
         borderWidth="$1"
         borderRadius="$md"
         $focus={{
-          borderColor: '$green500',
+          borderColor: invalid ? '$red500' : '$green500',
+        }}
+        $invalid={{
+          borderColor: '$red500',
         }}
         isReadOnly={isReadOnly}
         opacity={isReadOnly ? 0.5 : 1}>