<?php 
include 'includes/header.php';
include 'includes/navbar.php';

// Enable error reporting for debugging
error_reporting(E_ALL);
ini_set('display_errors', 1);

$id = isset($_GET['id']) ? (int)$_GET['id'] : 0;

// Step 1: Fetch Package Data (Simplified query to avoid JOIN issues)
$stmt = $conn->prepare("SELECT * FROM packages WHERE id = ?");
$stmt->bind_param("i", $id);
$stmt->execute();
$package = $stmt->get_result()->fetch_assoc();

if(!$package) {
    echo "<div class='container py-5 text-center' style='margin-top: 150px;'>
            <div class='card border-0 shadow-sm p-5' style='border-radius: 30px;'>
                <i class='fas fa-search mb-4 text-muted' style='font-size: 60px;'></i>
                <h2 class='fw-bold'>Tour Not Found</h2>
                <p class='text-muted'>We couldn't find the tour you're looking for (ID: $id). It may have been removed.</p>
                <a href='packages.php' class='btn btn-primary rounded-pill px-5 py-3 fw-bold mt-3'>Browse All Tours</a>
            </div>
          </div>";
    include 'includes/footer.php';
    exit;
}

// Step 2: Fetch Destination Name separately
$country_name = "Global Destination";
$dest_stmt = $conn->prepare("SELECT name FROM destinations WHERE id = ?");
$dest_stmt->bind_param("i", $package['country_id']);
$dest_stmt->execute();
$dest_res = $dest_stmt->get_result()->fetch_assoc();
if($dest_res) {
    $country_name = $dest_res['name'];
}

// Step 3: Get Gallery Images
$gal_stmt = $conn->prepare("SELECT * FROM package_gallery WHERE package_id = ?");
$gal_stmt->bind_param("i", $id);
$gal_stmt->execute();
$gallery = $gal_stmt->get_result();

$db_img = $package['main_image'] ?? '';
if (strpos($db_img, 'uploads/') === 0) $db_img = substr($db_img, 8);
$hero_img = "uploads/" . (!empty($db_img) ? $db_img : 'default-pkg.jpg');

if(empty($package['main_image'])) {
    $df = strtolower(trim($country_name));
    if($df == 'india') $df = 'dambadiwa';
    if($df == 'singapore' || $df == 'malaysia') $df = 'singapore & malaysia';
    $local_img = "assets/img 2/{$df}/1.jpeg";
    if($df == 'dubai') $local_img = "assets/img 2/dubai/WhatsApp Image 2026-05-08 at 10.47.33 AM.jpeg";
    if($df == 'egypt') $local_img = "assets/img 2/egypt/WhatsApp Image 2026-05-08 at 11.41.11 AM.jpeg";
    
    if(file_exists($local_img)) {
        $hero_img = $local_img;
    }
}
?>

<!-- Premium Package Details Hero -->
<div class="package-hero" style="min-height: 60vh; background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.7)), url('<?= str_replace(' ', '%20', $hero_img) ?>'); background-size: cover; background-position: center; display: flex; align-items: flex-end; padding-bottom: 80px; color: #fff; position: relative;">
    <div class="container">
        <div class="row">
            <div class="col-lg-8">
                <nav aria-label="breadcrumb" class="mb-3 reveal-up">
                    <ol class="breadcrumb mb-0">
                        <li class="breadcrumb-item"><a href="index.php" class="text-white opacity-75 text-decoration-none">Home</a></li>
                        <li class="breadcrumb-item"><a href="packages.php" class="text-white opacity-75 text-decoration-none">Tours</a></li>
                        <li class="breadcrumb-item active text-white fw-bold" aria-current="page"><?= htmlspecialchars($package['title']) ?></li>
                    </ol>
                </nav>
                <span class="badge bg-primary px-3 py-2 rounded-pill mb-3 reveal-up" style="letter-spacing: 2px; font-size: 10px;"><?= strtoupper(htmlspecialchars($country_name)) ?></span>
                <h1 class="display-3 fw-bold mb-0 reveal-up" style="letter-spacing: -2px;"><?= htmlspecialchars($package['title']) ?></h1>
            </div>
        </div>
    </div>
</div>

<section class="py-5" style="background: #fdfcfb; min-height: 500px;">
    <div class="container" style="margin-top: -50px; position: relative; z-index: 10;">
        <div class="row">
            <div class="col-lg-8">
                <!-- Stats Row -->
                <div class="row g-3 mb-5 reveal-up">
                    <div class="col-md-4">
                        <div class="p-4 bg-white shadow-sm rounded-4 d-flex align-items-center gap-3 h-100">
                            <div class="icon-box bg-light text-primary rounded-3" style="width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; font-size: 20px;"><i class="far fa-clock"></i></div>
                            <div><small class="text-muted d-block">Duration</small><strong style="font-size: 14px;"><?= htmlspecialchars($package['duration'] ?: 'N/A') ?></strong></div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="p-4 bg-white shadow-sm rounded-4 d-flex align-items-center gap-3 h-100">
                            <div class="icon-box bg-light text-primary rounded-3" style="width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; font-size: 20px;"><i class="far fa-calendar-alt"></i></div>
                            <div><small class="text-muted d-block">Travel Period</small><strong style="font-size: 14px;"><?= htmlspecialchars($package['travel_period'] ?: 'N/A') ?></strong></div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="p-4 bg-white shadow-sm rounded-4 d-flex align-items-center gap-3 h-100">
                            <div class="icon-box bg-light text-primary rounded-3" style="width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; font-size: 20px;"><i class="fas fa-users"></i></div>
                            <div><small class="text-muted d-block">Tour Type</small><strong style="font-size: 14px;">Premium Group</strong></div>
                        </div>
                    </div>
                </div>

                <!-- Tabs Navigation -->
                <ul class="nav nav-pills mb-4 gap-2 bg-white p-2 rounded-pill shadow-sm reveal-up" id="packageTab" role="tablist" style="border: 1px solid #eee;">
                    <li class="nav-item flex-fill"><button class="nav-link active rounded-pill w-100 py-3 fw-bold" data-bs-toggle="tab" data-bs-target="#overview">Overview</button></li>
                    <li class="nav-item flex-fill"><button class="nav-link rounded-pill w-100 py-3 fw-bold" data-bs-toggle="tab" data-bs-target="#itinerary">Itinerary</button></li>
                    <li class="nav-item flex-fill"><button class="nav-link rounded-pill w-100 py-3 fw-bold" data-bs-toggle="tab" data-bs-target="#inclusions">Inclusions</button></li>
                    <?php if($gallery->num_rows > 0): ?>
                    <li class="nav-item flex-fill"><button class="nav-link rounded-pill w-100 py-3 fw-bold" data-bs-toggle="tab" data-bs-target="#tour-gallery">Gallery</button></li>
                    <?php endif; ?>
                </ul>

                <!-- Tabs Content -->
                <div class="tab-content bg-white p-4 p-md-5 rounded-4 shadow-sm reveal-up" id="packageTabContent">
                    <div class="tab-pane fade show active" id="overview">
                        <h4 class="fw-bold mb-4">Tour Overview</h4>
                        <div class="text-muted fs-6" style="line-height: 1.8; white-space: pre-line;"><?= htmlspecialchars($package['tour_name'] ?: 'No description available.') ?></div>
                    </div>
                    <div class="tab-pane fade" id="itinerary">
                        <h4 class="fw-bold mb-4">Plan & Landmarks</h4>
                        <div class="text-muted fs-6" style="line-height: 1.8; white-space: pre-line;"><?= htmlspecialchars($package['landmarks'] ?: 'Itinerary details coming soon.') ?></div>
                    </div>
                    <div class="tab-pane fade" id="inclusions">
                        <h4 class="fw-bold mb-4">What's Included</h4>
                        <div class="text-muted fs-6" style="line-height: 1.8; white-space: pre-line;"><?= htmlspecialchars($package['includes'] ?: 'Inclusion details coming soon.') ?></div>
                    </div>
                    <?php if($gallery->num_rows > 0): ?>
                    <div class="tab-pane fade" id="tour-gallery">
                        <h4 class="fw-bold mb-4">Gallery</h4>
                        <div class="row g-3">
                            <?php while($img = $gallery->fetch_assoc()): ?>
                            <div class="col-md-4 col-6">
                                <div class="overflow-hidden rounded-4" style="height: 150px;">
                                    <img src="uploads/<?= $img['image'] ?>" class="w-100 h-100" style="object-fit: cover; cursor: pointer;">
                                </div>
                            </div>
                            <?php endwhile; ?>
                        </div>
                    </div>
                    <?php endif; ?>
                </div>
            </div>

            <!-- Sidebar -->
            <div class="col-lg-4 mt-5 mt-lg-0">
                <div class="sticky-top" style="top: 120px;">
                    <div class="card border-0 shadow-lg mb-4" style="border-radius: 30px; overflow: hidden;">
                        <div class="bg-primary text-white p-5 text-center">
                            <small class="text-uppercase opacity-75 fw-bold" style="letter-spacing: 2px;">Starting from</small>
                            <h2 class="display-5 fw-bold mb-0">LKR <?= number_format($package['price'], 0) ?></h2>
                        </div>
                        <div class="card-body p-5">
                            <?php if(!empty($package['brochure_pdf'])): ?>
                            <a href="uploads/<?= $package['brochure_pdf'] ?>" target="_blank" class="btn btn-outline-dark w-100 mb-4 py-3 rounded-pill fw-bold border-2">
                                <i class="fas fa-file-pdf me-2 text-danger"></i> DOWNLOAD BROCHURE
                            </a>
                            <?php endif; ?>

                            <h5 class="fw-bold mb-4"><i class="fas fa-calendar-check me-2 text-primary"></i> Plan Your Trip</h5>
                            <form action="booking.php" method="GET">
                                <input type="hidden" name="package_id" value="<?= $package['id'] ?>">
                                <div class="mb-3">
                                    <label class="small fw-bold text-muted mb-2">Preferred Travel Date</label>
                                    <input type="date" name="date" class="form-control border-0 bg-light p-3 rounded-3" required>
                                </div>
                                <div class="mb-4">
                                    <label class="small fw-bold text-muted mb-2">Number of Travelers</label>
                                    <input type="number" name="persons" class="form-control border-0 bg-light p-3 rounded-3" min="1" value="1" required>
                                </div>
                                <button type="submit" class="btn btn-primary w-100 py-3 rounded-pill fw-bold shadow-lg mb-3">BOOK NOW</button>
                            </form>
                            
                            <hr class="my-4 opacity-10">
                            
                            <div class="text-center">
                                <p class="small text-muted mb-3">Questions? Chat with an expert</p>
                                <a href="https://wa.me/<?= (!empty($settings['whatsapp_number']) ? $settings['whatsapp_number'] : '94771957420') ?>?text=<?= urlencode("Hello! I am interested in " . $package['title'] . " tour.") ?>" target="_blank" class="btn btn-success w-100 py-3 rounded-pill fw-bold" style="background: #25D366; border: none;">
                                    <i class="fab fa-whatsapp me-2"></i> WHATSAPP INQUIRY
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<style>
    .package-hero::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, transparent 60%);
        pointer-events: none;
    }
    .nav-pills .nav-link { color: #666; transition: 0.3s; }
    .nav-pills .nav-link.active { background: var(--primary) !important; color: #fff !important; }
    
    @media (max-width: 768px) {
        .package-hero {
            min-height: 50vh !important;
            padding-bottom: 60px !important;
            margin-top: 150px !important;
        }
        .display-3 { font-size: 32px !important; line-height: 1.2; }
        .tab-content { padding: 30px 20px !important; }
    }
    
    /* Visibility Fix for reveal animations */
    .reveal-up { opacity: 1 !important; transform: none !important; visibility: visible !important; }
</style>

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