Email Capture Section

"use client"

import { AccountsPayableHero } from "@/components/ui/email-capture-section"
import { useState } from "react"

export default function AccountsPayableHeroDemo() {
  const [submitted, setSubmitted] = useState(false)

  const handleSubmit = (email: string) => {
    console.log("Email submitted:", email)
    setSubmitted(true)
    setTimeout(() => setSubmitted(false), 3000)
  }

  const handleDemo = () => {
    console.log("Demo clicked")
  }

  return (
    <div className="w-full">
      {submitted && (
        <div className="fixed top-4 right-4 bg-green-500 text-white px-6 py-3 rounded-full shadow-lg animate-in fade-in slide-in-from-top-2 duration-300 z-50">
          ✓ Email received! Check your inbox for next steps.
        </div>
      )}

      <AccountsPayableHero
        heading="Get started with Acctual's accounts payable today"
        subheading="Streamline your payment processes with intelligent automation"
        inputPlaceholder="Enter your work email"
        buttonText="See a demo"
        poweredByText="Designed by Ravi Katiyar"
        stickyNoteText="Everything's looking great! Thanks!"
        onSubmit={handleSubmit}
        onDemoClick={handleDemo}
      />
    </div>
  )
}