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

export const getStyles = (colors: any) =>
  StyleSheet.create({
    container: {
      flexDirection: 'row',
      marginVertical: 12,
      gap: 12,
    },
    chip: {
      flex: 1,
      paddingVertical: 12,
      borderWidth: 1.5,
      borderColor: colors.border,
      borderRadius: borderRadius.md,
      backgroundColor: colors.chipInactive,
      alignItems: 'center',
      justifyContent: 'center',
    },
    chipActive: {
      backgroundColor: colors.chipActive,
      borderColor: colors.chipBorder,
    },
    label: {
      fontSize: typography.fontSize.sm,
      fontWeight: typography.fontWeight.medium,
      color: colors.textSecondary,
    },
    labelActive: {
      color: colors.primary,
      fontWeight: typography.fontWeight.semibold,
    },
  });