import { PageContainer } from "@/components/layout/page-container";
import { LoadingSkeleton } from "@/components/ui/loading-skeleton";

export default function RootLoading() {
  return (
    <PageContainer className="space-y-10 py-12">
      <div className="space-y-3">
        <LoadingSkeleton className="h-3 w-28" />
        <LoadingSkeleton className="h-10 w-full max-w-xl" />
        <LoadingSkeleton className="h-6 w-full max-w-3xl" />
      </div>
      <div className="grid gap-6 md:grid-cols-2 xl:grid-cols-3">
        {Array.from({ length: 6 }, (_, index) => (
          <LoadingSkeleton key={index} className="h-[24rem] w-full rounded-[1.5rem]" />
        ))}
      </div>
    </PageContainer>
  );
}