<?php require_once "config/conexion.php"; ?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <title>MiraloEn.com</title>
	<!-- Miralocon-->
    <link rel="icon" type="image/x-icon" href="assets/miraojo.ico" />
    <!-- Bootstrap icons-->
    <!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" rel="stylesheet" /> -->
    <!-- Core theme CSS (includes Bootstrap)-->
    <link href="assets/css/styles.css" rel="stylesheet" />
    <link href="assets/css/estilos.css" rel="stylesheet" />
	<style>
	   a {
		     text-decoration: none;
		 }
	</style>  
</head>
<body>
    <!-- <a href="#" class="btn-flotante" id="btnCarrito" style="color:#FF3933;">/\ #960825543<span class="badge bg-success" id="carrito">0</span></a>-->
    <a href="#" class="btn-flotante" style="color:#FF3933;">/\ #960825543<span class="badge bg-success" id="carrito">0</span></a>
    <!-- Navigation-->
    <div class="container">
        <nav class="navbar navbar-expand-lg navbar-light">
            <div class="container-fluid">
                <a class="navbar-brand" href="#">MiraloEnTrujillo.Com</a>
                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse" id="navbarNav">
                    <ul class="navbar-nav">
                        <a href="#" class="nav-link text-info" category="all">Todo</a>
						<?php
                        $query = mysqli_query($conexion, "SELECT UCASE(nomtiposervicio) AS categoria FROM tiposervicio Where idclaseservicio=0 ORDER BY nomtiposervicio");
						//2
                        while ($data = mysqli_fetch_assoc($query)) { ?>
						  <a href="#" class="nav-link" category="<?php echo $data['categoria']; ?>"><?php echo $data['categoria']; ?></a>
						<?php } ?>
				    </ul>
                </div>
            </div>
        </nav>
    </div>
    <!-- Header-->
	
    <header class="bg-dark py-1">
        <div class="container px-4 px-lg-5 my-5">
            <div class="text-center text-white">
                <h1 class="display-4 fw-bolder">MiraloEnTrujillo.Com </h1>
				   <a href="index2.php" style="color:#FF3933;"<p class="lead fw-normal text-red-50 mb-0">AHORA -> Observa los Eventos mas resaltantes ...</p></a>
				   <a href="carrusel.php?idserviciof=<?php echo urlencode($_GET["idserviciof"]);?>" style="color:#00BFFF;"<p class="lead fw-normal text-red-50 mb-0">Mira ->> C A R R U S E L L ....     DE  ....  I M A G E N E S ...</p></a>
		    </div>
        </div>
    </header>                 
    <section class="py-5">
        <div class="container px-4 px-lg-5">
            <div class="row gx-4 gx-lg-5 row-cols-2 row-cols-md-3 row-cols-xl-4 justify-content-center">
			    <?php
				//const id = $(this).data('idsubservicio');
				$idserviciof= $_GET["idserviciof"];
                $query = mysqli_query($conexion, "SELECT p.*, c.idclaseservicio AS id_cat, UCASE(p.nompublicidad) As categoria FROM publicidad p INNER JOIN servicio c ON c.idserviciof = p.idservicio Where c.idserviciof = $idserviciof order by p.nompublicidad");
                $result = mysqli_num_rows($query);
                if ($result > 0) {
                    while ($data = mysqli_fetch_assoc($query)) { ?>
                        <div class="col mb-5 productos" category="<?php echo $data['categoria']; ?>">
                            <div class="card h-100">
                                <!-- Sale badge-->
                                <div class="badge bg-danger text-white position-absolute" style="top: 0.5rem; right: 0.5rem"><?php echo ($data['hipervin1'] > 0) ? 'Especial' : ''; ?></div>
                                <!-- Product image-->
                                <img class="card-img-top" src="assets/img/<?php echo $data['imagen']; ?>" alt="..." />
                                <!-- Product details-->
                                <div class="card-body p-4">
                                    <div class="text-center">
                                        <!-- Product name-->
                                        <h5 class="fw-bolder"><?php echo $data['categoria'] ?></h5>
										<p><?php echo $data['hipervin1']; ?></p>
                                        <p><?php echo $data['hipervin2']; ?></p>
                                        <!-- Product reviews-->
                                        <div class="d-flex justify-content-center small text-warning mb-2">
                                            <div class="bi-star-fill"></div>
                                            <div class="bi-star-fill"></div>
                                            <div class="bi-star-fill"></div>
                                            <div class="bi-star-fill"></div>
                                            <div class="bi-star-fill"></div>
                                        </div>
                                        <!-- Product price-->                              
                                    </div>
                                </div>
                                <!-- Product actions-->
                              <div class="card-footer p-4 pt-0 border-top-0 bg-transparent">
                                    <div class="text-center"><a href="<?php echo $data['hipervin2']; ?>">Mirar...</a></div>
                                </div>
                            </div>
                        </div>
                <?php  }
                } ?>
            </div>
        </div>
    </section>
    <!-- Footer-->
    <footer class="py-5 bg-dark">
        <div class="container">
            <p class="m-0 text-center text-white">www.miraloen.com        Correo: contacto@miraloen.com       WhatsApp: 960825546...   Dirección:  Calle Mauricio Simons N°561 Urb. Las Quintanas</p>
			<a href="#" style="color:#CCFFFF;"<p class="lead fw-normal text-red-50 mb-0">Libro de Reclamaciones</p></a>
			<p class="m-0 text-center text-white">Copyright &copy; Año 2023</p>
        </div>
    </footer>
    <!-- Bootstrap core JS-->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
    <!-- Core theme JS-->
    <script src="assets/js/jquery-3.6.0.min.js"></script>
    <script src="assets/js/scripts.js"></script>
</body>

</html>