<?php
  date_default_timezone_set("America/Bogota"); // ← ZONA HORARIA BOGOTÁ–LIMA–QUITO
  if (!isset($_SESSION)) session_start();
  require_once __DIR__ . '/../../config/db.php';
  $NOMBRE_PROVEEDOR = NOMBRE_PROVEEDOR;
  $LOGO_EMPRESA = LOGO_EMPRESA;
  $LOGO_PROVEEDOR = LOGO_PROVEEDOR;
  $ip_real        = $_SESSION['TIENDA_IP_REAL'] ?? 'No asignado';
  $ip_enc         = $_SESSION['TIENDA_IP_ENC'] ?? 'No asignado';
  $tienda_nombre  = $_SESSION['TIENDA_NOMBRE'] ?? 'No asignado';
?>
    <meta charset="UTF-8">
    <meta name="MobileOptimized" content="width" />
    <meta name="HandheldFriendly" content="true" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="viewport" content="width=device-width">
    <meta name="mobile-web-app-capable" content="yes">
    
    <title><?php echo $title;?></title>

    <?php require_once __DIR__ . '/../../config/db.php'; ?>
    <link rel="icon" href="../../public/img/<?php echo $LOGO_PROVEEDOR; ?>" type="image/png"> 
    <link href="../../public/assets/bootstrap-5.3.3-dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="../../public/assets/font-awesome-6.5.0/css/all.min.css" rel="stylesheet">
 
    <style>
        .botonF1{
          width:50px;
          height:50px;
          border-radius:100%;
          background:#27AE60;
          left: :0;
          bottom:0;
          position:relative; /*position:relative;*/
          margin-left: :16px;
          margin-bottom:16px;
          border:none;
          outline:none;
          color:#FFF;
          font-size:30px;
          box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
          transition:.3s;  
        }
 
        .botonF1:hover span{
          transform:rotate(360deg);
        }
        .botonF1:active{
          transform:scale(1.1);
        }

        .botonF2{
          width:42px;
          height:42px;
          border-radius:100%;
          background:#5DADE2;
          right: 0;
          bottom:0;
          position:absolute;  
          margin-right: 25px;
          margin-bottom:510px;
          border:none;
          outline:none;
          color:#FFF;
          font-size:30px;
          box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
          transition:.3s;  
        }
 
        .botonF2:hover span{
          transform:rotate(360deg);
        }
        .botonF2:active{
          transform:scale(1.1);
        }
    </style> 


    <!--estilo compatibilidad version movil-->
    <style>
      <div id="aviso-movil-horizontal">
          Por favor, coloca tu móvil en horizontal.
      </div>
      <link rel="stylesheet" media="screen" type="text/css" href="normal.css" />
    </style>
 
 
    <style type="text/css">
      @media handheld
        body
        {
          width:98%;
          font-family:Verdana;
          font-size:16px;
        } 

        @media screen and (max-width: 960px) 
        {
        /* Navegadores tipo ipad*/
        /*definimos un ancho definido en el contenedor principal*/
        #main{width: 708px;}
        /*aumentamos tamaño de fuente de forma global*/
        body, input, textarea { font-size: 110%; }
        /*redefinimos la estructura para evitar que floten los contenedores y quitamos el bloque lateral para situarlo a continuación del contenido y así mejorar la legibilidad del texto (usabilidad)*/
        #wrapper #sidebar { float: none; margin: 0;width: auto; }
        /*hacemos que el bloque de contenido utilice todo el ancho disponible*/
        #content {margin: 0; width: 100%;background-color: #fff;}
        /*ocultamos el bloque de búsqueda*/
        #search-box {display: none; }
        }

        @media screen and (max-width: 767px) {
        /* Navegadores tipo tablet de 7px*/
        /*definimos un ancho definido en el contenedor principal*/
        #main{width:480px;}
        /*aumentamos tamaño de fuente de forma global*/
        body, input, textarea { font-size: 120%; }
        }

        @media screen and (max-width: 479px) {
        /* Navegadores tipo iphone*/
        /*definimos un ancho definido en el contenedor principal*/
        #main{width:320px;}
        /*aumentamos tamaño de fuente de forma global*/
        body, input, textarea { font-size: 130%; }
        /*reducimos el padding del contenedor de cabecera para que se vea correctamente para los móviles más pequeños */
        #header {padding: 1px; }
        }

        @media screen and (max-width: 319px) {
        /* Navegadores tipo móvil pequeño*/
        /*definimos un ancho del 100% a partir del ancho de 320px anterior*/
        #main{width:100%;}
        }
    </style>


