import Card from '@mui/material/Card';
import { styled } from '@mui/material/styles';
import CardMedia from '@mui/material/CardMedia';
import CardContent from '@mui/material/CardContent';
import Layout from './Centered';
import Logo from '../components/Logo';

const PREFIX = 'CommonConfirm';

const classes = {
  wrapper: `${PREFIX}-wrapper`
};

const StyledLayout = styled(Layout)((
  {
    theme
  }
) => ({
  [`& .${classes.wrapper}`]: {
    padding: theme.spacing(0, 8 ),
    '&:last-child': {
      paddingBottom: theme.spacing(12),
    },
  }
}));

const CommonConfirm = ({children}) => {


  return (
    <StyledLayout displayMenu={false}>
      <Card>
        <CardMedia component={Logo} />
        <CardContent className={classes.wrapper}>
          {children}
        </CardContent>
      </Card>
    </StyledLayout>
  );
};

export default CommonConfirm;