<!doctype html>

<html lang="en">



  <?php include "control/iniciarsesion.php";?>

   <?php //include "consultas/contar.php";?>

<!-- Mirrored from www.xn--b3c3da.com/haclc/dashboard-4.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 09 Nov 2022 02:07:59 GMT -->

<head>

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1">

    <base #href="" />



    <?php include "configuracion/titulo.php"; ?>



    <!-- include common vendor stylesheets & fontawesome -->

    <link rel="stylesheet" type="text/css" href="node_modules/bootstrap/dist/css/bootstrap.css">



    <link rel="stylesheet" type="text/css" href="node_modules/%40fortawesome/fontawesome-free/css/fontawesome.css">

    <link rel="stylesheet" type="text/css" href="node_modules/%40fortawesome/fontawesome-free/css/regular.css">

    <link rel="stylesheet" type="text/css" href="node_modules/%40fortawesome/fontawesome-free/css/brands.css">

    <link rel="stylesheet" type="text/css" href="node_modules/%40fortawesome/fontawesome-free/css/solid.css">







    <!-- include vendor stylesheets used in "Dashboard 4" page. see "/views//pages/partials/dashboard-4/@vendor-stylesheets.hbs" -->





    <!-- include fonts -->

    <link rel="stylesheet" type="text/css" href="dist/css/ace-font.css">







    <!-- ace.css -->

    <link rel="stylesheet" type="text/css" href="dist/css/ace.css">





    <!-- favicon -->

    <?php include "configuracion/favicon.php";?>



    <!-- "Dashboard 4" page styles, specific to this page for demo only -->

    <link rel="stylesheet" type="text/css" href="views/pages/dashboard-4/%40page-style.css">

    <link rel="stylesheet" type="text/css" href="dist/css/ace-themes.css">



  </head>



  <body>

    <div class="body-container">

     <?php include "configuracion/menu_arriba.php";?>

      <div class="main-container bgc-white">



      <?php include "configuracion/menu_izquierda.php"?>



        <div role="main" class="main-content">

          <div class="page-content">

            <div class="page-header border-0">

              <h1 class="page-title text-primary-d2 text-160">

               DEVOLUCI&Oacute;N

                <small class="page-info text-secondary-d3">

                  <i class="fa fa-angle-double-right text-80"></i>

                  &amp; APP

                </small>

              </h1>



              <div class="page-tools d-flex align-items-end btn-group">

                <button type="button" class="btn px-25 py-2 text-95 btn-text-purple btn-lighter-default btn-h-lighter-purple btn-a-lighter-purple border-b-2">

                  <i class="fa fa-save text-120"></i>

                </button>



                <button type="button" class="btn px-25 py-2 text-95 btn-text-success btn-lighter-default btn-h-lighter-success btn-a-lighter-success border-b-2">

                  <i class="fa fa-undo text-110"></i>

                </button>



                <div class="btn-group dropdown dd-backdrop dd-backdrop-none-md">

                  <button type="button" class="btn px-25 py-2 text-95 btn-text-info btn-lighter-default btn-h-lighter-info btn-a-lighter-info dropdown-toggle border-b-2" data-display="static" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

                    <i class="fa fa-search text-110"></i>

                  </button>

                  <div class="dropdown-menu dropdown-menu-right dropdown-caret dropdown-animated animated-2 dd-slide-up dd-slide-none-md">

                    <div class="dropdown-inner">

                      <a class="dropdown-item" href="#">Action</a>

                      <a class="dropdown-item" href="#">Another action</a>

                      <a class="dropdown-item" href="#">Something else here</a>

                      <div class="dropdown-divider"></div>

                      <a class="dropdown-item" href="#">Separated link</a>

                    </div>

                  </div>

                </div>

              </div>

            </div>











            <div class="px-2">

              <div class="row">



                <div class="col-12 col-sm-6 col-lg-3 p-0 p-md-1 mb-2 mb-lg-0">

                  <div class="p-2 py-lg-3 d-flex pos-rel mx-1 justify-content-start justify-content-lg-center ccard">



                    <div class="pl-1">

                      <span class="d-inline-block bgc-success-tp1 p-3 radius-round text-center border-2 brc-black-tp11">

              	<i class="fas fa-chart-line text-white text-170 w-3 mx-3px"></i>

              </span>

                    </div>



                    <div class="pl-25">

                      <div class="d-flex align-items-center justify-content-between justify-content-md-start">

                        <span class="text-grey-d3 text-160 mr-4">

      				

                    <?php echo $rol;?>

      			</span>





                      </div>







                      <div class="text-nowrap">

                        Tipo

                      </div>

                    </div>



                  </div>

                </div>



<?php



$rsd = mysql_query("SELECT MAX(id_dev) AS id FROM dev");

if ($r = mysql_fetch_row($rsd)) {

    $ids = trim($r[0]);

}



$consultar = "SELECT * FROM dev WHERE id_dev='".$ids."'"; 

$resultador = mysql_query($consultar,$conex) or die(mysql_error());

$filass = mysql_fetch_array($resultador);



$sorteosd = $filass["sorteo"];

$primer   = $filass["primera"];   // inicio plataforma

$ultima   = $filass["ultima"];    // cierre plataforma



?>

<div class="col-12 col-sm-6 col-lg-3 p-0 p-md-1 mb-2 mb-lg-0">

  <div class="p-2 py-lg-3 d-flex pos-rel mx-1 justify-content-start justify-content-lg-center ccard">



    <div class="pl-1">

      <span class="d-inline-block bgc-warning-tp1 p-3 radius-round text-center border-2 brc-black-tp11">

        <i class="fas fa-clock text-white text-170 w-3 mx-3px"></i>

      </span>

    </div>



    <div class="pl-25">



      <div class="d-flex align-items-center justify-content-between justify-content-md-start">

        <span class="text-grey-d3 text-160 mr-4" id="contador_cierre">

        Calculando...

        </span>

      </div>



      <div class="text-nowrap">

        Cierre Plataforma

      </div>



    </div>



  </div>

</div>





















               <!-- <div class="col-12 col-sm-6 col-lg-3 p-0 p-md-1 mb-2 mb-lg-0">

                  <div class="p-2 py-lg-3 d-flex pos-rel mx-1 justify-content-start justify-content-lg-center ccard">



                    <div class="pl-1">

                      <span class="d-inline-block bgc-blue-tp1 p-3 radius-round text-center border-2 brc-black-tp11">

              	<i class="fa fa-flask w-4 text-105 text-dark-tp3"></i>

              </span>

                    </div>



                    <div class="pl-25">

                      <div class="d-flex align-items-center justify-content-between justify-content-md-start">

                        <span class="text-grey-d3 text-160 mr-4">

      				<?php // echo $descargas;?>

      			</span>



                        <div class="text-success opacity-1 pr-1 font-bolder">

                          <?php //echo $descargas;?>

                          <i class="fas fa-level-up-alt"></i>

                        </div>



                      </div>







                      <div class="text-nowrap">

                       Tablas Generadas 

                      </div>

                    </div>



                  </div>

                </div>-->

 <div class="col-12 col-sm-6 col-lg-3 p-0 p-md-1 mb-2 mb-lg-0">

                  <div class="p-2 py-lg-3 d-flex pos-rel mx-1 justify-content-start justify-content-lg-center ccard">



                    <div class="pl-1">

                      <span class="d-inline-block bgc-danger-tp1 p-3 radius-round text-center border-2 brc-black-tp11">

              	<i class="fa fa-cog w-4 text-110 text-white-tp1"></i>

              </span>

                    </div>



                    <div class="pl-25">

                      <div class="d-flex align-items-center justify-content-between justify-content-md-start">

                        <span class="text-grey-d3 text-160 mr-4">

      				<?php echo $sorteosd ; ?>

      			</span>

  <div class="text-success opacity-1 pr-1 font-bolder">

                         <?php echo $sorteosd; ?>

                          <i class="fas fa-level-up-alt"></i>

                          </div>

                      </div>







                      <div class="text-nowrap">

                      Sorteo

                      </div>

                    </div>



                  </div>

                </div>



                <div class="col-12 col-sm-6 col-lg-3 p-0 p-md-1 mb-2 mb-lg-0">

                  <div class="p-2 py-lg-3 d-flex pos-rel mx-1 justify-content-start justify-content-lg-center ccard">



                    <div class="pl-1">

                      <span class="d-inline-block bgc-purple-tp1 p-3 radius-round text-center border-2 brc-black-tp11">

              	<i class="far fa-user text-white text-170 w-3 mx-3px"></i>

              </span>

                    </div>



                    <div class="pl-25">

                      <div class="d-flex align-items-center justify-content-between justify-content-md-start">

                        <span class="text-grey-d3 text-160 mr-4">

      			 <?php echo "$codigo";?>

      			</span>





                        <div class="text-success opacity-1 pr-1 font-bolder">

                          <?php echo "$codigo";?>%

                          <i class="fas fa-level-up-alt"></i>

                        </div>

                      </div>







                      <div class="text-nowrap">

                        Usuario

                      </div>

                    </div>



                  </div>

                </div>





               



              </div>

            </div>









            <hr class="mx-n3 mt-45 mb-0 brc-secondary-l2 opacity-2" />



<div class="box-content">

            <style>

    

    .contenedor {

        width: 500px;

        margin: auto;

        text-align: center;

    }

    .zona-drop {

        border: 3px dashed #007bff;

        border-radius: 10px;

        padding: 40px;

        background-color: #fff;

        color: #555;

        transition: 0.3s;

        cursor: pointer;

    }

    .zona-drop.dragover {

        background-color: #e0f0ff;

        border-color: #0056b3;

    }

    #lista-archivos {

        margin-top: 15px;

        text-align: left;

    }

    #lista-archivos li {

        list-style: none;

        background: #ffffff;

        border: 1px solid #ddd;

        padding: 8px;

        margin-bottom: 5px;

        border-radius: 5px;

    }

    .barra {

        width: 100%;

        background-color: #ddd;

        border-radius: 5px;

        overflow: hidden;

        height: 20px;

        margin-top: 15px;

        display: none;

    }

    .barra div {

        height: 100%;

        width: 0%;

        background-color: #007bff;

        text-align: center;

        color: #fff;

        line-height: 20px;

        transition: width 0.3s;

    }

    button {

        margin-top: 15px;

        padding: 10px 20px;

        background: #007bff;

        color: #fff;

        border: none;

        border-radius: 5px;

        cursor: pointer;

    }

    button:hover {

        background: #0056b3;

    }

</style>

</head>

<body>

               <!-- <form role="form">  -->

               

               

               

               

              <form action="estados/drop_nyevo.php" id="formulario" enctype="multipart/form-data">

        <input type="hidden" name="id_usuario" value="<?php echo $fila['id_usuario']; ?>">



        <div id="zonaDrop" class="zona-drop">

            Arrastra tus archivos PDF aqu&iacute; o haz clic para seleccionarlos

            <input type="file" id="inputArchivos" name="nombre_archivo_cliente[]" multiple accept="application/pdf" style="display:none;">

        </div>



        <ul id="lista-archivos"></ul>



        <!-- Barra de progreso -->

        <div class="barra" id="barraProgreso">

            <div id="progreso">0%</div>

        </div>



        <button type="submit">Subir Archivos</button>

    </form>

</div>

<style>

/* === Estilo del botón "Quitar" === */

.btn-quitar {

    background-color: #28a745;

    color: white;

    padding: 3px 10px;

    border-radius: 5px;

    font-size: 13px;

    text-decoration: none;

    margin-left: 10px;

    transition: 0.3s;

}

.btn-quitar:hover {

    background-color: #218838;

}



/* === Lista de archivos === */

#lista-archivos li {

    display: flex;

    justify-content: space-between;

    align-items: center;

    list-style: none;

    background: #ffffff;

    border: 1px solid #ddd;

    padding: 8px 10px;

    margin-bottom: 6px;

    border-radius: 6px;

}



/* === Barra de progreso === */

.barra {

    width: 100%;

    background-color: #ddd;

    border-radius: 5px;

    overflow: hidden;

    height: 25px;

    margin-top: 15px;

    display: none;

    box-shadow: inset 0 1px 3px rgba(0,0,0,0.2);

}

.barra div {

    height: 100%;

    width: 0%;

    background-color: #007bff;

    text-align: center;

    color: #fff;

    line-height: 25px;

    font-weight: bold;

    transition: width 0.3s ease;

}

</style>



<script>

// ==============================

// ?? DRAG & DROP + UPLOAD FIABLE

// ==============================

var zonaDrop = document.getElementById('zonaDrop');

var inputArchivos = document.getElementById('inputArchivos');

var listaArchivos = document.getElementById('lista-archivos');

var formulario = document.getElementById('formulario');

var barra = document.getElementById('barraProgreso');

var progreso = document.getElementById('progreso');

var archivosSeleccionados = [];



// --- Eventos básicos ---

zonaDrop.addEventListener('click', function() {

    inputArchivos.click();

});

zonaDrop.addEventListener('dragover', function(e) {

    e.preventDefault();

    zonaDrop.classList.add('dragover');

});

zonaDrop.addEventListener('dragleave', function() {

    zonaDrop.classList.remove('dragover');

});

zonaDrop.addEventListener('drop', function(e) {

    e.preventDefault();

    zonaDrop.classList.remove('dragover');

    agregarArchivos(e.dataTransfer.files);

});

inputArchivos.addEventListener('change', function() {

    agregarArchivos(this.files);

});



// --- Agregar archivos seleccionados ---

function agregarArchivos(files) {

    for (var i = 0; i < files.length; i++) {

        if (files[i].type === "application/pdf") {

            archivosSeleccionados.push(files[i]);

        } else {

            alert("? " + files[i].name + " no es un PDF válido.");

        }

    }

    mostrarArchivos();

}



// --- Mostrar lista de archivos ---

function mostrarArchivos() {

    listaArchivos.innerHTML = "";

    archivosSeleccionados.forEach(function(archivo, index) {

        var li = document.createElement('li');

        li.innerHTML = "<span>?? " + archivo.name + "</span>" +

                       "<a class='btn-quitar' onclick='eliminarArchivo(" + index + ")'>Quitar</a>";

        listaArchivos.appendChild(li);

    });

}



// --- Eliminar archivo individual ---

function eliminarArchivo(index) {

    archivosSeleccionados.splice(index, 1);

    mostrarArchivos();

}



// --- Enviar archivos con AJAX ---

formulario.addEventListener('submit', function(e) {

    e.preventDefault();



    if (archivosSeleccionados.length === 0) {

        alert("?? No se han seleccionado archivos PDF.");

        return;

    }



    // Crear FormData manualmente

    var datos = new FormData();

    var idUsuario = document.querySelector('[name="id_usuario"]').value;

    datos.append("id_usuario", idUsuario);



    for (var i = 0; i < archivosSeleccionados.length; i++) {

        datos.append("nombre_archivo_cliente[]", archivosSeleccionados[i]);

    }



    // Mostrar barra

    barra.style.display = 'block';

    progreso.style.width = '0%';

    progreso.textContent = '0%';



    // Crear nueva petición

    var xhr = new XMLHttpRequest();

    xhr.open('POST', formulario.getAttribute('action'), true);



    // Evitar cacheo y errores por encabezados

    xhr.setRequestHeader("Cache-Control", "no-cache");



    // Progreso en tiempo real

    xhr.upload.addEventListener('progress', function(e) {

        if (e.lengthComputable) {

            var porcentaje = Math.round((e.loaded / e.total) * 100);

            progreso.style.width = porcentaje + '%';

            progreso.textContent = porcentaje + '%';

        }

    });



    // Respuesta del servidor

    xhr.onreadystatechange = function() {

        if (xhr.readyState === 4) {

            if (xhr.status === 200) {

                progreso.style.width = '100%';

                progreso.textContent = '100%';

                alert('? Archivos subidos correctamente.');

                archivosSeleccionados = [];

                listaArchivos.innerHTML = '';

                formulario.reset();

                setTimeout(function() {

                    barra.style.display = 'none';

                    progreso.style.width = '0%';

                    progreso.textContent = '0%';

                }, 1500);

            } else {

                alert('? Error del servidor. Código: ' + xhr.status);

            }

        }

    };



    xhr.onerror = function() {

        alert('? Error de red o conexión con el servidor.');

    };



    xhr.send(datos);

});

</script>

 









<br>

<br>

<br>

<br>

<br>

<br>

<br>

<br>

<br>

<br>

<br>

<br>

<br>

<br>

<br>



           

















        



          <!-- this footer is shown in device width above `sm` -->

         <?php include "configuracion/footer.php";?>





          <!-- this footer is shown in mobile devices below `sm` -->

         

        </div>



        <div id="id-ace-settings-modal" class="my-1 my-lg-2 modal modal-nb ace-aside aside-right aside-offset aside-below-nav" data-backdrop="false" tabindex="-1" role="dialog" aria-hidden="true">



          <div class="modal-dialog" role="document">

            <div class="modal-content w-auto flex-grow-1 pb-1px radius-0 radius-l-2 border-y-2 border-l-1 brc-default-m3 bgc-white-tp1 shadow">



              <div class="modal-header p-0 radius-0 mx-3">

                <h4 class="modal-title text-primary-d1 text-140 pt-2 pl-1">Demo Settings</h4>



                <button type="button" class="close m-0 mr-n2" data-dismiss="modal" aria-label="Close">

                  <i class="fa fa-times text-70" aria-hidden="true"></i>

                </button>

              </div>



              <div class="modal-body mx-md-2" data-ace-scroll='{"smooth": true, "lock": true}'>

                <form autocomplete="off">

                  <div class="d-flex flex-column flex-md-row justify-content-md-between align-items-md-center">

                    <h5 class="text-default-d2">

                      Zoom

                    </h5>



                    <div class="btn-group btn-group-toggle align-self-end" data-toggle="buttons">

                      <label class="btn btn-sm btn-lighter-grey btn-h-light-primary btn-a-primary">

                        90%

                        <input type="radio" name="zoom-level" value="90" />

                      </label>



                      <label class="btn btn-sm btn-lighter-grey btn-h-light-primary btn-a-primary active">

                        100%

                        <input type="radio" name="zoom-level" value="none" checked />

                      </label>



                      <label class="btn btn-sm btn-lighter-grey btn-h-light-primary btn-a-primary">

                        110%

                        <input type="radio" name="zoom-level" value="110" />

                      </label>



                      <label class="btn btn-sm btn-lighter-grey btn-h-light-primary btn-a-primary">

                        120%

                        <input type="radio" name="zoom-level" value="120" />

                      </label>

                    </div>

                  </div>





                  <hr class="border-double my-md-3" />





                  <h5 class="text-purple-d1">

                    Themes

                  </h5>



                  <div id="auto-match-div" class="bgc-secondary-l4 py-1 radius-1 mb-3 border-1 radius-1 border-l-3 brc-secondary-m4">

                    <label class="mt-1 pr-2 d-flex align-items-center" for="id-auto-match">

                      <input type="checkbox" class="input-lg mx-15" id="id-auto-match" checked />



                      <span class="pl-0 text-secondary-d1 text-90 font-bolder">

                        Match sidebar & navbar themes

                      </span>

                    </label>

                  </div>





                  <div class="d-flex flex-column flex-md-row justify-content-md-between align-items-md-center mt-3">

                    <h6 class="text-95 pl-1 text-grey-d1">Sidebar</h6>



                    <div class="btn-group btn-group-toggle align-self-end flex-wrap px-0  col-10 col-sm-7" data-toggle="buttons">

                      <label class="btn btn-sm btn-light-default btn-text-default btn-bgc-white btn-a-default btn-h-default">

                        Dark

                        <input type="radio" name="sidebar-theme" value="dark" />

                      </label>



                      <label class="btn btn-sm btn-light-default btn-text-default btn-bgc-white btn-a-default btn-h-default">

                        Light

                        <input type="radio" name="sidebar-theme" value="light" />

                      </label>

                    </div>

                  </div>







                  <div>

                    <div class="d-none bgc-secondary-l1 radius-1 px-1 mb-3 mt-1 text-center" id="id-sidebar-themes-dark">

                      <div class="btn-group btn-group-toggle align-self-end flex-wrap justify-content-center w-75 mx-auto align-items-center my-2 flex-equal-sm" data-toggle="buttons">

                        <label class="btn btn-xs sidebar-color border-0 sidebar-dark d-style active m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="dark" checked />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-dark2 d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="dark2" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-darkblue d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="darkblue" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-darkslategrey d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="darkslategrey" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-cadetblue d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="cadetblue" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-plum d-style my-1px m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="plum" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-darkslateblue d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="darkslateblue" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-purple d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="purple" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-steelblue d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="steelblue" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-blue d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="blue" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-teal d-style m-1px d-none">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="teal" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-green d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="green" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-darkcrimson d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="darkcrimson" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-gradient1 d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="gradient1" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-gradient2 d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="gradient2" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-gradient3 d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="gradient3" />

                        </label>



                        <label class="btn btn-xs sidebar-color border-0 sidebar-gradient4 d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="sidebar-dark" value="gradient4" />

                        </label>



                        <!--

                      <label class="btn btn-xs sidebar-color border-0 sidebar-gradient5 d-style m-1px d-none">

                        <i class="fa fa-check text-white v-active"></i>

                        <input type="radio" name="sidebar-dark" value="gradient5"  />

                      </label>

                      -->



                      </div>

                    </div><!-- #id-sidebar-themes-dark -->





                    <div class="d-none" id="id-sidebar-themes-light">

                      <div class="bgc-secondary-tp2 radius-1 py-1 px-1 mb-3 mt-1 text-center">

                        <div class="d-flex btn-group btn-group-toggle align-self-end flex-wrap justify-content-center mx-auto align-items-center my-2 flex-equal-sm" data-toggle="buttons">



                          <label class="active btn btn-xs border-0 sidebar-white2 d-style m-1px">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="sidebar-light" value="white" checked />

                          </label>



                          <label class="btn btn-xs border-0 sidebar-white2 d-style m-1px d-none">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="sidebar-light" value="white2" />

                          </label>



                          <label class="btn btn-xs border-0 sidebar-white3 d-style m-1px">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="sidebar-light" value="white3" />

                          </label>



                          <label class="btn btn-xs border-0 sidebar-white4 d-style m-1px">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="sidebar-light" value="white4" />

                          </label>



                          <label class="btn btn-xs border-0 sidebar-light d-style m-1px">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="sidebar-light" value="light" />

                          </label>



                          <label class="btn btn-xs border-0 sidebar-lightblue d-style m-1px">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="sidebar-light" value="lightblue" />

                          </label>



                          <label class="btn btn-xs border-0 sidebar-lightblue2 d-style m-1px">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="sidebar-light" value="lightblue2" />

                          </label>



                          <label class="btn btn-xs border-0 sidebar-lightpurple d-style m-1px">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="sidebar-light" value="lightpurple" />

                          </label>





                        </div>

                      </div>

                    </div><!-- #id-sidebar-themes-light -->



                  </div>



                  <hr class="border-dotted" />



                  <div class="d-flex flex-column flex-md-row justify-content-md-between align-items-md-center">

                    <h6 class="text-95 pl-1 text-grey-d1">Navbar</h6>



                    <div id="navbar-themes-show" class="btn-group btn-group-toggle align-self-end flex-wrap px-0 col-10 col-sm-7" data-toggle="buttons">

                      <label class="btn btn-sm btn-light-green btn-text-green btn-bgc-white btn-a-green btn-h-green">

                        Light

                        <input type="radio" name="navbar-theme" value="light" />

                      </label>



                      <label class="btn btn-sm btn-light-green btn-text-green btn-bgc-white btn-a-green btn-h-green">

                        Dark

                        <input type="radio" name="navbar-theme" value="dark" />

                      </label>

                    </div>



                    <div id="navbar-themes-show-msg" class="d-none text-95 px-3 py-15 bgc-secondary-l3 border-1 brc-secondary-m4 border-dotted ml-3 radius-1">

                      Navbar themes can be viewed in<br /> <span>Dashboard <a class="btn-h-dark no-underline px-2px" href="dashboard.html">1</a> & <a class="btn-h-dark no-underline px-2px" href="dashboard-4.html">4</a></span>

                    </div>



                  </div>



                  <div>

                    <div class="d-none bgc-secondary-l1 radius-1 px-1 mb-3 mt-1 text-center" id="id-navbar-themes-dark">

                      <div class="btn-group btn-group-toggle align-self-end flex-wrap justify-content-center w-75 mx-auto align-items-center my-2 flex-equal-sm" data-toggle="buttons">



                        <label class="btn btn-xs border-0 navbar-blue d-style active m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="navbar-dark" value="blue" checked />

                        </label>



                        <label class="btn btn-xs border-0 navbar-darkblue d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="navbar-dark" value="darkblue" />

                        </label>



                        <label class="btn btn-xs border-0 navbar-teal d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="navbar-dark" value="teal" />

                        </label>



                        <label class="btn btn-xs border-0 navbar-green d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="navbar-dark" value="green" />

                        </label>



                        <label class="btn btn-xs border-0 navbar-cadetblue d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="navbar-dark" value="cadetblue" />

                        </label>







                        <label class="btn btn-xs border-0 navbar-plum d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="navbar-dark" value="plum" />

                        </label>



                        <label class="btn btn-xs border-0 navbar-purple d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="navbar-dark" value="purple" />

                        </label>



                        <label class="btn btn-xs border-0 navbar-orange d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="navbar-dark" value="orange" />

                        </label>





                        <label class="btn btn-xs border-0 navbar-brown d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="navbar-dark" value="brown" />

                        </label>



                        <label class="btn btn-xs border-0 navbar-darkgreen d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="navbar-dark" value="darkgreen" />

                        </label>



                        <label class="btn btn-xs border-0 navbar-skyblue d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="navbar-dark" value="skyblue" />

                        </label>



                        <label class="btn btn-xs border-0 navbar-secondary d-style m-1px">

                          <i class="fa fa-check text-white v-active"></i>

                          <input type="radio" name="navbar-dark" value="secondary" />

                        </label>



                      </div>

                    </div><!-- #id-navbar-themes-dark -->



                    <div class="d-none" id="id-navbar-themes-light">

                      <div class="bgc-secondary-tp2 radius-1 py-1 px-1 mb-3 mt-1 text-center">

                        <div class="btn-group btn-group-toggle align-self-end flex-wrap justify-content-center w-75 mx-auto align-items-center my-2 flex-equal-sm" data-toggle="buttons">



                          <label class="active btn btn-xs border-0 navbar-white d-style m-1px">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="navbar-light" value="white" checked />

                          </label>



                          <label class="btn btn-xs border-0 navbar-white2 d-style m-1px">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="navbar-light" value="white2" />

                          </label>



                          <label class="btn btn-xs border-0 navbar-lightblue d-style m-1px">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="navbar-light" value="lightblue" />

                          </label>



                          <label class="btn btn-xs border-0 navbar-lightpurple d-style m-1px">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="navbar-light" value="lightpurple" />

                          </label>



                          <label class="btn btn-xs border-0 navbar-lightgreen d-style m-1px">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="navbar-light" value="lightgreen" />

                          </label>



                          <label class="btn btn-xs border-0 navbar-lightgrey d-style m-1px">

                            <i class="fa fa-check text-muted v-active"></i>

                            <input type="radio" name="navbar-light" value="lightgrey" />

                          </label>



                          <!--

                        <label class="btn btn-xs border-0 navbar-lightyellow d-style m-1px">

                          <i class="fa fa-check text-muted v-active"></i>

                          <input type="radio" name="navbar-light" value="lightyellow"  />

                        </label>

        

                        <label class="btn btn-xs border-0 navbar-khaki d-style m-1px">

                          <i class="fa fa-check text-muted v-active"></i>

                          <input type="radio" name="navbar-light" value="khaki"  />

                        </label>

                        -->



                        </div>

                      </div>



                    </div><!-- #id-navbar-themes-light -->



                  </div>





                  <hr class="border-dotted" />





                  <div class="text-95">

                    <h5 class="text-success">Layout</h5>



                    <div class="mt-3 d-flex justify-content-between align-items-center">

                      <label for="id-navbar-fixed" class="pl-1 text-grey-d1">Fixed Navbar</label>

                      <input type="checkbox" class="ace-switch" id="id-navbar-fixed" checked />

                    </div>



                    <div class="mt-2 d-flex justify-content-between align-items-center">

                      <label for="id-sidebar-fixed" class="pl-1 text-grey-d1">Fixed Sidebar</label>

                      <input type="checkbox" class="ace-switch" id="id-sidebar-fixed" checked />

                    </div>



                    <div class="mt-2 d-flex justify-content-between align-items-center">

                      <label for="id-footer-fixed" class="pl-1 text-grey-d1">Fixed Footer</label>

                      <input type="checkbox" class="ace-switch" id="id-footer-fixed" />

                    </div>



                    <div class="mt-2 d-none d-xl-flex flex-column flex-md-row justify-content-md-between align-items-md-center">

                      <div class="pl-1 text-grey-d1">Boxed Layout</div>



                      <div class="w-50 btn-group btn-group-toggle flex-row flex-wrap fl1ex-md-nowrap" data-toggle="buttons">

                        <label class="btn btn-sm btn-light-primary btn-bgc-white btn-text-primary btn-h-primary btn-a-primary">

                          None

                          <input type="radio" name="boxed-layout" value="none" />

                        </label>



                        <label class="btn btn-sm btn-light-primary btn-bgc-white btn-text-primary btn-h-primary btn-a-primary">

                          All

                          <input type="radio" name="boxed-layout" value="all" />

                        </label>



                        <label class="btn btn-sm btn-light-primary btn-bgc-white btn-text-primary btn-h-primary btn-a-primary">

                          Not Navbar

                          <input type="radio" name="boxed-layout" value="not-navbar" />

                        </label>



                        <label class="btn btn-sm btn-light-primary btn-bgc-white btn-text-primary btn-h-primary btn-a-primary active">

                          Only Content

                          <input type="radio" name="boxed-layout" value="only-content" checked />

                        </label>

                      </div>

                    </div>



                    <div id="id-body-bg" class="collapse">

                      <div class="mt-3 d-none d-xl-flex flex-column flex-md-row justify-content-md-between align-items-md-center">

                        <h6 class="text-95 pl-1 text-grey-d1">Body Background:</h6>



                        <div class="btn-group btn-group-toggle align-self-end" data-toggle="buttons">

                          <label class="btn btn-sm btn-outline-purple active  mb-1">

                            None

                            <input type="radio" name="body-theme" value="auto" checked />

                          </label>



                          <label class="btn btn-sm btn-outline-purple mb-1">

                            Image 1

                            <input type="radio" name="body-theme" value="img1" />

                          </label>



                          <label class="btn btn-sm btn-outline-purple mb-1">

                            Image 2

                            <input type="radio" name="body-theme" value="img2" />

                          </label>

                        </div>

                      </div>

                    </div>







                    <hr class="border-dotted my-2" />



                    <div class="mt-1 d-flex justify-content-between align-items-center">

                      <label for="id-rtl" class="pl-1 text-grey-d1">RTL (right to left)</label>



                      <input type="checkbox" class="ace-switch" id="id-rtl" />

                    </div>





                  </div>



                  <hr class="border-double my-md-4" />



                  <div class="d-flex flex-column flex-md-row justify-content-md-between align-items-md-center">

                    <h5 class="text-info">Font</h5>



                    <div class="align-self-end w-75">

                      <select id="id-change-font" class="ace-select radius-round w-100 text-grey brc-h-info-m2">

                        <option value="lato">Lato</option>

                        <option value="manrope">Manrope</option>

                        <option value="montserrat">Montserrat</option>

                        <option value="noto-sans">Noto Sans</option>

                        <option value="open-sans" selected>Open Sans</option>

                        <option value="poppins">Poppins</option>

                        <option value="raleway">Raleway</option>

                        <option value="roboto" class="text-primary-d2 text-600">Roboto (popular)</option>

                        <option value="">----</option>

                        <option value="markazi">Markazi (for RTL languages)</option>

                      </select>

                    </div>

                  </div>





                  <hr class="border-double my-md-4" />



                  <div class="text-95">

                    <h5 class="text-orange-d2 ml-n2px">Sidebar</h5>

                    <!--

                  <div class="mt-3 d-none d-xl-flex justify-content-between align-items-center">

                      <label for="id-sidebar-compact" class="pl-1 text-grey-d2">Compact</label>

        

                      <div class="custom-control custom-switch d-inline-block">

                        <input type="checkbox" class="custom-control-input" id="id-sidebar-compact"  />

                        <label class="custom-control-label" for="id-sidebar-compact"></label>

                      </div>

                  </div>

                  -->



                    <div class="mt-2 d-none d-xl-flex justify-content-between align-items-center">

                      <div class="pl-1 text-grey-d1">Collapsed Mode</div>



                      <div class="btn-group btn-group-toggle flex-row" data-toggle="buttons">

                        <label class="btn btn-sm btn-outline-red active">

                          Expand

                          <input type="radio" name="sidebar-collapsed" value="expandable" checked />

                        </label>



                        <label class="btn btn-sm btn-outline-red">

                          Popup

                          <input type="radio" name="sidebar-collapsed" value="hoverable" />

                        </label>



                        <label class="btn btn-sm btn-outline-red">

                          Hide

                          <input type="radio" name="sidebar-collapsed" value="hideable" />

                        </label>

                      </div>

                    </div>



                    <div class="mt-3 d-none d-xl-flex justify-content-between align-items-center">

                      <label for="id-sidebar-hover" class="pl-1 text-grey-d1">Submenu on Hover</label>



                      <label>

                        <input type="checkbox" class="ace-switch" id="id-sidebar-hover" />

                      </label>

                    </div>



                    <div class="mt-2 d-flex d-xl-none justify-content-between align-items-center">

                      <label for="id-push-content" class="pl-1 text-grey-d1">Push Content</label>



                      <label>

                        <input type="checkbox" class="ace-switch" id="id-push-content" />

                      </label>

                    </div>



                  </div>



                  <div class="my-1"></div>

                </form>

              </div>



              <div class="modal-footer d-none justify-content-center">

                <button type="button" class="btn btn-default" data-dismiss="modal">

                  <i class="fa fa-times mr-1"></i>

                  Close

                </button>

                <button type="button" class="btn btn-info">

                  <i class="fa fa-check mr-1"></i>

                  Keep changes

                </button>

              </div>



            </div><!-- .modal-content -->



            <div class="aside-header align-self-start mt-1 mt-lg-5 text-right d-style">

              <button type="button" class="btn btn-orange btn-lg shadow-sm pl-2 radius-l-2 f-n-hover py-1 py-md-2" data-toggle="modal" data-target="#id-ace-settings-modal">

                <i class="fa fa-cog text-110 ml-1"></i>

              </button>

            </div>

          </div><!-- .modal-dialog -->

        </div><!-- .modal-aside -->

      </div>



    </div>









<script>



var fecha_cierre = new Date("<?php echo str_replace(' ','T',$ultima); ?>").getTime();



setInterval(function(){



var ahora = new Date().getTime();

var distancia = fecha_cierre - ahora;



if(distancia <= 0){



document.getElementById("contador_cierre").innerHTML =

"<span style='color:red;font-weight:bold;'>CERRADO</span>";



return;



}



var dias = Math.floor(distancia / (1000*60*60*24));

var horas = Math.floor((distancia % (1000*60*60*24)) / (1000*60*60));

var minutos = Math.floor((distancia % (1000*60*60)) / (1000*60));

var segundos = Math.floor((distancia % (1000*60)) / 1000);



document.getElementById("contador_cierre").innerHTML =

dias+"d "+horas+"h "+minutos+"m "+segundos+"s";



},1000);



</script>











    <!-- include common vendor scripts used in demo pages -->

    <script src="node_modules/jquery/dist/jquery.js"></script>

    <script src="node_modules/popper.js/dist/umd/popper.js"></script>

    <script src="node_modules/bootstrap/dist/js/bootstrap.js"></script>





    <!-- include vendor scripts used in "Dashboard 4" page. see "/views//pages/partials/dashboard-4/@vendor-scripts.hbs" -->

    <script src="node_modules/chart.js/dist/Chart.js"></script>





    <script src="node_modules/sortablejs/Sortable.js"></script>





    <!-- include ace.js -->

    <script src="dist/js/ace.js"></script>







    <!-- demo.js is only for Ace's demo and you shouldn't use it -->

    <script src="app/browser/demo.html"></script>





<?php //include "views/pages/dashboard-4/scarip.php";?>

    <!-- "Dashboard 4" page script to enable its demo functionality -->

    <script src="views/pages/dashboard-4/%40page-script.js"></script>

    

  </body>





<!-- Mirrored from www.xn--b3c3da.com/haclc/dashboard-4.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 09 Nov 2022 02:08:00 GMT -->

</html>