
// components/common/Layout.jsx - Reusable Layout
import Image from "next/image";
import Link from "next/link";
import Header from "./Header";
import Footer from "./Footer";

export default function Layout({ children }) {
  return (
    <div className="min-h-screen flex flex-col">
      {/* <nav className="bg-white shadow-sm">
        <div className="container mx-auto px-4 py-4 flex items-center justify-between">
          <Link href="/">
            <h1 className="text-2xl font-bold text-blue-600 cursor-pointer">
              
            <Image src="/find_deshi transparent.png" alt="FindDeshi Logo" width={140} height={50} />

            </h1>
          </Link>
          <div className="flex gap-6">
            <Link href="/matrimonial" className="hover:text-blue-600">
              Matrimonial
            </Link>
            <Link href="/classifieds" className="hover:text-blue-600">
              Classifieds
            </Link>
            <Link href="/events" className="hover:text-blue-600">
              Events
            </Link>
            <Link href="/dashboard" className="hover:text-blue-600">
              Dashboard
            </Link>
          </div>
        </div>
      </nav> */}
      <Header />

      <main className="flex-1 ">{children}</main>

      {/* <footer className="bg-gray-900 text-white py-8">
        <div className="container mx-auto px-4 text-center">
          <p>&copy; 2024 Your Platform. All rights reserved.</p>
        </div>
      </footer> */}
      <Footer />
    </div>
  );
}