/* Go Nexus — painel de Tweaks (React) + ponte para o DOM */

const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
  "direcao": "light",
  "palette": ["#2563EB", "#2DD4BF"],
  "headFont": "Space Grotesk",
  "radius": 16,
  "showForm": true,
  "whatsapp": "5533999712069"
}/*EDITMODE-END*/;

const PALETTES = [
  ["#2563EB", "#2DD4BF"],
  ["#3B82F6", "#22D3EE"],
  ["#4F46E5", "#06B6D4"],
  ["#6366F1", "#22D3EE"]
];

const HEAD_FONTS = [
  { value: "Space Grotesk", label: "Space Grotesk" },
  { value: "Sora", label: "Sora" },
  { value: "Outfit", label: "Outfit" },
  { value: "Manrope", label: "Manrope" }
];

function applyTweaks(t) {
  var root = document.documentElement;
  // Direção visual
  root.setAttribute("data-theme", t.direcao || "dark");
  // Cores de acento
  var pal = t.palette || PALETTES[0];
  root.style.setProperty("--accent", pal[0]);
  root.style.setProperty("--accent-2", pal[1] || pal[0]);
  // Tipografia dos títulos
  root.style.setProperty("--font-head", '"' + (t.headFont || "Space Grotesk") + '", system-ui, sans-serif');
  // Cantos
  root.style.setProperty("--r", (t.radius != null ? t.radius : 16) + "px");
  // Logo conforme tema (NEXUS escuro x claro)
  var darkBg = (t.direcao || "dark") === "dark";
  document.querySelectorAll("[data-logo]").forEach(function (img) {
    img.src = darkBg ? "assets/logo-light.png" : "assets/logo.png";
  });
  // Formulário de contato on/off
  var cta = document.querySelector("#contato");
  if (cta) cta.classList.toggle("no-form", !t.showForm);
  // WhatsApp
  if (window.GONEXUS) {
    window.GONEXUS.whatsapp = t.whatsapp || window.GONEXUS.whatsapp;
    if (window.GONEXUS.refreshWhatsApp) window.GONEXUS.refreshWhatsApp();
  }
}

function TweaksApp() {
  const [t, setTweak] = useTweaks(TWEAK_DEFAULTS);

  React.useEffect(function () { applyTweaks(t); }, [t]);

  return (
    React.createElement(TweaksPanel, { title: "Go Nexus — Tweaks" },
      React.createElement(TweakSection, { label: "Direção visual" }),
      React.createElement(TweakRadio, {
        label: "Estilo",
        value: t.direcao,
        options: [
          { value: "dark", label: "Navy" },
          { value: "light", label: "Claro" },
          { value: "gradient", label: "Vibrante" }
        ],
        onChange: function (v) { setTweak("direcao", v); }
      }),
      React.createElement(TweakColor, {
        label: "Cores de destaque",
        value: t.palette,
        options: PALETTES,
        onChange: function (v) { setTweak("palette", v); }
      }),

      React.createElement(TweakSection, { label: "Tipografia & forma" }),
      React.createElement(TweakSelect, {
        label: "Fonte dos títulos",
        value: t.headFont,
        options: HEAD_FONTS,
        onChange: function (v) { setTweak("headFont", v); }
      }),
      React.createElement(TweakSlider, {
        label: "Arredondamento",
        value: t.radius, min: 6, max: 24, unit: "px",
        onChange: function (v) { setTweak("radius", v); }
      }),

      React.createElement(TweakSection, { label: "Contato" }),
      React.createElement(TweakToggle, {
        label: "Formulário de lead",
        value: t.showForm,
        onChange: function (v) { setTweak("showForm", v); }
      }),
      React.createElement(TweakText, {
        label: "WhatsApp (DDD+número)",
        value: t.whatsapp,
        placeholder: "5562999999999",
        onChange: function (v) { setTweak("whatsapp", v); }
      })
    )
  );
}

// Aplica os defaults imediatamente (antes mesmo do painel abrir)
applyTweaks(TWEAK_DEFAULTS);

ReactDOM.createRoot(document.getElementById("tweaks-root")).render(
  React.createElement(TweaksApp)
);