/* ============================================================
   THEME.JS — Hell/Dunkel ohne Inline-Skript (CSP-fest)
   Version: 2.1.0

   Im <head> OHNE defer einbinden, damit das Theme vor dem ersten Rendern
   steht (kein Aufflackern):
     <script src="/static/js/theme.js"></script>

   Umschalten: <button data-action="theme-toggle">…</button>
   Icons: .icon-theme-light / .icon-theme-dark (components.css) zeigen sich
   je nach Theme, ganz ohne JavaScript.

   Gespeichert in localStorage unter "theme". Ohne gespeicherten Wert gilt
   prefers-color-scheme des Systems.
   ============================================================ */

(function () {
  var root = document.documentElement;

  function gespeichert() {
    try { return localStorage.getItem('theme'); } catch (e) { return null; }
  }

  function setzen(theme) {
    root.dataset.theme = theme;
    try { localStorage.setItem('theme', theme); } catch (e) { /* privat oder gesperrt */ }
  }

  var start = gespeichert();
  if (!start && window.matchMedia) {
    start = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
  }
  root.dataset.theme = start || root.dataset.theme || 'light';

  document.addEventListener('click', function (e) {
    var el = e.target.closest && e.target.closest('[data-action="theme-toggle"]');
    if (el) setzen(root.dataset.theme === 'dark' ? 'light' : 'dark');
  });
})();