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

const Faq = async () => {
    const data = await prisma?.faqQuestion.findMany();

    return (
        <>
            <div className="container mx-auto px-4 py-8 min-h-[90vh]">
                <h2 className="text-[#111] text-xl text-center py-4 pb-10  sm:text-[44px] font-bold leading-6 sm:leading-[48px]  ">Frequently Asked Questions</h2>
                <Accordion type="single" collapsible className="w-full max-w-4xl mx-auto">
                    {
                        data?.map((item) => (
                            <AccordionItem key={item.id} value={`item-${item.id}`} className="border-b">
                                <AccordionTrigger className="text-xl text-[#157bb5] py-6 px-2 hover:no-underline hover:bg-gray-50">
                                    {item.question}
                                </AccordionTrigger>
                                <AccordionContent className="text-lg pb-6">
                                    {item.answer}
                                </AccordionContent>
                            </AccordionItem>
                        ))
                    }
                </Accordion>
            </div>
        </>
    );
};

export default Faq;