@extends('layouts.app')

@section('title', 'Frequently Asked Questions - Gletra')

@section('content')
<div class="container py-5">
    <div class="row justify-content-center">
        <div class="col-md-9">
            <div class="text-center mb-5">
                <h1 class="fw-bold mb-3">Frequently Asked Questions (FAQ)</h1>
                <p class="text-muted lead">
                    Welcome to <strong>Gletra</strong>. Below are some commonly asked questions to help you understand how our platform works. If you still have queries, feel free to contact our support team.
                </p>
            </div>

            <div class="accordion shadow-sm rounded overflow-hidden" id="faqAccordion">

                <!-- 🛒 General Questions -->
                <div class="p-4 bg-light border-bottom">
                    <h4 class="fw-bold text-dark m-0"><i class="bi bi-cart-fill me-2 text-primary"></i> General Questions</h4>
                </div>
                
                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#gen1">
                            What is Gletra?
                        </button>
                    </h2>
                    <div id="gen1" class="accordion-collapse collapse show" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Gletra is an online eCommerce and multi-vendor marketplace where users can buy products from multiple verified sellers on a single platform.
                        </div>
                    </div>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#gen2">
                            Do I need an account to shop on Gletra?
                        </button>
                    </h2>
                    <div id="gen2" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Yes, creating an account helps you track orders, manage returns, and receive updates easily.
                        </div>
                    </div>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#gen3">
                            Is shopping on Gletra safe?
                        </button>
                    </h2>
                    <div id="gen3" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Yes. We use secure payment gateways and follow industry-standard security practices to protect user data.
                        </div>
                    </div>
                </div>

                <!-- 👤 Account & Login -->
                <div class="p-4 bg-light border-bottom border-top">
                    <h4 class="fw-bold text-dark m-0"><i class="bi bi-person-circle me-2 text-primary"></i> Account & Login</h4>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#acc1">
                            How do I create an account?
                        </button>
                    </h2>
                    <div id="acc1" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Click on the <strong>Sign Up</strong> button, enter your details, and verify your email or phone number.
                        </div>
                    </div>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#acc2">
                            I forgot my password. What should I do?
                        </button>
                    </h2>
                    <div id="acc2" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Go to our <a href="{{ route('contact', ['subject' => 'Password Reset']) }}">Contact page</a> and choose <strong>Password Reset</strong> as the subject. Our team will help you regain access to your account.
                        </div>
                    </div>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#acc3">
                            Can I update my account details?
                        </button>
                    </h2>
                    <div id="acc3" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Yes, you can update your profile details from your account dashboard.
                        </div>
                    </div>
                </div>

                <!-- 💳 Orders & Payments -->
                <div class="p-4 bg-light border-bottom border-top">
                    <h4 class="fw-bold text-dark m-0"><i class="bi bi-credit-card-fill me-2 text-primary"></i> Orders & Payments</h4>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#ord1">
                            What payment methods are supported?
                        </button>
                    </h2>
                    <div id="ord1" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            We support UPI, Credit/Debit Cards, Net Banking, and other gateway-supported options.
                        </div>
                    </div>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#ord2">
                            Is Cash on Delivery (COD) available?
                        </button>
                    </h2>
                    <div id="ord2" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            COD availability depends on product, seller, and delivery location.
                        </div>
                    </div>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#ord3">
                            How do I know if my order is confirmed?
                        </button>
                    </h2>
                    <div id="ord3" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Once payment is successful, you will receive an order confirmation via email/SMS.
                        </div>
                    </div>
                </div>

                <!-- 🚚 Shipping & Delivery -->
                <div class="p-4 bg-light border-bottom border-top">
                    <h4 class="fw-bold text-dark m-0"><i class="bi bi-truck me-2 text-primary"></i> Shipping & Delivery</h4>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#ship1">
                            How long does delivery take?
                        </button>
                    </h2>
                    <div id="ship1" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Delivery usually takes <strong>3–7 business days</strong>, depending on your location and seller.
                        </div>
                    </div>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#ship2">
                            How can I track my order?
                        </button>
                    </h2>
                    <div id="ship2" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            You can track your order from the <strong>My Orders</strong> section in your dashboard.
                        </div>
                    </div>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#ship3">
                            Do you ship internationally?
                        </button>
                    </h2>
                    <div id="ship3" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Currently, Gletra primarily ships within India. International shipping may be added later.
                        </div>
                    </div>
                </div>

                <!-- 🔄 Returns & Refunds -->
                <div class="p-4 bg-light border-bottom border-top">
                    <h4 class="fw-bold text-dark m-0"><i class="bi bi-arrow-repeat me-2 text-primary"></i> Returns & Refunds</h4>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#ret1">
                            How do I return a product?
                        </button>
                    </h2>
                    <div id="ret1" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Go to <strong>My Orders</strong>, select the product, and request a return within the eligible period.
                        </div>
                    </div>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#ret2">
                            When will I get my refund?
                        </button>
                    </h2>
                    <div id="ret2" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Approved refunds are processed within <strong>5–7 business days</strong> to the original payment method.
                        </div>
                    </div>
                </div>

                 <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#ret3">
                            What items are non-returnable?
                        </button>
                    </h2>
                    <div id="ret3" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Digital products, gift cards, and used items are generally non-returnable.
                        </div>
                    </div>
                </div>

                <!-- 🏪 Vendors & Sellers -->
                <div class="p-4 bg-light border-bottom border-top">
                    <h4 class="fw-bold text-dark m-0"><i class="bi bi-shop me-2 text-primary"></i> Vendors & Sellers</h4>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#ven1">
                            Who are the sellers on Gletra?
                        </button>
                    </h2>
                    <div id="ven1" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Sellers on Gletra are registered vendors who must comply with our quality and policy guidelines.
                        </div>
                    </div>
                </div>

                 <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#ven2">
                            Is Gletra responsible for seller products?
                        </button>
                    </h2>
                    <div id="ven2" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                             Gletra acts as a platform facilitator. Sellers are responsible for product quality and accuracy.
                        </div>
                    </div>
                </div>

                <!-- 🔐 Privacy & Security -->
                <div class="p-4 bg-light border-bottom border-top">
                    <h4 class="fw-bold text-dark m-0"><i class="bi bi-shield-lock-fill me-2 text-primary"></i> Privacy & Security</h4>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#priv1">
                            How is my data used?
                        </button>
                    </h2>
                    <div id="priv1" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            Your data is used only to process orders, manage accounts, and improve services. For more details, refer to our <strong>Privacy Policy</strong>.
                        </div>
                    </div>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#priv2">
                           Will my information be shared?
                        </button>
                    </h2>
                    <div id="priv2" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                           We do not sell your personal information. Data is shared only with trusted partners for order fulfillment.
                        </div>
                    </div>
                </div>

                <!-- 📞 Support & Contact -->
                <div class="p-4 bg-light border-bottom border-top">
                    <h4 class="fw-bold text-dark m-0"><i class="bi bi-headset me-2 text-primary"></i> Support & Contact</h4>
                </div>

                <div class="accordion-item border-0">
                    <h2 class="accordion-header">
                        <button class="accordion-button collapsed fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#supp1">
                            How can I contact Gletra support?
                        </button>
                    </h2>
                    <div id="supp1" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                        <div class="accordion-body text-muted">
                            You can reach us via:<br>
                            <ul class="mt-2 list-unstyled">
                                <li><i class="bi bi-envelope me-2"></i>Email: <a href="mailto:support@gletra.com" class="text-decoration-none">support@gletra.com</a></li>
                                <li><i class="bi bi-globe me-2"></i>Website: <a href="https://www.gletra.com" class="text-decoration-none">https://www.gletra.com</a></li>
                            </ul>
                        </div>
                    </div>
                </div>

            </div>
            
            <div class="text-center mt-5">
                <p class="text-muted small fst-italic">*This FAQ page is applicable to all users, customers, and vendors using the Gletra platform.*</p>
            </div>

        </div>
    </div>
</div>
@endsection