import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Headphones, Mail } from "lucide-react";

export function SubscribeSection() {
  return (
    <section className="py-12 md:py-16 lg:py-20 border-b">
      <div className="container">
        <div className="mx-auto max-w-2xl text-center">
          <div className="flex justify-center">
            <div className="rounded-full bg-primary/10 p-3">
              <Headphones className="h-6 w-6 text-primary" />
            </div>
          </div>
          <h2 className="mt-4 text-3xl font-bold tracking-tight">
            هرگز یک قسمت را از دست ندهید
          </h2>
          <p className="mt-2 text-muted-foreground">
            در خبرنامه ما مشترک شوید و از انتشار قسمت های جدید مطلع شوید منتشر
            شد.
          </p>
          <div className="mt-6 flex gap-2 flex-row">
            <Input
              placeholder="ایمیل خود را وارد کنید"
              type="email"
              className="sm:min-w-[300px] bg-background border-2 h-10 py-4"
            />
            <Button className="bg-parch border" size={"lg"}>
              مشترک شوید
              <Mail className="md:mr-2 h-4 w-4" />
            </Button>
          </div>
        </div>
      </div>
    </section>
  );
}
