:root {
		--naranja: #dd3703;
		--azul: #314f7f;
		--azul-contraste: #fff;
		--celeste: #4285f4;
		--azul-rgba: 20,60,105;
		--naranja-rgba: 221,51,3;
	}
	.modal .fa-times:hover{ cursor: pointer !important; }

:root{
  --color-azul:#193c69;
  --color-naranja:var(--naranja);
}

/* ------------------ MOBILE FIRST ------------------ */
	.BUSCADOR{ max-width:480px; background:#fff; padding:5px; border-radius:45px; display:flex; flex-wrap:wrap; gap:5px; }
	.BUSCADOR [class^="col"]{padding-inline:5px; }
	.BUSCADOR i.icono{font-size:20px;width:24px; text-align: center; }

	.labelFechas, .labelCiudad, .BUSCADOR select{ line-height:1; color:var(--color-azul); font:500 16px/1 var(--font-family,inherit); }

	.BUSCADOR button{ background:var(--color-naranja); display:inline-block; padding:0 15px; min-width:30px;  height:30px; border-radius:45px; }
	.BUSCADOR button .labelBuscar{display:none;}

/* Formato fecha */
	.labelFecha{display:flex;align-items:flex-start;}
	.labelFecha .diaNumero{font-size:36px;line-height:1em;letter-spacing:-0.15rem;margin-right:5px; transform:translateY(-2px);}
	.labelFecha p{ line-height: 0.8; font-style:italic; font-size:14px; letter-spacing:.025em; padding-left:5px; margin:0; text-align:left;}
	.labelFecha p.mesNombre{font-weight:500;}
	.labelFecha p.diaNombre{transform:translateY(2px);}

	.modal .modal-title .labelFechas .col-auto{padding-inline:5px;}
	.modal .tituloAlojamiento{ background: var(--azul); color: white; text-align: center; padding-block: 15px; margin: -15px -15px 15px -15px; font-size: 22px;}

/* ------------------ BREAKPOINTS ------------------ */
	@media(max-width:400px){
	  body:not(.home) .BUSCADOR i.icono{display:none;width:23px;}
	  body:not(.home) .BUSCADOR .labelCiudad .col-auto{padding-left:0;}
	}

	@media(min-width:992px){
		.BUSCADOR{max-width:800px;}
		.labelFechas{ min-width: 275px; }
		body.detalle-apartamento .BUSCADOR{max-width:460px;}
		.BUSCADOR i.icono{font-size:25px;}
		.BUSCADOR :is(select, .labelSinFecha){font-size:22px; line-height: 1em; }
		.BUSCADOR button{ font-size:20px; height:40px; white-space:nowrap; margin-right:-5px;}
		.BUSCADOR button .labelBuscar{display:inline-block;}
	}

/* ------------------ HERO ------------------ */
	#HERO{--altoBuscador:60px;}
	
	#HERO .BUSCADOR i.icono{font-size:25px;width:30px; display: flex }
	#HERO :is(select, .labelSinFecha){font-size:25px; display: flex; }
	#HERO .BUSCADOR button{ font-size:25px; min-width:100%; height:var(--altoBuscador); margin-right:0; }
	#HERO button .labelBuscar{display:inline-block; line-height: 1em}

	@media(max-width:992px){
		#HERO .BUSCADOR{border-radius:10px;padding:10px;}
		#HERO .BUSCADOR > .col-auto{width:100%;margin-bottom:10px;}
		#HERO :is(.labelFechas, .labelCiudad){outline:1px solid #CCC;border-radius:4px; height:var(--altoBuscador);line-height:var(--altoBuscador); }
	}
	
	#contenedorBuscadorInteriores{ background: var(--azul); position:sticky; top:0; z-index: 2; padding:0}
	#contenedorBuscadorInteriores .container-fluid{ background: rgba(0,0,0,0.1);  padding-top:15px; padding-bottom: 20px;}
/* ------------------ ESPECÍFICOS ------------------ */

	body.detalle-apartamento #contenedorBuscadorInteriores{ top:48px;}
	body.detalle-apartamento .BUSCADOR button{ font-size:20px; height:40px; white-space:nowrap; margin-right:-5px; }
	body.apartamentos-resultados .labelSinFecha{font-size:14px;border:1px solid red;}
		
		

		


	/*  MODAL CALENDARIO*/
		body.modal-blur .main-content{
			filter: blur(4px);
			transition: filter 0.3s ease;
		}
		
		#modalCalendario { z-index:999999999999999 !important; }
		#modalCalendario .modal-dialog{ width: 100%; min-width: 360px; max-width: 400px; margin: auto auto; }
		#modalCalendario .modal-header{ height: 60px;}
		#modalCalendario .modal-body{ max-height: calc(100vh - 195px) !important; overflow: auto }

		@media(max-width: 440px){
			#modalCalendario .modal-body{padding-inline: 0;}
		}
		@media(min-width: 768px){
			#modalCalendario .modal-dialog{ width: 100%; min-width: 760px; max-width: 760px; }
			#modalCalendario .modal-body{ min-height: 480px !important; }
		}
		#modalCalendario .botonBuscar{  background: #eee; color: #999; text-align: center; padding: 15px 25px; font-size: 20px !important;  border-radius: 30px;  }
		#modalCalendario .botonBuscar.enabled{ background: var(--naranja); color: #fff; }
		#modalCalendario .botonBuscar .fal{ font-size: 18px; transform: translateY(-2px)}

	/*  CALENDARIO	(AJAX) */
		#CALENDARIO *{ color: var(--azul); }
		#CALENDARIO .cada-mes{ width: 350px !important; margin: auto auto !important; }
		#CALENDARIO .nombresDias .col{ background: #f4f4f4; padding:8px 0 8px 0; line-height: 1em; width:50px; max-width:50px; }
		
		#CALENDARIO .col.dia{ width:50px; max-width:50px; height: 60px; }
		#CALENDARIO .col.dia p{padding:0; margin:0;}
		#CALENDARIO .col.dia p.numeroDia{ font-weight: 600; font-size:22px; line-height: 35px; }
		#CALENDARIO .col.dia .precioDia{ 
			font-weight: normal; font-size:12px; position:absolute; bottom: 10px; width: calc(100% - 5px); text-align: center; line-height: 1em; 
		}

		#CALENDARIO .fecha-no-disponible .numeroDia{ color: #bbb; }
		#CALENDARIO :is(.fecha-no-disponible, .fecha-disponible) .col{ width: 50px; height: 50px; border-radius: 10px; border:2px solid white }
		#CALENDARIO .fecha-no-disponible .col {color: #eee; background: #F1F1F1;   }
		#CALENDARIO .fecha-no-disponible div:not(.bgEstanciaFijada) > .numeroDia {
			text-decoration: line-through; text-decoration-color: #bbb; 
		}
		#CALENDARIO .fecha-disponible .col{ background: rgba(85, 118, 168, 0.2);  }
		#CALENDARIO .fecha-disponible .col:hover{ cursor: pointer; background: rgba(85, 118, 168, 0.6); }
		#CALENDARIO .fecha-disponible .col:hover p{ color:#fff }

		#CALENDARIO .fecha-disponible.hoy .col{ border: 1px solid var(--azul); }
		#CALENDARIO .fecha-disponible.fecha-seleccionada .col{ background: var(--azul); }
		#CALENDARIO .fecha-disponible.fecha-seleccionada .col .numeroDia{ font-size:22px; line-height: 35px !important;transform:translateY(-3px)  }
		#CALENDARIO .fecha-disponible.fecha-seleccionada .col .precioDia{ color: #fff; }
		#CALENDARIO .fecha-disponible.fecha-seleccionada.fecha-entrada .col{ 
			width: 50px;
			height: 50px;
			background-color: #193c69; /* Color azul del botón */
			color: white; /* Color del texto */
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 16px;
			font-weight: bold;
			border-radius: 10px; /* Bordes redondeados */
			clip-path: polygon(0% 0, 70% 0, 100% 50%, 70% 100%, 0% 100%, 0% 50%);
		}
		#CALENDARIO .fecha-disponible.fecha-seleccionada.fecha-salida .col{ 
			width: 50px;
			height: 50px;
			background-color: #193c69; /* Color azul del botón */
			color: white; /* Color del texto */
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 16px;
			font-weight: bold;
			border-radius: 10px; /* Bordes redondeados */
			clip-path: polygon(100% 0, 30% 0, 0% 50%, 30% 100%, 100% 100%, 100% 50%);

		}
		#CALENDARIO .fecha-disponible.fecha-seleccionada p{ color: #fff !important; }
				
		.bgEstanciaFijada,
		.bgEstanciaDisponible:not(.fecha-salida) .col{ background: rgba(85, 118, 168, 0.6) !important;  }

		.bgEstanciaFijada p,
		.bgEstanciaDisponible:not(.fecha-salida) .col p{ color: #fff !important;}
		
		@media(max-width: 768px){
			.swiper-button-prev,
			.swiper-button-next{ visibility: hidden; }
		}
	
	/* Cambio la posición de las flechas de navegación */
		#CALENDARIO .swiper-button-prev,
		#CALENDARIO .swiper-button-next { width: 18px; height: 30px;  margin:0; position:absolute; top: -2px; background: #fff } 
		#CALENDARIO .swiper-button-prev{ left:0; padding-left:4px; }
		#CALENDARIO .swiper-button-next{ right:0; padding-right:4px;}
	/* Cambio las flechas originales por chevrons de fontawesome. */
		#CALENDARIO .swiper-button-prev:after,
		#CALENDARIO .swiper-button-next:after { content:"" !important; } 
	/* Necesario para el scroll vertical (móviles). */
		#CALENDARIO .swiper{ max-height: 80vh}
		#CALENDARIO .swiper-slide{ height: auto !important; }