import type { Metadata } from "next";
import { Inter, Plus_Jakarta_Sans, Poppins } from "next/font/google";
import AosInit from "@/components/global/AosInit";
import BootstrapInit from "@/components/global/BootstrapInit";
import DarkModeBtn from "@/components/global/DarkModeBtn";

// Core CSS
import "bootstrap/dist/css/bootstrap.min.css";
import "aos/dist/aos.css";
// Custom CSS
import "../public/assets/css/style.css";
import "../public/assets/css/custom.css";

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

const plusJakartaSans = Plus_Jakarta_Sans({
  variable: "--font-plus-jakarta",
  subsets: ["latin"],
  weight: ["200", "300", "400", "500", "600", "700", "800"],
});

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

export const metadata: Metadata = {
  title: {
    template: "%s | Sasico || IT Solution - SaaS & Tech Startup",
    default: "Sasico || IT Solution - SaaS & Tech Startup",
  },
  description: "Ai-power Software Solutions",
  icons: {
    icon: "/assets/images/favicon.ico",
  },
};

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <html
      lang="en"
      className={`${inter.variable} ${plusJakartaSans.variable} ${poppins.variable}`}
    >
      <body className="it-solution">
        <BootstrapInit />
        <AosInit />
        <DarkModeBtn />
        <div className="wrapper">{children}</div>
      </body>
    </html>
  );
}
