// components/CatalogCardSkeletonSmall.tsx
export default function CatalogCardSkeletonSmall() {
  return (
    <div className="relative w-50 h-87.5 overflow-hidden rounded-2xl bg-[#17161679] border border-white/10 animate-pulse">
      <div className="flex flex-col h-full p-4 gap-3">
        
        {/* Title skeleton */}
        <div className="space-y-2">
          <div className="h-5 bg-white/10 rounded-md w-3/4" />
          <div className="h-5 bg-white/10 rounded-md w-1/2" />
        </div>

        {/* Image skeleton */}
        <div className="flex-1 rounded-xl bg-linear-to-br from-[#444242] to-gray-900/50 border border-white/5 flex items-center justify-center">
          <div className="w-20 h-20 bg-white/5 rounded-lg" />
        </div>
      </div>

      {/* Shimmer */}
      <div className="absolute inset-0 -translate-x-full animate-shimmer bg-linear-to-r from-transparent via-white/5 to-transparent" />
    </div>
  );
}
