export default function Loading() {
  return (
    <div className="min-h-screen">
      <div className="fixed inset-0 -z-10">
        <div className="absolute inset-0 bg-[radial-gradient(ellipse_80%_50%_at_50%_-20%,rgba(16,185,129,0.12),transparent)]" />
        <div className="absolute inset-0 bg-zinc-950" style={{ zIndex: -1 }} />
      </div>

      <div className="max-w-6xl mx-auto px-4 sm:px-6 py-8 sm:py-12 animate-pulse">
        {/* Header skeleton */}
        <div className="flex items-center gap-3 mb-10">
          <div className="w-10 h-10 rounded-xl bg-zinc-800" />
          <div>
            <div className="h-6 w-40 rounded bg-zinc-800 mb-1.5" />
            <div className="h-4 w-64 rounded bg-zinc-900" />
          </div>
        </div>

        {/* Stats skeleton */}
        <div className="grid grid-cols-2 sm:grid-cols-4 gap-3 mb-8">
          {Array.from({ length: 4 }).map((_, i) => (
            <div
              key={i}
              className="rounded-xl border border-zinc-800/80 bg-zinc-900/60 p-4"
            >
              <div className="h-3 w-16 rounded bg-zinc-800 mb-2" />
              <div className="h-7 w-10 rounded bg-zinc-800" />
            </div>
          ))}
        </div>

        {/* Search skeleton */}
        <div className="h-10 rounded-xl bg-zinc-900 border border-zinc-800 mb-6" />

        {/* Card skeletons */}
        <div className="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
          {Array.from({ length: 6 }).map((_, i) => (
            <div
              key={i}
              className="rounded-xl border border-zinc-800/80 bg-zinc-900/60 p-5"
            >
              <div className="flex items-center gap-2.5 mb-3">
                <div className="w-8 h-8 rounded-lg bg-zinc-800" />
                <div className="h-5 w-32 rounded bg-zinc-800" />
              </div>
              <div className="h-4 w-48 rounded bg-zinc-800/60 mb-3" />
              <div className="pt-3 border-t border-zinc-800/50">
                <div className="h-3 w-20 rounded bg-zinc-800/40" />
              </div>
            </div>
          ))}
        </div>
      </div>
    </div>
  );
}