Refactor theme management: streamline theme application and toggle logic

[john-sp]

No description provided.

[github-actions]

🚀 Draft Preview: https://pr180-draft.lc0.org/

[Copilot]

Pull Request Overview

This PR refactors the theme management system to use a data-attribute-based approach instead of CSS classes. The changes streamline theme application logic and implement a three-state toggle (light → dark → system) that respects user preferences while maintaining localStorage persistence.

Key Changes:

• Replaced class-based theme switching (.theme-light, .theme-dark) with data-attribute approach (data-theme='light', data-theme='dark')
• Consolidated theme variables into a centralized palette structure with explicit light/dark prefixes
• Implemented helper functions (applyTheme, saveTheme) to reduce code duplication in theme toggle logic

Reviewed Changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 1 comment.

File	Description
themes/leela/assets/js/main.js	Refactored theme toggle logic to use data attributes and extracted reusable functions for applying and saving themes
themes/leela/assets/css/syntax.css	Updated dark mode media query selector to match new data-attribute approach
themes/leela/assets/css/main.css	Restructured CSS variables into a centralized palette with light/dark prefixes and updated selectors to use data attributes

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

The variable currentTheme is declared but never used. Since the toggle logic only relies on savedTheme, this line should be removed to avoid confusion.

Suggested change

const currentTheme = htmlEl.getAttribute("data-theme");