<?php
$pageTitle = 'FAQ - Frequently Asked Questions | MeeVakeel';
$metaDescription = 'Find answers to common questions about MeeVakeel legal consultation platform — booking consultations, lawyer verification, payments, refunds and more.';
require_once '../includes/config.php';
require_once '../includes/header.php';

$db  = getDB();
$all = $db->query("SELECT * FROM faqs WHERE status=1 ORDER BY category, sort_order")->fetchAll();

// Group by category
$grouped = [];
foreach ($all as $f) {
    $grouped[$f['category']][] = $f;
}

$catLabels = [
    'general'      => ['icon'=>'fas fa-info-circle',         'label'=>'General',            'color'=>'var(--primary)'],
    'consultation' => ['icon'=>'fas fa-comments',            'label'=>'Consultations',       'color'=>'#1a4a8a'],
    'fees'         => ['icon'=>'fas fa-rupee-sign',          'label'=>'Fees & Payments',     'color'=>'var(--gold-dark)'],
    'lawyers'      => ['icon'=>'fas fa-user-tie',            'label'=>'For Lawyers',         'color'=>'#2d6a4f'],
    'security'     => ['icon'=>'fas fa-shield-alt',          'label'=>'Security & Privacy',  'color'=>'#8e44ad'],
    'payment'      => ['icon'=>'fas fa-credit-card',         'label'=>'Payment & Refunds',   'color'=>'#e74c3c'],
];

// Fallback FAQs when DB is empty
if (empty($grouped)) {
    $grouped = [
        'general' => [
            ['question'=>'What is MeeVakeel?','answer'=>'MeeVakeel is India\'s trusted online legal consultation platform that connects clients with verified lawyers across Telangana, Andhra Pradesh, and all of India. You can consult lawyers online via chat, audio or video call from the comfort of your home.','category'=>'general'],
            ['question'=>'Is MeeVakeel a law firm?','answer'=>'No. MeeVakeel is not a law firm. We are a technology platform (marketplace) that connects clients with independent, verified lawyers. The legal advice is provided by the individual lawyers, not by MeeVakeel.','category'=>'general'],
            ['question'=>'Is MeeVakeel available across India?','answer'=>'We are currently active in Telangana and Andhra Pradesh with 500+ verified lawyers. We are rapidly expanding to Maharashtra, Karnataka, Tamil Nadu, Kerala, Delhi, and other major states in 2025.','category'=>'general'],
            ['question'=>'In which languages can I consult a lawyer?','answer'=>'Our lawyers speak multiple languages including Telugu, Hindi, English, Urdu, Tamil, Kannada, Malayalam, and more. You can filter lawyers by language when searching.','category'=>'general'],
        ],
        'consultation' => [
            ['question'=>'How do I book a consultation?','answer'=>'Search for a lawyer by practice area, city, or language. View their profile and click "Book Consultation". Select your preferred date and time slot, complete the payment (if applicable), and you\'re all set. You\'ll receive a confirmation email and SMS.','category'=>'consultation'],
            ['question'=>'What types of consultations are available?','answer'=>'We offer four modes: Chat Consultation (text-based), Audio Call, Video Call, and In-Person (selected lawyers). You can choose your preferred mode while booking.','category'=>'consultation'],
            ['question'=>'Can I upload documents for my consultation?','answer'=>'Yes! After booking, you can upload relevant legal documents (FIR, court orders, property papers, contracts, etc.) securely through your client dashboard. The lawyer can review them before your session.','category'=>'consultation'],
            ['question'=>'What if the lawyer doesn\'t show up?','answer'=>'If a lawyer fails to attend the scheduled consultation, you will receive a full refund within 3–5 business days. You can also rebook with another lawyer for free.','category'=>'consultation'],
            ['question'=>'How long is a consultation session?','answer'=>'Default sessions are 30 minutes. Lawyers with 2–4 years experience offer a mandatory free 10-minute initial consultation. Extended sessions can be booked at an additional fee.','category'=>'consultation'],
        ],
        'fees' => [
            ['question'=>'How much does a consultation cost?','answer'=>'Fees vary by lawyer experience. Lawyers with 2–4 years experience offer a mandatory free 10-minute initial consultation. Lawyers with 5+ years experience set their own fees, which are clearly displayed on their profile before booking.','category'=>'fees'],
            ['question'=>'Are there any hidden charges?','answer'=>'No hidden charges at all. The fee shown on the lawyer\'s profile is the final amount you pay. MeeVakeel charges a platform fee that is already included in the displayed price.','category'=>'fees'],
            ['question'=>'What payment methods are accepted?','answer'=>'We accept UPI (PhonePe, Google Pay, Paytm), Credit/Debit Cards, Net Banking, and digital wallets — all through our secure Razorpay payment gateway. EMI options are also available for higher-value consultations.','category'=>'fees'],
        ],
        'lawyers' => [
            ['question'=>'How do I register as a lawyer on MeeVakeel?','answer'=>'Click on "Register as Lawyer", fill in your personal and professional details, upload your Bar Council enrollment card (front and back), and submit. Our team will verify and approve your profile within 24–48 hours.','category'=>'lawyers'],
            ['question'=>'What is the eligibility to register as a lawyer?','answer'=>'You must have a valid Bar Council enrollment and a minimum of 2 years of active legal practice. Lawyers with 0–2 years of experience are not eligible currently.','category'=>'lawyers'],
            ['question'=>'Is lawyer registration free?','answer'=>'Yes, registration is 100% free for all verified advocates. MeeVakeel earns a platform commission from paid consultations. You keep the majority of your consultation earnings.','category'=>'lawyers'],
            ['question'=>'When do I receive my payout?','answer'=>'Lawyer payouts are processed every Monday for all completed consultations from the previous week. Payments are made directly to your registered bank account via NEFT/IMPS.','category'=>'lawyers'],
        ],
        'security' => [
            ['question'=>'Are my consultations confidential?','answer'=>'Absolutely. All consultations are protected by strict attorney-client confidentiality. Chat logs and documents are encrypted. Our lawyers sign a confidentiality agreement when joining the platform.','category'=>'security'],
            ['question'=>'How is my personal data protected?','answer'=>'We use industry-standard SSL encryption, secure cloud storage, and strict data privacy policies compliant with Indian IT laws. We never sell or share your personal data with advertisers.','category'=>'security'],
        ],
        'payment' => [
            ['question'=>'Can I get a refund?','answer'=>'Yes. If a lawyer doesn\'t attend, you get a full refund. If you cancel 6+ hours before the consultation, you get a full refund. Cancellations within 6 hours are subject to a 50% cancellation fee. No refund for completed sessions.','category'=>'payment'],
            ['question'=>'How long does a refund take?','answer'=>'Refunds are processed within 3–5 business days to your original payment method (UPI / Card / Net Banking). You will receive an email confirmation once the refund is initiated.','category'=>'payment'],
        ],
    ];
}
?>

<!-- Page Hero -->
<section class="page-hero">
    <div class="container">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb mb-3">
                <li class="breadcrumb-item"><a href="/">Home</a></li>
                <li class="breadcrumb-item active">FAQ</li>
            </ol>
        </nav>
        <h1 class="mb-2">Frequently Asked <span style="color:var(--gold);">Questions</span></h1>
        <p style="color:rgba(255,255,255,0.75);max-width:520px;">Everything you need to know about MeeVakeel. Can't find your answer? Contact our support team.</p>
    </div>
</section>

<!-- ── SEARCH ── -->
<div style="background:white;border-bottom:1px solid var(--border);padding:20px 0;position:sticky;top:68px;z-index:99;">
    <div class="container">
        <div style="max-width:540px;margin:0 auto;position:relative;">
            <i class="fas fa-search" style="position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--text-light);"></i>
            <input type="text" id="faqSearch" class="form-control" style="padding:12px 16px 12px 44px;border-radius:50px;border-color:var(--border);font-size:0.9rem;" placeholder="Search your question...">
        </div>
    </div>
</div>

<!-- ── CONTENT ── -->
<section class="section">
    <div class="container">
        <div class="row g-5">

            <!-- Sidebar nav -->
            <div class="col-lg-3">
                <div style="position:sticky;top:140px;">
                    <h6 style="font-size:0.78rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--text-light);font-weight:700;margin-bottom:14px;">Jump to Section</h6>
                    <nav style="display:flex;flex-direction:column;gap:4px;" id="faqNav">
                        <?php foreach ($grouped as $cat => $items):
                            $meta = $catLabels[$cat] ?? ['icon'=>'fas fa-circle','label'=>ucfirst($cat),'color'=>'var(--primary)']; ?>
                        <a href="#cat-<?= $cat ?>"
                           style="display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:10px;color:var(--text);font-size:0.87rem;font-weight:500;text-decoration:none;border:1px solid transparent;transition:var(--transition);"
                           onmouseover="this.style.background='var(--off-white)';this.style.borderColor='var(--border)'"
                           onmouseout="this.style.background='';this.style.borderColor='transparent'"
                           class="faq-nav-link">
                            <span style="width:28px;height:28px;background:<?= $meta['color'] ?>;border-radius:6px;display:flex;align-items:center;justify-content:center;color:white;font-size:0.72rem;">
                                <i class="<?= $meta['icon'] ?>"></i>
                            </span>
                            <span><?= $meta['label'] ?></span>
                            <span style="margin-left:auto;background:var(--off-white);border-radius:50px;padding:1px 8px;font-size:0.72rem;color:var(--text-light);"><?= count($items) ?></span>
                        </a>
                        <?php endforeach; ?>
                    </nav>

                    <!-- Still need help -->
                    <div style="background:linear-gradient(135deg,var(--primary),#1a3a6b);border-radius:16px;padding:24px;margin-top:24px;text-align:center;">
                        <i class="fas fa-headset" style="font-size:2rem;color:var(--gold);margin-bottom:12px;display:block;"></i>
                        <h6 style="color:white;margin-bottom:8px;font-size:0.9rem;">Still have questions?</h6>
                        <p style="color:rgba(255,255,255,0.6);font-size:0.8rem;margin-bottom:16px;">Our support team is ready to help you.</p>
                        <a href="contact.php" style="background:var(--gold);color:var(--primary);padding:10px 20px;border-radius:50px;font-weight:700;font-size:0.82rem;text-decoration:none;display:block;">Contact Support</a>
                        <a href="https://wa.me/9876543210" target="_blank" style="background:rgba(255,255,255,0.1);color:white;padding:10px 20px;border-radius:50px;font-weight:600;font-size:0.82rem;text-decoration:none;display:block;margin-top:8px;">
                            <i class="fab fa-whatsapp me-1"></i>WhatsApp Us
                        </a>
                    </div>
                </div>
            </div>

            <!-- FAQ Accordion -->
            <div class="col-lg-9" id="faqContent">
                <?php $accIdx = 0; foreach ($grouped as $cat => $items):
                    $meta = $catLabels[$cat] ?? ['icon'=>'fas fa-circle','label'=>ucfirst($cat),'color'=>'var(--primary)']; ?>

                <div class="faq-category-block mb-5" id="cat-<?= $cat ?>">
                    <!-- Category Header -->
                    <div style="display:flex;align-items:center;gap:14px;margin-bottom:20px;padding-bottom:14px;border-bottom:2px solid var(--border);">
                        <div style="width:44px;height:44px;background:<?= $meta['color'] ?>;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:white;">
                            <i class="<?= $meta['icon'] ?>"></i>
                        </div>
                        <div>
                            <h3 style="font-size:1.15rem;margin-bottom:0;"><?= $meta['label'] ?></h3>
                            <span style="font-size:0.78rem;color:var(--text-light);"><?= count($items) ?> question<?= count($items)>1?'s':'' ?></span>
                        </div>
                    </div>

                    <div class="accordion faq-accordion" id="accordion-<?= $cat ?>">
                        <?php foreach ($items as $j => $faq): $accIdx++; ?>
                        <div class="accordion-item faq-item" data-q="<?= strtolower(htmlspecialchars($faq['question'])) ?>">
                            <h2 class="accordion-header">
                                <button class="accordion-button <?= ($accIdx > 1) ? 'collapsed' : '' ?>"
                                        type="button" data-bs-toggle="collapse"
                                        data-bs-target="#faq-<?= $accIdx ?>">
                                    <span style="margin-right:14px;min-width:28px;height:28px;background:<?= $meta['color'] ?>;border-radius:6px;display:flex;align-items:center;justify-content:center;color:white;font-size:0.7rem;font-weight:700;">Q</span>
                                    <?= htmlspecialchars($faq['question']) ?>
                                </button>
                            </h2>
                            <div id="faq-<?= $accIdx ?>" class="accordion-collapse collapse <?= ($accIdx === 1) ? 'show' : '' ?>"
                                 data-bs-parent="#accordion-<?= $cat ?>">
                                <div class="accordion-body" style="padding-left:58px;">
                                    <div style="display:flex;gap:10px;align-items:flex-start;">
                                        <span style="min-width:28px;height:28px;background:rgba(40,167,69,0.12);border-radius:6px;display:flex;align-items:center;justify-content:center;color:var(--success);font-size:0.7rem;font-weight:700;margin-top:2px;">A</span>
                                        <p style="margin:0;color:var(--text-light);line-height:1.85;font-size:0.9rem;"><?= htmlspecialchars($faq['answer']) ?></p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <?php endforeach; ?>
                    </div>
                </div>
                <?php endforeach; ?>

                <!-- No results message (hidden by default) -->
                <div id="noFaqResults" style="display:none;text-align:center;padding:60px 0;">
                    <i class="fas fa-search" style="font-size:3rem;color:var(--border);margin-bottom:16px;display:block;"></i>
                    <h5 style="color:var(--text-light);margin-bottom:8px;">No results found</h5>
                    <p style="color:var(--text-light);font-size:0.88rem;">Try different keywords or <a href="/pages/contact.php" style="color:var(--primary);">contact our support team</a>.</p>
                </div>
            </div>

        </div>
    </div>
</section>

<!-- ── BOTTOM CTA ── -->
<div style="background:var(--off-white);padding:60px 0;border-top:1px solid var(--border);">
    <div class="container text-center">
        <h4 style="color:var(--primary);margin-bottom:10px;">Didn't Find Your Answer?</h4>
        <p style="color:var(--text-light);font-size:0.9rem;margin-bottom:24px;">Our legal experts and support team are available to help you.</p>
        <div class="d-flex gap-3 justify-content-center flex-wrap">
            <a href="<?= SITE_URL ?>/pages/contact.php" class="btn btn-primary-dark px-4">
                <i class="fas fa-envelope me-2"></i>Send Us a Message
            </a>
            <a href="https://wa.me/9876543210" target="_blank" class="btn btn-gold px-4">
                <i class="fab fa-whatsapp me-2"></i>Chat on WhatsApp
            </a>
        </div>
    </div>
</div>

<script>
// ── FAQ SEARCH ──
const faqSearch = document.getElementById('faqSearch');
faqSearch.addEventListener('input', function() {
    const q = this.value.toLowerCase().trim();
    let visible = 0;

    document.querySelectorAll('.faq-item').forEach(item => {
        const text = item.dataset.q + ' ' + item.querySelector('.accordion-body')?.innerText.toLowerCase();
        const show = !q || text.includes(q);
        item.style.display = show ? '' : 'none';
        if (show) visible++;
    });

    // Show/hide category blocks
    document.querySelectorAll('.faq-category-block').forEach(block => {
        const hasVisible = [...block.querySelectorAll('.faq-item')].some(i => i.style.display !== 'none');
        block.style.display = hasVisible ? '' : 'none';
    });

    document.getElementById('noFaqResults').style.display = visible === 0 ? 'block' : 'none';
});

// ── SMOOTH SCROLL FOR NAV LINKS ──
document.querySelectorAll('.faq-nav-link').forEach(link => {
    link.addEventListener('click', function(e) {
        e.preventDefault();
        const target = document.querySelector(this.getAttribute('href'));
        if (target) target.scrollIntoView({ behavior: 'smooth', block: 'start' });
    });
});
</script>

<?php require_once '../includes/footer.php'; ?>