export function Loading() {
  return (
    <div className="flex items-center justify-center p-8 min-h-[200px]">
      <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-turo-accent" />
    </div>
  );
}

export function LoadingSkeleton() {
  return (
    <div className="animate-pulse space-y-4 p-4">
      <div className="h-4 bg-gray-200 rounded w-3/4" />
      <div className="h-4 bg-gray-200 rounded w-1/2" />
      <div className="h-4 bg-gray-200 rounded w-5/6" />
    </div>
  );
}

export function CardSkeleton() {
  return (
    <div className="animate-pulse border rounded-lg p-6 space-y-4">
      <div className="h-48 bg-gray-200 rounded" />
      <div className="space-y-2">
        <div className="h-4 bg-gray-200 rounded w-3/4" />
        <div className="h-4 bg-gray-200 rounded w-1/2" />
      </div>
    </div>
  );
}