{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"faq-6","type":"registry:block","title":"Faq 6","description":"","dependencies":[],"registryDependencies":["https://www.diarmuradi.com/r/styles/base-nova/accordion.json","https://www.diarmuradi.com/r/styles/base-nova/button.json"],"files":[{"path":"faq.tsx","type":"registry:block","content":"\"use client\"\n\nimport {\n  Accordion,\n  AccordionContent,\n  AccordionItem,\n  AccordionTrigger,\n} from \"@/components/ui/accordion\"\nimport { Button } from \"@/components/ui/button\"\n\nconst categories = [\n  {\n    title: \"Account\",\n    items: [\n      {\n        value: \"item-1\",\n        trigger: \"How do I change my email address?\",\n        content:\n          \"You can update your email address in your account settings. We'll send a verification link to confirm the change.\",\n      },\n      {\n        value: \"item-2\",\n        trigger: \"Can I update my payment details online?\",\n        content:\n          \"Yes, you can update your payment information anytime in the billing section of your account settings.\",\n      },\n      {\n        value: \"item-3\",\n        trigger: \"What should I do if I forget my password?\",\n        content:\n          \"Click 'Forgot Password' on the login page and follow the reset instructions sent to your email.\",\n      },\n    ],\n  },\n  {\n    title: \"Support\",\n    items: [\n      {\n        value: \"item-4\",\n        trigger: \"How can I contact customer support?\",\n        content:\n          \"You can reach our support team via live chat, email, or phone. We're available 24/7 to help.\",\n      },\n      {\n        value: \"item-5\",\n        trigger: \"Do you provide weekend assistance?\",\n        content:\n          \"Yes, our support team is available 7 days a week, including weekends and holidays.\",\n      },\n      {\n        value: \"item-6\",\n        trigger: \"Is live chat support available?\",\n        content:\n          \"Yes, live chat support is available during business hours. For after-hours issues, please email us.\",\n      },\n    ],\n  },\n  {\n    title: \"Security\",\n    items: [\n      {\n        value: \"item-9\",\n        trigger: \"How secure is my data?\",\n        content:\n          \"We use bank-level encryption and comply with industry standards. All data is encrypted at rest and in transit.\",\n      },\n      {\n        value: \"item-10\",\n        trigger: \"Do you have two-factor authentication?\",\n        content:\n          \"Yes, we offer two-factor authentication for enhanced account security. You can enable it in your security settings.\",\n      },\n      {\n        value: \"item-11\",\n        trigger: \"How often do you conduct security audits?\",\n        content:\n          \"We conduct comprehensive security audits quarterly and perform continuous monitoring to detect and prevent threats.\",\n      },\n    ],\n  },\n  {\n    title: \"Payments\",\n    items: [\n      {\n        value: \"item-7\",\n        trigger: \"How long does it take to process a payment?\",\n        content:\n          \"Most payments are processed within 1-2 business days depending on your payment method.\",\n      },\n      {\n        value: \"item-8\",\n        trigger: \"Are refunds handled automatically?\",\n        content:\n          \"Yes, refunds are processed automatically and typically appear in your account within 3-5 business days.\",\n      },\n    ],\n  },\n]\n\nexport function Faq() {\n  return (\n    <div className=\"mx-auto flex w-full max-w-3xl flex-col gap-8\">\n      <header className=\"flex flex-col gap-3 md:items-center md:text-center\">\n        <p className=\"w-fit rounded-lg bg-muted px-3 py-2 text-sm text-foreground\">\n          Two columns\n        </p>\n        <div className=\"flex flex-col items-center gap-2\">\n          <h1 className=\"text-3xl font-semibold tracking-tight sm:text-4xl md:text-5xl\">\n            A compact knowledge base\n          </h1>\n          <p className=\"max-w-xl text-muted-foreground md:text-center\">\n            Account, payments, security, and support sit side by side so you can\n            compare topics.\n          </p>\n        </div>\n      </header>\n\n      <div className=\"grid grid-cols-1 gap-4 md:grid-cols-2\">\n        {categories.map((category) => (\n          <div key={category.title} className=\"flex flex-col gap-2\">\n            <h2 className=\"ml-1 text-sm font-medium text-muted-foreground\">\n              {category.title}\n            </h2>\n            <Accordion\n              defaultValue={[category.items[0]?.value]}\n              className=\"gap-2\"\n            >\n              {category.items.map((item) => (\n                <AccordionItem\n                  key={item.value}\n                  value={item.value}\n                  className=\"overflow-hidden rounded-lg border-none bg-muted\"\n                >\n                  <AccordionTrigger className=\"px-4 text-sm text-muted-foreground hover:no-underline aria-expanded:text-foreground\">\n                    {item.trigger}\n                  </AccordionTrigger>\n                  <AccordionContent className=\"flex flex-col gap-2 px-4 pb-2 text-balance text-foreground\">\n                    <p className=\"text-sm\">{item.content}</p>\n                  </AccordionContent>\n                </AccordionItem>\n              ))}\n            </Accordion>\n          </div>\n        ))}\n      </div>\n\n      <div className=\"flex flex-col items-start gap-0.5 text-sm text-muted-foreground md:flex-row md:items-center md:justify-center\">\n        <span>Still have questions? Email us at</span>\n        <Button\n          variant=\"link\"\n          className=\"h-auto p-0 text-foreground\"\n          render={<a href=\"mailto:user@example.com\" />}\n          nativeButton={false}\n        >\n          user@example.com\n        </Button>\n      </div>\n    </div>\n  )\n}","target":"components/faq.tsx"}]}