import React from "react";
import { View } from "react-native";

export default function MarketplaceCardSkeleton() {
  return (
    <View className="bg-white rounded-[32px] overflow-hidden border border-slate-100 shadow-sm mb-6 pb-6">
      {/* Image Skeleton */}
      <View className="relative h-[220px] bg-slate-100" />
      
      {/* Content Skeleton */}
      <View className="p-6 pt-10">
        {/* Title Skeleton */}
        <View className="h-6 bg-slate-100 rounded-md w-3/4 mb-4" />
        
        {/* Stats Grid Skeleton */}
        <View className="flex-row gap-3 mb-6">
           <View className="flex-1 h-32 p-3.5 rounded-2xl bg-slate-50 border border-slate-100" />
           <View className="flex-1 h-32 p-3.5 rounded-2xl bg-slate-50 border border-slate-100" />
        </View>

        {/* Footer Skeleton */}
        <View className="flex-row items-center justify-between">
           <View className="flex-row items-center gap-3">
              <View className="w-10 h-10 rounded-full bg-slate-100" />
              <View>
                 <View className="h-2 bg-slate-100 rounded-sm w-12 mb-2" />
                 <View className="h-3 bg-slate-100 rounded-sm w-20" />
              </View>
           </View>
           
           <View className="w-24 h-12 rounded-2xl bg-slate-100" />
        </View>
      </View>
    </View>
  );
}
