import Image from 'next/image';
import { Footer } from '@/components/shared/Footer';

export default function MainLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <>
      <header className="relative z-10 border-b border-white/10 backdrop-blur-sm">
        <nav className="max-w-7xl mx-auto px-6 py-3 flex justify-between items-center h-16">
          <div className="h-full flex items-center">
            <Image
              src="/banatie-logo-horisontal.png"
              alt="Banatie Logo"
              width={150}
              height={40}
              priority
              className="h-full w-auto object-contain"
            />
          </div>
          <a
            href="#waitlist"
            className="text-sm text-gray-300 hover:text-white transition-colors"
          >
            Join Beta
          </a>
        </nav>
      </header>

      {children}

      <Footer />
    </>
  );
}
