@import "../../plantilla/css/mensajes.css";
@import "../../plantilla/css/global.css";
@import "../../plantilla/css/vpdf.css";

body{
	background-color: #FFF;
}

	h3 {
		color: #A21F42;
		margin-left: 1rem;
		font-weight: lighter;
		border-bottom: 1px solid #E3E3E3;
	}

	body h3:first-child {
		margin-top: 1.5rem;
	}

	.main-parametros, .main-acuse, .main-documentos {
		display: flex;
	}

	.main-parametros, .main-acuse {
		align-items: center;
		flex-direction: column;
	}

	.main-documentos {
		flex-direction: row;
		justify-content: center;
	}

	.main-parametros > .seccion, .main-acuse > .seccion {
		width: 90vw;
		max-width: 1024px;
	}

		/* 	***************
			DATOS GENERALES
			*************** */

		.datos {
			margin-top: 1rem;
		}

			.datos  article {
				display: flex;
				flex-wrap: wrap;
				flex-direction: row;
			}

				.datos [class^="item"] {
					display: flex;
					flex-wrap: nowrap;
					align-items: center;
					flex-direction: row;
					margin: 1rem 0 0 1rem;
				}

				.datos .item {
					flex-grow: 1;
				}
				
 					.datos [class^="item"] > p,
 					.datos [class^="item"] > label {
 						font-size: .8rem;
 					}

					.datos [class^="item"] > label {
						margin-right: .5rem;
					}

					.datos [class^="item"] > input, 
					.datos [class^="item"] > select, 
					.datos [class^="item"] > textarea {
						height: 2rem;
						display: flex;
						flex-grow: 1; 
						padding: 0 .5rem;
						border-radius: 5px;
						transition: all .5s;
						border: 1px solid #E3E3E3;
					}

						textarea.solicitud{
							height: unset !important;
						}

						.fecha {
							max-width: 6rem;
							text-align: right;
						}

						#observacion {
							color: #A21F42;
						}

 					.datos [class^="item"] > span {
 						font-size: .2rem;
 						margin-right: 1rem;
 					}

						.datos .orden > select {
							max-width: 6rem;
							min-width: 6rem;
							margin-left: .5rem;
						}

				.datos [class^="itemBoton"] {
					color: #595959;
					padding: .5rem;
					cursor: pointer;
					font-size: .8rem;
					transition: all .5s;
					justify-content: center;
					border: 1px solid #C9C6C6;
					background-color: #E3E3E3;
					box-shadow: 0px 10px 13px -7px #000000, 2px 2px 15px 8px rgba(0,0,0,0);
				}

					.datos .itemBoton {
						border-radius: 5px;
					}

					.datos .itemBotonRedondo {
						border-radius: 50%;
					}
				
					.datos [class^="itemBoton"]:hover {
						color: #A21F42 !important;
						border: 1px solid #A21F42;
					}

		/* 	*******
			BOTONES
			******* */

		.botonera{
			display: flex;
			flex-direction: row;
			justify-content: center;
		}

			[class^="btnWrapper"] {
				display: flex;
				color: #595959;
				padding: .5rem;
				cursor: pointer;
				font-size: .8rem;
				min-height: 2rem;
				border-radius: 5px;
				transition: all .5s;
				align-items: center;
				flex-direction: row;
				justify-content: center;
				border: 1px solid #C9C6C6;
				background-color: #E3E3E3;
				box-shadow: 0px 10px 13px -7px #000000, 2px 2px 15px 8px rgba(0,0,0,0);
			}

				.btnWrapper {
					margin: 1.5rem .75rem;
				}

				.btnWrapperEnviar {
					margin: .75rem;
					max-width: 5rem;
				}

				.cursor-stop{
					cursor: not-allowed !important;
				}

				[class^="btnWrapper"]:hover {
					color: #A21F42;
					border: 1px solid #A21F42;
				}

				[class^="btnWrapper"] > p {
					margin-left: .5rem;
				}

				.pdfWrapper{
					color: white !important;
					background-color: #D99595 !important;
					border: 1px solid #D99595 !important;
				}

				.excelWrapper{
					color: white !important;
					background-color: #81B784 !important;
					border: 1px solid #81B784 !important;
				}

		/* ====================
		INFORMACIÓN DEL PERIODO
		======================= */
		h4.label {
			color: #595959;
		}

		h4.descripcion {
			color: #595959;
			margin-left: .5rem;
			font-weight: lighter;
		}

		h3.indice {
			width: 100%;
			color: #A21F42;
			text-align: center;
		}

/*	====================================
	DOCUMENTOS, INCLUYENDO FUNCIÓN ACUSE
	==================================== */

	#cabecera, .nodoAcuse {
		display: flex;
		font-size: .75rem;
		margin-left: 1rem;
		min-height: 1.5rem;
		align-items: center;
	}

	.nodoAcuse{
		display: flex;
		margin-top: .25rem;
	}

	#cabecera {
		color: white;
		margin-top: .5rem;
		background-color: #595959;
	}

		#cabecera span {
			text-align: center;
		}

		.doc {
			flex-grow: 1;
			min-width: 65%;
			text-align: left;
		}

		.tipo, .fecha, .hora, .estatus {
			text-align: center;
			border-left: 1px solid white;
		}

		.tipo {
			min-width: 5rem;
		}

		.estatus {
			min-width: 10%;
		}

		.fecha, .hora {
			min-width: 8%;
		}

		.nodoAcuse:nth-child(odd) {
			background-color: #E3E3E3;
		}

	.documentoWrapper:last-child {
		margin-bottom: 1rem;
	}

	.msgOpcional{
		top: -12px;
		width: 100%;
		display: flex;
		font-size: .8rem;
		user-select: none;
		min-height: 1.5rem;
		position: absolute;
		justify-content: center;
	}
	
	.msgOpcional > p{			
			padding: 5px 5px;
			text-align: center;
			border-radius: 5px;
			background-color: rgba(255,255,0,.5);
		}
	

/* 	==============
	NOTIFICACIONES
	============== */

.notificacion {
	color: black;
	display: flex;
	min-width: 100%;
	max-width: 100%;
	min-height: 70px;
	margin: .25rem 0;
	font-size: .8rem;
	position: relative;
	border-radius: 5px;
	flex-direction: column;
	align-items: center;
	text-align: justify;
	transition: all .5s;
	border: 1px solid #E3E3E3;
}

	p.notificacion-descripcion {
		width: 100%;
		padding: .25rem .25rem 0 .25rem;
	}

	p.notificacion-fecha {
		width: 100%;
		color: #969696;
		padding: .25rem;
	}

	.notificacion:hover {
		color: #A21F42 !important;
		border: 1px solid #A21F42;
		background-color: #E3E3E3;
	}

	.notificacion-resaltada {
		background-color: #E3E3E3;
		border: 1px solid #E3E3E3;
	}

	#solicitud{
		padding-bottom: 1rem;
	}

/* 	=============
	MEDIA QUERIES
	============= */

@media(max-width: 800px){
	.notificaciones, .visor {
		min-width: 100%;
		max-width: 100%;
	}
}

/* =====
   FONTS
   ===== */

@font-face {
  font-family: 'municipios';
  src:  url('fonts/municipios.eot?mumw5y');
  src:  url('fonts/municipios.eot?mumw5y#iefix') format('embedded-opentype'),
    url('fonts/municipios.ttf?mumw5y') format('truetype'),
    url('fonts/municipios.woff?mumw5y') format('woff'),
    url('fonts/municipios.svg?mumw5y#municipios') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}


[class^="municipio-"], [class*=" municipio-"] {
  line-height: 1;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  font-family: 'municipios' !important;
}

.municipio-contraloria:before {
  content: "\e930";
  font-size: 1.5rem;  
}
.municipio-generar:before {
  content: "\e996";
  font-size: 1.5rem;  
}
.municipio-descargar:before {
  content: "\e9c2";
  font-size: 1.5rem;  
}
.municipio-acuse:before {
  content: "\e9c4";
  font-size: 1.5rem;  
}
.municipio-filtrar:before {
  content: "\e903";
  font-size: 1rem;  
}
.municipio-sinleer:before {
  content: "\e951";
  color: #A21F42;
}
.municipio-info:before {
  content: "\ea0c";
}
.municipio-leida:before {
  content: "\ea10";
  color: rgba(4,78,4,.75);
}
.municipio-ok:before {
  content: "\e900";
}
.municipio-solicitudes:before {
  content: "\e92e";
  font-size: 1.5rem;  
}
.municipio-recibido:before {
  content: "\e995";
}
.municipio-cargar:before {
  content: "\e9c3";
  font-size: 1.5rem;  
}
.municipio-cancelar:before {
  content: "\ea0d";
  font-size: 1rem;  
}
.municipio-rechazado:before {
  content: "\ea0e";
}
.municipio-pdf:before {
  content: "\eadf";
  font-size: 1rem;  
}
.municipio-excel:before {
  content: "\eae2";
  font-size: 1rem;  
}
.municipio-notificaciones:before {
  content: "\e902";
  font-size: 1.5rem;  
}
.municipio-enviar:before {
  content: "\e901";
}