import { Skeleton } from "@/components/ui/skeleton";

// Kendi loading dosyası olmayan tüm rotalar için genel sayfa iskeleti:
// spinner yerine başlık, metin ve kart bloklarının yer tutucuları —
// içerik gelince zıplama olmaz.
export default function Loading() {
  return (
    <main aria-live="polite" className="mx-auto w-full max-w-6xl px-4 py-12">
      {/* Rozet + başlık + alt metin */}
      <Skeleton className="h-6 w-44 rounded-full" />
      <Skeleton className="mt-5 h-10 w-3/4 max-w-2xl" />
      <Skeleton className="mt-3 h-10 w-1/2 max-w-md" />
      <Skeleton className="mt-5 h-5 w-2/3 max-w-lg" />
      <Skeleton className="mt-2 h-5 w-1/2 max-w-sm" />

      {/* Form / aksiyon şeridi */}
      <div className="mt-8 flex max-w-xl flex-col gap-3 sm:flex-row">
        <Skeleton className="h-12 flex-1 rounded-lg" />
        <Skeleton className="h-12 w-full rounded-lg sm:w-44" />
      </div>

      {/* Kart bloklar */}
      <div className="mt-14 grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
        {Array.from({ length: 3 }).map((_, i) => (
          <Skeleton key={i} className="h-40 w-full rounded-2xl" />
        ))}
      </div>
    </main>
  );
}