import { Button } from "@/components/ui/button"
import { Input } from "@/components/ui/input"

interface NewsletterSectionProps {
  title: string
  description: string
  buttonText?: string
  layout?: "row" | "column"
  className?: string
}

export function NewsletterSection({
  title,
  description,
  buttonText = "Subscribe",
  layout = "row",
  className,
}: NewsletterSectionProps) {
  return (
    <section className={`w-full py-12 md:py-24 lg:py-32 ${className}`}>
      <div className="container px-4 md:px-6">
        <div className="flex flex-col items-center justify-center space-y-4 text-center">
          <div className="space-y-2">
            <h2 className="text-3xl font-bold tracking-tighter sm:text-4xl">{title}</h2>
            <p className="max-w-[600px] text-gray-500 md:text-xl/relaxed lg:text-base/relaxed xl:text-xl/relaxed dark:text-gray-400">
              {description}
            </p>
          </div>
          <div className={`w-full max-w-md ${layout === "row" ? "flex gap-2" : "space-y-3"}`}>
            <Input
              className={layout === "row" ? "max-w-lg flex-1" : "w-full"}
              placeholder="Enter your email"
              type="email"
            />
            <Button className={layout === "row" ? "" : "w-full"}>{buttonText}</Button>
          </div>
        </div>
      </div>
    </section>
  )
}