const FAQ_ITEMS = [
  // ===== BUYERS — Delivery =====
  { aud:"buyer", cat:"delivery", tag:"Delivery",
    q:"How will I receive my tickets after purchase?",
    a:`<p>Primo Ticketing offers several delivery methods. Your delivery method is selected at checkout and confirmed in your order confirmation email:</p><ul><li><strong>Text:</strong> A text is sent from a 1-866-865-1210 number within 15 minutes of purchase.</li><li><strong>Email:</strong> A PDF is sent to your email within 15 minutes of purchase. Show at event or download and print before the event.</li><li><strong>Will Call:</strong> Pick up your tickets at the venue box office on event day. Bring a valid photo ID and your order confirmation number.</li></ul>` },

  { aud:"buyer", cat:"delivery", tag:"Delivery",
    q:"I never received my ticket confirmation email. What should I do?",
    a:`<p>If you didn't receive a confirmation email after purchase, follow these steps:</p><ul><li>Check your spam or junk folder — confirmation emails and texts occasionally get filtered.</li><li>Make sure you're checking the email address associated with your ticket purchase.</li><li>If you still cannot find it, contact our support team at <a href="mailto:support@primoticketing.com">support@primoticketing.com</a> and we will resend it.</li></ul>` },

  { aud:"buyer", cat:"delivery", tag:"Delivery",
    q:"I received a confirmation or receipt email but there was no ticket attached. Where is my ticket?",
    a:`<p>A receipt or order confirmation email confirms your purchase but may not contain the actual ticket file — tickets are delivered separately depending on your delivery method.</p>` },

  { aud:"buyer", cat:"delivery", tag:"Buyers",
    q:"Can I transfer my tickets to someone else?",
    a:`<p>Yes, you can transfer your unused ticket to someone else.</p>` },

  { aud:"buyer", cat:"delivery", tag:"Buyers",
    q:"The ticket has my name on it, but someone else is attending. Is that a problem?",
    a:`<p>For most events, the name on the ticket does not need to match the attendee's ID. Entry is granted by scanning the QR code on the ticket, regardless of the name printed on it.</p><p>However, there is one exception:</p><ul><li>Some events may have name-specific ticket requirements set by the organizer. Check the event page or your confirmation email for any specific entry requirements.</li></ul><p>If you're unsure whether your event has name-matching requirements, contact our support team before the day of the event.</p>` },

  { aud:"buyer", cat:"delivery", tag:"Buyers",
    q:"Can I add my ticket to Apple Wallet or Google Wallet?",
    a:`<p>Yes. Every Primo ticket includes one-tap "Add to Apple Wallet" and "Add to Google Wallet" buttons in the confirmation email and text. Once added, your ticket lives in your phone's wallet alongside your boarding passes and concert tickets — no need to dig through your inbox at the gate.</p>` },

  // ===== BUYERS — Event info =====
  { aud:"buyer", cat:"event", tag:"Event Info",
    q:"Where can I find details about my event, like the address and start time?",
    a:`<p>All event details — including venue address, door times, show times, and any special instructions — are available in two places:</p><ul><li>Your order confirmation email, sent at the time of purchase.</li><li>The event organizer's website — search for the event by name to find the full details.</li></ul><p>If event details have changed since your purchase, you will be notified by email. Always check your confirmation email and the event page for the most up-to-date information.</p>` },

  { aud:"buyer", cat:"event", tag:"Event Info",
    q:"What is the bag policy for my event?",
    a:`<p>Bag policies are set by the venue and vary by event. To find the policy for your specific event:</p><ul><li>Visit the event organizer's website and check out the Event Info or Venue Details section.</li><li>Visit the venue's official website for full security and entry policy.</li></ul><p>As a rule, most venues allow small clutches or bags no larger than 4.5" x 6.5". Oversized bags, backpacks, and outside food and beverages are commonly prohibited. We recommend checking before you arrive to avoid delays at entry.</p>` },

  { aud:"buyer", cat:"event", tag:"Event Info",
    q:"Is parking available at the venue?",
    a:`<p>Parking availability and pricing vary by venue and event. To find parking information for your event:</p><ul><li>Check the event page on the event organizer's website — parking details are listed when provided by the venue.</li><li>Visit the venue's official website for lot locations, pricing, and pre-purchase options.</li></ul><p>We recommend arriving early, especially for large events, as nearby parking can fill up quickly.</p>` },

  { aud:"buyer", cat:"event", tag:"Event Info",
    q:"Do you offer military discounts on tickets?",
    a:`<p>All tickets are priced as listed on the event organizer's website. Pricing may vary by ticket type (single-day, two-day, etc.) If you have questions about available ticket types or pricing for a specific event, visit the event organizer's website or contact our support team at <a href="mailto:support@primoticketing.com">support@primoticketing.com</a>.</p>` },

  // ===== BUYERS — Checkout =====
  { aud:"buyer", cat:"checkout", tag:"Checkout",
    q:"What payment methods does Primo Ticketing accept?",
    a:`<p>Primo Ticketing accepts the following payment methods at checkout:</p><ul><li><strong>Major credit and debit cards:</strong> Visa, Mastercard, American Express, Discover</li><li><strong>Digital wallets:</strong> Apple Pay, Google Pay</li></ul>` },

  { aud:"buyer", cat:"checkout", tag:"Checkout",
    q:"I was charged but never received an order or receipt confirmation. Was my order placed?",
    a:`<p>If you see a charge on your account but haven't received a confirmation email, follow these steps:</p><ul><li>Check your spam or junk folder for confirmation from Primo Ticketing.</li><li>If no order appears and the charge is on your statement, contact our support team immediately at <a href="mailto:support@primoticketing.com">support@primoticketing.com</a> with the charge amount and date so we can investigate.</li></ul>` },

  { aud:"buyer", cat:"checkout", tag:"Checkout",
    q:"I made a mistake on my order (wrong event, wrong quantity). Can I change it?",
    a:`<p>Orders cannot be edited after they are placed. If you purchased the wrong tickets, here are your options. Email <a href="mailto:support@primoticketing.com">support@primoticketing.com</a> with your name, email and phone used to purchase the tickets, event name and order number.</p><p>We are unable to guarantee changes or cancellations outside of the event's stated refund policy.</p>` },

  // ===== BUYERS — Refunds =====
  { aud:"buyer", cat:"refunds", tag:"Refunds",
    q:"Can I get a refund on my tickets?",
    a:`<p>Generally speaking, there are no refunds for events. However, refund eligibility can depend on the event organizer's policy and the timing of your request.</p><p>Contact our support team at <a href="mailto:support@primoticketing.com">support@primoticketing.com</a> for further assistance.</p>` },

  { aud:"buyer", cat:"refunds", tag:"Refunds",
    q:"The event I purchased tickets for was cancelled. What happens now?",
    a:`<p>If an event is officially cancelled by the organizer, you are entitled to a full refund of your ticket price and service fees. Here's what to expect:</p><ul><li>You will receive an email and/or text notification confirming the cancellation and your refund.</li><li>Refunds are automatically processed to your original payment method — no action is needed on your end.</li><li>Allow 5–10 business days for the refund to appear on your statement.</li></ul><p>If you do not receive a refund confirmation email within 72 hours of the cancellation announcement, contact our support team with your ticket number.</p>` },

  { aud:"buyer", cat:"refunds", tag:"Refunds",
    q:"The event was postponed. Can I get a refund or do I have to keep my tickets?",
    a:`<p>If an event is postponed, there are usually two options:</p><ul><li><strong>Keep your tickets</strong> — they will automatically be valid for the new date. You can still request a refund within 14 days of the postponement announcement.</li><li><strong>To request a refund for a postponed event:</strong> Send a request to <a href="mailto:support@primoticketing.com">support@primoticketing.com</a>.</li></ul><p>After the 14-day window closes, tickets are no longer eligible for a refund and will remain valid for the rescheduled date.</p>` },

  { aud:"buyer", cat:"refunds", tag:"Refunds",
    q:"Are ticket fees and facility fees refundable?",
    a:`<p>It depends on the situation:</p><ul><li><strong>If an event is cancelled:</strong> Both the ticket price and fees are fully refunded.</li><li><strong>If you cancel within the refund window:</strong> The ticket price may be refunded per the organizer's policy, but ticket fees and facility fees are non-refundable.</li><li><strong>If the refund window has passed:</strong> No fees are refundable.</li></ul>` },

  { aud:"buyer", cat:"refunds", tag:"Refunds",
    q:"How long does it take to receive my refund?",
    a:`<p>Once a refund is approved and processed, please allow 5–10 business days for the amount to appear on your original payment method. Timelines may vary depending on your bank or card issuer. If your refund has not appeared after 10 business days, contact your bank first, then reach out to our support team at <a href="mailto:support@primoticketing.com">support@primoticketing.com</a> with your order number and refund confirmation.</p>` },

  { aud:"buyer", cat:"refunds", tag:"Refunds",
    q:"I missed the event because of parking issues. Can I get a refund?",
    a:`<p>We understand how frustrating parking situations can be. However, inability to park or access the venue is not covered under our standard refund policy, as parking is outside of Primo Ticketing's control. Tickets are considered used once the event has begun, regardless of whether the customer was able to attend.</p><p>If you were completely unable to enter the venue and your ticket was never scanned, please contact our support team at <a href="mailto:support@primoticketing.com">support@primoticketing.com</a> with your order/ticket number, full name and contact information, event name and date, and a brief description of what happened.</p><p>Refund eligibility in these cases is reviewed individually and is subject to the event organizer's approval.</p>` },

  { aud:"buyer", cat:"refunds", tag:"Refunds",
    q:"If my team doesn't advance to Day 2, can I get a partial refund on my two-day ticket?",
    a:`<p>Partial refunds on two-day or multi-day tickets are not guaranteed and depend on the event organizer's policy. If your situation changes and you will not be attending on all days covered by your ticket, contact our support team as early as possible at <a href="mailto:support@primoticketing.com">support@primoticketing.com</a> with your order number and the event name. Our team will check with the organizer on refund eligibility for your specific case.</p>` },

  // ===== BUYERS — Day of =====
  { aud:"buyer", cat:"dayof", tag:"Day-of",
    q:"I'm at the venue and my ticket isn't scanning. What do I do?",
    a:`<p>If your ticket won't scan at entry, try the following steps immediately:</p><ul><li>Make sure your screen is bright and turned all the way up.</li><li>Ensure your device is updated to the latest version.</li><li>If using a print-at-home ticket, make sure the barcode is clean and unobstructed.</li><li>Ask the venue staff to try manual entry using your order number.</li></ul><p>If none of this works, go directly to the venue's Box Office or Guest Services window with your order confirmation number and a valid photo ID.</p>` },

  { aud:"buyer", cat:"dayof", tag:"Day-of",
    q:"I lost my phone at the event and can't access my tickets. What should I do?",
    a:`<p>Go directly to the venue's Box Office or Guest Services window as soon as possible. Bring the following:</p><ul><li>A valid government-issued photo ID</li><li>Your order confirmation number (check your email on another device if possible)</li></ul><p>Venue staff can verify your identity and grant entry in most cases.</p>` },

  // ===== PRODUCERS — Pricing =====
  { aud:"producer", cat:"pricing", tag:"Fees",
    q:"What does Primo cost the event producer?",
    a:`<p>Nothing. Primo is free for event producers — no setup fees, no monthly fees, no transaction fees. We're paid by a flat service fee that's collected from the ticket buyer at checkout. That fee covers card processing, chargeback protection, refund management, fraud protection, on-site scanning equipment, sponsor management tools, and live US-based support.</p>` },

  { aud:"producer", cat:"pricing", tag:"Fees",
    q:"What does the service fee actually cover?",
    a:`<p>Everything. The fee is the only charge anywhere in the transaction — there are no hidden add-ons, processing surcharges, or "convenience fees" stacked on top. the average buyer pays about $3.41 in service fees per ticket (based on a $25 ticket price). See our <a href="#pricing">Pricing page</a> for the full breakdown.</p>` },

  { aud:"producer", cat:"pricing", tag:"Payouts",
    q:"How and when do I get paid as a producer?",
    a:`<p>Payouts flow directly to your bank account through our Stripe-powered payments system. Onboarding takes about five minutes — connect your bank, confirm your business info, and you're live. Funds typically arrive within 2 business days of each ticket sale.</p>` },

  // ===== PRODUCERS — Getting started =====
  { aud:"producer", cat:"getting-started", tag:"Producers",
    q:"How long does it take to get a new event live?",
    a:`<p>Most producers are live and selling tickets within a week of signing up. The event builder walks you through three quick steps — event basics, ticket setup, and review — and produces a ready-to-share landing page for spectator tickets.</p>` },

  { aud:"producer", cat:"getting-started", tag:"Producers",
    q:"Can I migrate from another ticketing platform mid-season?",
    a:`<p>Yes, and we'll help. Many producers switch to Primo for their next event without disrupting the current one. Our team will help map your existing setup (ticket types, sponsors, pricing) into Primo, and we'll honor any tickets already sold elsewhere by importing them as comp entries.</p>` },

  // ===== PRODUCERS — Features =====
  { aud:"producer", cat:"features", tag:"Producers",
    q:"What kinds of cheer & dance events can I sell tickets for?",
    a:`<p>All of them — single- and multi-day championships, regional and national competitions, dance competitions (solos, duets, small and large groups, lines and productions), school and collegiate showcases, and end-of-season recitals. If you run a cheer or dance event, Primo sells tickets for it. You can also copy a full event setup from a past event in one click.</p>` },

  { aud:"producer", cat:"features", tag:"Producers",
    q:"Can I run promo codes, early-bird pricing, or comp tickets?",
    a:`<p>All of the above. Each event supports unlimited promo codes (percentage or flat-dollar, with optional usage caps and date windows), early-bird pricing tiers, comp tickets for sponsors and staff, and group discounts.</p>` },

  { aud:"producer", cat:"features", tag:"Producers",
    q:"How does sponsor management work?",
    a:`<p>Sponsorships are a first-class part of Primo — not a spreadsheet bolted on. Set up tiers (Title, Gold, Silver, Bronze), track contract values, monitor outstanding payments, and the system auto-applies sponsor logos to tickets and confirmation emails. You can reuse the same sponsor library across every event in your season.</p>` },

  // ===== PRODUCERS — Support =====
  { aud:"producer", cat:"support", tag:"Support",
    q:"Is your support team really available on the weekend?",
    a:`<p>Yes — that's a promise. Most cheer &amp; dance events run on weekends, so that's when we're on. Call our support line during event hours and a real human picks up. No bot, no faceless support queue. We've helped producers solve at-the-gate scanning issues, last-minute schedule changes, and even bank account hiccups mid-event.</p>` },

  // ===== PRODUCERS — On-site =====
  { aud:"producer", cat:"onsite", tag:"On-site",
    q:"What hardware do I need to scan tickets at the door?",
    a:`<p>Nothing fancy — any iPhone or Android with the Primo scanner app can scan QR-coded tickets. For larger venues, we can ship dedicated scanning gear at no extra cost. Concessions, merch, and other retail run separately on Square POS, which we recommend for that side of the operation.</p>` },

  { aud:"producer", cat:"onsite", tag:"On-site",
    q:"Does scanning work if the venue Wi-Fi goes down?",
    a:`<p>Yes. The scanner app caches your guest list locally so check-ins still work offline, and re-syncs to the dashboard as soon as connectivity is restored. We also color-code tickets by type and day, which gives gate staff a fast visual check even before scanning.</p>` },

  { aud:"producer", cat:"onsite", tag:"On-site",
    q:"How do you prevent ticket fraud or duplicates at the gate?",
    a:`<p>Every Primo ticket has a one-time-use QR code. Once it's scanned in, any duplicate or screenshot is flagged immediately. Tickets are also color-coded by type and event day, so a fraudulent screenshot of a Saturday ticket is obvious to staff working the Sunday gate.</p>` },

  { aud:"producer", cat:"onsite", tag:"On-site",
    q:"Can we sell walk-up tickets at the door?",
    a:`<p>Absolutely. Walk-up sales run through the same Primo app — guests pay by card (Apple Pay, Google Pay, all major cards) right on your device. The transaction lands in the same real-time dashboard as your online sales, so reconciliation at the end of the day is a single report.</p>` },
];

const BUYER_CATS = [
  { value:"all",      label:"All questions" },
  { value:"delivery", label:"Tickets & delivery" },
  { value:"event",    label:"Event info" },
  { value:"checkout", label:"Payment & checkout" },
  { value:"refunds",  label:"Refunds & changes" },
  { value:"dayof",    label:"At the event" },
];

const PRODUCER_CATS = [
  { value:"all",             label:"All questions" },
  { value:"pricing",         label:"Pricing & payouts" },
  { value:"getting-started", label:"Getting started" },
  { value:"features",        label:"Features & setup" },
  { value:"onsite",          label:"On-site & check-in" },
  { value:"support",         label:"Support" },
];

function FaqPage() {
  const [aud, setAud] = React.useState("buyer");
  const [cat, setCat] = React.useState("all");

  function switchAud(newAud) {
    setAud(newAud);
    setCat("all");
  }

  const cats = aud === "buyer" ? BUYER_CATS : PRODUCER_CATS;

  const visible = FAQ_ITEMS.filter(item =>
    item.aud === aud && (cat === "all" || item.cat === cat)
  );

  const plusIcon = (
    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round">
      <line x1="12" y1="5" x2="12" y2="19"/>
      <line x1="5" y1="12" x2="19" y2="12"/>
    </svg>
  );

  return (
    <>
      {/* Hero */}
      <section className="faq-hero">
        <div className="wrap">
          <span className="eyebrow"><span className="dot"></span>Frequently Asked Questions</span>
          <h1>You've got questions. <span className="faq-accent">We've got answers.</span></h1>
          <p className="faq-lede">We're here to help you navigate seamlessly through the ticketing process — from buying and managing tickets to setting up your event and getting paid.</p>
        </div>
      </section>

      {/* Audience + category filters */}
      <section className="faq-cats">
        <div className="wrap">
          <div className="aud-toggle" role="tablist" aria-label="Choose audience">
            <button
              className={"aud-btn" + (aud === "buyer" ? " active" : "")}
              onClick={() => switchAud("buyer")}
              role="tab"
              aria-selected={aud === "buyer"}
            >
              <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" style={{width:16,height:16}}>
                <path d="M3 9a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><path d="M3 10h18"/><circle cx="7.5" cy="13.5" r="1"/>
              </svg>
              I'm a ticket buyer
            </button>
            <button
              className={"aud-btn" + (aud === "producer" ? " active" : "")}
              onClick={() => switchAud("producer")}
              role="tab"
              aria-selected={aud === "producer"}
            >
              <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" style={{width:16,height:16}}>
                <path d="M3 21h18"/><path d="M5 21V7l8-4v18"/><path d="M19 21V11l-6-4"/><path d="M9 9v.01M9 12v.01M9 15v.01"/>
              </svg>
              I run events
            </button>
          </div>

          <div className="cat-row">
            {cats.map(c => (
              <button
                key={c.value}
                className={"cat-chip" + (cat === c.value ? " active" : "")}
                onClick={() => setCat(c.value)}
              >
                {c.label}
              </button>
            ))}
          </div>
        </div>
      </section>

      {/* FAQ list */}
      <section className="faq-section">
        <div className="wrap">
          <div className="faq-list">
            {visible.map((item, i) => (
              <details key={aud + "-" + cat + "-" + i} className="faq-item">
                <summary>
                  <span className="tag">{item.tag}</span>
                  <span className="q-text">{item.q}</span>
                  <span className="icon">{plusIcon}</span>
                </summary>
                <div className="answer" dangerouslySetInnerHTML={{ __html: item.a }} />
              </details>
            ))}
          </div>
        </div>
      </section>

      {/* Help block */}
      <section className="help-block">
        <div className="wrap">
          <div>
            <h2>Still <em>can't find</em> your answer?</h2>
            <p>Email us anytime at <a href="mailto:support@primoticketing.com" style={{color:"white",borderBottom:"1.5px solid var(--brand)"}}>support@primoticketing.com</a> — we read every message and respond within one business day. During event weekends, response is much faster.</p>
          </div>
          <div className="help-actions">
            <a href="signup.html" className="primary">Start Selling Tickets</a>
            <a href="schedule.html" className="secondary">Schedule a Demo</a>
            <a href="mailto:support@primoticketing.com" className="secondary">Email support</a>
          </div>
        </div>
      </section>
    </>
  );
}

window.FaqPage = FaqPage;
