import makeStyles from '@mui/styles/makeStyles';
import type { Theme } from '../../@styles/theme-provider';

const createClasses = makeStyles<Theme>(theme => ({
  root: {
    '& .MuiFormControlLabel-label': {
      ...theme.typography.body2
    }
  },
  error: {
    '&.MuiButtonBase-root:not(.Mui-disabled)': {
      '& > div': {
        borderColor: theme.palette.error[500],
        '& .injected-svg': {
          fill: theme.palette.error[500]
        }
      },
      '&.Mui-checked:not(.MuiCheckbox-indeterminate) > div': {
        borderColor: theme.palette.secondary[200],
        backgroundColor: theme.palette.error.main
      },
      '&:hover > div': {
        borderColor: theme.palette.error[600]
      }
    },
    '&.MuiFormControlLabel-label': {
      color: theme.palette.error[500]
    }
  }
}));

export default createClasses;