import {ThemeProvider} from '@mui/material';
import {createTheme} from '@mui/material';

export default function CustomThemeProvider({children}) {
  console.log('theme', theme);
  return <ThemeProvider theme={theme}>
    { children }
  </ThemeProvider>;
}

const themeOptions = {
  palette: {
    mode: 'light',
    primary: {
      main: '#0b0b14',
    },
    secondary: {
      main: '#9c27b0',
    },
  },
  overrides: {
    MuiAppBar: {
      colorInherit: {
        backgroundColor: '#689f38',
        color: '#fff',
      },
    },
    MuiButton: {
      root: {
        background: 'linear-gradient(45deg, #FE6B8B 30%, #FF8E53 90%)',
        border: 0,
        borderRadius: 3,
        boxShadow: '0 3px 5px 2px rgba(255, 105, 135, .3)',
        color: 'white',
        height: 48,
        padding: '0 30px',
      },
    },
  },
};


const theme = createTheme(themeOptions);