<?php
require_once 'header.php';

// Get internet plans from database
$stmt = $pdo->query("SELECT * FROM plans WHERE is_active = 1 ORDER BY speed_mbps");
$internet_plans = $stmt->fetchAll();

// Office space plans
$office_plans = [
    ['name' => 'Daily Pass', 'price' => 2000, 'duration' => '1 Day', 'speed' => '10 Mbps'],
    ['name' => 'Weekly Pass', 'price' => 12000, 'duration' => '7 Days', 'speed' => '15 Mbps'],
    ['name' => 'Monthly Pass', 'price' => 40000, 'duration' => '30 Days', 'speed' => '20 Mbps']
];
?>

<!-- Page Header -->
<div class="page-header bg-primary text-white py-5 mt-5">
    <div class="container text-center">
        <h1>Our Services & Plans</h1>
        <p class="lead">Choose the perfect plan for your needs</p>
    </div>
</div>

<!-- Internet Plans Section -->
<section class="internet-plans py-5">
    <div class="container">
        <h2 class="text-center mb-5">Internet Service Plans</h2>
        <div class="row">
            <?php foreach($internet_plans as $plan): ?>
            <div class="col-md-4 mb-4">
                <div class="card plan-card h-100 text-center">
                    <div class="card-body">
                        <h3><?php echo htmlspecialchars($plan['name']); ?></h3>
                        <div class="display-4 text-primary"><?php echo $plan['speed_mbps']; ?> <small>Mbps</small></div>
                        <div class="price mt-3">N<?php echo number_format($plan['price'], 2); ?><span>/month</span></div>
                        <ul class="list-unstyled mt-4">
                            <li><i class="fas fa-check text-success"></i> Unlimited Data</li>
                            <li><i class="fas fa-check text-success"></i> 24/7 Technical Support</li>
                            <li><i class="fas fa-check text-success"></i> Free Router</li>
                            <li><i class="fas fa-check text-success"></i> Free Installation</li>
                        </ul>
                        <a href="register.php" class="btn btn-primary btn-lg mt-3">Subscribe Now</a>
                    </div>
                </div>
            </div>
            <?php endforeach; ?>
        </div>
    </div>
</section>

<!-- Office Space Plans -->
<section class="office-plans bg-light py-5">
    <div class="container">
        <h2 class="text-center mb-5">Office Space & Hot Desk Plans</h2>
        <div class="row">
            <?php foreach($office_plans as $plan): ?>
            <div class="col-md-4 mb-4">
                <div class="card h-100 text-center">
                    <div class="card-header bg-info text-white">
                        <h4><?php echo $plan['name']; ?></h4>
                    </div>
                    <div class="card-body">
                        <div class="display-4">N<?php echo number_format($plan['price']);?></div>
                        <p class="text-muted"><?php echo $plan['duration']; ?></p>
                        <ul class="list-unstyled">
                            <li><i class="fas fa-wifi"></i> High-speed WiFi <?php // echo $plan['speed']; ?></li>
                            <li><i class="fas fa-plug"></i> Power Backup</li>
                            <!-- <li><i class="fas fa-coffee"></i> Free Coffee/Tea</li> -->
                            <li><i class="fas fa-print"></i> Printing Services</li>
                        </ul>
                        <a href="contact.php" class="btn btn-info btn-lg text-white mt-3">Book Space</a>
                    </div>
                </div>
            </div>
            <?php endforeach; ?>
        </div>
    </div>
</section>

<!-- Other Services -->
<section class="other-services py-5">
    <div class="container">
        <h2 class="text-center mb-5">Other Services</h2>
        <div class="row">
            <div class="col-md-6 mb-4">
                <div class="service-detailed card">
                    <div class="row g-0">
                        <div class="col-md-4">
                            <div class="service-icon bg-primary text-white h-100 d-flex align-items-center justify-content-center">
                                <i class="fas fa-laptop fa-4x"></i>
                            </div>
                        </div>
                        <div class="col-md-8">
                            <div class="card-body">
                                <h4>Laptop Sales & Repairs</h4>
                                <p>Get the best deals on new and refurbished laptops. We also offer professional repair services.</p>
                                <ul>
                                    <li>HP, Dell, Lenovo, Apple</li>
                                    <li>Hardware & Software Repairs</li>
                                    <li>Upgrades & Maintenance</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-6 mb-4">
                <div class="service-detailed card">
                    <div class="row g-0">
                        <div class="col-md-4">
                            <div class="service-icon bg-success text-white h-100 d-flex align-items-center justify-content-center">
                                <i class="fas fa-graduation-cap fa-4x"></i>
                            </div>
                        </div>
                        <div class="col-md-8">
                            <div class="card-body">
                                <h4>CBT & School Solutions</h4>
                                <p>Complete e-learning platforms and computer-based testing solutions for schools.</p>
                                <ul>
                                    <li>Online Examination Platform</li>
                                    <li>Learning Management System</li>
                                    <li>Result Processing Software</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<!-- FAQ Section -->
<section class="faq bg-light py-5">
    <div class="container">
        <h2 class="text-center mb-5">Frequently Asked Questions</h2>
        <div class="row justify-content-center">
            <div class="col-md-8">
                <div class="accordion" id="faqAccordion">
                    <div class="accordion-item">
                        <h2 class="accordion-header">
                            <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#faq1">
                                How do I get connected?
                            </button>
                        </h2>
                        <div id="faq1" class="accordion-collapse collapse show" data-bs-parent="#faqAccordion">
                            <div class="accordion-body">
                                Simply sign up online, choose your plan, and our technical team will contact you within 24 hours to schedule installation.
                            </div>
                        </div>
                    </div>
                    <div class="accordion-item">
                        <h2 class="accordion-header">
                            <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#faq2">
                                What payment methods do you accept?
                            </button>
                        </h2>
                        <div id="faq2" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                            <div class="accordion-body">
                                We accept credit/debit cards, bank transfers, and cash payments at our office.
                            </div>
                        </div>
                    </div>
                    <div class="accordion-item">
                        <h2 class="accordion-header">
                            <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#faq3">
                                Is there a contract?
                            </button>
                        </h2>
                        <div id="faq3" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                            <div class="accordion-body">
                                No long-term contracts! Our plans are month-to-month with no hidden fees.
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<?php
require_once 'footer.php';
?>