import Navbar from "../components/Layout/Navbar/Navbar";
import Footer from "../components/Layout/Footer";

type Props = {
  children: React.ReactNode;
};

export default function MainLayout({ children }: Props) {
  return (
    <div className="min-h-screen flex flex-col bg-background text-text">

      {/* NAVBAR - tam genişlikte arka plan, ortalı içerik */}
      <div className="bg-surface">
        <div className="max-w-[1400px] mx-auto px-4">
          <Navbar />
        </div>
      </div>

      {/* ANA İÇERİK */}
      <main className="flex-1 bg-background">
        <div className="max-w-[1400px] mx-auto px-4 ">
          {children}
        </div>
      </main>

      {/* FOOTER - tam genişlikte arka plan, ortalı içerik */}
      <div className="bg-surface border-t border-zinc-800">
        <div className="max-w-[1400px] mx-auto px-4 py-4">
          <Footer />
        </div>
      </div>

    </div>
  );
}
