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);