import { ThemeProvider } from "@/Components/ThemeProvider";
import { Navbar } from "@/Components/Landing/Navbar";
import { Footer } from "@/Components/Landing/Footer";

import { cn } from "@/lib/utils";

export default function GuestLayout({ 
    children,
    variant = 'default'
}: { 
    children: React.ReactNode,
    variant?: 'default' | 'landing'
}) {
    return (
        <ThemeProvider defaultTheme="dark" storageKey="nihonbuzz-academy-theme">
            <div className="min-h-screen flex flex-col bg-background text-foreground selection:bg-primary/30 selection:text-primary relative isolate">
                {/* Global Background Pattern */}
                {/* SVG is white by default. In light mode, we invert it to black to be visible on white bg. */}
                <div className="fixed inset-0 z-[-1] bg-wave-global invert dark:invert-0 opacity-20 dark:opacity-5 pointer-events-none" />

                <Navbar />
                <main className={cn(
                    "min-h-screen flex flex-col items-center justify-center overflow-hidden relative",
                    variant === 'default' ? "pt-20 lg:pt-24 px-4" : "pt-0 px-0"
                )}>
                    {children}
                </main>
                <Footer />
            </div>
        </ThemeProvider>
    );
}
