<?php
   include "includes/main-action.php";
   $obj=new admin_main();
   $sel_cs=$obj->select_all("menu","order by menu_id");
   $sel_banner_top=$obj->select_all("adv_tbl1","where menu_id='$_REQUEST[catid]' order by adv_id desc");
   //for pop gallery
   $sel_popGallery=$obj->select_all("adv_tbl1","where menu_id='$_REQUEST[catid]' order by adv_id desc");
   
   $sel_banner_right=$obj->select_all("adv_tbl3","order by adv_id desc limit 2");
   $sel_slider=$obj->select_all("adv_tbl2","order by adv_id desc");
   //select category products
   $probycat=$obj->select_all("product","where menu_id='$_REQUEST[catid]' and status='Active' order by id desc");
   //shop by subcategory 
   $shopbyscat=$obj->select_all("categories","where menu_id='$_REQUEST[catid]' and status='Active' order by cat_id");
   
   //select category name
   $cat_query= $obj->select_all("menu","where menu_id='$_REQUEST[catid]' order by menu_id");
   $catName= mysqli_fetch_array($cat_query);
   
   if(isset($_REQUEST['catid']) && $_REQUEST['catid']=="2")$titleName = "Kamal Art Gallery";else $titleName = "News Gallery";
   ?>
<!DOCTYPE html>
<html lang="en">
   <head>
      <title><?php echo $titleName?></title>
      <meta charset="utf-8">
      <meta name="keywords" content="" />
      <meta name="description" content="" />
      <meta name="author" content="">
      <meta name="robots" content="index, follow" />
      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
      <link rel="shortcut icon" type="image/png" href="<?php echo $url?>image/icon/favicon.png"/>
      <link rel="stylesheet" href="<?php echo $url?>css/bootstrap/css/bootstrap.min.css">
      <link href="<?php echo $url?>css/font-awesome/css/font-awesome.min.css" rel="stylesheet">
      <link href="<?php echo $url?>css/themecss/so_megamenu.css" rel="stylesheet">
      <link href="<?php echo $url?>css/footer/footer2.css" rel="stylesheet">
      <link href="<?php echo $url?>css/header/header2.css" rel="stylesheet">
      <link id="color_scheme" href="<?php echo $url?>css/home2.css" rel="stylesheet">
      <link href="<?php echo $url?>css/responsive.css" rel="stylesheet">
      <link href='https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700' rel='stylesheet' type='text/css'>
      <style>
         /* Gallery Grid */
         .gallery {
         display: grid;
         grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
         gap: 15px;
         }
         .gallery-item {
         position: relative;
         cursor: pointer;
         overflow: hidden;
         border-radius: 10px;
         }
         .gallery-item img {
         width: 100%;
         height: 160px;
         object-fit: cover;
         transition: transform 0.4s ease;
         border-radius: 10px;
         }
         .gallery-item:hover img {
         transform: scale(1.05);
         }
         .gallery-item .caption {
         position: absolute;
         bottom: 0;
         width: 100%;
         background: rgba(0,0,0,0.6);
         color: #fff;
         padding: 8px;
         text-align: center;
         font-size: 14px;
         border-radius: 0 0 10px 10px;
         }
         /* Lightbox */
         .lightbox {
         display: none;
         position: fixed;
         z-index: 1000;
         padding-top: 60px;
         top: 0;
         width: 80px;
         height: 500px;
         background: rgba(0,0,0,0.9);
         overflow: auto;
         }
         .lightbox-content {
         position: relative;
         margin: auto;
         display: flex;
         flex-direction: column;
         align-items: center;
         width: 80%;
         max-width: 800px;
         color: #fff;
         text-align: center;
         }
         .lightbox-content img {
         width: 100%;
         border-radius: 10px;
         margin-bottom: 15px;
         }
         /* Text Content */
         .lightbox-title {
         font-size: 22px;
         font-weight: 600;
         margin-bottom: 8px;
         }
         .lightbox-desc {
         font-size: 16px;
         color: #ccc;
         }
         /* Navigation & Close */
         .close, .prev, .next {
         position: absolute;
         color: white;
         font-size: 30px;
         cursor: pointer;
         top: 50%;
         transform: translateY(-50%);
         user-select: none;
         transition: 0.3s;
         }
         .close {
         top: 20px;
         right: 30px;
         font-size: 35px;
         transform: none;
         }
         .prev {
         left: 0;
         padding: 20px;
         }
         .next {
         right: 0;
         padding: 20px;
         }
         .prev:hover, .next:hover, .close:hover {
         color: #f39c12;
         }
      </style>
   </head>
   <body class="common-home res layout-2">
      <div id="wrapper" class="wrapper-fluid banners-effect-7">
      <!-- Header Container  -->
      <?php include "includes/topbar.php";?>
      <!-- //Header Top -->
      <!-- Header center -->
      <?php include "includes/searchbar.php";?>
      <!-- //Header center -->
      <!-- Header Bottom -->
      <?php include "includes/navbar.php";?>
      </header>
      <!-- //Header Container  -->
      <!-- Main Container  -->
      <div class="main-container container">
         <ul class="breadcrumb">
            <li><a href="<?php echo $url?>"><i class="fa fa-home"></i></a></li>
            <li><?php echo $titleName?></li>
         </ul>
         <div class="row">
            <!--Left Part Start-->
            <?php //include "includes/left_bar.php"?>
            <!--Left Part ends-->
            <!--Middle Part Start-->
            <div class="item col-md-1 col-xs-12"></div>
            <div id="content" class="col-md-10 col-sm-10" style="margin-bottom:40px">
               <div class="product-view">
                  <div class="left-content-product">
                     <div id="product">
                        <div class="related titleLine products-list grid module gallery">
                           <?php
                              $g=0;
                              while($mobile_cat=mysqli_fetch_array($sel_banner_top)){
                              ?>
                           <div class="gallery-item" onclick="openLightbox(<?php echo $g?>)">
							  <a href="details.php?pid=<?php echo $mobile_cat['adv_id']?>"> 
                               <img src="<?php echo $url?>image/banner_top/<?php echo $mobile_cat['img'] ?>" alt="Image 1">
                               <?php if(isset($_REQUEST['catid']) && $_REQUEST['catid']=='2'){?>
								  <div class="caption"><?php echo substr($mobile_cat['Adv'],0,170)."..."?></div>
							   <?php }?>	  
							  </a>	  
                           </div>
                           <?php 
                              $g++;
                              } ?>
                        </div>
                     </div>
                     <!-- end Related  Products-->
                  </div>
               </div>
            </div>
            <div class="item col-md-1 col-xs-12"></div>
         </div>
      </div>
      <!-- //Main Container -->
      <!-- Footer Container -->
      <?php include "includes/footer.php" ?>
      <script type="text/javascript" src="<?php echo $url?>js/jquery-2.2.4.min.js"></script>
      <script type="text/javascript" src="<?php echo $url?>js/bootstrap.min.js"></script>
      <script type="text/javascript" src="<?php echo $url?>js/countdown/jquery.countdown.min.js"></script>
      <script type="text/javascript" src="<?php echo $url?>js/themejs/so_megamenu.js"></script>
      <script type="text/javascript" src="<?php echo $url?>js/themejs/addtocart.js"></script>	
      <script type="text/javascript" src="<?php echo $url?>js/themejs/libs.js"></script>
      <script type="text/javascript" src="<?php echo $url?>js/themejs/application.js"></script>
   </body>
</html>