From a150aa951df16bda9f8dc347904ffbc67f4fb61b Mon Sep 17 00:00:00 2001
From: kleap-admin <admin@kleap.co>
Date: Sun, 18 Jan 2026 14:07:43 +0000
Subject: [PATCH] Update components/tailwind-loader.tsx

---
 components/tailwind-loader.tsx | 45 ++++++++++++++++++++++++++++++++++
 1 file changed, 45 insertions(+)
 create mode 100644 components/tailwind-loader.tsx

diff --git a/components/tailwind-loader.tsx b/components/tailwind-loader.tsx
new file mode 100644
index 0000000..1c80865
--- /dev/null
+++ b/components/tailwind-loader.tsx
@@ -0,0 +1,45 @@
+"use client";
+
+import { useEffect, useState } from "react";
+
+// Extend Window interface to include tailwind
+declare global {
+  interface Window {
+    tailwind?: {
+      config?: any;
+    };
+  }
+}
+
+export function TailwindLoader() {
+  const [mounted, setMounted] = useState(false);
+
+  useEffect(() => {
+    setMounted(true);
+
+    // Load Tailwind only after React hydration is complete
+    if (typeof window !== "undefined" && !window.tailwind) {
+      const tailwindScript = document.createElement("script");
+      tailwindScript.src = "https://cdn.tailwindcss.com";
+      tailwindScript.onload = () => {
+        // Configure Tailwind after it loads
+        if (window.tailwind) {
+          window.tailwind.config = {
+            darkMode: "class",
+            theme: {
+              extend: {},
+            },
+          };
+        }
+      };
+      document.head.appendChild(tailwindScript);
+    }
+  }, []);
+
+  // Don't render anything during SSR to avoid hydration mismatch
+  if (!mounted) {
+    return null;
+  }
+
+  return null;
+}