<?php 
require_once 'includes/db.php';
require_once 'includes/header.php'; 

$id = isset($_GET['id']) ? (int)$_GET['id'] : 0;
$service = null;
try {
    $res = $conn->query("SELECT * FROM services WHERE id = $id");
    if($res) {
        $service = $res->fetch_assoc();
    }
} catch(Exception $e) {
    $service = null;
}

if(!$service) {
    echo "<div class='container my-5 text-center'><h3>Service not found.</h3><a href='services.php' class='btn btn-primary'>Back to Services</a></div>";
    require_once 'includes/footer.php';
    exit;
}

$title = $lang == 'hi' && !empty($service['title_hi']) ? $service['title_hi'] : $service['title'];
$desc = $lang == 'hi' && !empty($service['description_hi']) ? $service['description_hi'] : $service['description'];
?>

<div class="position-relative" style="background: linear-gradient(135deg, #A20E37 0%, #7b0a28 60%, #FBBC09 100%); padding: 60px 0;">
    <div class="container text-white text-center">
        <h1 class="fw-bold mb-2"><?php echo h($title); ?></h1>
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb justify-content-center mb-0">
                <li class="breadcrumb-item"><a href="index.php" class="text-warning">Home</a></li>
                <li class="breadcrumb-item"><a href="services.php" class="text-warning">Services</a></li>
                <li class="breadcrumb-item active text-white"><?php echo h($title); ?></li>
            </ol>
        </nav>
    </div>
</div>

<div class="container my-5">
    <div class="row mb-5">
        <div class="col-md-8 mx-auto text-center">
            <p class="lead text-muted"><?php echo h($desc); ?></p>
        </div>
    </div>

    <div class="row g-4">
        <div class="col-12 mb-3">
            <h3 class="fw-bold border-bottom pb-2"><?php echo __('gallery'); ?></h3>
        </div>
        
        <?php 
        $gres = false;
        try {
            $gres = $conn->query("SELECT * FROM service_gallery WHERE service_id = $id ORDER BY id DESC");
        } catch(Exception $e) {
            $gres = false;
        }
        if($gres && $gres->num_rows > 0):
            while($grow = $gres->fetch_assoc()):
        ?>
        <div class="col-md-4 col-sm-6">
            <div class="card border-0 shadow-sm h-100 gallery-item">
                <div class="position-relative overflow-hidden" style="border-radius: 15px;">
                    <?php $img_src = (strpos($grow['image'], 'http') === 0) ? $grow['image'] : 'uploads/gallery/'.h($grow['image']); ?>
                    <img src="<?php echo $img_src; ?>" class="card-img-top" style="height: 250px; object-fit: cover; transition: transform 0.5s;" alt="...">
                    <div class="gallery-overlay d-flex flex-column justify-content-end p-3 text-white">
                        <h6 class="mb-1 fw-bold"><?php echo h($grow['title']); ?></h6>
                        <small><?php echo h($grow['subtitle']); ?></small>
                    </div>
                </div>
            </div>
        </div>
        <?php 
            endwhile; 
        else:
        ?>
        <div class="col-12 text-center py-5">
            <div class="text-muted">
                <i class="fas fa-images fa-4x mb-3 opacity-25"></i>
                <p>No images found in this gallery yet.</p>
            </div>
        </div>
        <?php endif; ?>
    </div>
</div>

<style>
.gallery-item:hover img {
    transform: scale(1.1);
}
.gallery-overlay {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
    opacity: 0;
    transition: opacity 0.3s;
    border-radius: 15px;
}
.gallery-item:hover .gallery-overlay {
    opacity: 1;
}
</style>

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