import { Paper, type SxProps, type Theme } from '@mui/material';
import { type PropsWithChildren } from 'react';

export interface AuthenticationCardProps extends PropsWithChildren {
  sx?: SxProps<Theme>;
}

export const AuthenticationCard = ({
  children,
  sx,
}: AuthenticationCardProps) => {
  return (
    <Paper
      elevation={0}
      sx={{
        borderRadius: 2,
        p: {
          xs: 3,
          md: 6,
        },
        mx: 2,
        boxSizing: 'border-box',
        maxWidth: 636,

        ...sx,
      }}
    >
      {children}
    </Paper>
  );
};
