interface Props {
  icon?: string
  title: string
  description?: string
}

export function EmptyState({ icon = '🍰', title, description }: Props) {
  return (
    <div className="flex flex-col items-center justify-center py-16 text-center">
      <span className="text-5xl mb-4">{icon}</span>
      <h3 className="font-display text-xl text-espresso mb-2">{title}</h3>
      {description && <p className="text-warm-grey text-sm">{description}</p>}
    </div>
  )
}
