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

export function AccordionDemo() {
  return (
    <Accordion type="single" collapsible defaultValue="support" variant="bordered">
      <AccordionItem value="support">
        <AccordionTrigger>What support channels are included?</AccordionTrigger>
        <AccordionContent>
          Email, chat, and priority escalation are available. Critical production
          issues receive the fastest response window.
        </AccordionContent>
      </AccordionItem>
      <AccordionItem value="billing">
        <AccordionTrigger>Can billing details be changed?</AccordionTrigger>
        <AccordionContent>
          Yes. Admins can update billing profiles, tax details, and renewal
          preferences from the account settings area.
        </AccordionContent>
      </AccordionItem>
      <AccordionItem value="arabic">
        <AccordionTrigger>هل يدعم المكون العربية؟</AccordionTrigger>
        <AccordionContent>
          نعم. يرث المكون اتجاه الصفحة، وتستخدم المسافات محاور منطقية لتعمل
          بشكل صحيح في الواجهات العربية والإنجليزية.
        </AccordionContent>
      </AccordionItem>
    </Accordion>
  )
}
