/*=============================================
VARIABLES CSS (heredadas de style.css)
=============================================*/

/*=============================================
INFO-RESERVAS
=============================================*/

.infoReservas{
	position: relative;
	margin-top:-20px;
}

.infoReservas .colIzqReservas{
	position:relative;
	margin-top:-170px;
}


.colIzqReservas button{
	border-radius: var(--border-radius);
	background: linear-gradient(135deg, var(--bg-dark) 0%, #333 100%);
	color:white;
	border: none;
	transition: var(--transition-fast);
	box-shadow: var(--shadow-md);
	font-weight: 500;
}

.colIzqReservas button:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-lg);
	background: linear-gradient(135deg, #333 0%, var(--bg-dark) 100%);
}

.colDerReservas{
	transition: var(--transition-smooth);
	border-radius: var(--border-radius-lg);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
}

.colDerReservas:hover {
	box-shadow: var(--shadow-md);
}

/*=============================================
TABLET VERTICAL (MD revisamos en 768px hacia abajo)
=============================================*/

@media (max-width:768px){

	.infoReservas .colIzqReservas .cabeceraReservas{
		background: black;
	}

	.infoReservas .colIzqReservas .cabeceraReservas h1{
		font-size:20px;
	}

	.infoReservas .colIzqReservas .calendarioReservas h1{
		font-size:16px;
	}

	.infoReservas .colIzqReservas .calendarioReservas ul li{
		font-size:14px;
	}
	

}