function openSignup() {
  document.getElementById('signupModal').classList.add('active');
  document.getElementById('signupForm').style.display = 'block';
  document.getElementById('keyResult').style.display = 'none';
  document.getElementById('signupEmail').value = '';
  document.getElementById('signupError').style.display = 'none';
  setTimeout(function() { document.getElementById('signupEmail').focus(); }, 100);
}

function closeSignup() {
  document.getElementById('signupModal').classList.remove('active');
}

// Close on overlay click
document.getElementById('signupModal').addEventListener('click', function(e) {
  if (e.target === this) closeSignup();
});

// Submit on Enter
document.getElementById('signupEmail').addEventListener('keydown', function(e) {
  if (e.key === 'Enter') submitSignup();
});

async function submitSignup() {
  var email = document.getElementById('signupEmail').value.trim();
  var errEl = document.getElementById('signupError');
  var btn = document.getElementById('signupBtn');

  if (!email) {
    errEl.textContent = 'Please enter your email.';
    errEl.style.display = 'block';
    return;
  }

  btn.textContent = 'Creating...';
  btn.disabled = true;

  try {
    var res = await fetch('/v1/signup/free', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ email: email })
    });
    var data = await res.json();

    if (!res.ok) {
      errEl.textContent = data.error || 'Something went wrong.';
      errEl.style.display = 'block';
      btn.textContent = 'Get API Key';
      btn.disabled = false;
      return;
    }

    // Show key
    document.getElementById('signupForm').style.display = 'none';
    document.getElementById('keyResult').style.display = 'block';
    document.getElementById('apiKeyDisplay').textContent = data.apiKey;
  } catch (err) {
    errEl.textContent = 'Network error. Please try again.';
    errEl.style.display = 'block';
    btn.textContent = 'Get API Key';
    btn.disabled = false;
  }
}

function copyKey() {
  var key = document.getElementById('apiKeyDisplay').textContent;
  navigator.clipboard.writeText(key).then(function() {
    var btn = document.getElementById('apiKeyDisplay'); var origText = btn.textContent; btn.textContent = 'Copied!'; document.querySelector('.copy-hint').textContent = '✓ Copied!';
    setTimeout(function() { btn.textContent = origText; document.querySelector('.copy-hint').textContent = 'Click to copy'; }, 2000);
  });
}

async function checkout() {
  try {
    var res = await fetch('/v1/billing/checkout', { method: 'POST' });
    var data = await res.json();
    if (data.url) window.location.href = data.url;
    else alert('Something went wrong. Please try again.');
  } catch (err) {
    alert('Something went wrong. Please try again.');
  }
}

// BUG-005 fix: attach all click handlers via JS instead of inline onclick
document.addEventListener('DOMContentLoaded', function() {
  document.getElementById('btn-signup').addEventListener('click', openSignup);
  document.getElementById('btn-signup-2').addEventListener('click', openSignup);
  document.getElementById('btn-checkout').addEventListener('click', checkout);
  document.getElementById('btn-close-signup').addEventListener('click', closeSignup);
  document.getElementById('signupBtn').addEventListener('click', submitSignup);
  document.getElementById('apiKeyDisplay').addEventListener('click', copyKey);
});