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

export const NewsletterSection = () => {
  return (
    <section className="py-16 bg-gradient-to-r from-purple-500 to-pink-400 text-white">
      <div className="container mx-auto px-6">
        <div className="max-w-3xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-4 ">Stay Connected</h2>
          <p className="mb-8 opacity-90">
            Subscribe to our newsletter for helpful resources, event
            announcements, and therapeutic insights.
          </p>
          <div className="flex flex-col sm:flex-row gap-4 max-w-lg mx-auto">
            <Input
              placeholder="Your email address"
              className="bg-white/20 border-white/30 text-white placeholder:text-white/70 focus:border-white"
            />
            <Button className="bg-white text-purple-700 hover:bg-white/90 !rounded-button whitespace-nowrap cursor-pointer">
              Subscribe
            </Button>
          </div>
        </div>
      </div>
    </section>
  );
};