import { createTheme } from '@mui/material'

export const theme = createTheme({
  palette: {
    mode: 'light',
    background: {
      default: '#f7f4ee',
      paper: '#fffaf2',
    },
    text: {
      primary: '#1f1a26',
      secondary: '#5a5166',
    },
    primary: {
      main: '#9a2d2b',
      contrastText: '#fdf7ee',
    },
    secondary: {
      main: '#2d4c7c',
    },
  },
  typography: {
    fontFamily:
      '"Noto Serif JP", "Noto Serif CJK SC", "Hiragino Mincho ProN", "Yu Mincho", "Songti SC", serif',
    h1: {
      fontSize: '2.75rem',
      fontWeight: 600,
    },
    h2: {
      fontSize: '1.75rem',
      fontWeight: 600,
    },
  },
  shape: {
    borderRadius: 12,
  },
  components: {
    MuiAppBar: {
      styleOverrides: {
        colorPrimary: {
          backgroundColor: '#1f1a26',
        },
      },
    },
  },
})
