import { defineStyleConfig } from '@chakra-ui/react';
import { mode } from '@chakra-ui/theme-tools';


const flexTheme = defineStyleConfig({
  variants: {
    '@menu': (props) => ({
      bg: mode('back.100', 'back.800')(props),
      color: mode('brand.900', 'brand.100')(props),
      borderRadius: 0,
      border: 0,
      _hover: { background: mode('back.300', 'back.600')(props) },
      _focus: { border: 'none' },
      fontSize: '20px',
    }),
  },
});

export default flexTheme;