import { AuraCard } from './AuraCard';

export const UpsellCard = ({
  className,
  title,
  description,
  button,
  ...props
}: {
  className?: string;
  title: string;
  description: string;
  button: React.ReactNode;
  auraImage?: string;
}) => {
  return (
    <AuraCard className={className} auraImage={props.auraImage}>
      <div className='flex flex-col gap-3'>
        <div className='relative z-10 flex flex-col gap-1'>
          <h3 className='text-sm font-medium text-foreground-primary/90'>
            {title}
          </h3>
          <p className='text-xs text-foreground-secondary'>{description}</p>
        </div>
        {button}
      </div>
    </AuraCard>
  );
};
