import React, { type PropsWithChildren } from 'react';
import { Box, Paper } from '@mui/material';

interface ConfigurationFormContainerProps extends PropsWithChildren {
  className?: string;
}

export function ConfigurationFormContainer({ children, className }: ConfigurationFormContainerProps) {
  return (
    <Paper
      elevation={0}
      sx={{
        p: 3,
        backgroundColor: 'transparent',
        border: 'none',
        boxShadow: 'none',
      }}
      className={className}
    >
      {children}
    </Paper>
  );
}

export function MainContainer({ children }: PropsWithChildren) {
  return (
    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
      {children}
    </Box>
  );
}