BUG:Dark Mode Toggle Not Functioning on Click

### Is there an existing issue for this?

- [x] I have searched the existing issues

### What happened?

## 📌 Issue Overview
Clicking the **Dark Mode** toggle in the application does not activate the dark theme. The switch appears clickable, but the UI remains in light mode with no visible theme change.

---

## 🔍 Steps to Reproduce
1. Open the application in the browser
2. Locate the **Dark Mode** toggle (usually in the navbar or settings)
3. Click on the toggle
4. Observe that the UI does not change to dark theme

---

## 🎯 Expected Behavior
When the user clicks the Dark Mode toggle, the entire application's theme should switch to dark mode — including background colors, text, buttons, and all UI components.

---

## 🚨 Actual Behavior
Clicking the toggle does not apply the dark theme.
- The UI stays in light mode
- No dark styles are applied
- Possibly, the `.dark` class is not added to the `` or `` element

---

## 📷 Video
(https://drive.google.com/file/d/1omK7LRKXDlA25ovgpZ_ujdKrX5fTMI1e/view?usp=sharing)

## 💡 Suggested Improvements
- Ensure that clicking the toggle triggers a state change in the app’s theme context or global state
- Confirm that the `.dark` class (for Tailwind or CSS-based dark themes) is being properly added to the root element
- If using Tailwind CSS, verify that `darkMode: 'class'` is set in `tailwind.config.js`
- Persist the theme selection in localStorage (optional improvement)

---

🙋‍♂️ I'd love to work on this and submit a fix. Please assign this issue to me.

### Record

- [x] I agree to follow this project's Code of Conduct
- [x] I want to work on this issue