import { Outlet } from "react-router-dom";
import { CosmicBackground } from "../components/CosmicBackground";
import { BottomNav } from "../components/BottomNav";

export default function MainLayout() {
  return (
    <div className="min-h-screen text-foreground flex flex-col font-sans selection:bg-white/30">
      <CosmicBackground />
      <main className="flex-1 w-full max-w-md mx-auto relative safe-area-inset-top z-10 pb-[104px]">
        <Outlet />
      </main>
      <BottomNav />
    </div>
  );
}
