From 3d341cc25b151ebaff492647f295b1cb88508a6b Mon Sep 17 00:00:00 2001
From: omkar hole <omkarhole314@gmail.com>
Date: Fri, 9 Jan 2026 16:38:59 +0530
Subject: [PATCH 1/3] added

---
 src/index.css             |   2 +-
 src/pages/ProfilePage.tsx |   2 +-
 src/theme.css             | 420 +++++++++++++++++++++++++++++++++-----
 3 files changed, 372 insertions(+), 52 deletions(-)

diff --git a/src/index.css b/src/index.css
index 1a31f79d..34f67058 100644
--- a/src/index.css
+++ b/src/index.css
@@ -35,4 +35,4 @@
 .reveal.visible {
   opacity: 1;
   transform: translateY(0);
-}
\ No newline at end of file
+}
diff --git a/src/pages/ProfilePage.tsx b/src/pages/ProfilePage.tsx
index cc442707..9eca10f1 100644
--- a/src/pages/ProfilePage.tsx
+++ b/src/pages/ProfilePage.tsx
@@ -44,7 +44,7 @@ export default function ProfilePage() {
 
             <div className="space-y-6">
               <div>
-                <h1 className="text-3xl font-bold text-gray-900 dark:text-white mb-2">
+                <h1 className="text-3xl font-bold mb-2  name">
                   {displayName}
                 </h1>
                 <p className="text-gray-600 dark:text-gray-400">
diff --git a/src/theme.css b/src/theme.css
index 7af35492..102788fa 100644
--- a/src/theme.css
+++ b/src/theme.css
@@ -25,7 +25,7 @@ html.dark {
   --text-secondary: #cbd5e1;
   --text-tertiary: #94a3b8;
   --border-color: #334155;
-  --border-subtle: #1e293b;
+  --border-subtle: #1e293b; 
   --accent-cyan: #06b6d4;
   --accent-cyan-light: #22d3ee;
   --accent-cyan-bg: #164e63;
@@ -39,18 +39,8 @@ body {
   transition: background-color 0.3s ease, color 0.3s ease;
 }
 
-/* Light Mode Color Overrides */
-html.light .bg-slate-950 {
-  background-color: #ffffff;
-  border: 1px solid #cbd5e1;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-}
 
-html.light .bg-slate-900 {
-  background-color: #f8fafc;
-  border: 1px solid #e2e8f0;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
-}
+
 
 /* Specific page backgrounds and titles */
 html.light .min-h-screen {
@@ -62,7 +52,7 @@ html.light .bg-slate-950 {
 }
 
 html.light .bg-slate-900 {
-  background-color: #ffffff !important;
+    background-color: var(--bg-secondary) !important;
   border: 1px solid #cbd5e1 !important;
 }
 
@@ -83,16 +73,7 @@ html.light .bg-gradient-to-b {
   border-bottom: 2px solid #cbd5e1 !important;
 }
 
-/* Hero section titles */
-html.light .text-6xl {
-  color: #000000 !important;
-  font-weight: 900 !important;
-}
 
-html.light .text-4xl {
-  color: #000000 !important;
-  font-weight: 800 !important;
-}
 
 /* Navbar and main titles */
 html.light nav {
@@ -100,25 +81,7 @@ html.light nav {
   border-bottom: 2px solid #cbd5e1 !important;
 }
 
-html.light .text-white {
-  color: #000000 !important;
-  font-weight: 700;
-}
 
-html.light .text-gray-300 {
-  color: #1f2937 !important;
-  font-weight: 600;
-}
-
-html.light .text-slate-300 {
-  color: #1f2937 !important;
-  font-weight: 600;
-}
-
-html.light .text-slate-400 {
-  color: #374151 !important;
-  font-weight: 600;
-}
 
 html.light .text-cyan-300 {
   color: #0891b2 !important;
@@ -157,17 +120,7 @@ html.light .font-semibold {
   font-weight: 700 !important;
 }
 
-/* Logo specific styling */
-html.light .text-xl {
-  color: #000000 !important;
-  font-weight: 900 !important;
-}
 
-/* Large text elements */
-html.light .text-3xl, html.light .text-4xl, html.light .text-5xl {
-  color: #000000 !important;
-  font-weight: 800 !important;
-}
 
 /* Button text */
 html.light button {
@@ -176,6 +129,7 @@ html.light button {
 
 html.light .border-slate-700 {
   border-color: #cbd5e1 !important;
+  
 }
 
 html.light .border-slate-800 {
@@ -241,3 +195,369 @@ html.light .hover\:border-cyan-500:hover {
 html.light .hover\:border-slate-500:hover {
   border-color: #64748b !important;
 }
+
+/* Event / Card text fix for light mode */
+html.light .bg-slate-900{
+  color:var(--text-primary)
+}
+
+html.light .bg-slate-900 .text-slate-400,
+html.light .bg-slate-900 .text-slate-300 {
+  color: var(--text-secondary) !important;
+}
+
+html.light .bg-slate-900 .text-white {
+  color: var(--text-primary) !important;
+}
+
+/* FIX: Cards & forms staying dark in light mode */
+html.light .bg-slate-800,
+html.light .bg-slate-700,
+html.light .bg-slate-900 {
+  background-color: #ffffff !important;
+  border: 1px solid #cbd5e1 !important;
+}
+/* FIX: Inputs & textareas in light mode */
+html.light input,
+html.light textarea,
+html.light select {
+  background-color: #ffffff !important;
+  color: #0f172a !important;
+  border: 1.5px solid #94a3b8 !important;
+  font-weight: 500 !important;
+}
+/* FIX: Placeholder visibility */
+html.light input::placeholder,
+html.light textarea::placeholder {
+  color: #475569 !important;
+  font-weight: 400 !important;
+  opacity: 0.8 !important;
+}
+/* FIX: Card headings */
+html.light .bg-slate-800 h1,
+html.light .bg-slate-800 h2,
+html.light .bg-slate-800 h3,
+html.light .bg-slate-900 h1,
+html.light .bg-slate-900 h2,
+html.light .bg-slate-900 h3 {
+  color: #0f172a !important;
+}
+
+/* Auth buttons text fix */
+html.light button.text-white,
+html.light a.text-white {
+  color: #0f172a !important;
+}
+
+html.light .bg-blue-600,
+html.light .bg-cyan-600 {
+  color: #ffffff !important;
+}
+
+
+/* Form labels & helper text */
+html.light label,
+html.light .text-slate-500,
+html.light .text-slate-600 {
+  color: #1e293b !important;
+  font-weight: 600 !important;
+}
+
+/* =========================
+   LIGHT MODE – FINAL CARD SYSTEM
+   ========================= */
+
+/* Card surfaces (Create Post, Create Event, Community, Event cards) */
+html.light .bg-slate-900,
+html.light .bg-slate-800,
+html.light .bg-slate-700 {
+  background-color: #ffffff !important;
+  border: 1.5px solid #cbd5e1 !important;
+  border-radius: 12px;
+  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
+  color: #0f172a;
+}
+
+/* Card backgrounds with opacity - CRITICAL for Create Post/Community */
+html.light .bg-slate-800\\/50,
+html.light .bg-slate-900\\/50 {
+  background-color: #ffffff !important;
+  border: 1.5px solid #cbd5e1 !important;
+}
+
+/* Additional slate background variations */
+html.light [class*="bg-slate-"] {
+  background-color: #ffffff !important;
+}
+
+html.light .bg-slate-800\\/50 * {
+  color: inherit;
+}
+
+/* Card headings */
+html.light .bg-slate-900 h1,
+html.light .bg-slate-900 h2,
+html.light .bg-slate-900 h3,
+html.light .bg-slate-800 h1,
+html.light .bg-slate-800 h2,
+html.light .bg-slate-800 h3 {
+  color: #0f172a !important;
+  font-weight: 700;
+}
+
+/* Card secondary text */
+html.light .bg-slate-900 .text-slate-400,
+html.light .bg-slate-900 .text-slate-300,
+html.light .bg-slate-800 .text-slate-400 {
+  color: #334155 !important;
+  font-weight: 500 !important;
+}
+
+/* Additional secondary text classes */
+html.light .text-gray-400,
+html.light .text-gray-500 {
+  color: #334155 !important;
+  font-weight: 500 !important;
+}
+
+html.light .text-gray-600 {
+  color: #1e293b !important;
+  font-weight: 500 !important;
+}
+
+/* Gray text inside forms and cards */
+html.light .text-gray-300,
+html.light .text-gray-400,
+html.light .text-gray-500 {
+  color: #475569 !important;
+  font-weight: 500 !important;
+}
+
+/* Inputs, textareas, selects */
+html.light input,
+html.light textarea,
+html.light select {
+  background-color: #ffffff !important;
+  color: #0f172a !important;
+  border: 1.5px solid #94a3b8 !important;
+  font-weight: 500 !important;
+}
+
+/* Placeholders */
+html.light input::placeholder,
+html.light textarea::placeholder {
+  color: #475569 !important;
+  font-weight: 400 !important;
+  opacity: 0.8 !important;
+}
+
+/* Specific placeholder overrides for all contexts */
+html.light .placeholder-gray-400::placeholder,
+html.light .placeholder-gray-500::placeholder {
+  color: #475569 !important;
+  opacity: 0.9 !important;
+}
+
+/* Labels & helper text */
+html.light label,
+html.light .text-slate-500,
+html.light .text-slate-600 {
+  color: #1e293b !important;
+  font-weight: 600 !important;
+}
+
+/* Small helper text */
+html.light .text-xs.text-gray-500,
+html.light .text-sm.text-gray-500,
+html.light .text-xs.text-slate-500,
+html.light .text-sm.text-slate-500 {
+  color: #475569 !important;
+  font-weight: 500 !important;
+}
+
+/* Primary buttons */
+html.light .bg-cyan-600,
+html.light .bg-blue-600 {
+  color: #ffffff !important;
+}
+
+/* Text buttons / links */
+html.light button.text-white,
+html.light a.text-white {
+  color: #0f172a !important;
+}
+
+/* Event card and similar text improvements */
+html.light .text-slate-300 {
+  color: #1e293b !important;
+  font-weight: 500 !important;
+}
+
+html.light .text-slate-400 {
+  color: #334155 !important;
+  font-weight: 500 !important;
+}
+
+/* Focus states for inputs */
+html.light input:focus,
+html.light textarea:focus,
+html.light select:focus {
+  border-color: #0891b2 !important;
+  outline: none !important;
+  box-shadow: 0 0 0 3px rgba(8, 145, 178, 0.1) !important;
+}
+
+/* Login/Register page specific improvements */
+html.light .text-gray-600.dark\\:text-gray-500 {
+  color: #475569 !important;
+}
+/* Auth page inputs - override bg-gray-900 */
+html.light .bg-gray-900 {
+  background-color: #ffffff !important;
+  border: 1.5px solid #94a3b8 !important;
+}
+
+/* Auth page specific dark mode overrides */
+html.light .dark\:bg-gray-800 input,
+html.light input.dark\:bg-gray-800 {
+  background-color: #ffffff !important;
+  color: #0f172a !important;
+  border-color: #94a3b8 !important;
+}
+/* Link colors in light mode */
+html.light .text-blue-600,
+html.light .text-blue-500 {
+  color: #0369a1 !important;
+  font-weight: 600 !important;
+}
+
+html.light .hover\\:text-blue-500:hover {
+  color: #0284c7 !important;
+}
+
+/* Error messages */
+html.light .text-red-800 {
+  color: #991b1b !important;
+  font-weight: 600 !important;
+}
+
+html.light .dark\:text-red-400 {
+  color: #dc2626 !important;
+  font-weight: 600 !important;
+}
+
+html.light .text-red-300,
+html.light .dark\:text-red-500 {
+  color: #b91c1c !important;
+}
+
+/* Success/error backgrounds */
+html.light .bg-red-50 {
+  background-color: #fef2f2 !important;
+  border: 1px solid #fca5a5 !important;
+}
+
+html.light .dark\\:bg-red-900\\/20 {
+  background-color: #fef2f2 !important;
+  border: 1px solid #fca5a5 !important;
+}
+/* Success message styling */
+html.light .bg-green-50,
+html.light .dark\:bg-green-900\/20 {
+  background-color: #f0fdf4 !important;
+  border: 1px solid #86efac !important;
+}
+
+html.light .text-green-800,
+html.light .dark\:text-green-400 {
+  color: #166534 !important;
+  font-weight: 600 !important;
+}
+
+html.light .text-green-700,
+html.light .dark\:text-green-500 {
+  color: #15803d !important;
+}
+/* Button text visibility */
+html.light .text-gray-800 {
+  color: #1f2937 !important;
+  font-weight: 600 !important;
+}
+
+html.light .dark\:text-gray-300 {
+  color: #1f2937 !important;
+  font-weight: 600 !important;
+}
+
+/* Auth form dividers */
+html.light .dark\:bg-gray-700 {
+  background-color: #d1d5db !important;
+}
+
+/* Hover states for auth buttons */
+html.light .dark\:hover\:bg-gray-700:hover {
+  background-color: #f3f4f6 !important;
+}
+
+/* Profile page name field */
+html.light .name {
+  color: #0f172a !important;
+}
+/* Comprehensive gray background fixes */
+html.light .bg-gray-900,
+html.light .bg-gray-800,
+html.light .bg-gray-700 {
+  background-color: #ffffff !important;
+  color: #0f172a !important;
+}
+
+html.light .bg-gray-100 {
+  background-color: #f3f4f6 !important;
+}
+
+/* Border colors in light mode */
+html.light .dark\:border-gray-700 {
+  border-color: #d1d5db !important;
+}
+/* Border improvements for light mode */
+html.light .border-gray-300 {
+  border-color: #9ca3af !important;
+}
+
+html.light .dark\\:border-gray-600 {
+  border-color: #9ca3af !important;
+}
+
+html.light .dark\\:bg-gray-800 {
+  background-color: #ffffff !important;
+  border: 1.5px solid #cbd5e1 !important;
+}
+/* Profile page specific backgrounds */
+html.light .bg-gray-50,
+html.light .dark\:bg-gray-700 {
+  background-color: #f8fafc !important;
+  border: 1px solid #e2e8f0 !important;
+}
+
+/* White backgrounds in light mode */
+html.light .bg-white {
+  background-color: #ffffff !important;
+}
+
+/* Profile page text colors */
+html.light .text-gray-900,
+html.light .dark\:text-white {
+  color: #0f172a !important;
+  font-weight: 600 !important;
+}
+
+html.light .text-gray-600,
+html.light .dark\:text-gray-400 {
+  color: #475569 !important;
+  font-weight: 500 !important;
+}
+
+html.light .text-gray-500,
+html.light .dark\:text-gray-400 {
+  color: #64748b !important;
+}
\ No newline at end of file

From b6c798f6a10b94695c65acd52de462569238cbfb Mon Sep 17 00:00:00 2001
From: Omkar Hole <182200831+omkarhole@users.noreply.github.com>
Date: Fri, 9 Jan 2026 22:06:18 +0530
Subject: [PATCH 2/3] Update ProfilePage.tsx

---
 src/pages/ProfilePage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/ProfilePage.tsx b/src/pages/ProfilePage.tsx
index 9eca10f1..bb695706 100644
--- a/src/pages/ProfilePage.tsx
+++ b/src/pages/ProfilePage.tsx
@@ -44,7 +44,7 @@ export default function ProfilePage() {
 
             <div className="space-y-6">
               <div>
-                <h1 className="text-3xl font-bold mb-2  name">
+                <h1 className="text-3xl font-bold mb-2">
                   {displayName}
                 </h1>
                 <p className="text-gray-600 dark:text-gray-400">

From 786661821617d2a95aefb338736cabcbd60cf476 Mon Sep 17 00:00:00 2001
From: Omkar Hole <182200831+omkarhole@users.noreply.github.com>
Date: Fri, 9 Jan 2026 22:07:33 +0530
Subject: [PATCH 3/3] Update theme.css

---
 src/theme.css | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/theme.css b/src/theme.css
index 102788fa..fbc64a07 100644
--- a/src/theme.css
+++ b/src/theme.css
@@ -25,7 +25,7 @@ html.dark {
   --text-secondary: #cbd5e1;
   --text-tertiary: #94a3b8;
   --border-color: #334155;
-  --border-subtle: #1e293b; 
+  --border-subtle: #1e293b;
   --accent-cyan: #06b6d4;
   --accent-cyan-light: #22d3ee;
   --accent-cyan-bg: #164e63;
@@ -52,7 +52,7 @@ html.light .bg-slate-950 {
 }
 
 html.light .bg-slate-900 {
-    background-color: var(--bg-secondary) !important;
+  background-color: var(--bg-secondary) !important;
   border: 1px solid #cbd5e1 !important;
 }
 
@@ -560,4 +560,4 @@ html.light .dark\:text-gray-400 {
 html.light .text-gray-500,
 html.light .dark\:text-gray-400 {
   color: #64748b !important;
-}
\ No newline at end of file
+}