diff --git a/app/layout.tsx b/app/layout.tsx
new file mode 100644
index 0000000..3adfc5b
--- /dev/null
+++ b/app/layout.tsx
@@ -0,0 +1,151 @@
+import type { Metadata } from "next";
+import "./globals.css";
+import { GeistSans } from "geist/font/sans";
+import { cn } from "@/lib/utils";
+import { ThemeProvider } from "@/context/theme-provider";
+import { NavBar } from "@/components/navbar";
+import { KleapScripts } from "@/components/kleap-scripts";
+import { DevToolsGuard } from "./devtools-guard";
+import { TailwindCDNClient } from "@/components/tailwind-cdn-client";
+
+export const metadata: Metadata = {
+ title: {
+ default: "InvoiceGen - Professional Invoice Generator for Freelancers - AI-Powered Solution",
+ template: "%s | InvoiceGen - Professional Invoice Generator for Freelancers",
+ },
+ description:
+ "Built with Kleap - AI-powered platform to create stunning websites and apps. Turn your ideas into reality in minutes.",
+ keywords: ["SaaS", "AI", "Template", "Next.js", "React", "TypeScript"],
+ authors: [{ name: "InvoiceGen Team" }],
+ creator: "InvoiceGen Inc.",
+ publisher: "InvoiceGen Inc.",
+ icons: {
+ icon: "/favicon.ico",
+ shortcut: "/favicon.ico",
+ apple: "/favicon.ico",
+ },
+ robots: {
+ index: true,
+ follow: true,
+ googleBot: {
+ index: true,
+ follow: true,
+ "max-video-preview": -1,
+ "max-image-preview": "large",
+ "max-snippet": -1,
+ },
+ },
+ openGraph: {
+ type: "website",
+ locale: "en_US",
+ url: process.env.NEXT_PUBLIC_URL || "https://kleap.co",
+ siteName: "InvoiceGen - Professional Invoice Generator for Freelancers",
+ title: "InvoiceGen - Professional Invoice Generator for Freelancers - AI-Powered Solution",
+ description:
+ "Built with Kleap - AI-powered platform to create stunning websites and apps. Turn your ideas into reality in minutes.",
+ images: [
+ {
+ url: "/og-image.png",
+ width: 1200,
+ height: 630,
+ alt: "InvoiceGen - Professional Invoice Generator for Freelancers",
+ },
+ ],
+ },
+ twitter: {
+ card: "summary_large_image",
+ title: "InvoiceGen - Professional Invoice Generator for Freelancers - AI-Powered Solution",
+ description:
+ "Built with Kleap - AI-powered platform to create stunning websites and apps. Turn your ideas into reality in minutes.",
+ images: ["/og-image.png"],
+ creator: "@invoicegen",
+ },
+ metadataBase: new URL(process.env.NEXT_PUBLIC_URL || "https://kleap.co"),
+ alternates: {
+ canonical: "/",
+ },
+};
+
+export default function RootLayout({
+ children,
+}: Readonly<{
+ children: React.ReactNode;
+}>) {
+ return (
+
+
+ {/*
+ CRITICAL: Base styles to prevent FOUC and hydration errors
+ ⚠️ DO NOT REMOVE OR MODIFY WITHOUT CAREFUL TESTING ⚠️
+ React 19 requires href and precedence attributes on style tags
+ */}
+
+
+
+
+
+
+
+
+
+ {children}
+
+
+
+
+ );
+}