import {
  Accordion,
  AccordionContent,
  AccordionItem,
  AccordionTrigger,
} from "@/components/ui/accordion";
import { cn } from "@/lib/utils";

const faqs = [
  {
    question: "فرم جذب سرنخ به CRM وصل می‌شود؟",
    answer:
      "بله. هر ارسال فرم رکورد جدید می‌سازد و منبع کانال برای گزارش هزینه جذب ثبت می‌شود.",
  },
  {
    question: "چطور کیفیت سرنخ را قبل از ارجاع بسنجم؟",
    answer:
      "با امتیاز تناسب و قوانین واجد شرایط بودن، فقط سرنخ‌های آماده به صف فروش می‌روند.",
  },
  {
    question: "آیا لندینگ بدون تیم فنی ساخته می‌شود؟",
    answer:
      "قالب‌های آماده را ویرایش کنید، فرم و ردیابی را فعال کنید و بدون استقرار جداگانه منتشر شوید.",
  },
  {
    question: "هزینه جذب هر کانال را می‌بینم؟",
    answer:
      "بودجه، تعداد سرنخ و هزینه به‌ازای تبدیل در داشبورد کانال‌ها کنار هم قرار می‌گیرد.",
  },
  {
    question: "اعلان سرنخ جدید چطور به فروش می‌رسد؟",
    answer:
      "اعلان لحظه‌ای در اپ، ایمیل یا پیام‌رسان تیم ارسال می‌شود تا زمان پاسخ اولیه کوتاه بماند.",
  },
];

interface Faq9Props {
  className?: string;
}

const Faq9 = ({ className }: Faq9Props) => {
  return (
    <section dir="rtl" lang="fa" className={cn("py-32", className)}>
      <div className="container mx-auto max-w-3xl">
        <h2 className="mt-2 mb-12 text-center text-3xl font-bold md:text-2xll">
          پرسش‌های جذب سرنخ
                          </h2>
        <Accordion type="multiple" className="text-start">
          {faqs.map((faq, index) => (
            <AccordionItem
              key={index}
              value={`item-${index}`}
              className="mb-2 rounded-md border-b-0 bg-muted px-5 py-2 md:mb-4"
            >
              <AccordionTrigger className="text-start">
                {faq.question}
              </AccordionTrigger>
              <AccordionContent>{faq.answer}</AccordionContent>
            </AccordionItem>
          ))}
        </Accordion>
      </div>
    </section>
  );
};

export { Faq9 };