(function(){
  const mountFloating = () => {
    if (!window.CRMI_AI_AGENT || !CRMI_AI_AGENT.showBubble) return;
    // Avoid duplicating if shortcode already present and we only want floating
    const rootId = 'crmi-ai-agent-floating-root';
    const root = document.getElementById(rootId);
    if (!root) return;

    const bubble = document.createElement('div');
    bubble.className = 'crmi-ai-bubble';
    bubble.innerHTML = '<span>💬</span>';
    bubble.title = 'Chat CRMI';
    document.body.appendChild(bubble);

    const panel = document.createElement('div');
    panel.className = 'crmi-ai-agent crmi-floating';
    panel.innerHTML = `
      <div class="crmi-header">
        <div class="crmi-title">Assistente CRMI</div>
        <button class="crmi-close" aria-label="Chiudi">×</button>
      </div>
      <div class="crmi-body" id="crmi-body"></div>
      <div class="crmi-gdpr"></div>
      <form class="crmi-input" autocomplete="off">
        <input type="text" class="crmi-text" placeholder="Scrivi qui..." />
        <button type="submit" class="crmi-send">Invia</button>
      </form>
      <div class="crmi-handoff"></div>
    `;
    document.body.appendChild(panel);

    const brand = CRMI_AI_AGENT.brand || '#000000';
    panel.style.setProperty('--crmi-brand', brand);

    const body = panel.querySelector('#crmi-body');
    const input = panel.querySelector('.crmi-text');
    const form = panel.querySelector('form');
    const gdpr = panel.querySelector('.crmi-gdpr');
    gdpr.textContent = CRMI_AI_AGENT.gdpr || '';

    // Welcome
    const welcome = CRMI_AI_AGENT.welcome || 'Ciao! Come posso aiutarti?';
    pushMessage(body, 'assistant', welcome);

    // Handoff buttons
    renderHandoff(panel.querySelector('.crmi-handoff'));

    bubble.addEventListener('click', () => {
      panel.classList.toggle('open');
    });
    panel.querySelector('.crmi-close').addEventListener('click', () => {
      panel.classList.remove('open');
    });

    // Conversation state (localStorage)
    const key = 'crmi_ai_dialog';
    let history = JSON.parse(localStorage.getItem(key) || '[]');
    if (history.length) {
      body.innerHTML = '';
      history.forEach(m => pushMessage(body, m.role, m.content));
    } else {
      history.push({role:'assistant', content: welcome});
      localStorage.setItem(key, JSON.stringify(history));
    }

    form.addEventListener('submit', async (e) => {
      e.preventDefault();
      const text = input.value.trim();
      if (!text) return;
      input.value = '';
      pushMessage(body, 'user', text);
      history.push({role:'user', content:text});
      localStorage.setItem(key, JSON.stringify(history));
      const reply = await callAPI(history);
      if (reply && reply.content) {
        pushMessage(body, 'assistant', reply.content);
        history.push({role:'assistant', content: reply.content});
        localStorage.setItem(key, JSON.stringify(history));
      }
      body.scrollTop = body.scrollHeight;
    });
  };

  function renderHandoff(container){
    container.innerHTML = '';
    const { whatsapp, email } = CRMI_AI_AGENT.fallback || {};
    if (whatsapp) {
      const a = document.createElement('a');
      a.className = 'crmi-wa';
      a.href = 'https://wa.me/' + encodeURIComponent(whatsapp);
      a.target = '_blank';
      a.rel = 'noopener';
      a.textContent = 'Parla con un operatore (WhatsApp)';
      container.appendChild(a);
    }
    if (email) {
      const a2 = document.createElement('a');
      a2.className = 'crmi-mail';
      a2.href = 'mailto:' + email;
      a2.textContent = 'Scrivi a un operatore';
      container.appendChild(a2);
    }
  }

  function pushMessage(body, role, text){
    const row = document.createElement('div');
    row.className = 'crmi-msg ' + role;
    row.innerHTML = `<div class="crmi-bubble">${escapeHtml(text)}</div>`;
    body.appendChild(row);
    body.scrollTop = body.scrollHeight;
  }

  function escapeHtml(s){
    return s.replace(/[&<>"']/g, (m)=>({ '&':'&amp;', '<':'&lt;', '>':'&gt;', '"':'&quot;', "'":'&#039;' }[m]));
  }

  async function callAPI(history){
    try {
      const res = await fetch(CRMI_AI_AGENT.restUrl + '?_wpnonce=' + encodeURIComponent(CRMI_AI_AGENT.nonce), {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ messages: history.filter(m => m.role !== 'system') })
      });
      if (!res.ok) {
        const t = await res.text();
        return { content: 'Errore di rete ('+res.status+'): ' + t };
      }
      const data = await res.json();
      if (data.reply) return { content: data.reply };
      return { content: 'Nessuna risposta dal modello.' };
    } catch (e) {
      return { content: 'Errore: ' + (e && e.message ? e.message : e) };
    }
  }

  // Inline shortcode mounts are handled simply by rendering welcome and wiring events after DOM ready
  const mountInline = () => {
    document.querySelectorAll('.crmi-ai-agent.crmi-inline').forEach((panel) => {
      const brand = CRMI_AI_AGENT.brand || '#000000';
      panel.style.setProperty('--crmi-brand', brand);

      const body = panel.querySelector('.crmi-body');
      const input = panel.querySelector('.crmi-text');
      const form = panel.querySelector('form');
      const gdpr = panel.querySelector('.crmi-gdpr');
      gdpr.textContent = CRMI_AI_AGENT.gdpr || '';

      const welcome = CRMI_AI_AGENT.welcome || 'Ciao! Come posso aiutarti?';
      pushMessage(body, 'assistant', welcome);

      renderHandoff(panel.querySelector('.crmi-handoff'));

      const key = 'crmi_ai_dialog_inline';
      let history = JSON.parse(localStorage.getItem(key) || '[]');
      if (history.length) {
        body.innerHTML = '';
        history.forEach(m => pushMessage(body, m.role, m.content));
      } else {
        history.push({role:'assistant', content: welcome});
        localStorage.setItem(key, JSON.stringify(history));
      }

      form.addEventListener('submit', async (e) => {
        e.preventDefault();
        const text = input.value.trim();
        if (!text) return;
        input.value = '';
        pushMessage(body, 'user', text);
        history.push({role:'user', content:text});
        localStorage.setItem(key, JSON.stringify(history));
        const reply = await callAPI(history);
        if (reply && reply.content) {
          pushMessage(body, 'assistant', reply.content);
          history.push({role:'assistant', content: reply.content});
          localStorage.setItem(key, JSON.stringify(history));
        }
        body.scrollTop = body.scrollHeight;
      });
    });
  };

  document.addEventListener('DOMContentLoaded', function(){
    mountFloating();
    mountInline();
  });
})();