Dark mode switch Lit

my-app.ts

  @state()
  private _isDarkMode = this._getInitialTheme();

  private _getInitialTheme(): boolean {
    const storedTheme = localStorage.getItem('theme');
    if (storedTheme) {
        return storedTheme === 'dark';
    } else {
        return window.matchMedia('(prefers-color-scheme: dark)').matches;
    }
  }

  connectedCallback() {
    super.connectedCallback();
    this._applyTheme();
  }

  private _toggleTheme() {
    this._isDarkMode = !this._isDarkMode;
    localStorage.setItem('theme', this._isDarkMode ? 'dark' : 'light');
    this._applyTheme();
  }

  private _applyTheme() {
    if (this._isDarkMode) {
      document.documentElement.classList.add('dark-theme');
    } else {
      document.documentElement.classList.remove('dark-theme');
    }
  }

theme.css

:root.dark-theme {
    --bg-color: #121212;
    --text-color: #eeeeee;
    --primary-color: #0b5ed7;
}