Dropdown Icon Not Visible in Light Mode & Incorrect Theme State Handling

[TusharSaini999]

Description 🐞

The dropdown arrow icon in the timeline/accordion section is not clearly visible in light mode due to low contrast. Additionally, the icon appears to retain styles from dark mode, indicating improper theme state handling.

Steps To Reproduce 🔁

1. Open the website
2. Switch to Light Mode
3. Navigate to the timeline/registration section
4. Observe the dropdown arrow icon on the card (e.g., "Registration Opens")

Expected Behavior ✅

• Icon should be clearly visible in light mode
• Icon color should adapt based on the current theme
• No residual styling from dark mode should persist

Actual Behavior ❌

• Icon is barely visible in light mode (low contrast)
• Icon appears styled for dark mode even when light mode is active
• Poor UI clarity and inconsistent theme behavior

Screenshots / Logs 📷

Environment 💻

• OS: Windows 10
• Browser: Chrome (v147)
• Node version: (add your version)

Possible Fix 💡

• Apply theme-based conditional styling (e.g., text-gray-800 for light mode, text-white for dark mode)
• Ensure proper theme state switching (check dark: classes or theme provider logic)
• Avoid hardcoded colors; use design tokens or CSS variables
• Verify icon inherits correct color (currentColor)

[svivek19]

Hi! I'd love to help with this issue. I noticed it's assigned already. if it becomes available or needs assistance, I'd be happy to work on it.