<?php
require_once '../src/config/db.php';
require_once '../src/includes/functions.php';
include '../src/includes/header.php';

$services = get_all_services($pdo);
$sliders = get_all_sliders($pdo);
$contact_info_main = get_contact_info($pdo);
?>

<!-- Hero Section -->
<section class="hero-section-slider">
    <div class="hero-slider-container">
        <?php foreach ($sliders as $index => $slide): ?>
            <?php
                $imageSrc = $slide['image_url'];
            ?>
            <div class="hero-slide <?php echo $index === 0 ? 'active' : ''; ?>" style="background-image: url('<?php echo htmlspecialchars($imageSrc); ?>');">
                <div class="hero-slide-overlay"></div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-8 text-center text-lg-start">
                            <h1 class="display-3 fw-bolder hero-slide-title"><?php echo htmlspecialchars($slide['title']); ?></h1>
                            <p class="lead hero-slide-description mb-5"><?php echo htmlspecialchars($slide['description']); ?></p>
                            <a href="<?php echo htmlspecialchars($slide['link_url'] . $langParam); ?>" class="btn btn-hero">
                                <?php echo $t['home_hero_btn']; ?>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        <?php endforeach; ?>
    </div>
</section>

<!-- About Snippet Section -->
<section class="py-5 py-lg-6">
    <div class="container">
        <div class="row justify-content-center">
            <hr class="section-divider">
            <div class="col-lg-8 text-center animated-card">
                <h2 class="display-5 fw-bolder section-title"><?php echo $t['nav_about']; ?></h2>
                <p class="lead text-muted mb-4"><?php echo $t['about_subtitle']; ?></p>
                <p class="mb-5"><?php echo $t['about_intro']; ?></p>
                <a href="about.php<?php echo $langParam; ?>" class="btn btn-outline-primary px-5 py-3 fw-bold">
                    <?php echo $t['hero_learn_more']; ?>
                </a>
            </div>
        </div>
    </div>
</section>

<!-- Services Section -->
<section class="py-5 py-lg-6">
    <div class="container">
        <div class="row justify-content-center mb-5">
            <hr class="section-divider">
            <div class="col-lg-8 text-center">
                <h2 class="display-5 fw-bolder section-title"><?php echo $t['home_services_title']; ?></h2>
                <p class="lead text-muted"><?php echo $t['home_services_desc']; ?></p>
            </div>
        </div>
        <div class="row g-4">
            <?php 
            $serviceKeyMap = [
                'HDD Destruction' => ['title' => 'service_hdd_title', 'desc' => 'service_hdd_desc'],
                'SSD Destruction' => ['title' => 'service_ssd_title', 'desc' => 'service_ssd_desc'],
                'Mobile Device Destruction' => ['title' => 'service_mobile_title', 'desc' => 'service_mobile_desc'],
                'Confidential Document Destruction' => ['title' => 'service_documents_title', 'desc' => 'service_documents_desc'],
                'IT Asset Disposition (ITAD)' => ['title' => 'service_itad_title', 'desc' => 'service_itad_desc'],
                'Data Center Decommissioning' => ['title' => 'service_datacenter_title', 'desc' => 'service_datacenter_desc'],
                'Certificate of Destruction (CoD)' => ['title' => 'service_cod_title', 'desc' => 'service_cod_desc'],
            ];
            foreach (array_slice($services, 0, 8) as $service): 
                $serviceKey = $serviceKeyMap[$service['name']] ?? null;
            ?>
                <div class="col-lg-3 col-md-6 d-flex">
                    <?php
                        $default_image = 'assets/img/default-service.png';
                        $image_path = !empty($service['image_url']) && file_exists(__DIR__ . '/' . $service['image_url'])
                                        ? $service['image_url']
                                        : $default_image;
                    ?>
                    <div class="service-card w-100"><div class="service-card-image" style="background-image: url('<?php echo htmlspecialchars($image_path); ?>');"></div>
                        <div class="service-card-content">
                            <h3><?php echo htmlspecialchars($serviceKey && isset($t[$serviceKey['title']]) ? $t[$serviceKey['title']] : $service['name']); ?></h3>
                            <p><?php echo htmlspecialchars(mb_strimwidth($serviceKey && isset($t[$serviceKey['desc']]) ? $t[$serviceKey['desc']] : $service['description'], 0, 100, '...')); ?></p>
                        </div>
                    </div>
                </div>
            <?php endforeach; ?>
        </div>
    </div>
</section>

<!-- Stats Section -->
<section class="py-5 py-lg-6 stats-section">
    <div class="container">
        <div class="row justify-content-center mb-5">
            <hr class="section-divider">
            <div class="col-lg-8 text-center">
                <h2 class="display-5 fw-bolder section-title"><?php echo $t['stats_title']; ?></h2>
                <p class="lead text-muted"><?php echo $t['stats_desc']; ?></p>
            </div>
        </div>
        <div class="row g-4 justify-content-center">
            <div class="col-lg-4 col-md-6">
                <div class="stat-item"><div class="stat-number" data-target="50000"><?php echo $t['stats_1_number']; ?></div><div class="stat-label"><?php echo $t['stats_1_label']; ?></div></div>
            </div>
            <div class="col-lg-4 col-md-6">
                <div class="stat-item"><div class="stat-number" data-target="1200"><?php echo $t['stats_2_number']; ?></div><div class="stat-label"><?php echo $t['stats_2_label']; ?></div></div>
            </div>
            <div class="col-lg-4 col-md-6">
                <div class="stat-item"><div class="stat-number" data-target="100"><?php echo $t['stats_3_number']; ?></div><div class="stat-label"><?php echo $t['stats_3_label']; ?></div></div>
            </div>
        </div>
    </div>
</section>

<!-- Explore Section -->
<section class="py-5 py-lg-6">
    <div class="container">
        <div class="row justify-content-center mb-5">
            <hr class="section-divider">
            <div class="col-lg-8 text-center">
                <h2 class="display-5 fw-bolder section-title"><?php echo $t['explore_title']; ?></h2>
                <p class="lead text-muted"><?php echo $t['explore_desc']; ?></p>
            </div>
        </div>
        <div class="row g-4">
            <div class="col-lg-3 col-md-6">
                <div class="explore-card animated-card">
                    <div class="explore-card-icon">⚙️</div>
                    <h3 class="explore-card-title"><?php echo $t['nav_services']; ?></h3>
                    <p class="explore-card-desc"><?php echo $t['home_services_desc']; ?></p>
                    <a href="services.php<?php echo $langParam; ?>" class="btn btn-outline-primary mt-auto"><?php echo $t['explore_btn']; ?></a>
                </div>
            </div>
            <div class="col-lg-3 col-md-6">
                <div class="explore-card animated-card">
                    <div class="explore-card-icon">🏆</div>
                    <h3 class="explore-card-title"><?php echo $t['nav_certifications']; ?></h3>
                    <p class="explore-card-desc"><?php echo $t['cert_subtitle']; ?></p>
                    <a href="certifications.php<?php echo $langParam; ?>" class="btn btn-outline-primary mt-auto"><?php echo $t['explore_btn']; ?></a>
                </div>
            </div>
            <div class="col-lg-3 col-md-6">
                <div class="explore-card animated-card">
                    <div class="explore-card-icon">ℹ️</div>
                    <h3 class="explore-card-title"><?php echo $t['nav_about']; ?></h3>
                    <p class="explore-card-desc"><?php echo $t['about_subtitle']; ?></p>
                    <a href="about.php<?php echo $langParam; ?>" class="btn btn-outline-primary mt-auto"><?php echo $t['explore_btn']; ?></a>
                </div>
            </div>
            <div class="col-lg-3 col-md-6">
                <div class="explore-card animated-card">
                    <div class="explore-card-icon">📞</div>
                    <h3 class="explore-card-title"><?php echo $t['nav_contact']; ?></h3>
                    <p class="explore-card-desc"><?php echo $t['contact_subtitle']; ?></p>
                    <a href="contact.php<?php echo $langParam; ?>" class="btn btn-outline-primary mt-auto"><?php echo $t['explore_btn']; ?></a>
                </div>
            </div>
        </div>
    </div>
</section>

<!-- Address Section -->
<section class="py-5 py-lg-6 text-center" style="background: linear-gradient(180deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);">
    <div class="container">
        <div class="row justify-content-center">
            <hr class="section-divider" style="background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0));">
            <div class="col-lg-9">
                <h2 class="display-5 fw-bolder section-title"><?php echo $t['locations_title']; ?></h2>
                <p class="lead text-muted mb-4"><?php echo $t['locations_desc']; ?></p>
                <div class="d-inline-flex align-items-center gap-3 flex-wrap justify-content-center p-4 rounded-pill mb-5" style="background: var(--bs-surface); border: 1px solid var(--bs-border); box-shadow: var(--bs-shadow);">
                    <span class="fs-5" dir="ltr">
                        📍 <?php echo $t['topbar_address']; ?>
                    </span>
                </div>
                <div class="d-flex justify-content-center align-items-center gap-3 mb-5">
                    <a href="<?php echo htmlspecialchars($contact_info_main['youtube_url'] ?? '#'); ?>" target="_blank" rel="noopener" class="social-icon" title="YouTube"><i class="bi bi-youtube"></i></a>
                    <a href="<?php echo htmlspecialchars($contact_info_main['facebook_url'] ?? '#'); ?>" target="_blank" rel="noopener" class="social-icon" title="Facebook"><i class="bi bi-facebook"></i></a>
                    <a href="<?php echo htmlspecialchars($contact_info_main['whatsapp'] ?? '#'); ?>" target="_blank" rel="noopener" class="social-icon" title="WhatsApp"><i class="bi bi-whatsapp"></i></a>
                    <a href="mailto:<?php echo htmlspecialchars($contact_info_main['email_info'] ?? '#'); ?>" class="social-icon" title="Email"><i class="bi bi-envelope-fill"></i></a>
                </div>
                <a href="contact.php<?php echo $langParam; ?>" class="btn btn-hero"><?php echo $t['hero_cta_btn']; ?></a>
            </div>
        </div>
    </div>
</section>

<?php include '../src/includes/footer.php'; ?>