import { Metadata } from "next";
import Link from "next/link";
import { Search, ShoppingBag, Shield, CreditCard, User, Truck, RotateCcw, HelpCircle, Mail } from "lucide-react";

export const metadata: Metadata = {
  title: "Help Center – Americas.Pet",
  description: "Find answers to your questions about orders, shipping, returns, insurance, and account management.",
};

const categories = [
  { id: "orders", icon: ShoppingBag, title: "Orders & Shipping", questions: [
    { q: "How do I track my order?", a: "Once your order ships, you'll receive an email with a tracking number. You can also check order status anytime by logging into your account and visiting 'My Orders'." },
    { q: "How long does shipping take?", a: "Standard shipping takes 5-7 business days. Express shipping takes 2-3 business days. Orders placed before 2:00 PM EST are processed the same day." },
    { q: "Can I change or cancel my order?", a: "You can modify or cancel your order within 1 hour of placing it. After that, it enters processing and cannot be changed. Contact support immediately if needed." },
    { q: "Do you ship internationally?", a: "Currently, we ship to all 50 US states, Puerto Rico, and US territories. International shipping is planned for 2026." },
    { q: "What if my order arrives damaged?", a: "Contact us within 48 hours with photos of the damage. We'll send a replacement or full refund — no return needed." },
  ]},
  { id: "insurance", icon: Shield, title: "Insurance & Claims", questions: [
    { q: "What does pet insurance cover?", a: "Coverage depends on your plan. Accident Only covers injuries. Complete Care adds illness coverage. Premium Wellness includes routine care, dental, and alternative therapies. See your policy document for full details." },
    { q: "How do I file a claim?", a: "Log into your account, go to 'My Insurance', and click 'File a Claim'. Upload your vet invoice and we'll process it within 5-10 business days." },
    { q: "Is there a waiting period?", a: "Yes. Accident coverage begins after 2 days. Illness coverage begins after 14 days. This prevents claims for pre-existing conditions." },
    { q: "Can I cancel my insurance?", a: "Yes, you can cancel anytime. Monthly plans cancel at the end of the billing period. Annual plans receive a prorated refund for remaining months." },
    { q: "Are pre-existing conditions covered?", a: "Pre-existing conditions diagnosed before enrollment are not covered. However, curable conditions that have been symptom-free for 12+ months may be eligible for coverage review." },
  ]},
  { id: "products", icon: HelpCircle, title: "Product Questions", questions: [
    { q: "How do I choose the right food for my pet?", a: "Consider your pet's age, size, breed, and health conditions. Our product pages include detailed nutritional info. For specific advice, consult your veterinarian." },
    { q: "Are your products authentic?", a: "Yes. We source directly from manufacturers and authorized distributors. Every product is guaranteed authentic." },
    { q: "What if my pet doesn't like the product?", a: "Unopened items can be returned within 30 days. For food or treats, we offer a satisfaction guarantee — contact us and we'll help find an alternative." },
    { q: "Do you carry prescription items?", a: "We currently do not carry prescription medications. We offer over-the-counter supplements, treatments, and veterinarian-recommended products." },
  ]},
  { id: "account", icon: User, title: "Account & Billing", questions: [
    { q: "How do I create an account?", a: "Click 'Account' in the top menu and select 'Create Account'. You can also create one during checkout. An account lets you track orders, manage insurance, and save favorites." },
    { q: "I forgot my password.", a: "Click 'Sign In' then 'Forgot Password'. Enter your email and we'll send a reset link. Links expire after 24 hours." },
    { q: "How do I update my payment method?", a: "Go to Account Settings to update your payment information. For insurance subscriptions, updating payment applies to future billing cycles." },
    { q: "How do I delete my account?", a: "Contact support at support@americas.pet with your request. We'll process account deletion within 5 business days. Note: active insurance plans must be cancelled first." },
  ]},
  { id: "returns", icon: RotateCcw, title: "Returns & Refunds", questions: [
    { q: "What's your return policy?", a: "We offer 30-day hassle-free returns on most items. Items must be unused and in original packaging. See our Shipping & Returns page for full details." },
    { q: "How long do refunds take?", a: "Refunds are processed within 3-5 business days after we receive and inspect the returned item. It may take an additional 3-5 days to appear on your statement." },
    { q: "Do I need to pay for return shipping?", a: "No! We provide prepaid return labels for all eligible returns within the continental US." },
    { q: "Can I exchange instead of returning?", a: "Yes. Select 'Exchange' when initiating your return. Choose the new item and we'll ship it once we receive the original." },
  ]},
];

export default function HelpPage() {
  return (
    <div className="min-h-screen bg-gray-50">
      {/* Hero */}
      <div className="bg-gradient-to-br from-primary-600 to-primary-700 text-white py-16">
        <div className="max-w-4xl mx-auto px-4 text-center">
          <h1 className="text-4xl font-bold mb-4">Help Center</h1>
          <p className="text-primary-100 text-lg mb-8">Find answers to your questions. We're here to help.</p>
          <div className="max-w-xl mx-auto relative">
            <Search className="absolute left-4 top-1/2 -translate-y-1/2 h-5 w-5 text-gray-400" />
            <input type="text" placeholder="Search for help..." className="w-full pl-12 pr-4 py-4 rounded-full text-gray-900 text-sm shadow-lg focus:outline-none focus:ring-4 focus:ring-white/30" />
          </div>
        </div>
      </div>

      {/* Category nav */}
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 -mt-6 relative z-10 mb-12">
        <div className="bg-white rounded-2xl shadow-sm p-4 flex flex-wrap gap-2 justify-center">
          {categories.map((cat) => (
            <a key={cat.id} href={`#${cat.id}`} className="flex items-center gap-2 px-4 py-2.5 rounded-xl text-sm font-medium text-gray-600 hover:bg-primary-50 hover:text-primary-600 transition-colors">
              <cat.icon className="h-4 w-4" />
              {cat.title}
            </a>
          ))}
        </div>
      </div>

      {/* FAQ Sections */}
      <div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 pb-20 space-y-12">
        {categories.map((cat) => (
          <section key={cat.id} id={cat.id}>
            <div className="flex items-center gap-3 mb-6">
              <div className="w-10 h-10 bg-primary-100 rounded-xl flex items-center justify-center">
                <cat.icon className="h-5 w-5 text-primary-600" />
              </div>
              <h2 className="text-xl font-bold text-gray-900">{cat.title}</h2>
            </div>
            <div className="space-y-3">
              {cat.questions.map((item) => (
                <details key={item.q} className="bg-white rounded-2xl shadow-sm border border-gray-100 group">
                  <summary className="flex items-center justify-between cursor-pointer px-6 py-5 text-sm font-medium text-gray-900 hover:text-primary-600 transition-colors">
                    {item.q}
                    <span className="text-gray-400 group-open:rotate-45 transition-transform text-lg">+</span>
                  </summary>
                  <div className="px-6 pb-5 -mt-1">
                    <p className="text-sm text-gray-500 leading-relaxed">{item.a}</p>
                  </div>
                </details>
              ))}
            </div>
          </section>
        ))}

        {/* Still need help */}
        <div className="bg-primary-50 rounded-2xl p-8 border border-primary-100 text-center">
          <h3 className="text-xl font-bold text-gray-900 mb-2">Still need help?</h3>
          <p className="text-gray-500 mb-6 text-sm">Our support team is available Mon-Fri 8am-8pm EST. We typically respond within a few hours.</p>
          <div className="flex flex-wrap justify-center gap-4">
            <Link href="/contact" className="btn-primary">
              <Mail className="h-4 w-4" /> Contact Us
            </Link>
            <a href="tel:1-800-267-4227" className="btn-outline">
              Call 1-800-AMERICAS-PET
            </a>
          </div>
        </div>
      </div>
    </div>
  );
}