<?php
if (!isset($_SESSION["Usuario"]) || ($_SESSION["Grupo"] != GRUPO_ADMINS && $_SESSION["Grupo"] != GRUPO_SUPERVISORES)) {
    header('Location: /' . RUTA_MAESTRA);
}

$idioma = "es";
if (isset($_COOKIE["idioma"])) {
    $idioma = isset($_COOKIE["idioma"]) ? $_COOKIE["idioma"] : "es";
}

?>
<!DOCTYPE html>
<html translate="no" lang="es">
<!--================================================================================
	Item Name: Materialize - Material Design Admin Template
	Version: 4.0
	Author: PIXINVENT
	Author URL: https://themeforest.net/user/pixinvent/portfolio
  ================================================================================ -->

<!-- Mirrored from pixinvent.com/materialize-material-design-admin-template/html/horizontal-menu/ by HTTrack Website Copier/3.x [XR&CO'2014], Tue, 07 Aug 2018 16:54:03 GMT -->

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="msapplication-tap-highlight" content="no">
	<meta name="description" content="Materialize is a Material Design Admin Template,It's modern, responsive and based on Material Design by Google. ">
	<meta name="keywords" content="materialize, admin template, dashboard template, flat admin template, responsive admin template,">
	<title>
		<?=SITE_NAME;?>
	</title>
	<!-- Favicons-->
	<link rel="icon" href="<?=IMG_ADMIN;?>favicon/icono.png" sizes="64x64">
	<!-- Favicons-->
	<link rel="apple-touch-icon-precomposed" href="<?=IMG_ADMIN;?>favicon/apple-touch-icon-152x152.png">
	<!-- For iPhone -->
	<meta name="msapplication-TileColor" content="#00bcd4">
	<meta name="msapplication-TileImage" content="<?=IMG_ADMIN;?>favicon/mstile-144x144.html">
	<!-- For Windows Phone -->
	<!-- CORE CSS-->
	<link href="<?=CSS_ADMIN;?>themes/horizontal-menu/materialize.css" type="text/css" rel="stylesheet">
	<link href="<?=CSS_ADMIN;?>themes/horizontal-menu/style.css" type="text/css" rel="stylesheet">
	<!-- Custome CSS-->
	<link href="<?=CSS_ADMIN;?>custom/custom.css" type="text/css" rel="stylesheet">
	<!-- CSS style Horizontal Nav-->
	<link href="<?=CSS_ADMIN;?>layouts/style-horizontal.css" type="text/css" rel="stylesheet">
	<!-- INCLUDED PLUGIN CSS ON THIS PAGE -->
	<link href="<?=VENDORS_ADMIN;?>perfect-scrollbar/perfect-scrollbar.css" type="text/css" rel="stylesheet">
	<link href="<?=VENDORS_ADMIN;?>jvectormap/jquery-jvectormap.css" type="text/css" rel="stylesheet">
	<link href="<?=CSS_ADMIN;?>flag-icon.css" type="text/css" rel="stylesheet">
	<style>
		.tooltip {
			pointer-events: none;
		}

		thead th {
			background: #bbdefb;
		}

		tfoot {
			font-weight: bold;
		}

		thead th:first-of-type {
			border-top-left-radius: 10px;
		}

		thead th:last-of-type {
			border-top-right-radius: 10px;
		}

		td {
			padding-top: 0px;
			padding-bottom: 0px;
		}

		.headerMenu {
			width: 80px;
		}

		table.highlight tbody tr:hover {
			background-color: #e0e0e0 !important;
		}

		table.striped>tbody>tr:nth-child(odd) {
			background-color: rgba(231, 231, 231, 0.5);
		}
		.dropdown-content li{
			min-height: 0px;
			max-height: 40px;
		}
		.dropdown-content li a{
			max-height: 40px;
		}
		.dropdown-content li a i{
			font-size: 1.2rem;
		}
		#barritaAlt{
			background: white;
			position: absolute;
			transform: translate(-50%, -50%);
			left: 50%;
			top: 50%;
			display: none;
			z-index: 100;
			box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.3);
			padding: 2rem;
			transition: all 237ms ease-in-out;
		}
		#barritaAlt img{
			width: 15vh;
			height: 15vh;
		}



	</style>
	<style>
		#formuModal::-webkit-scrollbar {
			width: 1em;
		}

		.modal {
			width: 80% !important;
			max-height: 100%
		}

		#formuModal::-webkit-scrollbar-track {
			-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
		}

		#formuModal::-webkit-scrollbar-thumb {
			background: linear-gradient(to right, #485563, #29323c);
			outline: 1px solid slategrey;
		}

		[v-cloak] {
			display: none;
		}
	</style>
	<link href="<?=CSS_ADMIN;?>animate.css" type="text/css" rel="stylesheet">
	<script src="<?=JS_ADMIN;?>smooth-scroll.polyfills.min.js"></script>
	<script src="<?=JS_ADMIN;?>material-dialog.js"></script>
	<script src="<?=JS_ADMIN;?>gettext.js" type="text/javascript"></script>
	<script src="<?=JS_ADMIN;?>traduccion.js?version=<?= md5_file(RUTA_APP . "public/homeAdmin/js/traduccion.js"); ?>" type="text/javascript"></script>
	<script>seleccionarIdioma("<?=$idioma;?>")</script>
</head>

</head>

<body id="layouts-horizontal" class="">
	<!-- Start Page Loading -->
	<!-- End Page Loading -->
	<!-- //////////////////////////////////////////////////////////////////////////// -->
	<!-- START HEADER -->
	<div id="main" v-cloak>
	<header id="header" class="page-topbar">
		<div class="navbar-fixed">
			<!-- Barra superior -->
			<?php require_once UTILS_PATH . "toolBar.php";?>
            <!-- Barra superior -->
            <!-- Barra que contiene los menus -->
                <?php require_once UTILS_PATH . "navigationBar.php";?>
            <!-- Barra que contiene los menus -->
		</div>
		<script>
			document.addEventListener('DOMContentLoaded', function () {
				//Esconde el switch para mostrar Navbar
				var navigationBarSwitchElement = document.getElementById('navigationBarSwitch');
				navigationBarSwitchElement.style.visibility = "hidden";

				var elems = document.querySelectorAll('.dropdown-trigger');
				var instances = M.Dropdown.init(elems, {
					'hover': true,coverTrigger: false
				});

				
			});
			var white =
				"linear-gradient(to right, #ece9e6, #ffffff)";
			var black =
				"linear-gradient(to right, #000000, #434343)"
			var backSwitch = localStorage.getItem('background');
			if (backSwitch == null) {
				localStorage.setItem('background', 'white');backSwitch='white';
			}
			if (backSwitch == 'white') {
				document.body.style.background = white;
				document.getElementById("backgroundSwitch").checked = true;
			}
			if (backSwitch == 'black') {

				document.body.style.background = black;
				document.getElementById("backgroundSwitch").checked = false;
			}
			document.getElementById("backgroundSwitch").addEventListener("click", switchBack);

			function switchBack() {
				var checkBox = document.getElementById("backgroundSwitch");
				if (localStorage.getItem('background') == "white") {

					localStorage.setItem('background', 'black');
					location.reload();
				} else if (localStorage.getItem('background') == "black") {

					localStorage.setItem('background', 'white')
					location.reload();
				}
			}

			// Comentando esto porque esta función ya no se usa
			// function hideBar() {
			// 	var y = document.getElementById('horizontal-nav');
			// 	if (y.style.display === "none") {
			// 		$('#horizontal-nav').removeClass('animated')
			// 		$('#horizontal-nav').removeClass('slideOutUp')
			// 		$('#horizontal-nav').addClass('animated slideInDown faster')
			// 		setTimeout(function () {
			// 			y.style.display = "block";
			// 		}, 500)
			// 	} else {
			// 		$('#horizontal-nav').removeClass('animated')
			// 		$('#horizontal-nav').removeClass('slideInDown')
			// 		$('#horizontal-nav').addClass('animated slideOutUp faster')
			// 		setTimeout(function () {
			// 			y.style.display = "none";
			// 		}, 500)
			// 	}
			// }
		</script>

		<!-- HORIZONTL NAV START-->

	</header>
	<?php require_once UTILS_PATH . 'htmlMenu.php';?>

		<!-- START WRAPPER -->
		<div class="wrapper">
			<!-- START LEFT SIDEBAR NAV-->