add bank card validation

src/app/ui/inputs/bank-card-inpit.tsx

@@ -3,16 +3,16 @@
 import { useState, ChangeEvent, useEffect } from 'react';
 import { InputMask, format } from '@react-input/mask';
 import styles from '@/app/styles/module/login.module.scss';
-import { PayoutMethods } from '@/app/actions/referralsActions';
 
 interface BankCardProps {
 	bankCardState: string | undefined;
 	validateHandler: (e: ChangeEvent<HTMLInputElement>) => void;
 	clearCondition?: string | undefined | null;
 	disabled: boolean;
+	isValid: boolean | undefined;
 }
 
-export default function BankCardInput({ bankCardState, validateHandler, disabled }: BankCardProps) {
+export default function BankCardInput({ bankCardState, validateHandler, disabled, isValid }: BankCardProps) {
 	const [bankCard, setBankCard] = useState<string | undefined>('');
 
 	useEffect(() => {
@@ -37,7 +37,7 @@ export default function BankCardInput({ bankCardState, validateHandler, disabled
 			type="phone"
 			id="bankCard"
 			name="bankCard"
-			className={`${styles['form-input']}`}
+			className={`${styles['form-input']} ${isValid ? styles['valid-card'] : ''}`}
 			mask="____ ____ ____ ____"
 			replacement={{ _: /\d/ }}
 			value={bankCard}