import 'package:citycards_customer/common_packages/custom_expansion_tile.dart';
import 'package:citycards_customer/common_packages/custom_text.dart';
import 'package:flutter/material.dart';

class FaqPage extends StatelessWidget {
  const FaqPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: SafeArea(
        child: SingleChildScrollView(
          child: Padding(
            padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Container(
                  padding: const EdgeInsets.only(bottom: 10),
                  decoration: const BoxDecoration(
                    border: Border(
                      bottom: BorderSide(color: Color(0xFFD9D9D9), width: 0.7),
                    ),
                  ),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Image.asset("assets/logo/logo_city_cards.png", scale: 4),
                      Image.asset("assets/icons/shopping_cart.png", scale: 4),
                    ],
                  ),
                ),
                const SizedBox(height: 22),

                // Back + Title
                Row(
                  children: [
                    GestureDetector(
                        onTap: (){
                          Navigator.pop(context);
                        },
                        child: Icon(Icons.arrow_back, size: 24)),
                    SizedBox(width: 8),
                    Text(
                      "FAQ",
                      style: TextStyle(
                        fontSize: 12,
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                  ],
                ),
                const SizedBox(height: 34),

                FAQSection(title: "🧭 General FAQs", faqs: generalFAQs),
                SizedBox(height: 20),
                FAQSection(title: "✈️ Booking & Planning", faqs: bookingFaq),
                SizedBox(height: 20),
                FAQSection(title: "🌍 Discover & Explore", faqs: discoverFAQs),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

// Model for FAQ
class FAQItem {
  final String question;
  final String answer;

  FAQItem({required this.question, required this.answer});
}

// Sample FAQ data
final List<FAQItem> generalFAQs = [
  FAQItem(
    question: "What is CityCards?",
    answer:
        "You can browse without an account, but signing up allows you to save trips, sync data, and get personalized recommendations.",
  ),
  FAQItem(
    question: "Is the app free to use?",
    answer:
        "You can browse without an account, but signing up allows you to save trips, sync data, and get personalized recommendations.",
  ),
  FAQItem(
    question: "Do I need an account to use the app?",
    answer:
        "You can browse without an account, but signing up allows you to save trips, sync data, and get personalized recommendations.",
  ),
];

final List<FAQItem> discoverFAQs = [
  FAQItem(
    question: "How does the app recommend destinations?",
    answer:
        "You can browse without an account, but signing up allows you to save trips, sync data, and get personalized recommendations.",
  ),
  FAQItem(
    question: "Can I create a custom itinerary?",
    answer:
        "You can browse without an account, but signing up allows you to save trips, sync data, and get personalized recommendations.",
  ),
  FAQItem(
    question: "Does the app work offline?",
    answer:
        "You can browse without an account, but signing up allows you to save trips, sync data, and get personalized recommendations.",
  ),
];

final List<FAQItem> bookingFaq = [
  FAQItem(
    question: "Can I modify or cancel my bookings?",
    answer:
        "You can browse without an account, but signing up allows you to save trips, sync data, and get personalized recommendations.",
  ),
  FAQItem(
    question: "Can I plan multi-city trips?",
    answer:
        "You can browse without an account, but signing up allows you to save trips, sync data, and get personalized recommendations.",
  ),
  FAQItem(
    question: "Can I book hotels through the app?",
    answer:
        "You can browse without an account, but signing up allows you to save trips, sync data, and get personalized recommendations.",
  ),
];

// Widget for FAQ section
Widget FAQSection({required String title, required List<FAQItem> faqs}) {
  return Container(
    padding: EdgeInsets.symmetric(vertical: 12, horizontal: 8),
    decoration: BoxDecoration(
      border: Border.all(color: Color(0xFFF95F62)),
      borderRadius: BorderRadius.circular(10),
    ),
    child: Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        // Section heading
        CustomText(
          text: title,
          size: 16,
          weight: FontWeight.w500,
          color: Color(0xFF212121),
        ),
        SizedBox(height: 12),

        // Dynamic list of questions
        Column(
          children: faqs.map((faq) {
            int index = faqs.indexOf(faq);
            return Column(
              children: [
                CustomExpansionTile(
                  minTileHeight: 42,
                  borderRadius: BorderRadius.circular(5),
                  backgroundColor: Color(0xFFFEE7E7),
                  collapsedBackgroundColor: Color(0xFFFEE7E7),
                  tilePadding: EdgeInsets.symmetric(
                    horizontal: 14,
                    vertical: 0,
                  ),
                  childrenPadding: EdgeInsets.all(12),
                  title: Text(faq.question, style: TextStyle(fontSize: 14)),
                  children: [
                    Text(
                      faq.answer,
                      style: TextStyle(color: Color(0xFF5C5C5C), fontSize: 14),
                    ),
                  ],
                ),
                if (index != faqs.length - 1) SizedBox(height: 8), // spacing
              ],
            );
          }).toList(),
        ),
      ],
    ),
  );
}
