import Image from "next/image";
import Background from "@/public/background/space.webp";
import { UiProviders } from "./client";

export default function UiLayout({ children }: { children: React.ReactNode }) {
  return (
    <UiProviders>
      <div className="relative isolate min-h-svh overflow-x-clip text-foreground">
        <Image
          src={Background}
          alt=""
          priority
          sizes="100vw"
          className="pointer-events-none fixed inset-0 -z-20 size-full object-cover opacity-40"
        />
        <div
          aria-hidden="true"
          className="pointer-events-none fixed inset-0 -z-10 bg-background/40"
        />
        {children}
      </div>
    </UiProviders>
  );
}