export function Skeleton({ className = '' }: { className?: string }) {
  return <div className={`animate-pulse bg-sand/50 rounded-xl ${className}`} />
}

export function RecipeCardSkeleton() {
  return (
    <div className="bg-surface rounded-2xl overflow-hidden shadow-sm">
      <Skeleton className="w-full h-48 rounded-none" />
      <div className="p-3 space-y-2">
        <Skeleton className="h-5 w-3/4" />
        <Skeleton className="h-4 w-1/2" />
      </div>
    </div>
  )
}
