// ui/circleTheme.js
// Controla a exibição do círculo do ícone dos cards conforme o tema

//   const THEMES = [
//     { value:"dark", label:"Escuro", dotFg: "#fff", dotBg: "#1e293b" },
//     { value:"light", label:"Claro", dotFg: "#222", dotBg: "#e5e7eb" },
//     { value:"amoled", label:"AMOLED", dotFg: "#fff", dotBg: "#181818" },
//     { value:"contrast", label:"Alto Contraste", dotFg: "#fff", dotBg: "#000" },
//     { value:"solarized", label:"Solarizado", dotFg: "#073642", dotBg: "#eee8d5" },
//     { value:"neonblue", label:"Azul Neon", dotFg: "#fff", dotBg: "#1e293b" },
//     { value:"matrix", label:"Verde Matrix", dotFg: "#00ff00", dotBg: "#181818" },
//     { value:"hep", label:"Tema HEP", dotFg: "#fff", dotBg: "#1e293b" }

(function() {
  // Temas e cores do círculo
  const THEMES = [
    { value:"dark",      label:"Escuro",         dotBg: "#425675ff" },
    { value:"light",     label:"Claro",          dotBg: "#e5e7eb" },
    { value:"amoled",    label:"AMOLED",         dotBg: "#5e5e5fff" },
    { value:"contrast",  label:"Alto Contraste", dotBg: "#a6a6a8ff" },
    { value:"solarized", label:"Solarizado",     dotBg: "#eee8d5" },
    { value:"neonblue",  label:"Azul Neon",      dotBg: "#446cacff" },
    { value:"matrix",    label:"Verde Matrix",   dotBg: "#2ebd03ff" },
    { value:"hep",       label:"Tema HEP",       dotBg: "#1e293b" }
  ];
  // Temas que exibem o círculo
  const THEMES_WITH_CIRCLE = ["hep","amoled", "neonblue", "contrast", "matrix"];
  function getCurrentTheme() {
    const themeLink = document.getElementById('themeCSS');
    if (!themeLink) return '';
    const href = themeLink.getAttribute('href') || '';
    const match = href.match(/themes\/(.+?)\.css/);
    return match ? match[1] : '';
  }

  function updateCardIconCircle() {
    const theme = getCurrentTheme();
    const showCircle = THEMES_WITH_CIRCLE.includes(theme);
    document.body.classList.toggle('show-card-icon-circle', showCircle);
    // Define cor do círculo ou transparente
    const themeObj = THEMES.find(t => t.value === theme);
    const color = showCircle && themeObj ? themeObj.dotBg : 'transparent';
    document.body.style.setProperty('--icon-bg', color);
  }

  document.addEventListener('DOMContentLoaded', updateCardIconCircle);
  const themeLink = document.getElementById('themeCSS');
  if (themeLink) {
    themeLink.addEventListener('load', updateCardIconCircle);
    const observer = new MutationObserver(updateCardIconCircle);
    observer.observe(themeLink, { attributes: true, attributeFilter: ['href'] });
    const bodyObserver = new MutationObserver(updateCardIconCircle);
    bodyObserver.observe(document.body, { attributes: true, attributeFilter: ['data-theme'] });
  }
  window.updateCardIconCircle = updateCardIconCircle;
})();
