Add dark/light mode toggle to gallery app

[arvindsing]

Feature Request: Dark/Light Mode Toggle

Summary

Add a visible UI control to toggle between dark mode and light mode in the Photo Gallery & Portfolio application, instead of relying solely on system or default theme.

Motivation

• The app already uses Tailwind dark: variants and supports dark styles in many components.
• A toggle will make it easier during demos to show how the UI adapts between themes.
• Users may prefer to override the system theme when browsing the gallery.

Proposed Approach

• Implement a theme toggle control in the main layout so it is available on all pages (e.g., in the header or a fixed corner of the viewport).
• Use a simple theme state ("light" | "dark" | "system" or just "light" | "dark") and apply it to the html or body element via a dark class.
• Persist the user’s selection in localStorage so the preference is remembered across reloads.
• Ensure that existing Tailwind dark: styles in components continue to work without major refactors.

Details & Considerations

• Update src/app/layout.tsx (or a shared layout component) to:
  • Read the initial theme from localStorage on client side (with a safe default).
  • Apply the appropriate class to enable dark or light mode.
• Add a small, accessible toggle component (icon button or switch) that:
  • Clearly indicates the current mode.
  • Works well on both desktop and mobile.
• No backend changes are required; this should remain a purely client-side concern.

Acceptance Criteria

• A theme toggle is visible and usable on all main pages (home, gallery, upload, admin).
• Clicking the toggle switches the UI between dark and light themes immediately.
• The selected theme is remembered after page refresh.
• Existing dark: Tailwind styles continue to work; no obvious visual regressions on key pages.

Nice-to-Have (Optional)

• A third "System" option that follows the OS-level preference.
• A small animation when toggling themes to demonstrate UI polish during demos.