Dark Mode Toggler

Note: This challenge focuses more on logic than UI. If you want to also focus on and practice UI, visit our UI Components challenges.

Objective: Implement a dark mode toggle that switches between light and dark modes.

Instructions:

1. Create a button or switch that toggles between light and dark modes when clicked.
2. Create some basic CSS styles to indicate theme difference

Requirements:

• Implement a function that toggles between light and dark modes.
• Create basic CSS theme for light/dark mode.

Bonus:

1. Automatically detect the user's OS-level dark mode preference and apply it on first load.
2. Add a transition effect when switching between modes.