import { StyleSheet } from 'react-native';
import { typography, borderRadius } from '@theme';

export const getStyles = (colors: any) =>
  StyleSheet.create({
    container: {
      flexDirection: 'row',
      justifyContent: 'space-between',
      width: '100%',
      paddingHorizontal: 10,
      marginVertical: 20,
    },
    inputContainer: {
      width: 45,
      height: 50,
      borderWidth: 1.5,
      borderColor: colors.border,
      borderRadius: borderRadius.sm,
      backgroundColor: colors.inputBg,
      justifyContent: 'center',
      alignItems: 'center',
    },
    inputActive: {
      borderColor: colors.primary,
      backgroundColor: colors.background,
    },
    inputError: {
      borderColor: colors.error,
    },
    inputText: {
      fontSize: typography.fontSize.lg,
      fontWeight: typography.fontWeight.bold,
      color: colors.text,
      textAlign: 'center',
    },
  });