import type { Metadata } from "next";
import { Poppins } from "next/font/google";
import "./globals.css";
import WhatsAppButton from "../components/WhatsAppButton";

const poppins = Poppins({
  variable: "--font-poppins",
  subsets: ["latin"],
  weight: ["300", "400", "500", "600", "700", "800", "900"],
});

export const metadata: Metadata = {
  // Update Title agar lebih branding ke Mulya Balon
  title: "MULYA BALON",
  keywords: "mulya balon, dekorasi balon, balon gate, balon gas, balon sablon, vendor balon Bogor,",
};

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <html
      lang="id"
      className={`${poppins.variable} h-full antialiased scroll-smooth`}
    >
      <body className={`min-h-full flex flex-col font-sans bg-white text-slate-900 ${poppins.className}`}>
        {/* Konten Utama */}
        <main className="grow">
          {children}
        </main>

        {/* --- FLOATING WHATSAPP BUTTON --- */}
        
        <div className="fixed bottom-0 right-0 z-9999">
          <WhatsAppButton />
        </div>
      </body>
    </html>
  );
}