import React from 'react';
import { Section, Text } from '@react-email/components';
import { theme } from '../theme';

interface CardProps {
  children: React.ReactNode;
}

export const Card = ({ children }: CardProps) => {
  return (
    <Section
      style={{
        backgroundColor: theme.colors.accentLightest,
        borderRadius: '8px',
        padding: theme.spacing.md,
        margin: `${theme.spacing.md} 0`,
        border: `1px solid ${theme.colors.accentLight}`,
      }}
    >
      {children}
    </Section>
  );
};