import type { Theme } from '@mui/material';
import type { Components } from '@mui/material/styles';

export default function MuiAccordion(theme: Theme): Components['MuiAccordion'] {
  const borderColor = theme.palette.shades[300];

  return {
    defaultProps: {
      square: true,
      disableGutters: true,
    },
    styleOverrides: {
      root: {
        width: '100%',
        border: `1px solid ${borderColor}`,
        borderTop: 0,

        '&:before': {
          display: 'none',
        },
        '&:first-of-type': {
          borderTop: `1px solid ${borderColor}`,
          borderTopLeftRadius: theme.shape.borderRadius,
          borderTopRightRadius: theme.shape.borderRadius,
        },
        '&:last-of-type': {
          borderTop: `1px solid ${borderColor}`,
          borderBottomLeftRadius: theme.shape.borderRadius,
          borderBottomRightRadius: theme.shape.borderRadius,
        },
      },
    },
  };
}
