UI: Added section-aware light-mode styling to main dashboard header icons (Gold for Pro Tier, Cyan for AI Coach)

fix_icons.py

@@ -0,0 +1,83 @@
+import os
+import glob
+import re
+
+PRO_TIER_DIRS = [
+    "src/app/dashboard",
+    "src/app/dashboard/leaderboard",
+    "src/app/dashboard/progress",
+    "src/app/dashboard/cbt",
+    "src/app/dashboard/materials",
+    "src/app/dashboard/analytics",
+    "src/app/dashboard/community",
+    "src/app/dashboard/streaks",
+    "src/app/dashboard/settings",
+    "src/app/dashboard/rank-predictor"
+]
+
+AI_COACH_DIRS = [
+    "src/app/dashboard/ai-coach/tutor",
+    "src/app/dashboard/ai-coach/cbt-dpp",
+    "src/app/dashboard/ai-coach/readiness",
+    "src/app/dashboard/ai-coach/college-predictor",
+    "src/app/dashboard/ai-coach/strategy",
+    "src/app/dashboard/ai-coach/study-plan",
+    "src/app/dashboard/ai-coach/time-optimization",
+    "src/app/dashboard/ai-coach/heatmap",
+    "src/app/dashboard/ai-coach/weekly-progress",
+    "src/app/dashboard/ai-coach/mistakes"
+]
+
+def process_file(filepath, is_pro):
+    if not os.path.exists(filepath):
+        return
+        
+    with open(filepath, 'r', encoding='utf-8') as f:
+        content = f.read()
+
+    # Original patterns
+    bg_pattern = r'bg-\[\#00F0FF\]/10 border border-\[\#00F0FF\]/20'
+    bg_amber_pattern = r'bg-amber-500/10 border border-amber-500/20' # Specifically for heatmap
+    
+    if is_pro:
+        new_bg = 'bg-yellow-50 dark:bg-[#00F0FF]/10 border border-yellow-300/60 dark:border-[#00F0FF]/20'
+        # To replace the icon color, we'll find the line after the span and replace text-[#00F0FF]
+        # But text-[#00F0FF] might be used elsewhere, so let's only replace if it's an icon tag near the span.
+        # The safest way is a regex that matches the span and the inner icon.
+        # e.g., <span className="... bg-[#00F0FF]/10 ...">\n  <IconName className="text-[#00F0FF]"
+        
+        # 1. Replace the background span
+        content = re.sub(bg_pattern, new_bg, content)
+        
+        # 2. Replace the icon color (we can just replace all text-[#00F0FF] inside that specific h1 block, but regex is tricky. 
+        # Let's just do a manual string replace for known blocks.)
+        # Actually, let's use a regex to capture the span and the following line.
+        pattern = r'(<span[^>]*bg-yellow-50[^>]*>\s*<[A-Za-z0-9]+[^>]*)text-\[\#00F0FF\]'
+        content = re.sub(pattern, r'\1text-yellow-600 dark:text-[#00F0FF]', content)
+        
+    else: # AI Coach
+        new_bg = 'bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20'
+        
+        # Replace both cyan and amber variants for consistency
+        content = re.sub(bg_pattern, new_bg, content)
+        content = re.sub(bg_amber_pattern, new_bg, content)
+        
+        pattern = r'(<span[^>]*bg-cyan-50[^>]*>\s*<[A-Za-z0-9]+[^>]*)text-\[\#00F0FF\]'
+        content = re.sub(pattern, r'\1text-cyan-700 dark:text-[#00F0FF]', content)
+        
+        # Specifically for heatmap which had amber text
+        pattern_amber = r'(<span[^>]*bg-cyan-50[^>]*>\s*<[A-Za-z0-9]+[^>]*)text-amber-500'
+        content = re.sub(pattern_amber, r'\1text-cyan-700 dark:text-[#00F0FF]', content)
+
+    with open(filepath, 'w', encoding='utf-8') as f:
+        f.write(content)
+
+for d in PRO_TIER_DIRS:
+    page_path = os.path.join(d, "page.tsx")
+    process_file(page_path, is_pro=True)
+
+for d in AI_COACH_DIRS:
+    page_path = os.path.join(d, "page.tsx")
+    process_file(page_path, is_pro=False)
+
+print("Done replacing header icons.")

src/app/dashboard/ai-coach/cbt-dpp/page.tsx

@@ -98,8 +98,8 @@ export default function AIDailyPracticePage() {
         <div className="flex items-start justify-between gap-4 flex-wrap">
           <div>
             <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
-              <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+              <span className="p-2.5 rounded-xl bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20">
-                <Sparkles className="text-[#00F0FF]" size={28} />
+                <Sparkles className="text-cyan-700 dark:text-[#00F0FF]" size={28} />
               </span>
               AI Daily Practice (DPP)
             </h1>
@@ -108,7 +108,7 @@ export default function AIDailyPracticePage() {
             </p>
           </div>
           <div className="flex items-center gap-2 shrink-0">
-            <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-[#00F0FF]/10 border border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5">
+            <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5">
               <BrainCircuit size={12} /> AI Powered
             </span>
           </div>

src/app/dashboard/ai-coach/college-predictor/page.tsx

@@ -23,8 +23,8 @@ export default function CollegePredictorPage() {
         <div className="flex items-start justify-between gap-4 flex-wrap">
           <div>
             <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
-              <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+              <span className="p-2.5 rounded-xl bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20">
-                <GraduationCap className="text-[#00F0FF]" size={28} />
+                <GraduationCap className="text-cyan-700 dark:text-[#00F0FF]" size={28} />
               </span>
               AI College &amp; Cutoff Predictor
             </h1>
@@ -32,7 +32,7 @@ export default function CollegePredictorPage() {
               Discover your probable target medical &amp; engineering colleges based on current mock exam scores and historical cutoffs.
             </p>
           </div>
-          <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-[#00F0FF]/10 border border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
+          <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
             <GraduationCap size={12} /> AI Powered
           </span>
         </div>

src/app/dashboard/ai-coach/heatmap/page.tsx

@@ -28,8 +28,8 @@ export default function HeatmapPage() {
         <div className="flex items-start justify-between gap-4 flex-wrap">
           <div>
             <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
-              <span className="p-2.5 rounded-xl bg-amber-500/10 border border-amber-500/20">
+              <span className="p-2.5 rounded-xl bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20">
-                <Flame className="text-amber-500" size={28} />
+                <Flame className="text-cyan-700 dark:text-[#00F0FF]" size={28} />
               </span>
               Mistake Heatmap Vault
             </h1>
@@ -37,7 +37,7 @@ export default function HeatmapPage() {
               Visual density map of your errors across subjects and topics — pinpoint your weakest areas instantly.
             </p>
           </div>
-          <span className="text-xs font-bold uppercase tracking-wider text-amber-500 bg-amber-500/10 border border-amber-500/20 px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
+          <span className="text-xs font-bold uppercase tracking-wider text-amber-500 bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
             <AlertTriangle size={12} /> Error Density Analysis
           </span>
         </div>

src/app/dashboard/ai-coach/mistakes/page.tsx

@@ -62,8 +62,8 @@ export default function MistakeTrackingPage() {
         <div className="flex items-start justify-between gap-4 flex-wrap">
           <div>
             <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
-              <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+              <span className="p-2.5 rounded-xl bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20">
-                <BrainCircuit className="text-[#00F0FF]" size={28} />
+                <BrainCircuit className="text-cyan-700 dark:text-[#00F0FF]" size={28} />
               </span>
               Mistake Review &amp; Spaced Repetition
             </h1>

src/app/dashboard/ai-coach/readiness/page.tsx

@@ -25,8 +25,8 @@ export default function ReadinessPage() {
         <div className="flex items-start justify-between gap-4 flex-wrap">
           <div>
             <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
-              <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+              <span className="p-2.5 rounded-xl bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20">
-                <Gauge className="text-[#00F0FF]" size={28} />
+                <Gauge className="text-cyan-700 dark:text-[#00F0FF]" size={28} />
               </span>
               Exam Readiness Analytics
             </h1>
@@ -34,7 +34,7 @@ export default function ReadinessPage() {
               Real-time algorithmic prediction of your exam readiness — based on speed, accuracy, syllabus coverage, and test history.
             </p>
           </div>
-          <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-[#00F0FF]/10 border border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
+          <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
             <Gauge size={12} /> AI Powered
           </span>
         </div>
@@ -70,7 +70,7 @@ export default function ReadinessPage() {
             <div className="flex items-center gap-2 mb-5">
               <Award className="text-amber-400" size={22} />
               <h2 className="text-xl font-extrabold tracking-tight">Composite Readiness Index</h2>
-              <span className="ml-auto text-xs font-bold text-[#00F0FF] bg-[#00F0FF]/10 border border-[#00F0FF]/20 px-2.5 py-1 rounded-full">Updated Daily</span>
+              <span className="ml-auto text-xs font-bold text-[#00F0FF] bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20 px-2.5 py-1 rounded-full">Updated Daily</span>
             </div>
             <ReadinessGauge />
           </Card>

src/app/dashboard/ai-coach/strategy/page.tsx

@@ -19,8 +19,8 @@ export default function StrategyPage() {
         <div className="flex items-start justify-between gap-4 flex-wrap">
           <div>
             <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
-              <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+              <span className="p-2.5 rounded-xl bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20">
-                <Zap className="text-[#00F0FF]" size={28} />
+                <Zap className="text-cyan-700 dark:text-[#00F0FF]" size={28} />
               </span>
               Exam Strategy &amp; Time Optimization
             </h1>
@@ -28,7 +28,7 @@ export default function StrategyPage() {
               Master time allocation per question, eliminate negative marking traps, and fine-tune your subject sequence for maximum score yield.
             </p>
           </div>
-          <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-[#00F0FF]/10 border border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
+          <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
             <Zap size={12} /> AI Powered
           </span>
         </div>

src/app/dashboard/ai-coach/study-plan/page.tsx

@@ -13,8 +13,8 @@ export default function StudyPlanPage() {
         <div className="flex items-start justify-between gap-4 flex-wrap">
           <div>
             <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
-              <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+              <span className="p-2.5 rounded-xl bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20">
-                <Calendar className="text-[#00F0FF]" size={28} />
+                <Calendar className="text-cyan-700 dark:text-[#00F0FF]" size={28} />
               </span>
               Personalized Daily &amp; Weekly Study Plan
             </h1>
@@ -22,7 +22,7 @@ export default function StudyPlanPage() {
               AI-generated task schedule dynamically tailored to fix your weak areas and maintain optimal syllabus coverage.
             </p>
           </div>
-          <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-[#00F0FF]/10 border border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
+          <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
             <Calendar size={12} /> AI Powered
           </span>
         </div>

src/app/dashboard/ai-coach/time-optimization/page.tsx

@@ -45,8 +45,8 @@ export default function TimeOptimizationPage() {
         <div className="flex items-start justify-between gap-4 flex-wrap">
           <div>
             <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
-              <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+              <span className="p-2.5 rounded-xl bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20">
-                <Clock className="text-[#00F0FF]" size={28} />
+                <Clock className="text-cyan-700 dark:text-[#00F0FF]" size={28} />
               </span>
               Study Time Optimization
             </h1>
@@ -54,7 +54,7 @@ export default function TimeOptimizationPage() {
               Understand your peak productive hours and schedule your hardest topics in your highest-efficiency windows.
             </p>
           </div>
-          <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-[#00F0FF]/10 border border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
+          <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
             <Zap size={12} /> Chronobiology Analytics
           </span>
         </div>

src/app/dashboard/ai-coach/tutor/page.tsx

@@ -18,8 +18,8 @@ export default function TutorChatPage() {
         <div className="flex items-start justify-between gap-4 flex-wrap">
           <div>
             <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
-              <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+              <span className="p-2.5 rounded-xl bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20">
-                <BrainCircuit className="text-[#00F0FF]" size={28} />
+                <BrainCircuit className="text-cyan-700 dark:text-[#00F0FF]" size={28} />
               </span>
               AI Tutor — 24/7 Doubt Solver
             </h1>

src/app/dashboard/ai-coach/weekly-progress/page.tsx

@@ -27,8 +27,8 @@ export default function WeeklyProgressPage() {
         <div className="flex items-start justify-between gap-4 flex-wrap">
           <div>
             <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
-              <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+              <span className="p-2.5 rounded-xl bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20">
-                <Target className="text-[#00F0FF]" size={28} />
+                <Target className="text-cyan-700 dark:text-[#00F0FF]" size={28} />
               </span>
               Weekly Progress Overview
             </h1>
@@ -37,7 +37,7 @@ export default function WeeklyProgressPage() {
             </p>
           </div>
           <div className="flex items-center gap-2 shrink-0">
-            <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-[#00F0FF]/10 border border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5">
+            <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5">
               <Zap size={12} /> Live Analytics
             </span>
           </div>

src/app/dashboard/analytics/page.tsx

@@ -35,8 +35,8 @@ export default function AnalyticsPage() {
       <div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
         <div>
           <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
-            <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+            <span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[#00F0FF]/10 border border-yellow-300/60 dark:border-[#00F0FF]/20">
-              <LineChartIcon className="text-[#00F0FF]" size={28} />
+              <LineChartIcon className="text-yellow-600 dark:text-[#00F0FF]" size={28} />
             </span>
             Performance Analytics
           </h1>

src/app/dashboard/cbt/page.tsx

@@ -129,8 +129,8 @@ export default function CBTPage() {
       <div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
         <div>
           <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
-            <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+            <span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[#00F0FF]/10 border border-yellow-300/60 dark:border-[#00F0FF]/20">
-              <MonitorPlay className="text-[#00F0FF]" size={28} />
+              <MonitorPlay className="text-yellow-600 dark:text-[#00F0FF]" size={28} />
             </span>
             Computer Based Tests (CBT)
           </h1>

src/app/dashboard/community/page.tsx

@@ -114,8 +114,8 @@ export default function CommunityPage() {
       <div className="flex flex-col md:flex-row justify-between items-start md:items-end gap-4">
         <div>
           <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
-            <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+            <span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[#00F0FF]/10 border border-yellow-300/60 dark:border-[#00F0FF]/20">
-              <MessageSquare className="text-[#00F0FF]" size={28} />
+              <MessageSquare className="text-yellow-600 dark:text-[#00F0FF]" size={28} />
             </span>
             Doubt Forum
           </h1>

src/app/dashboard/leaderboard/page.tsx

@@ -29,8 +29,8 @@ export default function LeaderboardPage() {
       <div className="flex flex-col md:flex-row justify-between items-start md:items-end gap-4">
         <div>
           <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
-            <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+            <span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[#00F0FF]/10 border border-yellow-300/60 dark:border-[#00F0FF]/20">
-              <Trophy className="text-[#00F0FF]" size={28} />
+              <Trophy className="text-yellow-600 dark:text-[#00F0FF]" size={28} />
             </span>
             Leaderboard
           </h1>

src/app/dashboard/materials/page.tsx

@@ -36,8 +36,8 @@ export default function MaterialsPage() {
       <div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
         <div>
           <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
-            <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+            <span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[#00F0FF]/10 border border-yellow-300/60 dark:border-[#00F0FF]/20">
-              <FileText className="text-[#00F0FF]" size={28} />
+              <FileText className="text-yellow-600 dark:text-[#00F0FF]" size={28} />
             </span>
             Study Materials & Notes
           </h1>

src/app/dashboard/page.tsx

@@ -45,8 +45,8 @@ export default function DashboardPage() {
         <div className="flex flex-col md:flex-row md:items-end justify-between gap-4 mb-8">
           <div>
             <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
-              <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+              <span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[#00F0FF]/10 border border-yellow-300/60 dark:border-[#00F0FF]/20">
-                <LayoutDashboard className="text-[#00F0FF]" size={28} />
+                <LayoutDashboard className="text-yellow-600 dark:text-[#00F0FF]" size={28} />
               </span>
               Performance Overview
             </h1>

src/app/dashboard/progress/page.tsx

@@ -108,8 +108,8 @@ export default function ProgressTrackerPage() {
       <div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
         <div>
           <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
-            <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+            <span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[#00F0FF]/10 border border-yellow-300/60 dark:border-[#00F0FF]/20">
-              <Target className="text-[#00F0FF]" size={28} />
+              <Target className="text-yellow-600 dark:text-[#00F0FF]" size={28} />
             </span>
             Syllabus Tracker
           </h1>

src/app/dashboard/settings/page.tsx

@@ -103,8 +103,8 @@ export default function SettingsPage() {
       <div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
         <div>
           <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
-            <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+            <span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[#00F0FF]/10 border border-yellow-300/60 dark:border-[#00F0FF]/20">
-              <Settings className="text-[#00F0FF]" size={28} />
+              <Settings className="text-yellow-600 dark:text-[#00F0FF]" size={28} />
             </span>
             Account Settings
           </h1>

src/app/dashboard/streaks/page.tsx

@@ -20,8 +20,8 @@ export default function StreaksPage() {
       <div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
         <div>
           <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
-            <span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
+            <span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[#00F0FF]/10 border border-yellow-300/60 dark:border-[#00F0FF]/20">
-              <Flame className="text-[#00F0FF]" size={28} />
+              <Flame className="text-yellow-600 dark:text-[#00F0FF]" size={28} />
             </span>
             Your Learning Streak
           </h1>