import type { Metadata } from "next";
import "./globals.css";
import QueryProvider from "@/app/QueryProvider";
import { AppHeader } from "@/app/components/AppHeader";
import { AppFooter } from "@/app/components/AppFooter";
import { ToastProvider } from "@/app/components/ui/ToastProvider";


export const metadata: Metadata = {
  title: "ASSM",
  description: "assm",
};

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <html lang="ko">
      <body className="min-h-screen bg-background text-foreground antialiased">
        <QueryProvider>
          <ToastProvider>
            <div className="min-h-screen flex flex-col">
              <div className="sticky top-0 z-50 bg-white/80 backdrop-blur">
                <div className="mx-auto w-full">
                  <AppHeader />
                </div>
              </div>
              <main className="flex-1 bg-[#F2F2F2]">
                <div className="max-w-[1920px] mx-auto px-4 py-6">
                  {children}
                </div>
              </main>
              <div className="">
                <div className="max-w-[1920px] mx-auto px-4">
                  <AppFooter />
                </div>
              </div>
            </div>
          </ToastProvider>
        </QueryProvider>
      </body>
    </html>
  );
}
