/* #region Global */
	@font-face {
		font-family: 'pl';
		src: url('/font/pl.eot?96397018');
		src: url('/font/pl.eot?96397018#iefix') format('embedded-opentype'),
			url('/font/pl.woff?96397018') format('woff'),
			url('/font/pl.ttf?96397018') format('truetype'),
			url('/font/pl.svg?96397018#pl') format('svg');
		font-weight: normal;
		font-style: normal;
	}
	@import url('https://fonts.googleapis.com/css?family=Roboto:400,400i,500,500i,700,900');

	:root{
		/* Colores antiguos
		--header-bg-color: #254fb9;
		--navItems-bg-color: #222D32;
		--content-bg-color: #dae2e9; */
		
		--header-bg-color: #b32e2e;
		--navItems-bg-color: #222D32;
		--content-bg-color: #dae2e9;
	}
	body{
		font-family: 'Roboto',Arial,sans-serif;
		font-size: 16px;
		padding: 0;
		margin: 0; 
		color: #302d3b;
		background-color: #fff;
		z-index: 0;
	}
	*, *:hover, *:active, *:focus, *::before, *::after{
		box-sizing: border-box;
		outline: none;
		outline: 0;
	}
	*:-webkit-autofill, *:-webkit-autofill:hover, *:-webkit-autofill:focus{
		background-color: #FFFFFF !important;
    	-webkit-box-shadow: 0 0 0 1000px white inset !important;
	}
	ul,ol,li{
		list-style: none;
		margin: 0;
		padding: 0;
	}
	a{
		text-decoration: none;
		display: inline-block;
	}
	img{
		max-width: 100%;
		vertical-align: top;
	}

	/* Mensaje pantalla completa */
	.ui-dialog{
		width: 100% !important;
		max-width: 700px;
	}

	.d-none{
		display: none !important;
	}
	.opacity-0{opacity: 0;} .opacity-1{opacity: 1;}

	/* #region Estilo de los inputs text */
		input {
			filter: none;
		}

		/* Estilo general */
		.inp{
			width: 100%;
			padding: 5px 6px;
			margin-bottom: 5px;
			border-radius: 3px;
			color: #414255;
			border: 1px solid #414255;
		}
		.inp:hover, .inp:focus{
			border-color: #555ab1;
		}

		/* Esitlo del login */
		.inp-text{
			position: relative;
			width: 100%;
			margin: 5px 0px;
		}
		.inp-text input, .inp-text label{
			border: none;
			display: block;
			transition: .2s ease all;
		}
		.inp-text > label{
			position: absolute;
			cursor: text;
			top: 0;
			left: 14px;
			margin-top: -7px;
			font-size: 14px;
			line-height: 1em;
			background-color: #fff;
			color: #6d6d6d;
			padding: 0px 7px;
		}
		.inp-text > input, .inp-text > input:valid{
			border: 1px solid #aaa;
			border-radius: 3px;
			display: block;
			width: 100%;
			height: 100%;
			padding: 12px;
			margin-top: 16px;
			font-size: 1em;
		}
		.inp-text input:hover, .inp-text input:focus{
			border-color: #5084c9;
		}
		.inp-text input:focus + label, .inp-text input:hover + label{
			color: #5084c9;
		}

		/* Agrupar inputs y label */
		.goup_inp{
			display: inline-block;
			margin: 3px;
		}
		.goup_inp_block{
			display: block;
			margin: 3px;
		}
	/* #endregion */

	/* Botón UI */
	.ui-button{
		border-radius: 8px;
	}
	.ui-button.light-green{
		box-shadow: 0px -1px 10px -1px #a4ffcd inset;
	}.ui-button.light-green:hover{
		box-shadow: 0px 0px 0px 0px transparent inset;
	}

	.ui-button, .tab-row a.ui-button{
		transition: .3s ease all;
		color: #514961;
	}
	.tab-row a.ui-button:hover, .tab-row a.ui-button:active{
		transition: .3s ease all;
		color: #fff;
	}
	.tab-row a.ui-button:active{color: #1382ED;}

	.ui-button:disabled{
		opacity: 0.4;
	}

	/* Tabs UI */
	.ui-tabs{
		padding: 0;
	}
	.ui-tabs .ui-tabs-panel{
		padding-top: 0.3em;
	}
	.ui-tabs .ui-tabs-nav .ui-tabs-anchor{
		padding: .4em 1em;
		padding-bottom: .3em;
	}
	.ui-tabs .ui-tabs-nav li{
		border-radius: 8px 8px 0px 0px;
		transition: .2s ease all;
	}
	.ui-tabs-nav .ui-state-active a, .ui-tabs-nav .ui-state-active a:link, .ui-tabs-nav .ui-state-active a:visited{
		color: #38334e;
	}
	.ui-tabs-nav .ui-state-default a, .ui-tabs-nav .ui-tabs-nav .ui-state-default a:link, .ui-tabs-nav .ui-state-default a:visited{
		color: #8b82b1;
	}
	.ui-tabs-nav .ui-state-default.ui-state-active a:hover{
		color: #38334e;
	}
	.ui-tabs-nav .ui-state-default a:hover{
		color: #ffffff;
	}

	/* Calendario UI */
	#ui-datepicker-div {
		box-shadow: 0px 4px 8px -5px rgba(0, 0, 0, 0.4);
	}
	.ui-datepicker-trigger{
		display: inline-block;
	}

	/* Modal UI */
	.ui-widget-overlay{
		background-color: #000;
		opacity: 0.6;
	}
	.ui-widget, .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button{
		font-family: 'Roboto',Arial,sans-serif;
	}

	/* Autocomplete UI */
	.ui-autocomplete.ui-widget.ui-widget-content {
		border: 1px solid #aeaeae;
		border-radius: 0px 0px 5px 5px;
		box-shadow: 0px 2px 4px -2px rgba(0, 0, 0, 0.702);
		max-height: 300px;
		overflow-y: auto;   /* prevent horizontal scrollbar */
		overflow-x: hidden; /* add padding to account for vertical scrollbar */
		z-index:1000 !important;
	}
	.ui-autocomplete .ui-menu-item a.ui-menu-item-wrapper{
		width: 100%;
	}
	.ui-autocomplete .ui-menu-item a.ui-menu-item-wrapper.ui-state-active{
		/* border: 0; */
		background: #e6e6e6 url("");
		font-weight: normal;
		color: #413e4e;
		border: 1px solid #b8b8b8;
		border-right-color: transparent;
		border-left-color: transparent;
	}
	.ui-autocomplete .ui-menu-item-wrapper, .ui-autocomplete .ui-menu-item-wrapper.ui-state-active{
		margin: 0;
		border: 1px solid transparent;
	}

	/* Iconos */
	i{
		font-family: 'pl';
		font-style: normal;
		font-weight: normal;
	}
	i.icon-save::before{
		content: '\e82a';
	}
	i.icon-remove::before{
		content: '\f1f8';
	}
	i.icon-next::before{
		content: '\f1f8';
	}
	i.icon-after::before{
		content: '\e81d';
	}
	i.icon-next::before{
		content: '\e81e';
	}
	i.icon-plus::before{
		content: '\e809';
	}
	i.icon-edit::before{
		content: '\e821';
	}
	i.icon-print::before{
		content: '\e814';
	}
	i.icon-save::before{
		content: '\e82a';
	}
	i.icon-reply::before{
		content: '\f112';
	}
	i.icon-ok::before{
		content: '\e807';
	}
	i.icon-see::before{
		content: '\e80e';
	}
	i.icon-calendar::before{
		content: '\e822';
	}
	i.icon-dollar::before{
		content: '\f155';
	}
	i.icon-doc-inv::before{
		content: '\f15b';
	}
	/* #region Mensajes en pantalla*/
		.tabtit-msg, .tabtit-msg2{
			/* visibility: hidden; */
			display: block;
			position: fixed;
			top: 8px;
			right: 10px;
			z-index: 2000;
			max-width: 100%;
			font-size: 14px;
			font-weight: bold;
			margin-left: 20px;
			padding: 7px 11px;
			border-radius: 9px;
			color: #5e5e5e;
			background-color: #ffffff;
			box-shadow: 0px 2px 5px -2px #0006;
		}
		.cont-msg{
			position: fixed;
			top: 8px;
			right: 10px;
			z-index: 1000;
		}
		.cont-msg .tabtit-msg{
			top: 0;
			right: 0;
			position: initial;
			margin-top: 5px;
		}
		.cont-msg .tabtit-msg:first-child{
			margin-top: 0;
		}
		.tabtit-msg[error]{
			color: #c90b0b;
		}
		.tabtit-msg[correcto]{
			color: #099204;
		}
		.tabtit-msg[error]::before{
			content: '\e82e';
			font-family: 'pl';
			padding-right: 0.4em;
			font-weight: normal;
		}
		.tabtit-msg[correcto]::before{
			content: '\e807';
			font-family: 'pl';
			padding-right: 0.4em;
			font-weight: normal;
		}
	/* #endregion*/

	/* #region Tablas con div */
		.table{
			position: relative;
			display: inline-block;
			border-collapse: collapse;
			width: 100%;
			overflow: auto;
			padding-top: 2px;
			font-size: 14px;
			background-color: #fff;
			margin: 0;
			padding: 0;
		}
		.cm-pad > .title{
			border: 0;
			margin: 10px auto;
			margin-top: 0;
			padding: 6px 8px;
			/* padding-left: 0; */
			font-size: 1.1rem;
			color: #51475f;
			border-bottom: 1px solid #797183;
		}
		.tit-text span {
			background: rgba(255, 255, 255, 0.702);
			padding: 2px 8px;
			border-radius: 5px;
			box-shadow: 0 2px 4px -3px #000;
			display: inline-block;
			margin-bottom: 3px;
		}

		.table .title{
			padding: 12px 10px;
			border-top: 3px solid #ccc;
			border-bottom: 0;
			font-size: 1.3em;
			font-weight: bold;
			/* display: -webkit-flex;
			display: -moz-flex;
			display: flex; 
			flex-direction: row;*/
			display: grid;
			grid-template-columns: auto auto;
			align-items: center;
			margin: 0;
		}
		
		.table .title .tit-text, .table .title .tit-btn{
			display: inline-block;
			/* width: 49%; */
			font-size: 1em;
		}
		.table .title .tit-text .ui-button, .table .title .tit-btn .ui-button{
			font-size: 0.9em;
		}
		
		.table .title .tit-btn{
			text-align: right;
			/* position: absolute;
			right: 4px; */
		}
		.table .tab-head{
			display: table-row;
			font-weight: bold;
			margin-top: 1px;
			background-color: #f2f2f2;
			border: 1px solid #e1e1e1;
			border-left: 0;
			border-right: 0;
		}
		.table .tab-row{
			display: table-row;
			border-bottom: 1px solid #e1e1e1;
		}
		.table .tab-row.not-save{
			border-color: #fcdfbd;
			border-width: 2px;
		}
		.table .tab-row:hover, .table .tab-row:nth-child(2n):hover{
			background-color: #ececec;
		}
		.table .tab-row:nth-child(2n){
			background-color: #f7f7f7;
		}
		
		.table .cell{
			position: relative;
			display: table-cell;
			padding: 10px 14px;
			top: -1px;
			vertical-align: middle;
			clear: both;
			width: 1%;
		}
		.table .cell:focus{
			box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.3) inset;
			background-color: #fff;
		}
		.table .cell + .cell{
			border-left: 0;
		}
		.table .cell.peso::before{
			content: '$ ';
			cursor: text;
		}
		.table .cell .ui-button{
			font-size: 12px;
			/* float: left; */
			/* clear: both; */
			display: inline-block;
			margin: 2px;
		}
		.table .tab-row .cell{
			border-top: 0;
		}
		.table .tab-row.marcar0 .cell{
			background-color: #ffe0df;
		}
		.table .tab-row.marcar1 .cell{
			background-color: #e2f79a;
		}
		.table .cell.tab-comb{
			border-width: 0;
		}
		.table .cell.tab-comb2{
			border-width: 0;
			border-right-width: 1px;
		}
		
		.table .footer{
			padding: 10px 10px;
			border-bottom: 2px solid #ccc;
			display: -webkit-flex;
			display: -moz-flex;
			display: flex;
			flex-direction: row;
			align-items: center;
		}
		.table .footer .f-text,.table .footer .f-pagination{
			width: 100%;
			padding: 1px;
		}
		.table .footer .f-pagination{
			text-align: right;
		}

		/* Tabla en libro compra y venta */
		.libro_cv .table .title{
			border: 0;
			font-weight: normal;
		}
		.libro_cv .table .title .inp{
			font-size: 0.9em;
			padding: 3px 5px;
			width: auto;
			display: inline-block;
		}
		.libro_cv .table .tit-text span{
			box-shadow: none;
			padding: 0;
			margin: 0;
		}
		.libro_cv .table .tab-row:nth-child(2n), .libro_cv .table .tab-row:hover{
			background-color: transparent;
		}
	/* #endregion */
	
	/* #region Buscador */
		.bus-header{
			display: inline-flex;
			align-items: center;
		}
		.busc-box{
			position: relative;
			display: inline-block;
			margin: 2px;
		}
		.buscador{
			position: relative;
			display: inline-block;
			border: 1px solid #bbb;
			background-color: #fff;
			border-radius: 3px;
			overflow: hidden;
			min-width: 300px;
			font-size: 14px;
		}
		.buscador .busc_txt{
			position: relative;
		}
		.buscador .busc_txt, .buscador .busc_btn{
			display: inline-block;
		}
		.buscador .busc_txt input, .buscador .busc_btn button{
			padding: .7em;
			border:0;
		}
		.buscador .busc_txt input{
			min-width: 250px;
		}
		.buscador .busc_txt .bus_del{
			display: none;
			position: absolute;
			z-index: 20;
			right: 0;
			top: 5px;
			padding: 4px 6px;
			background-color: rgba(255, 255, 255, 0.5);
			color: #aaa;
			cursor: pointer;
			transition: .2s ease all;
		}
		.buscador .busc_txt .bus_del:hover{
			color: #888;
			background-color: #fff;
		}
		.buscador .busc_btn button{
			background-color: #e0e0e0;
			padding: .7em 1.2em;
			transition: .3s ease all;
		}
		.buscador .busc_btn button:hover, .buscador .busc_btn button:active{
			background-color: #c9c9c9;
		}
		.buscador .busc_btn button::before{
			content: '\e806';
			font-family: "pl";
		}

		/* loading Input effects */
		.busc-box .cargando{
			display: none;
			position: absolute;
			bottom: 4px;
			width: 100%;
			height: 2px;
			background: transparent;
			overflow: hidden;
		}
		.busc-box .cargando::before{
			content: '';
			position: absolute;
			top: 0;
			width: 30%;
			height: 100%;
			-moz-animation: preload-search 0.8s linear infinite;
			-webkit-animation: preload-search 0.8s linear infinite;
			animation: preload-search 0.8s linear infinite;

			display: inline-block;
			background: #4f9cf2;
			border-radius: 50%;
			margin-left: -33%;
		}
			@keyframes preload-search{
				from{ 
					margin-left: -33%;
				}
				to{
					margin-left: 101%;
				}
			}

		/* Seleccionar categoría */
		.input [separator]{
			background: rgba(0, 0, 0, 0.1);
			font-size: 1px;
			margin-bottom: 20px;
			display: inline-block;
		}
		.sel_cat{
			display: inline-block;
			margin-top: -10px;
			margin-left: 10px;
		}
		.sel_cat .input{
			max-width: 250px;
			border: 1px solid #979797;
			border-radius: 5px;
			padding: 2px;
			color: #5a5a5a;
		}
	/* #endregion */

	/* #region Paginación */
		.page-selector ul li{
			display: inline-block;
			padding: 0;
		}
		.page-selector li a, .page-selector li.active a{
			display: inline-block;
			padding: 5px 10px;
			border-radius: 50%;
			color: #4f51d3;
		}
		.page-selector li a:hover{
			background-color: #dfdfdf;
			color: #5e5e5e;
		}
		.page-selector li.active a{
			color: #33343d;
		}
		.page-selector li.puntos a, .page-selector li.puntos a:hover, .page-selector li.active a:hover{
			background-color: transparent !important;
		}
	/* #endregion */

	/* #region Elemento de indicador de carga pantalla completa */
		.loading-full{
			display: none;
			position: fixed;
			z-index: 150000000000;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			background-color: rgba(0, 0, 0, 0.5);
		}
		.load-icon, .load-icon-min{
			position: absolute;
			top: 50%;
			left: 50%;
			width: 60px;
			height: 60px;
			margin-top: -30px;
			margin-left: -30px;
			background-color: transparent;
			border-radius: 50%;
			border: 7px solid #fff;
			/* border-bottom: 0;
			border-right:0;
			border-top: 0; */
			border-bottom-color: rgba(255, 255, 255, 0.2);
			border-right-color: rgba(255, 255, 255, 0.2);
			border-top-color: rgba(255, 255, 255, 0.2);
			box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5), 0px 0px 10px rgba(0, 0, 0, 0.5) inset;
			
			-moz-animation: preload 0.5s linear infinite;
			-webkit-animation: preload 0.5s linear infinite;
			animation: preload 0.5s linear infinite;
		}
		.load-icon-min{
			position: initial;
			display: none;
			top: 0;
			left: 0;
			width: 20px;
			height: 20px;
			margin-top: 0;
			margin-left: 0;
			border-width: 3px;
			border-color: #144e85;
			border-left-color: transparent;
			box-shadow: 0px 0px 0px transparent;
		}
		.load-icon-min[mostrar]{
			display: inline-block;
		}
		.loading-full::before{
			position: absolute;
			top: 50%;
			left: 58%;
			content: 'Cargando...';
			color: #fff;
			margin-left: -10em;
			margin-top: 3.3em;
			text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.9); 
		}
		@keyframes preload{
			from{ 
				-moz-transform: rotate(0deg);
				-webkit-transform: rotate(0deg);
				transform: rotate(0deg);
			}
			to{
				-moz-transform: rotate(360deg);
				-webkit-transform: rotate(360deg);
				transform: rotate(360deg);
			}
		}
	/* #endregion */

	/* #region Información numérica en libro de ventas*/
		.number-counter{
			display: inline-flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;
			font-size: 1em;
		}
			.number-counter .nc-title{
				display: inline-block;
				border: 1px solid #828895;
				border-left-width: 0;
				border-top-width: 0;
				border-bottom-width: 0;
				padding: 6px;
				padding-right: 12px;
				color: #828895;
			}
			.number-counter .nc-number{
				display: inline-flex;
				flex-direction: row;
				align-items: center;
			}
				.nc-number .nc-num-group{
					text-align: center;
					padding: 10px;
					margin: 2px;
				}
				.nc-num-title{
					font-size: 0.8em;
					color: #828895;
				}
				.nc-num-digit{
					color: #424253;
					font-size: 1.04em;
				}
				.nc-num-digit sup{
					margin-left: 2px;
					font-size: 0.8em;
				}
				.nc-num-digit.nc-num-pesos::before{
					content: "$ ";
				}
	/* #endregion*/

/* #endregion */

/* Contenido general */
	#global{
		/* #region inline-flex */
			display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
			display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
			display: -ms-flexbox; /* TWEENER - IE 10 */
			display: -webkit-flex; /* NEW - Chrome */
			display: inline-flex; /* W3C DEFINITION */
		/* #endregion */

		width: 100%;
		height: 100%;
		position: absolute;
		z-index: 8;
		top: 0;
		bottom: 0;
		left: 0;
		overflow: hidden;
		padding-top: 48px;
	}

	.back_nav{
		padding: 8px 4px;
		padding-top: 0;
		position: absolute;
		top: 1.1em;
		z-index: 200;
		color: #fff;
		font-weight: bold;
		font-size: 14px;
	}
	.back_nav a{
		color: #94d1e9;
	}

	/* #region Cabecera */
		#head{
			position: fixed;
			top: 0;
			left: 0;
			right: 0;
			z-index: 10;
			height: 48px;
			width: 100%;
			display: -webkit-flex;
			display: flex;
			align-items:center;
			justify-content: center;
			background-color: var(--header-bg-color);
			color: #fff;
			font-weight: bold;
			font-size: 1.2em;
			box-shadow: 0 0 8px -2px #000;
		}
			/* Boton abrir o cerrar menú */
			#open-men{
				-webkit-border-radius: 50%;
				border-radius: 50%;
				display: -webkit-flex;
				display: flex;
				margin: 0 12px;
				padding: 8px;
				overflow: hidden;
				vertical-align: middle;
				cursor: pointer;
				-moz-user-select: none;
				-webkit-user-select: none;
				user-select: none;
				flex: 0 0 auto;
			}
			#open-men:hover{
				background-color: rgba(0,0,0,0.071);
				outline: none;
			}
			#open-men svg{
				fill: white;
				height: 24px;
				width: 24px;
			}
			#open-men a{
				color: #fff;
				padding: 0px 12px;
			}
			#open-men a::after{
				content: '\6d';
				font-size: 1.8em;
			}
			#open-men .open a::after{
				content: '\e81d';
				font-size: 1.6em;
			}
			/* Titulo en cabecera */
			#head .title{
				width: 100%;
				-moz-user-select: none;
				-webkit-user-select: none;
				user-select: none;
				/* text-align: center; */
			}

			/* Menu en la cabecera */
			#head .head_men{
				margin: 0px 20px;
			}
			#head .head_men, #head .head_men ul li, #head .head_men li a{
				display: inline-block;
			}
			#head .head_men li a{
				color: #fff;
				padding: 6px 12px;
			}
			#head .head_men li a:hover, #head .head_men li a:active{
				color: #504764;
				background-color: #fff;
			}
	/* #endregion */

	/* #region Panel izquierdo de menu */
		#panel-left{
			position: relative;
			display: -webkit-flex;
			display: inline-flex;
			height: 100%;
			background-color: var(--navItems-bg-color);
			/* border-right: 1px solid rgba(73, 69, 78, 0.2); */
		}
		/* Estilo si esta cerrado o abierto el panel */
		#panel-left.closed-men #pnl-cont{
			width: 53px;
			transition: all 0.4s ease;
		}
		#panel-left.open-men #pnl-cont{
			transition: all 0.4s ease;
		}
		/* Contenedor */
		#pnl-cont{
			display: -webkit-inline-flex;
			display: inline-flex;
			flex-direction: column;
			width: 220px;
		}
			/* Cuerpo navegación */
			#pnl-nav{
				position: relative;
				display: inline-block;
				height: 100%;
				overflow: hidden;
				padding-top: 12px;
				scrollbar-color: #667c87 transparent;
				scrollbar-width: thin;
			}
			#pnl-nav:hover{
				overflow: auto;
			}
			#pnl-nav::-webkit-scrollbar {
				width: 6px;
				height: 6px;
			}
			#pnl-nav::-webkit-scrollbar-track-piece  {
				background-color: transparent;
			}
			#pnl-nav::-webkit-scrollbar-thumb {
				background-color: #667c87;
				border-radius: 3px;
			}

			#pnl-nav hr{
				border:0;
				border-bottom: 1px solid #7a7a7a;
			}
			#pnl-nav:hover{
				overflow: auto;
			}
			#pnl-nav ul li a{
				padding: 11px;
				width: 100%;
				font-weight: 500;
				outline: 0;
				overflow: hidden;
				vertical-align: middle;
				white-space: nowrap;
				color: #ddd8e7;
				transition: all 0.2s ease;
			}
				/* Iconos de los menues */
				#pnl-nav ul li a[class*="nav-"] i{
					display: inline-block;
					/* font-family: 'pl'; */
					font-family: "Font Awesome 5 Free";
					font-weight: bold;
					font-size: 1.1em;
					font-style: normal;
					width: 30px;
					height: 100%;
					text-align: center;
					margin-right: 15px;
				}
				#pnl-nav ul li a.nav-inicio i::after{
					content: '\f015';
				}
				#pnl-nav ul li a.nav-mercaderia i::after{
					content: '\f07a';
				}
				#pnl-nav ul li a.nav-categorias i::after{
					content: '\f0e8';
				}
				#pnl-nav ul li a.nav-clientes i::after{
					content: '\f007';
				}
				#pnl-nav ul li a.nav-libro_cv i::after{
					content: '\f0ca';
				}
				#pnl-nav ul li a.nav-factura i::after{
					content: '\f155';
				}
				#pnl-nav ul li a.nav-config i::after{
					content: '\f013';
				}
				#pnl-nav ul li a.nav-logout i::after{
					content: '\f011';
				}
				.nav-desarrollador{
					background: #ff00002e;
					color: #f8ff91 !important;
					cursor: default;
					padding: 1em;
					white-space: nowrap;
					text-align: center;
					overflow: hidden;
					transition: .3s ease all;
				}
				.nav-desarrollador i{
					margin-right: .4em;
				}
				.closed-men .nav-desarrollador{
					background: #ff000073;
				}
				.closed-men .nav-desarrollador span{
					transition: .3s ease all;
					opacity: 0;
				}
			#pnl-nav ul li+li a{
				/* box-shadow: -1px 2px 1px -1px rgba(19, 6, 65, 0.178) inset; */
			}
			#pnl-nav ul li a:hover, #pnl-nav ul li[selected] a{
				/* background-color: #465258; */
				background-color: rgba(252, 253, 253, 0.2);
				color: #ffffff;
			}
			#pnl-nav ul li[selected] a{
				box-shadow: 5px 0px 1px -1px var(--header-bg-color) inset;
			}
	/* #endregion */

	/* #region Contenedor del Contenido */
		#cont{
			display: inline-block;
			vertical-align: top;
			width: 100%;
			overflow: auto;
		}
			/* Cuerpo */
			#c-mos{
				padding: 0;
				overflow: auto;
				background-color: var(--content-bg-color);
				height: 100%;
			}
			/* Cuerpo con padding */
			#c-mos .cm-pad, .box-cont{
				padding: 18px 16px;
			}
			.box-cont{
				padding-bottom: 0px;
			}
	/* #endregion */

	/* #region Formulario de inicio de sesión */
		html.login, body.login{
			height:100%;
		}
		body.login{	
			/* background: url('/img/bc.jpg') no-repeat center center fixed; */
			background-color: #6191cf;
			-webkit-background-size: cover;
			-moz-background-size: cover;
			-o-background-size: cover;
			background-size: cover;

			/* animation: bg-login 6s ease infinite; */
		}
		@keyframes bg-login {
			0%{background-color: #83afe9;}
			50%{background-color: #6191cf;}
			100%{background-color: #83afe9;}
		}
		#global.gl_cl{
			margin: 0;
			padding: 5px;
			overflow: auto;
		}
		/* Cuadro del login */
		.gl_log{
			width: 100%;
			max-width: 400px;
			min-width: 200px;
			margin: auto;
			background-color: #fff;
			padding: 10px;
			border-radius: 12px;
			border: 1px solid #bfbcbc;
			box-shadow: 0px 9px 13px -9px rgba(0, 0, 0, 0.856);
		}
		.gl_log [class^=log_]{
			padding: 7px;
			text-align: center;
		}
		/* Titulo o logo */
		.gl_log .log_tit{
			font-size: 21px;
			font-weight: bold;
			margin-bottom: -10px;
			padding: 1px;
		}
		/* Titulo o logo */
		.gl_log .log_btn{
			padding: 5px;
		}
		/* Errores */
		.gl_log .log_error{
			display: none;
			color: #c00d0d;
			font-weight: bold;
			font-size: 16px;
			padding: 5px 0px;
			border: 2px solid #c00d0d;
			border-left:0;
			border-right: 0;
			margin-bottom: 7px;
			cursor: pointer;
			text-align: left;
		}
		.gl_log .log_error[correcto]{
			color: #0b7514;
			border-color: #0b7514;
		}
	/* #endregion */

	/* #region Sección inicio */
		/* #region Cuadro de datos */
			.dash-cont{
				margin-bottom: 10px;
				padding: 0px 7px;
			}
			.dash-cont .box-ds{
				display: -webkit-inline-flex;
				display: -moz-inline-flex;
				display: inline-flex;
				width: 220px;
				height: 200px;
				background-color: #0e88a7;
				border: 1px solid #144e85;
				color: #fff;
				-webkit-flex-direction: column;
				-moz-flex-direction: column;
				flex-direction: column;
				font-size: 1.3em;
				margin-right: 15px;
				margin-bottom: 5px;
			}
			.box-ds .tit-ds, .box-ds .icon-ds, .box-ds .text-ds{
				height: 20%;
				width: 100%;
				display: -webkit-inline-flex;
				display: -moz-inline-flex;
				display: inline-flex;
				align-items: center;
				justify-content: center;
				padding: 5px;
				font-weight: bold;
			}
			.box-ds .icon-ds{
				height: 60%;
				border: 1px solid rgba(255, 255, 255, 0.541);
				border-left: 0;
				border-right: 0;
				font-size: 80px;
			}
			
			/* Total Mercaderia */
			.dash-cont .box-ds.mercaderia .icon-ds::before{
				content: '\e81a';
				font-family: 'pl';
			}

			/* Total precio */
			.dash-cont .box-ds.precio{
				background-color: #0ea734;
				border-color: #218514;
			}
			.dash-cont .box-ds.precio .icon-ds::before{
				content: '\f155';
				font-family: 'pl';
			}
			/* Facturado */
			.dash-cont .box-ds.facturado{
				background-color: #b6b30b;
				border-color: #999b13;
			}
			.dash-cont .box-ds.facturado .icon-ds::before{
				content: '\f1ec';
				font-family: 'pl';
			}
			/* Facturado */
			.dash-cont .box-ds.clientes{
				background-color: #cf45db;
				border-color: #b11d9d;
			}
			.dash-cont .box-ds.clientes .icon-ds::before{
				content: '\f234';
				font-family: 'pl';
			}
		/* #endregion */

		/* #region Lista de estadísticas */
			.box-static{
				position: relative;
				display: -ms-flexbox;
				-webkit-display: inline-flex;
				display: inline-flex;
				width: 100%;
				max-width: 330px;
				height: 100px;
				border-radius: 5px;
				border: 1px solid #cacaca;
				color: #224;
				margin-right: 15px;
				margin-bottom: 15px;
				overflow: hidden;
				box-shadow: 0px 8px 10px -10px rgba(0, 0, 0, 0.4);
			}
			.box-static:last-child{margin-right: 0;}
			.box-static .icon{
				display: -ms-flexbox;
				-webkit-display: flex;
				display: flex;
				align-items: center;
				justify-content: center;
				background-color: #00c0ef;
				width: 150px;
				color: #fff;
				font-size: 40px;
			}
			.box-static .icon[color="green"]{background-color: #00a65a;}
			.box-static .icon[color="red"]{background-color: #dd4b39;}
			.box-static .content{
				width: 100%;
				background-color: #fff;
				padding: 10px;
				font-size: 1rem;
			}
			.box-static .content .number{
				font-weight: bold;
				font-size: 1.4em;
			}
			.box-static .number span{
				font-size: 0.6em;
				color: #59596b;
			}
			[data-href]{
				cursor: pointer;
			}
		/* #endregion */

		/* #region Acceso directo */
			.box-acc{
				position: relative;
				display: -ms-flexbox;
				-webkit-display: inline-flex;
				display: inline-flex;
				align-items: center;
				color: #224;
				font-size: 1rem;
				padding: 10px 0px;
				margin-right: 15px;
				margin-bottom: 10px;
				border: 1px solid #c9c9c9;
				border-radius: 10px;
				min-width: 160px;
				height: 80px;
				background-color: #fff;
				box-shadow: 0px 6px 8px -8px rgba(0, 0, 0, 0.4);
				transition: 0.2s ease all;
			}
			.box-acc:hover{
				box-shadow: 0px 10px 10px -10px rgba(14, 31, 85, 0.4);
				transform: scale(1.1);
			}
			.box-acc .icon{
				display: -ms-flexbox;
				-webkit-display: flex;
				display: flex;
				justify-content: center;
				align-items: center;
				margin-right: 10px;
				margin-left: 3px;
				/* color: #999999; */
				font-size: 20px;
				width: 75px;
				height: 80%;
				border-right: 1px solid #ccc;
			}
			.box-acc .title{
				width: 100%;
			}
		/* #endregion */
	
		/* #region Listados de información*/
			.group_info{
				clear: both;
			}
			.cont_info_in{
				position: relative;
				display: inline-block;
				float: left;
				width: auto;
				box-shadow: 0px 7px 9px -9px rgba(0, 0, 0, 0.5);
				margin-right: 10px;
				margin-bottom: 10px;
				vertical-align: top;
			}
			.cont_info_in .title{
				padding: 8px 12px;
				background: #dfdfdf;
				border: 1px solid #c6c6c6;
				border-radius: 4px 4px 0px 0px;
				font-weight: bold;
				color: #4a4e60;
				/* background: linear-gradient(#bdc0e6,#8c8fb7); */
			}
			.cont_info_in .title ul{
				display: -ms-flexbox;
				-webkit-display: flex;
				display: flex;
			}
			.cont_info_in .title ul li{
				width: 100%;
				display: inline-block;
				padding: 5px 8px;
				padding-bottom: 0;
				margin-top: 5px;
				margin-bottom: -5px;
				font-style: italic;
				border-top: 1px solid rgba(115, 115, 115, 0.3);
			}
			.cont_info_in .title ul li:first-child{
				padding-left: 0;
			}
			.cont_info_in .title ul li:last-child{
				border-right: 0;
				padding-right: 0;
			}
			.cont_info_in .content{
				position: relative;
				background: #ffffff;
				border: 1px solid #c6c6c6;
				border-top: 0;
				overflow-x: hidden;
				overflow-y: auto;
				border-radius: 0px 0px 4px 4px;
				scrollbar-width: thin;
				scrollbar-color: #b0b0b0 #dfdfdf;
				box-shadow: 0px 4px 7px -5px rgba(0, 0, 0, 0.3) inset;
			}
			.cont_info_in .content::-webkit-scrollbar {
				height: 6px;
				width: 6px;
				background: #dfdfdf;
			}
			.cont_info_in .content::-webkit-scrollbar-thumb {
				background: #b0b0b0;
				-webkit-border-radius: 0px 0px 4px 0px;
			}
			.cont_info_in .content ul{
				display: -ms-flexbox;
				-webkit-display: flex;
				display: flex;
				flex-direction: row;
				border-bottom: 1px solid #aaa;
			}
			.cont_info_in .content ul:last-child{
				border-bottom: 0;
			}
			.cont_info_in .content ul:hover{
				background: rgba(0, 0, 0, 0.05);
			}
			.cont_info_in .content ul li{
				display: inline-block;
				padding: 5px 8px;
				width: 100%;
				border-right: 1px solid #aaa;
			}
			.cont_info_in .content ul li:last-child{
				border-right: 0;
			}

		/* #endregion */
	/* #endregion */

	/* #region Sección Factura */
		#form_clientes, #form_cont{
			background-color: #ffF;
			padding: 9px;
			border-radius: 10px;
			border: 1px solid #ccc;
			margin-top: 5px;
		}
		#form_clientes:first-child, #form_cont:first-child{
			margin: 0;
		}
		
		.lab-inp{
			position: relative;
			display: inline-block;
			width: 100%;
			max-width: 250px;
			margin-right: 9px;
			margin-top: 5px;
		}
		.lab-inp:last-of-type{
			margin-right: 0;
		}
		.lab-inp .ui-datepicker-trigger{
			position: absolute;
			top: 50%;
			right: 5px;
			margin-top: 2px;
		}
		.lab-inp .inp{
			display: inline-block !important;
			margin: 0 !important;
			margin-top: 3px !important;
		}
		.lab-inp > label{
			display: inline-block;
		}
		
		#form_clientes .titulo{
			position: relative;
			font-size: 1.2em;
			font-weight: bold;
			padding: 3px 6px;
			border-bottom: 2px solid #99a;
			margin: 8px 4px;
			color: #78788a;
			display: block;
			width: fit-content;
			width: -moz-fit-content;
		}
		#form_clientes .titulo .ui-button{
			position: absolute;
			margin-left: 12px;
			margin-top: -1px;
			font-size: .7em;
		}
		#form_clientes .inp{
			width: 100%;
			max-width: 250px;
			margin: 4px;
		}
		#form_clientes .inp:disabled{
			background-color: #fafafa;
			border: 1px solid #d6d6d6;
		}
		#form_clientes .inp[readonly]{
			border: 1px solid #d6d6d6;
		}

		/* Contenido del modal de cargar prod. */
		.headModal_merc{
			display: flex;
			align-items: center;
		}
		.headModal_merc .desc_box{
			margin-left: 1em;
		}input#desc_inpModal{
			font-size: 1rem;
			width: 100%;
			max-width: 3.9em;
			padding: .4em .5em !important;
			margin: 0;
			border-radius: 5px;
		}


		/* Controles finales de código de barra y botones de guardado de factura */
		#form_clientes .end_fac{
			display: grid;
			grid-template-columns: 1fr 1fr;
			padding: 18px 4px;
			margin: 8px auto;
			margin-top: 18px;
			align-items: center;
			border-top: 1px dashed #b1b1b1;
		}
		#form_clientes .botones{
			text-align: right;
		}
		.end_fac .cod_barra{
			display: inline-flex;
		}
		.end_fac .cod_barra > div{
			margin-left: 9px;
			width: 100%;
		}.end_fac .cod_barra > div:first-child{
			margin-left: 0;
		}
		.end_fac .cod_barra input{
			width: 100%;
			max-width: none !important;
			font-size: 1em;
			padding: 8px;
		}
		.end_fac .cod_barra label{
			font-size: .8em;
			margin-left: 4px;
		}
		/* cantidad */
		.end_fac .cb_cant{
			max-width: 90px;
		}
		/* Descuento */
		.end_fac .cb_dto{
			opacity: .9;
			max-width: 60px;
		}
		.end_fac .cb_dto input{
			font-size: .9em;
		}
		/* precio */
		.end_fac .cb_price{
			max-width: 105px;
		}

		.table .tab-row{
			position: relative;
		}
		.table .tab-row.tipofac-6{
			background-color: #f5ffbc;
		}
		.table .tab-row.tipofac-3{
			background-color: #e9ebff;
		}
		.table .tab-row.tipofac-8{
			background-color: #e2ffc7;
		}
		.table .tab-row.tipofac-0{
			background-color: #fff3dd;
		}
		.table .tab-row.tipofac-1{
			background-color: #ffffff;
		}
		.table .tab-row[class*="tipofac-"]:hover{
			background-color: #dadada;
			transition: .3s ease all;
		}

		/* Preload de guardado en fila */
		.table.saving {
			position: relative;
			overflow: hidden;
		}
		.table.saving .title::before {
			content: "";
			position: absolute;
			top: 0;
			left: -20%;
			width: 20%;
			height: 3px;
			box-shadow: 0px 0px 5px 0px #16ffde;
			background: #27b0dd;
			opacity: 0.8;
			border-radius: 50%;
			-moz-animation: preload-search 1.2s linear infinite;
			-webkit-animation: preload-search 1.2s linear infinite;
			animation: preload-save 1.2s linear infinite;
		}
		@keyframes preload-save{
			from{ 
				left: -20%;
			}
			to{
				left: 120%;
			}
		}

		.tabla2{
			display: -webkit-inline-flex;
			display: -moz-inline-flex;
			display: inline-flex;
			flex-direction: column;
			width: 100%;
		}
		.tabla2 .row_tab{
			display: inline-flex;
			flex-direction: row;
			width: 100%;
			border-top: 1px solid #ccc;
		}
		.tabla2 .row_tab.cabecera{
			font-weight: bold;
		}
		.tabla2 .row_tab .cell_tab{
			padding: 8px;
			width: 100%;
		}

		.tabla2 .row_tab .cell_tab.min{
			width: 40%;
		}
		.tabla2 .row_tab .cell_tab.min2{
			width: 15%;
		}
		.tabla2 .row_tab .cell_tab.med{
			width: 60%;
		}

		.listado_merc{
			padding: 4px;
			margin-top: 8px;
		}

		/* Check verde de carga de producto correcta en pre-factura */
		[class*="check-add-"] {
			position: absolute;
			display: none;
			color: #15a721;
			right: .3em;
			top: calc(50% - .5em);
		}
		.tabla2 .row_tab.selected{
			background-color: #d4f3ec;
		}

		/* Botones sumar y restar cantidad en pre-factura */
		.prodCRes, .prodCSum{
			font-size: .8em;
			cursor: pointer;
			color: rgba(0, 0, 0, 0.4);
			opacity: 0;
			padding: .5em;
			border-radius: 50%;
			transition: .2s ease all;
		}.prodCRes:hover, .prodCSum:hover{
			color: rgba(29, 34, 105, 0.8);
			text-shadow: 0px 0px 10px rgba(0, 49, 209, 0.4);
		}
		.row_tab.items_merc .im_prodCant:hover .prodCRes, .row_tab.items_merc .im_prodCant:hover .prodCSum{
			opacity: 1;
		}
		.prodCRes{
			margin-right: .9em;
		}.prodCSum{
			margin-left: .9em;
		}
		@media screen and (max-width: 1024px){
			.prodCRes{
				margin-right: .5em;
			}.prodCSum{
				margin-left: .5em;
			}
		}@media screen and (max-width: 900px){
			.prodCRes, .prodCSum{
				display: none;
			}
		}

		/* Prevenir selección en doble click en cantidad y descuento */
		.items_merc .im_prodCant, .items_merc .im_valDesc{
			user-select: none;
		}
	/* #endregion */

	/* #region Sección mercadería y categorías */
		/* Lista Categorías */
		#cont-listCat{
			position: relative;
		}
		#cont-listCat .item_cat{
			display: flex;
			display: grid;
			grid-template-columns: auto 1fr;
			align-items: center;
			margin-bottom: 8px;
			padding: 4px;
			border-bottom: 1px dotted #aaa;
			transition: .2s ease all;
		}
		/* Botones */
		#cont-listCat .btn_cat{
			margin-right: 10px;
		}
		#cont-listCat .btn_cat .ui-button {
			padding: 3px 7px;
			font-size: .8em;
			color: #464759;
			font-weight: normal;
		}
		#cont-listCat .btn_cat .ui-button:hover, #cont-listCat .btn_cat .ui-button:focus{
			color: #FFFFFF;
		}
		#cont-listCat .btn_cat .ui-button:active{
			color: #3436df;
		}
		/* Texto */
		#cont-listCat .nombre_cat:focus{
			border-bottom: 1px solid #47a0ff;
			padding: 3px;
			padding-left: 6px;
			padding-right: 0;
			margin-right: 0;
			box-shadow: 0px 6px 8px -8px #47a0ff;
			transition: .2s ease all;
		}

		/* Input de selección de categoría en mercadería */
		.cell select#cat_prod{
			width: auto;
			max-width: 150px;
			min-width: 100px;
		}

		/* Resaltar columna cuando se guarda editado */
		.prod_save_success{
			box-shadow: 0px 0px 20px -7px #7aff7a inset !important;
			transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
		}.prod_save_error{
			box-shadow: 0px 0px 20px -7px #ff6969 inset !important;
		}

		/* Seleccionar todo (checkbox) */
		.check_prod_all{
			opacity: .6;
			transition: .2s ease all;
		}.check_prod_all:hover{
			opacity: .8;
		}
		.check_selected{
			background: #d6e8ff !important;
			box-shadow: 5px 0px 0px -2px #0060df inset;
			transition: .2s ease all;
		}.table .tab-row.check_selected:nth-child(2n) {
			background: #cee4ff !important;
		}.check_selected:hover, .table .tab-row.check_selected:nth-child(2n):hover {
			background: #d2ddeb !important;
		}

		.form-check-input{
			opacity: .8;
			transition: .2s ease all;
		}.form-check-input:hover, .form-check-input:checked{
			opacity: 1 !important;
		}

		/* Panelcito de edición de mercaderías */
		#tabs-merc{
			position: relative;
		}
		#list_merc_table{
			overflow: initial !important;
		}#list_merc_table .tit-text{
			width: auto;
			margin-right: 1rem;
		}
		.control_merc{
			/* position: sticky; */
			position: fixed;
			z-index: 2000;
			display: none;
			bottom: 4px;
			width: auto;
			max-width: 100%;
		}
		.ctrlM_cont{
			display: flex;
			width: max-content;
			background: #637177;
			box-shadow: 0px 4px 12px -6px #000;
			color: #ffffff;
			margin-bottom: .6rem;
			font-size: 1rem;
			border-radius: 5px;
		}
		.ctrlM_cont .ctrlM_item{
			padding: .5rem .7rem;
			cursor: default;
		}.ctrlM_cont .ctrlM_item.sel_count{
			font-size: .8em;
			display: flex;
			align-items: center;
			opacity: .7;
		}.ctrlM_cont .ctrlM_item.sel_count span{
			margin-left: .2em;
		}.ctrlM_cont .ctrlM_item:hover:not(.sel_count,.sel_separate){
			background: rgba(255, 255, 255, 0.1);
			cursor: pointer;
		}.ctrlM_cont .ctrlM_item.sel_separate{
			padding-left: 0;
			padding-right: 0;
			opacity: .7;
		}.ctrlM_cont .ctrlM_item.sel_separate::after{
			content: '|';
		}

	/* #endregion */

	/* #region Sección Configuración */
		#form_datos{
			display: inline-block;
			width: 100%;
		}
		#form_datos .dat_inp{
			display: inline-block;
			width: 100%;
			margin: auto 6px;
		}
		#form_datos .dat_inp > label{
			margin: 0;
			margin-right: 8px;
			width: 100%;
			text-align: left;
		}
		#form_datos .dat_inp > input{
			margin: 8px 0px;
			width: 100%;
		}
	/* #endregion */
	
	/* #region --------------- Redimensina según tamaño pantalla del dip ---------------*/
	@media screen and (max-width: 1024px){
		.table{
			font-size: 12px;
		}
	}
	@media screen and (max-width: 920px){
		/* Menu en la cabecera */
		#head .head_men{
			margin: 0px;
			padding: 0;
			position: fixed;
			bottom: 0;
			left: 0;
			width: 100%;
			background-color: var(--header-bg-color);
			text-align: center;
			height: 44px;
			overflow-y: hidden;
			overflow-x: auto;
		}
		#head .head_men ul{
			/* width: 100%; */
			height: 100%;
			display: inline-flex;
			white-space: nowrap;
		}
		#head .head_men li a{
			color: #fff;
			padding: 12px 15px;
		}
		.table .title.block-reduction{
			flex-direction: column;
			padding: 4px;
		}
		.table .title.block-reduction .tit-btn{
			position: static;
		}
	}
	@media screen and (max-height: 300px){
		#pnl-nav{
			overflow: auto;
		}
	}
	@media screen and (max-width: 700px){
		#c-mos .cm-pad, .box-cont{
			padding: 0;	
		}

		#pnl-nav{
			overflow: auto;
		}
		#pnl-nav::-webkit-scrollbar {
			width: 2px;
			height: 2px;
		}
		#pnl-nav::-webkit-scrollbar-thumb {
			background-color: rgba(255, 255, 255, 0.5);
			border: 1px solid rgba(0, 0, 0, 0.6);
		}

		.number-counter{
			flex-direction: column;
			margin-top: 4px;
		}
		.number-counter .nc-title{
			padding: 0 6px;
			border-right: 0;
			border-bottom-width: 1px;
		}
		.nc-number .nc-num-group{
			padding-top: 2px;
		}
	}
	@media screen and (max-width: 400px){
		.table{
			width: 100%;
		}

		#pnl-nav ul li a{
			font-size: 1.2em;
		}

		/* Cuadreo de datos */
		.dash-cont .box-ds{
			width: 100%;
			min-width: 180px;
			height: 180px;
			font-size: 1.3em;
			white-space: nowrap;
			overflow: hidden;
		}
		.box-ds .tit-ds, .box-ds .icon-ds, .box-ds .text-ds{
			height: 20%;
			width: 100%;
			padding: 5px;
		}
		.box-ds .icon-ds{
			height: 60%;
			font-size: 70px;
		}
	}
/* #endregion */