.main-menu .main-menu__list > li {
  position: relative;
  padding-top: 40px;
  padding-bottom: 40px;
}

.cv_pagina{
	text-align: justify;
	font-size: 12px;
	color: #666;
}
.cv_pagina p{
	margin: 5px 0;
	line-height: 1.4;
	white-space: normal;
	color: #666;
}
.cv_pagina ul{
	margin:0;
	line-height:1.2;
	white-space:normal;
	margin-bottom:3px;
	color: #666;
}

.cv_pagina li{
	margin:0;
	line-height:1.4;
	white-space:normal;
	margin:0;
	margin-bottom:2px;
	color: #666;
	font-size: 12px;
}

.cv_nombre{
    display: block;
    font-size: 10px;
    text-align: center;
}

.cv_pagina h1{
	font-size:12px;
	white-space:normal;
	margin:0;
	font-weight: bold;
	color: #666;
}


.analisis{
	flex: 0 0 auto;
	width: 75%;
	
	min-height: 400px;
    margin-top: 80px;
    padding: 30px 40px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    font-family: 'Georgia', 'Times New Roman', serif;
    line-height: 1.6;
}

.analisis h1{
	font-size: 1.2em;
}

.ranking_grafico{
	width:50%; 
	height:auto; 
	min-height:300px; 
	padding:10px; 
	border:1px solid lightgrey;
}

.ranking_anio{
	font-size: 18px;
	text-align: center;
	font-weight: bold;
}




/* btn_anio */
.btn_anio {
	display: inline-flex;
	align-items: center;
	gap: 28px;
	position: relative;
	overflow: hidden;
	vertical-align: middle;
	-webkit-appearance: none;
	border: none;
	outline: none !important;
	padding: 10px 10px;
	font-family: "Montserrat", sans-serif;
	text-align: center;
	font-size: 15px;
	font-weight: 600;
	color: #ffffff;
	line-height: 1;
	background-color: #0077BC;
	z-index: 1;
	margin: 5px;
}

.btn_anio[disabled],
.btn_anio[disabled]:hover,
.btn_anio[disabled]:focus,
.btn_anio[disabled]:active {
	opacity: 0.5;
	cursor: not-allowed;
	pointer-events: none; /* 🔹 evita que dispare hover o clic */
	background-color: #ccc !important; /* opcional: color neutro */
	color: #666 !important; /* opcional: texto gris */
}

.btn_anio:hover {
	cursor: pointer;
	background-color: cadetblue;
}

.btn_anio.active {
	background-color: darkorange;
}


/* btn_zona */
.btn_zona {
	display: inline-flex;
	align-items: center;
	gap: 28px;
	position: relative;
	overflow: hidden;
	vertical-align: middle;
	-webkit-appearance: none;
	border: none;
	outline: none !important;
	padding: 4px;
	font-family: "Montserrat", sans-serif;
	text-align: center;
	font-size: 12px;
	color: grey;
	background-color: white;
	z-index: 1;
}

.btn_zona:hover {
	cursor: pointer;
	color: white;
	background-color: grey;
}

.btn_zona.active {
	font-weight: 600;
	color: white;
	background-color: darkorange;
	padding: 4px 10px;
}


/* btn_vista */
.btn_vista {
	display: inline-flex;
	align-items: center;
	gap: 28px;
	position: relative;
	overflow: hidden;
	vertical-align: middle;
	-webkit-appearance: none;
	border: none;
	outline: none !important;
	padding: 6px 8px;
	font-family: "Montserrat", sans-serif;
	text-align: center;
	font-size: 12px;
	color: grey;
	background-color: white;
	z-index: 1;
}

.btn_vista:hover {
	cursor: pointer;
	color: black
}

.btn_vista.active {
	background-color: #ededed;
	font-weight: bold;
	color: #2B2B5E;
}

@media (max-width: 430px) {
  .btn_anio {
    font-size: 14px;
  }
}


/* btn_dominio */
.btn_dominio {
	padding: 		7px 10px;
	font-family: 	"Montserrat", sans-serif;
	text-align: 	left;
	font-size: 		12px;
	font-weight: 	600;
	color: 			#565656;
	line-height: 	1;
	z-index: 		1;
	margin: 		2px;
}

.btn_dominio:hover {
	cursor: pointer;
	background-color: lightgrey;
}

.btn_dominio.active {
	background-color: darkorange;
	color: white;
}


/* btn_lateral */
.btn_lateral {
	padding: 2px 10px;
	font-family: "Montserrat", sans-serif;
	text-align: left;
	font-size: 10px;
	color: darkgrey;
	line-height: 1;
	z-index: 1;
	margin: 3px;
}

.btn_lateral:hover {
	cursor: pointer;
	background-color: grey;
	color: white;
}

.btn_lateral.active {
	background-color: darkorange;
	color: white;
	padding: 5px 10px;
}


/* btn_region */
.btn_region {
	padding: 3px 10px;
	font-family: "Montserrat", sans-serif;
	text-align: left;
	font-size: 12px;
	font-weight: 600;
	color: darkgrey;
	line-height: 1;
	z-index: 1;
	margin: 3px;
}

.btn_region:hover {
	cursor: pointer;
	background-color: lightgrey;
}

.btn_region.active {
	background-color: darkorange;
	color: white;
}


/* btn_tipo */
.btn_tipo {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	position: relative;
	overflow: hidden;
	vertical-align: middle;
	-webkit-appearance: none;
	border: 1px solid #d0d0d0;
	outline: none !important;
	padding: 8px 12px;
	border-radius: 8px;
	font-family: "Montserrat", sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: #333;
	line-height: 1.2;
	background: #f9f9f9;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
	cursor: pointer;
	transition: all 0.25s ease;
	margin: 5px;
	z-index: 1;
}

.btn_tipo:hover {
	cursor: pointer;
	background-color: lightgrey;
}

.btn_tipo.active {
	background-color: darkorange;
	color: white;
}


@media screen and (min-width: 601px) {
  .bt_login {
	margin: 	5px 0;
	width:		100%;
    font-size: 	13px;
  }
  
  .logo_oferta {
	  width:	150px;
  }
  
  .subBusqueda {
	  font-size: 	20px;
	  font-weight:	bold;
  }
  
  .resultado {
	margin:		30px 0;
	width:		100%; 
	display:	table;
  }
  
  .resultado_mobile {
	  display: 		none;
  }
  
  .foto_detalle {
	  width:	50%
  }
  
  .aplicaciones_detalle {
	  width:	50%;
  }
}


@media screen and (max-width: 600px) {
  .bt_login {
	margin: 	2px 0;
	width:		100%;
    font-size: 	10px;
  }
  
  .logo_oferta {
	  width: 100px;
  }
  
  .subBusqueda {
	  font-size: 	16px;
	  font-weight:	bold;
  }
  
  .resultado {
	  display: 		none;
  }
  
  .resultado_mobile {
	  margin:		30px 0;
	  width:		100%; 
	  display:		table;
  }
  
  .foto_detalle {
	  width:	100%;
  }
  
  .aplicaciones_detalle {
	  width:	100%;
  }
  
  .ul {
	  padding-inline-start: 15px
  }
}



.iframe-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.7);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.iframe-wrapper {
  position: relative;
  width: 90%;
  height: 90%;
  background: white;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  overflow: hidden;
}

.iframe-wrapper iframe {
  width: 100%;
  height: 100%;
}

.close-btn {
  position: absolute;
  top: 8px;
  right: 10px;
  background: red;
  color: white;
  border: none;
  padding: 5px 10px;
  font-size: 18px;
  border-radius: 5px;
  cursor: pointer;
}


.cajaCentral {
	display: flex; 
	flex-wrap: wrap; 
	justify-content: space-between; 
	margin-bottom: 20px; 
	border: 1px solid lightgray; 
	padding:20px 20px 0;
}


.svg-container svg {
	width: 100%;
	height: auto;
	display: block;
}


.vcCajasDashboard{
	text-align: center; 
	margin: 0 auto; 
	display: table; 
}

.vcCajaDash{
	border: 1px solid grey;  
	display: block; 
	float: left; 
	min-width: 120px; 
	margin: 5px; 
	color: white
}

.vcCajaDash.gris{
	background: #a9a9a9;
}

.vcCajaDash.rosa{
	background: orchid;
}

.vcCajaDash.turquesa{
	background: #44b6ae;
}

.vcCajaDash.lila{
	background: #8775a7;
}

.vcCajaDash.rojo{
	background: #e35b5a;
}

.vcCajaDash.negro{
	background: #405763;
}

.vcCajaDash .cont{
	font-size: 24px; 
	padding: 8px;
}

.vcCajaDash .pie{
	font-size: 11px; 
	background: #00000040;
	padding: 2px;
    line-height: 1;
    height: 28px;
}


.cajaCentroGasto {
    width: 100%;
    padding: 20px;
    background: #ededed;
	min-height: 200px
}





path.activo {
  stroke: #000;
  stroke-width: 1.2;
  filter: brightness(1.2);
  transition: all 0.2s ease;
}

path.activo_new {
  fill: white !important; /* amarillo dorado, o el color que prefieras */
  stroke: #222 !important;
  stroke-width: 1.5;
  filter: drop-shadow(0 0 3px rgba(0,0,0,0.5));
  transition: fill 0.2s ease;
}

path:hover {
  filter: brightness(1.4);
  cursor: pointer;
}



path {
  fill: var(--color-apagado, #e0e0e0);
  stroke: #888;              /* 🔹 más oscuro que #aaa */
  stroke-width: 0.7;
  cursor: pointer;
  transition: fill 0.25s ease, stroke 0.25s ease, stroke-width 0.25s ease;
}

path:hover {
  fill: var(--color-hover, #bbb);
  stroke: #333;              /* 🔹 más contraste al pasar el mouse */
  stroke-width: 1;
}

path.activo {
  fill: var(--color-activo, #999);
  stroke: #222;              /* 🔹 borde firme cuando está activo */
  stroke-width: 1.3;
  filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.4));
}



/* === Menú móvil Observatorio === */

.mobile-sidebar {
	position: fixed;
	top: 0;
	right: -100%;
	width: 250px;
	height: 100%;
	background: #fafafa;
	box-shadow: -2px 0 8px rgba(0,0,0,0.3);
	transition: right 0.3s ease;
	z-index: 99999;
	padding: 20px;
	overflow-y: auto;
}

.mobile-sidebar.open {
	right: 0;
}

.mobile-nav__btn {
	cursor: pointer;
	display: none;
	flex-direction: column;
	justify-content: space-between;
	width: 25px;
	height: 18px;
}

.mobile-nav__btn span {
	display: block;
	height: 3px;
	background: #333;
	border-radius: 2px;
}

@media (max-width: 991px) {
	.main-menu {
		display: none !important;
	}
	.mobile-nav__btn {
		display: flex;
	}
}