style: fix dark mode accessibility issues (#422)

client/src/pages/About.css

@@ -241,7 +241,7 @@
 }
 
 .feature-deep ul li {
-  color: #555;
+  color: var(--muted);
   margin-bottom: 0.5rem;
   position: relative;
   padding-left: 1.5rem;
@@ -255,12 +255,8 @@
   font-weight: bold;
 }
 
-/* Add this to your About.css file */
-
-[data-theme="dark"] .feature-deep {
-  background-color: #1e2a3a; /* A nice dark blue-gray */
-  color: #f0f0f0;            /* Light text color for contrast */
-  border: 1px solid #4a4a4a;    /* Optional: a subtle border for dark mode */
+html[data-theme="dark"] .feature-deep {
+  border: 1px solid var(--border);
 }
 
 /* Values Section */
@@ -319,12 +315,8 @@
   opacity: 0.9;
 }
 
-/* Add this to your About.css file */
-
-[data-theme="dark"] .value-item {
-  background-color: #1e2a3a; /* A nice dark blue-gray */
-  color: #f0f0f0;            /* Light text color for contrast */
-  border: 1px solid #4a4a4a;    /* Optional: a subtle border for dark mode */
+html[data-theme="dark"] .value-item {
+  border: 1px solid var(--border);
 }
 
 /* Team Section */

client/src/pages/Contact.css

@@ -68,7 +68,7 @@
 .form-group textarea {
   width: 100%;
   padding: 15px;
-  border: 2px solid #e1e5e9;
+  border: 2px solid var(--border);
   border-radius: 8px;
   font-size: 1rem;
   transition: border-color 0.3s ease;
@@ -212,7 +212,7 @@
 .faq-item {
   margin-bottom: 30px;
   padding: 30px;
-  background: #f8f9fa;
+  background: var(--card);
   border-radius: 8px;
   border-left: 4px solid #667eea;
 }

client/src/pages/Contribute.css

@@ -241,7 +241,7 @@
 }
 
 .code-lang {
-  color: var(--border);
+  color: var(--muted);
   font-size: 0.9rem;
   font-weight: 600;
 }
@@ -269,7 +269,7 @@
 }
 
 .code-block code {
-  color: var(--border);
+  color: var(--text);
   font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
   font-size: 0.9rem;
   line-height: 1.5;

client/src/pages/Faq.css

@@ -153,6 +153,11 @@
   margin: 3rem 1rem 0; /* Adjusted margin */
   background: linear-gradient(45deg, var(--brand), #764ba2);
   border-radius: 16px;
+  color: white;
+}
+
+.contact-section .section-title {
+  color: white;
 }
 
 .contact-section p {

client/src/pages/Feedback.css

@@ -196,7 +196,7 @@
 .student-name {
   font-size: 1.4rem;
   font-weight: 700;
-  color: #1f2937;
+  color: var(--heading);
   margin-bottom: 0.5rem;
 }
 
@@ -252,7 +252,7 @@
 .subject-name {
   font-size: 1.5rem;
   font-weight: 700;
-  color: #1f2937;
+  color: var(--heading);
   margin-bottom: 0.5rem;
 }
 
@@ -311,15 +311,15 @@
 .detail-section h5 {
   font-size: 1rem;
   font-weight: 700;
-  color: #1f2937;
+  color: var(--heading);
   margin-bottom: 0.75rem;
   display: flex;
   align-items: center;
   gap: 0.5rem;
 }
 
 .detail-section p {
-  color: #4b5563;
+  color: var(--muted);
   line-height: 1.6;
   font-size: 0.95rem;
 }
@@ -479,15 +479,15 @@
   display: block;
   margin-bottom: 5px;
   font-weight: bold;
-  color: #555;
+  color: var(--muted);
 }
 
 .form-group input,
 .form-group select,
 .form-group textarea {
   width: 100%;
   padding: 10px;
-  border: 1px solid #ccc;
+  border: 1px solid var(--border);
   border-radius: 6px;
   font-size: 1rem;
   box-sizing: border-box;

client/src/pages/MindMapEditor.css

@@ -316,7 +316,7 @@ html[data-theme="dark"] .mindmap {
 
 .react-flow__node-info .info-node, .info-node {
   background: var(--card);
-  color: #111;
+  color: var(--text);
   padding: 8px 10px;
   border-radius: 8px;
   border: 1px solid var(--border);

client/src/pages/Notes.css

@@ -405,7 +405,7 @@
 
 .upload-section p {
   font-size: 1rem;
-  color: #555;
+  color: var(--muted);
   margin-bottom: 2rem;
 }
 

client/src/pages/PYQs.css

@@ -6,15 +6,16 @@
 
 /* Hero Section */
 .pyqs-hero {
-  background-color: var(--brand);
+  background: linear-gradient(45deg, var(--brand), #764ba2);
   padding: 60px 20px;
   text-align: center;
   border-radius: 10px;
+  color: white;
 }
 
 .pyqs-hero h1 {
   font-size: 2.4rem;
-  color: var(--text);
+  color: white;
   margin-bottom: 10px;
   font-weight: 600;
 }
@@ -45,7 +46,7 @@
 
 .form-group select {
   padding: 10px;
-  border: 1px solid #ccc;
+  border: 1px solid var(--border);
   border-radius: 6px;
   font-size: 1rem;
 }

client/src/pages/Privacy.css

@@ -177,7 +177,7 @@
 }
 
 .info-category ul li {
-  color: #555;
+  color: var(--muted);
   margin-bottom: 0.8rem;
   position: relative;
   padding-left: 1.5rem;
@@ -302,7 +302,7 @@
 }
 
 .sharing-category ul li {
-  color: #555;
+  color: var(--muted);
   margin-bottom: 1rem;
   position: relative;
   padding-left: 1.5rem;

client/src/pages/SubmitFeedback.css

@@ -12,7 +12,7 @@
 .form-header h1 {
   font-size: 2.5rem;
   font-weight: 700;
-  color: #1f2937;
+  color: var(--heading);
   margin-bottom: 1rem;
 }
 

client/src/pages/Syllabus.css

@@ -54,7 +54,6 @@
   margin: 0 auto 2.5rem;
   opacity: 0.9;
   line-height: 1.7;
-  color: var(--text);
 }
 
 .hero-stats {