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

export function RotationHelp() {
  return <Accordion>
    <AccordionItem value="rotation-help">
      <AccordionTrigger>อ่านโรเทชั่นและค่า DPS อย่างไร?</AccordionTrigger>
      <AccordionContent>
        <div className="flex flex-col gap-3 text-sm leading-6 text-muted-foreground">
          <p>DPS คือดาเมจรวมของทีม ÷ เวลาโรเทชั่น ผลคำนวณขึ้นอยู่กับทีม อาวุธ กลุ่มดาว และเงื่อนไขในไกด์ จึงอาจต่างจากดาเมจที่เล่นจริง</p>
          <dl className="grid grid-cols-[auto_1fr] gap-x-4 gap-y-2">
            <dt className="font-semibold text-foreground">E / Q</dt><dd>สกิลธาตุ / ท่าไม้ตาย</dd>
            <dt className="font-semibold text-foreground">N / C / P</dt><dd>โจมตีปกติ / ชาร์จโจมตี / โจมตีพุ่งลง</dd>
            <dt className="font-semibold text-foreground">hP / lP</dt><dd>โจมตีพุ่งลงจากที่สูง (High Plunge) / โจมตีพุ่งลงจากที่ต่ำ (Low Plunge)</dd>
            <dt className="font-semibold text-foreground">D / J / W</dt><dd>แดช / กระโดดเพื่อยกเลิกแอนิเมชั่น / เดินเพื่อยกเลิกแอนิเมชั่น</dd>
            <dt className="font-semibold text-foreground">s</dt><dd>สกิลพิเศษ (เช่น sE สกิลธาตุพิเศษ sQ อันติพิเศษ)</dd>
            <dt className="font-semibold text-foreground">hE / tE</dt><dd>กดสกิลธาตุค้าง / แตะสกิลธาตุ</dd>
            <dt className="font-semibold text-foreground">C0 / R1</dt><dd>กลุ่มดาวระดับ 0 / อาวุธขัดเกลาระดับ 1</dd>
          </dl>
          <p>ตัวอย่าง: <strong className="text-foreground">EQ &gt; N2D</strong> = ใช้สกิลธาตุ ตามด้วยท่าไม้ตาย แล้วโจมตีปกติ 2 ครั้งและแดช เครื่องหมาย &gt; คือทำขั้นตอนถัดไป ส่วน 2[N2C] คือทำชุดโจมตีปกติ 2 ครั้ง + ชาร์จโจมตี ซ้ำ 2 รอบ</p>
        </div>
      </AccordionContent>
    </AccordionItem>
  </Accordion>;
}