import type React from "react"
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
import { IoBulb } from "react-icons/io5"

interface FeatureCardProps {
  icon?: React.ReactNode
  title: string
  description: string
  className?: string
}

export function FeatureCard({
  icon = <IoBulb className="h-6 w-6" />,
  title = "Feature Title",
  description = "This is a description of the feature and what it does for users.",
  className,
}: FeatureCardProps) {
  return (
    <Card className={className}>
      <CardHeader>
        <div className="flex items-center gap-2">
          <div className="rounded-md bg-primary/10 p-2 text-primary">{icon}</div>
          <CardTitle>{title}</CardTitle>
        </div>
      </CardHeader>
      <CardContent>
        <CardDescription className="text-base">{description}</CardDescription>
      </CardContent>
    </Card>
  )
}