[FEAT]: Add different modes to the website to increase engagement

## Feature: Add Support for Multiple Visual Themes (Dark Mode, Light Mode, High Contrast)

### 📝 Description
Implement a theming system for the debate website that allows users to switch between visual themes like light mode, dark mode, and high-contrast mode. The system should be scalable, easily extendable, and persist user preferences across sessions.

---

### ✅ Features to Include

- Create a global theme context using:
- `localStorage` or cookies to persist the theme choice
- Define multiple theme styles:
- Light Mode (default)
- Dark Mode
- High Contrast Mode (for accessibility)
- Apply themes using:
- CSS variables with a theming system (`:root { --bg-color: ... }`)
- Dynamic class switching on the root HTML element (``)
- Implement a theme toggle UI:
- Add a switcher button in the navbar or settings
- Optional: Detect system theme (`window.matchMedia`) on first load
- Ensure all components support theme changes
- Reuse theme variables in buttons, cards, text, backgrounds, etc.
- Add fallback/default theme on first visit
- Test compatibility across:
- Home, Debate, Profile, Leaderboard, and Settings pages

---

### 👨‍💻 Assigned to: @Eli4479