import React from 'react';
import { ThemeProvider } from "@/Components/ThemeProvider";
import Header from "@/Components/Layout/Header";
import Footer from "@/Components/Layout/Footer";

export default function UserLayout({ children }) {
    return (
        <ThemeProvider defaultTheme="system" storageKey="app-ui-theme">
            <div className="min-h-screen flex flex-col bg-muted/20 text-foreground transition-colors duration-300">
                
                <Header />

                {/* Main Content Area - Full Width */}
                <div className="flex-1 max-w-[1600px] w-full mx-auto p-4 lg:p-8">
                    <main className="w-full pb-12">
                        {children}
                    </main>
                </div>

                <Footer />
                
            </div>
        </ThemeProvider>
    );
}