import React from 'react'
import Image from 'next/image'
import styles from './styles.module.css'
import { Divider } from '../../../atoms'

interface CardProps {
  title: string
  description: string
  icon: string
}

export const Card: React.FC<CardProps> = ({ title, description, icon }) => {
  return (
        <div className={styles.card}>
            <Divider margin={20} />
            <div className={styles.icon}>
                {/* <Image
                    src={icon}
                    alt="Payment Icon"
                    objectFit='cover'
                    width={100}
                    height={100}
                /> */}
            </div>
            <Divider margin={20} />
            <h2 className={styles.title}>
                {title}
            </h2>
            <Divider margin={20} />
            <p className={styles.description}>{description}</p>
        </div>
  )
}