function SubscribeForm({ source = 'lp_hero', autoFocus = false }) {
  const [email, setEmail] = React.useState('');
  const [status, setStatus] = React.useState('idle'); // idle | loading | success | error
  const [msg, setMsg] = React.useState('');

  async function onSubmit(e) {
    e.preventDefault();
    if (status === 'loading') return;
    const trimmed = email.trim();
    if (!trimmed || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(trimmed)) {
      setStatus('error');
      setMsg('Bitte eine gültige E-Mail-Adresse eingeben.');
      return;
    }
    setStatus('loading');
    setMsg('');
    try {
      const res = await fetch('/api/subscribe', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ email: trimmed, source }),
      });
      const data = await res.json().catch(() => ({}));
      if (!res.ok) {
        setStatus('error');
        setMsg(data.error || 'Anmeldung fehlgeschlagen. Bitte später nochmal versuchen.');
        return;
      }
      setStatus('success');
      setMsg('Danke! Du bekommst gleich eine Bestätigungs-Mail.');
      setEmail('');
    } catch (err) {
      setStatus('error');
      setMsg('Netzwerkfehler. Bitte später nochmal versuchen.');
    }
  }

  return (
    <div style={{ width: '100%', maxWidth: 540 }}>
      <form className="subscribe-form" onSubmit={onSubmit} noValidate>
        <input
          type="email"
          name="email"
          placeholder="name@unternehmen.de"
          value={email}
          onChange={(e) => setEmail(e.target.value)}
          required
          autoFocus={autoFocus}
          aria-label="E-Mail-Adresse"
          disabled={status === 'loading'}
        />
        <button type="submit" className="btn btn-primary btn-lg" disabled={status === 'loading'}>
          {status === 'loading' ? 'Sende…' : 'Kostenlos abonnieren'}
        </button>
      </form>
      {msg && (
        <div className={`subscribe-form-msg ${status === 'success' ? 'success' : status === 'error' ? 'error' : ''}`}>
          {msg}
        </div>
      )}
    </div>
  );
}
window.SubscribeForm = SubscribeForm;
