// Theme Toggle Component
export class ThemeToggle {
  constructor() {
    this.html = document.documentElement;
    this.toggle = document.getElementById('themeToggle');
    this.init();
  }

  init() {
    // Load saved theme
    const savedTheme = localStorage.getItem('theme') || 'light';
    this.html.setAttribute('data-theme', savedTheme);

    if (this.toggle) {
      this.toggle.addEventListener('click', () => this.toggleTheme());
    }
  }

  toggleTheme() {
    const currentTheme = this.html.getAttribute('data-theme');
    const newTheme = currentTheme === 'dark' ? 'light' : 'dark';
    this.html.setAttribute('data-theme', newTheme);
    localStorage.setItem('theme', newTheme);
  }
}