/*WIZARD*/

#cuadroTexto p {
	& img {
		width: 90%;
		display: block;
	    	margin: 0 auto;
		animation: fadein 2s ease;
		border-radius: 6px;
	}
	& em {
		display: inline-block;
		text-align: center;
		width: 100%;
		font-size: .9rem;
    		opacity: .7;
	}
}

.option_click {
	background: #133b3d;
	padding: 2px 8px;
	margin: 2px;
	width: fit-content;
	border-radius: 4px;
	text-decoration: none;
	cursor: pointer;
	transition: background .3s ease;

	&:hover {
		background: #155659;
		color: white;
	}
}

.wizardContainer {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	transition: grid-template-columns 0.7s ease;
	grid-template-columns: 3fr 3fr 3fr 3fr 3fr;
	width: 100%;
	height: 100%;

	&.paso1 {
		grid-template-columns: 100% 0fr 0fr 0fr 0fr;

		& .world_map {
			transform: scale(1);
		}
		& #datosPais .grafica {
			opacity: 0;
		}
	}

	&.paso2 {
		/*grid-template-columns: 2fr 7fr 3fr 0fr 0fr;*/
		grid-template-columns: 200px 0fr 10fr 0fr 0fr;
		
		& .world_map {
			pointer-events: none;
			transform: scale(10);
		}
		& #datosPais .grafica {
			opacity: 0;
	        animation-name: fadein;
			animation-duration: .8s;
			animation-fill-mode: forwards;

			--retraso: 300ms;
		
			&:nth-child(1) {animation-delay:calc(var(--retraso)*2);}
			&:nth-child(2) {animation-delay:calc(var(--retraso)*3);}
			&:nth-child(3) {animation-delay:calc(var(--retraso)*4);}
			&:nth-child(4) {animation-delay:calc(var(--retraso)*5);}
			&:nth-child(5) {animation-delay:calc(var(--retraso)*6);}
			&:nth-child(6) {animation-delay:calc(var(--retraso)*7);}
			
		}
		
		& .country-active:not( .country-select), 
		& .country-disabled, 
		& circle  {
		    filter: brightness(.3);
		}
	}

	&.paso3 {
		/* creo que no se usa */
		grid-template-columns: 200px 0fr 10fr 0fr 0fr;

		& .world_map {
			pointer-events: none;
			transform: scale(15);
		}
		& #datosPais .grafica {
			opacity: 0;
	            	animation: fadein .8s .6s forwards;

			--retraso: 300ms;
		
			&:nth-child(1) {animation-delay:calc(var(--retraso)*2);}
			&:nth-child(2) {animation-delay:calc(var(--retraso)*3);}
			&:nth-child(3) {animation-delay:calc(var(--retraso)*4);}
			&:nth-child(4) {animation-delay:calc(var(--retraso)*5);}
			&:nth-child(5) {animation-delay:calc(var(--retraso)*6);}
			&:nth-child(6) {animation-delay:calc(var(--retraso)*7);}
			
			& svg {
				opacity: 0;
	            animation: animAncho 3s 1.5s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
			}
		}

		& .country-active:not( .country-select), 
		& .country-disabled, 
		& circle  {
		    filter: brightness(.3);
		}	
			/*& circle.world_map_globe,
			& .country-active:not(.country-select),
			& .country-disabled {
			    display: none;
			}*/
	}

	&.paso4 {
		grid-template-columns: 0px 0fr 0fr 12fr 0fr;

		& .world_map {
			pointer-events: none;
			transform: scale(15);
		}
		& #datosPais .grafica {
			opacity: 0;
		}

		& .country-active:not( .country-select), 
		& .country-disabled, 
		& circle  {
		    filter: brightness(.3);
		}
	}

	&.paso5 {
		grid-template-columns: 0fr 0fr 0fr 0fr 12fr;
	}
}
@media (max-width: 770px) {
	.wizardContainer {
		display: grid;
		transition: grid-template-rows 0.7s ease;
		grid-template-columns: 1fr !important;
		grid-template-rows: repeat(5, 1fr) !important;
		
		&.paso1 {
			grid-template-rows: 12fr 0fr 0fr 0fr 0fr !important;
		}
	
		&.paso2 {
			grid-template-rows: 0fr 0fr 1fr 0fr 0fr !important;
		}
	
		&.paso3 {
			grid-template-rows: 0fr 0fr 1fr 0fr 0fr !important;
		}
	
		&.paso4 {
			grid-template-rows: 0fr 0fr 0fr 1fr 0fr!important;
			
			& .columnas {
				/*flex-direction: column;*/
			
				& #columna1 {
					min-width: 100%;
	    				max-width: initial !important;
					height: 25% !important;
					& div:first-child {
						/*width: 100%;*/
					}
				}
				& #columna2 {
					flex: none;
					height: calc(75% - 40px) !important;
					    & #cuadroTexto {
						    /*overflow: scroll;*/
					    }
				}
			}
		}
	
		&.paso5 {
			grid-template-rows: 0fr 0fr 0fr 0fr 12fr;
		}
	}
}

.columna {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	text-align: left;
	transition: all 0.7s ease;
	overflow: hidden;

	& .inner {
		width: 100%;
		height: 100%;
		margin: 0 6px;
		transition: all 1.5s ease;
		box-sizing: border-box;
		color: white;
	}

	&#col1 {
		display: flex;
		align-items: center;
		width: initial;

		& .inner {
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}
}


li.report_item {
	padding: 10px;
}

li.report_item .codename,
li.report_item .published,
li.report_item .license,
li.report_item .uuid {
	display: none;
}

/*
li.report_item .published_false {

}
*/

/*
li.report_item .published:before {
	content: "Publicado: ";
	font-size: 8px;	
}

li.report_item .license:before {
	content: "Licencia: ";
	font-size: 8px;	
}
*/

.cat_wizard {
	background: #fff;
	border: 1px solid #999;
	position: absolute;
	z-index: 9;
	left: 20px;
	width: 300px;
	display: none;
	top: 25px;
	left: 50px;
	color: #444;
	border-radius: 2px;
}

.dropdown-as-categories:hover+ul+p {
	display: block;
}

.dropdown-as-categories:active+ul+p {
	display: none;
}

.dropdown-as-categories:focus+ul+p {
	display: none;
}

.input-group-addon {
	padding: 7px 7px 0px 7px;
	border-radius: 7px 0px 0px 7px;
	min-width: 160px;
}


#region_containers_sharelink {
	/*display: block; */
	position: relative;
	/* top: 43px; */
	/* right: 10px; */
	/* width: 38px; */
	/* height: 33px; */
	/* background-color: #0091c1; */
	/* color: white; */
	/* z-index: 1000; */
	font-size: 10px;
	padding: 2px;
}

#screenshot .modal-body {
	text-align: center;
}

.input_sector_col1 {
	display: block;
	float: left;
}


.tematica {
	padding: 10px;
}

.tematica .title {
	font-size: 16px;
	padding: 4px;
}

.tematica .title i {
	display: absolute;
	float: right;
	font-size: 14px;
}

.listaTematicas {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    	grid-auto-rows: 165px;
	gap: 6px;
	padding: 6px;
	border-radius: 6px;
	scroll-snap-type: y mandatory;

	/*background-image: url('https://odoo17.geoecon.info/web/image/1215-72f736a3/fondoTematicas.png');*/
	background-position: right bottom;
    	background-repeat: no-repeat;

	& .tematica {
		padding: 1rem;
		/*background-color: var(--clr-princ-00);*/
		background-color: #004d66ed;
		border-radius: 4px;
		background-repeat: no-repeat;
		background-position: bottom right;
		transition: background-color .3s ease, background-position .3s ease, filter .3s ease;
		scroll-snap-align: start;
		cursor: pointer;
		
		& .topic_short_description {
			font-size: 12px;
			line-height: 1.2rem;
			display: -webkit-box;
			/*-webkit-line-clamp: 2;
			-webkit-box-orient: vertical;
			text-overflow: ellipsis;*/
			overflow: hidden;
			margin-top: 8px;
			text-wrap: pretty;
			color: #ffffffaa;
			opacity: 0;
			transform: translateX(10px);
			transition: opacity .3s ease, transform .5s ease;
		}
		
		&:hover {
			background-position: calc(100% + 20px) calc(100% + 20px);
			background-color: var(--clr-princ-2);
			
			& .topic_short_description {
				opacity: 1;
				transform: translateX(0px);
			}
		}
	}
	
	& .temaItem {
		/* ocultamos los textos hasta hacer algo mejor, como tipear un breve texto <= 2 renglones */
		display: none;
		
		& ul {
			margin: 0;
			padding: 0 6px;
			font-size: 1rem;
			line-height: 140%;
			list-style: disc;
			margin-top: 5px;
			margin-left: 12px;
		}
		& li {
			color: var(--clr-princ-5);
			cursor: pointer;
		}
	}
}

#chooseusertopic {
	& #columna2 {
		width: auto !important;
	}

	& .modal-dialog {
	    max-width: 1200px;
	}

	& .listaTematicas {
		display: grid;		
		grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
        	grid-auto-rows: 140px;
		gap: 6px;
		padding: 6px;
		border-radius: 6px;
		max-height: 300px;
		
		& .tematica {
			background-color: #004d66ed;
			border-radius: 4px;
			color : #FFF !important;
			overflow: hidden;
		}
	}
}

.tematica .descripcion {
	font-size: 10px;
	padding: 8px;
}

.unidadgeo {
	height: 200px !important;
}

.unidadgeo img {
	height: 160px !important;
}

.tematicas .dropdown-item {
	min-width: 640px !important;
	max-width: 640px !important;
}

.gedi .tematicas img {
	filter: invert();
}

.indicator_list {
	background-color: #555;
	color: #FFF;
	font-weight: normal;
	padding: 7px;
	margin-bottom: 4px;
	cursor: pointer;
	cursor: hand;
}

.indicator_list i {
	float: right;
}

.indicator_list_unidad_geo {
	display: block;
	width: 100%;
	background-color: #000;

	margin: 0px;
	padding-right: 0px;

}

.template_unidad_geo {
	display: block;
	color: white;
	background-color: #133b3d;
	cursor: pointer;
	cursor: hand;
	font-size: 12px;

	padding-left: 8px;
	padding-top: 5px;
	padding-bottom: 5px;

	transition: background-color .3s ease;

	&:last-child {
		border-radius: 0 0 6px 6px;
	}
}

.template_sectores {
	border-top: solid 1px #888;
}

.template_periodos {
	border-top: solid 1px #888;
}


.template_unidad_geo.active,
.template_unidad_geo:hover {
	/*display: block;*/
	background-color: #155659;
}

.tematica_unidad_cluster {
	display: block;
	color: #333;
	background-color: #FFF;
	cursor: pointer;
	cursor: hand;
	font-size: 12px;


	padding-left: 8px;
	padding-top: 5px;
	padding-bottom: 5px;
}

.tematica_unidad_cluster.active,
.tematica_unidad_cluster:hover {
	display: block;
	color: #FFF;
	background-color: #333;
}

.indicator_list_clusters {
	display: block;
	width: 50%;
	/*background-color: #CCC;*/

}

/*****************************************/
/*** WIZARD INFO PARA AGLO Y TERRITORIOS */
/*****************************************/


/* ##### TERRITORIOS |    ##########################################################################*/

div#tabla .item {
    color: white !important;
}

#indicator_list_content_1aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_.indicator_list_content {
	max-width: 650px;
}

#tablaTerritorio tr:first-child {
    height: 4rem;
    background: #00000094;
}

#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ #sectorTabla tr,
#cuadroTexto #tablaTerritorio tr,
#indicator_list_content_1aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ .tablaDesplegables tr {
	border-bottom: 1px solid var(--clr-neutro-0);
}

#cuadroTexto #tablaTerritorio .ver,
#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ td.ver {
	/* ver */
	width: 32px;
	/*background-color: var(--clr-neutro-0) !important;*/
	text-align: center;
}


#cuadroTexto #tablaTerritorio .check,
#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ td.check {
	/* check */
	width: 32px;
	/*background-color: var(--clr-neutro-00) !important;*/
	text-align: center;
}

#cuadroTexto #tablaTerritorio .tit,
#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ td.tit,
#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ th.tit {
	/* titulo */
	position: relative;
	width: 150px;
	text-align: center;
	/*background-color: var(--clr-neutro-1) !important;*/
}

.oscurecer {
	filter: brightness(0.8);
	
}
table.oscurecer {
	border-collapse: separate;
    	border-spacing: 2px;
	padding: 0;
}

#sectorTabla .oscurecer td.dis_open:before {
	/* titulo | flecha hacia abajo*/
	
	/*content: "";
	position: absolute;
	background-image: url('/img/flechas.svg');
	background-repeat: no-repeat;
	background-size: contain;
	top: 50%;
	left: 92%;
	transform: translateY(-50%);
	width: 10px;
	height: 10px;
	z-index: 1;
	opacity: .4;*/
}

#cuadroTexto #tablaTerritorio .val,
#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ td.val,
#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ th.val {
	/* val */
	width: 50px;
	text-align: center;
}

#tablaTerritorio {
	width: 96%;
	margin: 10px auto;
	background: #4b4b4b4a;
	
	& td {
		color: white !important;
		font-weight: normal;
		
		&:first-child {
	 		height: 3rem;
		}
		&.check {
			width: 0px;
		}
	}
}

.itemestrow:hover {
	filter: brightness(0.8);
}

/* Territorios | desplegables */

.tablaDesplegables.altura {
	/* no borrar! */
	max-height: 160px;
	border-radius: 6px;
}

.tablaDesplegables .tit {
	padding: 6px 10px;
	background-color: var(--clr-neutro-000);
	font-weight: 600;
	user-select: none;
}

.tablaDesplegables .tit:hover {
	background-color: var(--clr-neutro-0);
}

.tablaDesplegables td {
	width: 100%;
	background: var(--clr-neutro-1b);
	padding: 6px 8px;
	margin-bottom: 1px;
}

.tablaDesplegables td:hover {
	background-color: var(--clr-neutro-2);
}

.tablaDesplegables i {
	width: 30px;
	padding-left: 4px;
}


/* Tablas - Encabezado - TERRITORIOS */

/* parte superior */
.tablaDatosTop {
	font-weight: 600;
	border-bottom: 6px solid var(--clr-resal-4c);
	color: #1e3900;
}

.tablaDatosTop .fila .item:nth-child(1) {
	background-color: var(--clr-resal-4a);
	border-radius: 6px 0 0 0;
	flex: 3;
}

.tablaDatosTop .fila .item:nth-child(2) {
	background-color: var(--clr-resal-4c);
	text-align: center;
}

.tablaDatosTop .fila .item:nth-child(3) {
	background-color: var(--clr-resal-4b);
	border-radius: 0 6px 0 0;
	text-align: center;
	width: 170px;
}

.tablaDatos .fila,
.tablaDatosTop .fila {
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	font-size: .9rem;
}

.tablaDatos .fila .item,
.tablaDatosTop .fila .item {
	border-bottom: 1px solid var(--clr-neutro-1);
	padding: 12px;
	flex: 1;
}


/*      Tablas - Datos */



.tablaDatos .fila .item:nth-child(3n+1) {
	background-color: var(--clr-osc-2);
	flex: 3;
}

.tablaDatos .fila .item:nth-child(3n+2) {
	background-color: var(--clr-osc-1);
	color: var(--clr-resal-4b);
	justify-content: center;
}

.tablaDatos .fila .item:nth-child(3n+3) {
	background-color: var(--clr-osc-3);
	justify-content: center;
	width: 170px;
	color: var(--clr-resal-4b);
}

.tablaDatos .fila:hover>div {
	filter: brightness(1.2);
	transition: filter 0.3s ease;
}



#tablaTerritorio tr.fila:first-child:hover {
	filter: brightness(0.5);
}

/* porTerritorio | columna 1 abajo **/

.metrica {
	display: flex;
	gap: 1px;
	align-items: center;
	justify-content: center;
	height: 100%;
	width: 100%;
	position: relative;
	background-color: #fff1;
	font-size: .8rem;
}

.gsector {
	display: block;
	/*background-color: var(--clr-resal-4c) !important;*/
	font-size: .7rem;
	width: 100%;
	height: 25px;
	position: absolute;
	top: -25px;
	color: #FFF;
	text-align: center;
	padding-top: 5px;
}

.linea-central {
	width: 100%;
	height: 1px;
	background-color: #777;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

.barra {
	background-color: #fff;
	position: absolute;
	/*transform: translateX(-50%);*/
	/*left: 50%;*/
	width: 100%;
	height: 0;
	
	display: flex;
	justify-content: center;
	align-items: center;
	flex-grow: 1;
	
	color: white;
	font-size: .7rem;
	text-shadow: 0px 0px 10px black, 0px 0px 10px black;
	
	animation: animScaleY 2s ease;
	
}

.positiva {
	bottom: 50%;
	transform-origin: bottom;
	min-height: 1px;
	height: calc(var(--alto-barra)/2);
	align-items: flex-start;
	border-radius: 3px 3px 0 0;
	/*background-image: linear-gradient(0deg, transparent, var(--clr-princ-0));*/
	background-image: linear-gradient(0deg, transparent, var(--clr-princ-0));
    	transform-origin: bottom;
}

.negativa {
	top: 50%;
	transform-origin: top;
	min-height: 1px;
	height: calc((0% - var(--alto-barra))/2);
	align-items: flex-end;
	border-radius: 0 0 3px 3px;
	background-image: linear-gradient(180deg, transparent, #fff5);
}

/* GRID TOOLTIP */

#tooltip {
	display: inline-block;
	position: absolute;
	padding: 5px 15px;
	background: var(--clr-princ-1);
	border-radius: 3px;
	color: #fff;
	font-weight: 300;
	cursor: default;
	z-index: 100;
	min-width: 40px;
	transition: all 200ms linear;
	-webkit-transition: all 200ms linear;
	-moz-transition: all 200ms linear;
	-o-transition: all 200ms linear;
	max-width: 300px;
}

#tooltip:after {
	display: 'block';
	content: '';
	position: absolute;
	bottom: -10px;
	left: 10px;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 10px 8px 0 8px;
	border-color: var(--clr-princ-1) transparent transparent transparent;
}

.tablaDatos .item:hover,
.metrica:hover {
	filter: brightness(1.5);
	transition: filter 0.3s ease;
	cursor: default;
}

/* HEATMAP */

#heatMap {
	display: flex;
	font-size: .65rem;
	cursor: default;
	/*height: 205px;*/
	overflow-y: auto
}

.input input {
	width: 100%;
	border-radius: 4px;
	border: none;
}

#heatMap .columna {
	display: flex;
	flex-direction: column;
	gap: 0px;
	justify-content: flex-start;
	flex-wrap: nowrap;
	width: 100%;
	gap: 1px;
	padding-right: 6px;
}

#heatMap .fila {
	display: flex;
	gap: 1px;
}

#heatMap .item {
	width: 20px;
	height: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-grow: 1;
	max-width: 100%;
	cursor: pointer;
	cursor: hand;
}

/* HeatMap | Colores para representar el "mapa de calor" */

.clr1 {
	background-color: #fff;
}

.clr2 {
	background-color: var(--clr-princ-5);
}

.clr3 {
	background-color: var(--clr-princ-0);
}

/* HeatMap | Detalle grafico */

.heatMapDetalle {
	height: 200px;
	width: 96%;
	margin: 60px auto 30px auto;
	border: 2px solid #689438;
    	border-radius: 6px;
	
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 2px;
}

.destacar {
	border-radius: 4px 0 0 4px;
	background-color: var(--clr-resal-4c) !important;
	border-top: 2px solid var(--clr-resal-4c) !important;
	border-bottom: 2px solid var(--clr-resal-4c) !important;
	font-weight: bold;
}
.metrica.destacar {
	height: 100%;
	font-size: 1.3rem;
}




/* ##### SECTORES |    #####################################################################*/
.aglo_sectores {
	/*height:100%;*/
	display: flex;
	flex-direction: column;
	gap: 4px;

	& #sectorTabla table {
		padding: 0;

		&.algo_district_muni.active {
			background: darkcyan;		
		}
		
		& th,
		& td {
			min-width: 90px;
            		max-width: 90px;
		}
	}


	& .collapse table {
		padding: 0;
	}

	& td.add,
	& th.add {
		/* add */
		width: 40px !important;
		min-width: 40px;
		padding: 2px;
		background-color: hsl(0deg 0% 0% / 30%) !important;
		justify-content: center;
		transition: filter .5s ease;
		
		&:hover {
			filter: brightness(1.4);
        		animation: none;
		}
		& > div {
			animation: pulsar 3s infinite;
		}
		& img {
			width: 80% !important;
		}
	}

	& #sectorTabla {
	    	margin: 10px auto;
		background: #fff1;
		max-height: 490px;
		
		& td,
		& th {
			text-align: center;
		}
		& td:first-child {
		    /*padding: 0;*/
		}
	}

	& .colapsador td.add>div:first-child {
		background-color: var(--clr-princ-2);
		padding-top: 3px;
		width: 26px;
		height: 26px;
		border-radius: 6px;
		margin: 0 auto;
	}

	& td.clr,
	& th.clr {
		width: 8px;
	}

	& .oscurecer3:after {
		content: '';
		width: 50%;
		height: 100%;
		background: #00000061;
    		background-image: repeating-linear-gradient(45deg, #ffffff36 0, #ffffff36 2px, transparent 2px, transparent 8px);
		position: absolute;
		top: 0;
		left: 0;
	}
}


td.add,
th.add {
	width: 30px;
	padding: 2px;
	background-color: var(--clr-neutro-0) !important;
	justify-content: center;
}




/*#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ #sectorTabla td:nth-child(even),*/
#porTerritorio #tablaTerritorio .item:nth-child(even) {
	/* color de datos generales variacion en pares */
	background-color: var(--clr-neutro-2);
}

/*#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ .datosGeneral .item,*/
.datosGeneral .item {
	/* color de datos generales por defecto */
	background-color: rgba(193, 219, 227, 0.08);
	border-bottom: 1px solid hsla(0, 0%, 100%, 0.2);
	padding: 6px;
	cursor: default;
	padding: 10px 12px;
	display: flex;
}

/*#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ .datosGeneral .item:nth-child(odd),*/
.datosGeneral .item:nth-child(odd) {
	background-color: rgba(193, 219, 227, 0.10);
}

/*#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ .item .tit,*/
.item .tit {
	min-width: 30px;
	flex: 1;
	display: flex;
	align-items: center;
	font-size: .9rem;
	line-height: 1.2em;
	padding-right: 14px;
}

/*#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ .item .cifra1,*/
.item .cifra1 {
	flex: 1;
	text-align: right;
	font-size: 1.2rem;
	font-weight: 600;
}

/*#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ .item .cifra2,*/
.item .cifra2 {
	flex: 1;
	text-align: right;
	font-size: 1rem;
	color: var(--clr-neutro-4);
}

/* ##### SECTORES | Barras verticlaes */

/*#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ .barraVert,*/
.barraVert {
	display: flex;
	justify-content: flex-start;
	align-items: flex-end;
	gap: 1%;

	background: #fff1;
	background-image: repeating-linear-gradient(-45deg, #ffffff05 0, #ffffff05 4px, transparent 4px, transparent 12px);
	width: 96%;
    	margin: 10px auto;
	height: 150px;
	user-select: none;
    	padding: 14px 7px 0 7px;
	border-radius: 6px;
	border-bottom: 3px solid #fff7;
}

/*#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ .barraVert div,*/
.barraVert div {
	position: relative;
	flex: 1;
	width: 100%;
	min-height: 1px;
	border-radius: 3px 3px 0 0;
	
	text-align: center;
	text-shadow: 1px 1px 2px #000;
	color: #ffffff;

	animation: animScaleY 1s ease;
    	transform-origin: bottom;

	& div {
		position: absolute;
		top: -14px;
		font-size: .7rem;
		white-space: nowrap;
	}
}

/*#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ .barraVert div:hover,*/
.barraVert div:hover {
	filter: brightness(1.25);
}

/*#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ .barraColor,*/
.barraColor {
	--color-fondo: var(--data-color);
	--color-sat1: 70%;
	--color-lum1: 60%;
	--color-sat2: 80%;
	--color-lum2: 6%;
	background: url(/img/bg1.png), linear-gradient(hsl(var(--color-fondo), var(--color-sat1), var(--color-lum1)), hsl(var(--color-fondo), var(--color-sat2), var(--color-lum2)));
}

div#tablaFiltro:last-child {
    animation: fadein .5s ease;
}



/* ##### FILTROS |  ##########################################################################*/

#listaFiltro .altura {
	max-height: 110px;
}

#listaFiltro .altura2 {
	max-height: 220px;
}

#listaFiltro .clickeable div {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: .9rem;
}

#indicator_list_content_0aaaaaaa-bbbb-cccc-dddd-eeeeeeeeeeee_ #listaFiltro .clickeable div {
	padding: 10px;
}

#listaFiltro .tit {
	padding: 6px 10px;
	background-color: var(--clr-neutro-1);
	border-radius: 6px 6px 0 0;
	font-weight: 600;
}

#listaFiltro ul {
	list-style: none;
	padding: 0;
}

#listaFiltro li {
	background: var(--clr-princ-00);
	margin-bottom: 1px;
	margin-right: 6px;
	font-size: .8rem;
	border-radius: 4px;
	user-select: none;
	transition: background .2s ease;
}

#listaFiltro li.active {
	background: var(--clr-princ-1) !important;
}

#listaFiltro li div {
	padding: 6px 8px;
}

#listaFiltro li:hover {
	background: var(--clr-princ-1);
}

#listaFiltro i {
	width: 30px;
	padding-left: 4px;
}


/* listaFiltro | mostrar subcategorias */

#listaFiltro .cont-oculto {
	display: none;
	list-style-type: none;
	margin-top: 4px;
	margin-left: 8px;
	padding-bottom: 4px;

}

.cont-oculto .item {
	filter: brightness(1.2);
	border-left: 2px solid var(--clr-neutro-5);
}

#listaFiltro .clickeable {
	cursor: pointer;
	position: relative;
}

#listaFiltro .clickeable::after {
	content: "\f0d7";
    	font-family: 'FontAwesome';
	background-repeat: no-repeat;
	background-size: contain;
	color: white;
	opacity: .4;
	position: absolute;
	top: 20px;
	right: 6px;
	width: 8px;
	height: 8px;
	z-index: 1;
}




.sectorTit {
	/* titulo celeste con icono */
	width: 100%;
	max-height: 48px;
	border-radius: 0 6px 6px 0;
	padding: 6px 10px;
	line-height: 1.2rem;
	background-color: var(--clr-princ-0);
	overflow: hidden;
	text-overflow: ellipsis;
}

#cuadroTexto {
	height: auto;
	Width: 100%;
	opacity: 0;
	transition: opacity 0.5s;
	padding: 10px;
	overflow-wrap: break-word;
	
	/*& .respuesta_dinamica_nueva {*/
		/*display: flex;*/
		/*flex-direction: column;*/

		& .aglo_datosgeneral {
			width: 75%;
			/*margin: 10px auto;
    			min-width: 300px;*/
			position: absolute;
			display: block;
		        top: 0;
		        right: 0;
			transition: transform .5s ease, opacity .5s ease;
			padding: 9px 0;
		        background-image: linear-gradient(180deg, #1f2b3f5c, #2f3b4f94);
			backdrop-filter: blur(7px);
		        border-radius: 6px 0 6px 0;
			cursor: pointer;

			& > div {
				cursor: inherit;
			}

			& .pais {
				font-size: .8rem;
				float: left;
				text-transform: uppercase;
		        	color: var(--clr-princ-4);
			}
	
			& .pais:before {
				content: "pais";
				font-size: 10px;
			}
		}
		
		& .aglo_clusterDraw {
			display: flex;
			justify-content: center;
			align-items: center;
        		height: 100%;
			position: relative;
			transition: opacity .4s ease;
    			transition-delay: 0;
			
			& svg {
				height: 500px;
				opacity: .9;
			}
		}
	/*}*/
}

.aglo_clusterDraw:hover {
	/*& .aglo_datosgeneral {
	    opacity: 0;
	    transform: translateY(-30px);
	    pointer-events: none;
	}*/
	& svg {
		opacity: 1 !important;
	}
}

.clrRes3 {
	color: var(--clr-resal-4c);
}

.icono-32 {
	filter: brightness(10);
	width: 32px;
}

.winfo-title h5 {
	font-size: 16px;
}

#shpName h5 {
	font-size: 15px;
}

.datosCol>div {
	flex: 1;
}

.datoCol1 {
	background-color: var(--clr-princ-0);
	padding: 10px 12px;
	border-bottom: 1px solid #ffffff33;
	display: flex;
	flex-direction: column;
	color: white;
	user-select: none;
	transition: background-color 0.5s ease;

	&:hover {
		filter: brightness(1.2);
	}

	& .tit {
		flex: 1;
		display: flex;
		align-items: center;
		font-size: 1.3rem;
	}

	& .fila {
		display: flex;
		align-items: flex-start;
		gap: 6px;
	}

	& .cifra {
		text-align: right;
		font-size: 1.6rem;
		font-weight: 600;
		display: flex;
		flex-direction: column;
	}

	& .pie {
		margin-top: 6px;
		text-align: right;
		font-size: 1.0rem;
		color: var(--clr-princ-2);
	}

	& .variacion {
		text-align: right;
		font-size: 1.0rem;
		margin-left: 6px;
		color: var(--clr-princ-4);
	}

	& .tit img {
		margin-right: 10px;
	}

	&:first-of-type {
		border-radius: 6px 6px 0 0;
	}

	&:last-of-type {
		border-radius: 0 0 6px 6px;
	}
}


.icono-24 {
	filter: brightness(10);
	width: 24px;
}

.icono-32 {
	filter: brightness(10);
	width: 32px;
}

.cluster_locales_treemap .content {
	padding: 10px;
}

.infoTexto.md2html h1 {
	color: var(--clr-resal-4c);
	margin-bottom: 14px;
}

.infoTexto.md2html h2,
.infoTexto.md2html h3,
.infoTexto.md2html h4 {
	color: var(--clr-resal-4c);
	margin-bottom: 10px;
	font-weight: bold;
}

.md2html a {
	text-decoration: underline;
	color: #bbb;

	&:hover {
		color: #94f3ff;
	}
}

.tematica-home img {
	background: black;
	border-radius: 30px;
}

.tematica-home .title {
	text-align: left;
}


.tematica-home .descripcion {
	text-align: left;
}
