feat: add dark theme functionality

[arya-912]

🌙 [Feature/UI] Implement Premium Dark Mode & Overhaul Global UI Styling

Closes #26

📌 Description

This PR introduces a robust Light/Dark mode implementation and completely refines the application's global UI. The previous styling relied on hardcoded colors that broke visibility in dark mode (hidden text) and used heavy, flat backgrounds that felt visually overwhelming.

This update resolves all visibility issues, introduces dynamic Tailwind theme variables, and upgrades the overall aesthetic to a modern, premium standard with glassmorphism, softer typography, and refined accent colors.

---

🚀 Key Changes & Features

1. Robust Theme Architecture

• Added next-themes and wrapped the app with a global ThemeProvider
• Prevents hydration mismatch / FOUC (Flash of Unstyled Content)
• Implemented a premium [Feature/UI] Implement Dark Mode Toggle & Overhaul Global UI Aesthetics #26 switch in <Header /> using lucide-react (Sun/Moon icons)
• Smooth sliding animation with cubic-bezier transition

---

2. Global Theme Refinements (globals.css)

• Dark Mode:
  • Background: #111827 (dark slate)
  • Text: #bbbbbb (cool-toned grey for readability)
• Light Mode:
  • Background: #f8fafc (soft off-white)
  • Text: #0f172a (deep slate)
  • Cards: #ffffff for layered UI feel

---

3. Main Screen UI Overhaul

• Removed hardcoded classes (text-black, text-gray-800)
• Replaced with semantic Tailwind variables (text-foreground, text-muted-foreground)
• Introduced glassmorphism card:
  • bg-slate-900/60 backdrop-blur-xl (dark mode)
• Updated primary colors:
  • Replaced neon purple with bg-indigo-600
• Improved input visibility:
  • Better contrast backgrounds
  • Brighter placeholders (placeholder-slate-400)

---

4. Results & Analysis Page Fixes

• Fully dynamic theme-aware layout
• Updated SDG prediction cards:
  • Theme-adaptive tags (High/Medium/Low)
  • e.g., dark:bg-green-900/40 dark:text-green-300
• Fixed raw JSON viewer:
  • Proper dark mode styling (dark:bg-slate-950)

---

📸 Before & After Screenshots

🔆 Before (Light Mode Only)

---

🔆 Light Mode (After)

---

🌙 Dark Mode (After)

---

📸 Visual Impact

• Eliminates hidden text / contrast issues
• Softer, modern, and premium UI
• Improved readability in both light and dark modes
• Better interaction feedback across UI elements

---

✅ Checklist

• Tested Light/Dark toggle functionality
• Verified text contrast across UI components
• Ensured no hydration/theme flickering issues