/* Container principal - full-width */
.plugin-container{
	margin: 0 auto;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

/* Ttulo principal - alinhado  esquerda */
.plugin-container h3{
	font-family: "Times New Roman", Times, serif;
	text-transform: uppercase;
	font-weight: normal;
	letter-spacing: 1px;
	font-size: 24px;
	margin-top: 0;
	margin-bottom: 25px;
	color: #222;
	text-align: left;
	display: none;
}

/* Controles de disponibilidade */
.vbo-availability-controls{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 30px;
	padding: 20px;
	background-color: #fff;
	border: 1px solid #e2e2e2;
}

/* Formulrio de seleo de ms */
.vbo-availability-controls form{
	margin: 0;
}

.vbo-availability-controls select{
	height: 50px;
	padding: 0 15px;
	border: 1px solid #e2e2e2;
	background-color: #fff;
	color: #333;
	font-size: 16px;
	border-radius: 0;
	cursor: pointer;
	min-width: 200px;
}

.vbo-availability-controls select:focus{
	outline: none;
	border-color: #253F2A;
}

/* Legenda */
.vblegendediv{
	display: flex;
	align-items: center;
	gap: 25px;
}

.vblegenda{
	display: flex;
	align-items: center;
	gap: 8px;
}

.vblegenda-status{
	width: 20px;
	height: 20px;
	border: 1px solid #e2e2e2;
	display: inline-block;
}

.vblegfree{
	background-color: #8bc34a;
}

.vblegbusy{
	background-color: #e57373;
}

.vblegenda-lbl{
	color: #555;
	font-size: 14px;
}

/* Wrapper de disponibilidade */
.vbo-availability-wrapper{
	background-color: #fff;
	border: 1px solid #e2e2e2;
	padding: 35px;
	margin-bottom: 40px;
}

/* Container do quarto */
.vbo-availability-room-container{
	display: flex;
	flex-direction: column;
	gap: 30px;
}

/* Detalhes do quarto */
.vbo-availability-room-details{
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	gap: 30px;
	padding-bottom: 30px;
	border-bottom: 1px solid #e2e2e2;
}

.vbo-availability-room-details-first{
	display: flex;
	gap: 30px;
	flex: 1;
}

.vbo-availability-room-details-left{
	width: 200px;
	flex-shrink: 0;
}

.vbo-availability-room-details-left img{
	width: 100%;
	height: auto;
	border: 1px solid #e2e2e2;
}

.vbo-availability-room-details-right{
	flex: 1;
}

.vbo-availability-room-details-right h4{
	margin: 0 0 15px 0;
	font-size: 22px;
	color: #222;
	font-weight: 600;
}

.vbo-availability-room-details-descr{
	color: #555;
	line-height: 1.7em;
	margin-bottom: 20px;
	font-size: 16px;
}

/* Amenidades do quarto - espaamento reduzido */
.room_carats{
	margin-top: 25px;
}

.vbo-room-carats{
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.vbo-room-carat img{
	width: 35px;
	height: 35px;
	padding: 5px;
	background-color: #f9f9f9;
	border: 1px solid #ededed;
}

/* Ocultar boto de reserva */
.vbo-availability-room-details-last.vbselectr{
	display: none;
}

/* ltima seo - Boto de reserva */
.vbo-availability-room-details-last{
	min-width: 200px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-end;
}

.vbo-availability-room-details-last-inner{
	width: 100%;
}

/* Boto de reserva */
.btn.vbo-pref-color-btn{
	display: flex;
	background-color: #253F2A;
	color: #ffffff !important;
	border: 1px solid #253F2A;
	padding: 0;
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: 0;
	transition: all 0.4s ease-in-out;
	height: 50px;
	align-items: center;
	justify-content: center;
	width: 100%;
	cursor: pointer;
}

/* Boto de reserva (hover) */
.btn.vbo-pref-color-btn:hover{
	opacity: 0.85;
	color: #ffffff !important;
	text-decoration: none;
}

/* Check-in selecionado */
.vbo-availability-room-details-last-checkin{
	margin-top: 15px;
	padding-top: 15px;
	border-top: 1px solid #e2e2e2;
	color: #253F2A;
	font-size: 14px;
	display: none;
}

.vbo-availability-room-details-last-checkin i{
	color: #253F2A;
	margin-right: 5px;
}

/* Indicador visual de scroll horizontal */
.vbo-availability-room-monthcal{
	width: 100%;
	overflow-x: auto;
}

.vbo-availability-room-monthcal table{
	width: 100%;
	border-collapse: collapse;
}

/* Ajuste do calendrio para mobile */
.vbo-availability-month-name{
	font-weight: 600;
	color: #253F2A;
	padding: 15px;
	text-align: left;
	border: 1px solid #e2e2e2;
	background-color: #f9f9f9;
	vertical-align: middle;
	width: 120px;
}

/* Dias do ms */
.vbo-availability-month-day{
	text-align: center;
	padding: 8px 5px;
	border: 1px solid #e2e2e2;
	background-color: #f9f9f9;
	min-width: 35px;
	font-weight: 600;
}

.vbo-availability-daynumber{
	display: block;
	font-size: 15px;
	font-weight: 600;
}

.vbo-availability-weekday{
	display: block;
	font-size: 13px;
	color: #555;
	font-weight: normal;
	margin-top: 2px;
}

/* Clulas ainda menores para telas muito pequenas */
.vbo-availability-room-avdays td{
	text-align: center;
	padding: 5px;
	border: 1px solid #e2e2e2;
	font-weight: 600;
	font-size: 16px;
	height: 35px;
	width: 35px;
	vertical-align: middle;
}

/* Modificado cores mais suaves para clulas e corrigido problema de hover */
.vbo-free-cell{
	cursor: pointer;
}

/* Modificado cores mais suaves para clulas e corrigido problema de hover */
.vbo-free-cell:hover{
	background-color: #8bc34a !important;
}

.vbo-occupied-cell{
	color: #fff !important;
}

.vbo-occupied-cell:hover{
	background-color: #e57373 !important;
}

/* Container para dias disponveis */
.vbo-availability-day-container{
	background-color: transparent !important;
	display: inline-block;
	font-weight: 600;
}

.vbo-partially-cell{
	background-color: #fffaf0;
	color: #e67e22;
	cursor: pointer;
}

.vbo-cell-selected-arrival{
	background-color: #aed581 !important;
	border: 2px solid #253F2A;
}

/* Indicadores de check-in/check-out em mobile */
.vbo-checkinday-cell{
	border-left: 3px solid #253F2A;
}

.vbo-checkoutday-cell{
	border-right: 3px solid #253F2A;
}

/* Plugin container */
#content .page-content .elementor .elementor-element .elementor-widget-shortcode .elementor-widget-container .elementor-shortcode .plugin-container{
	width:100% !important;
}

/* Plugin container */
.elementor-widget-shortcode .elementor-shortcode .plugin-container{
	max-width:none !important;
}

/* Vbo free cell */
.table tbody .vbo-free-cell{
	background-color:rgba(39,174,96,0.40);
}

/* Vbo occupied cell */
.table tbody .vbo-occupied-cell{
	background-color:rgba(231,76,60,0.5);
}

/* Vbo availability wrapper */
.page-content .vbo-availability-wrapper{
	padding-left:20px;
	padding-right:20px;
	padding-top:20px;
	padding-bottom:20px;
}

/* 991px and smaller screen sizes */
@media (max-width: 991px){

	/* Controles de disponibilidade */
	.vbo-availability-controls{
		flex-direction: column;
		gap: 20px;
		align-items: flex-start;
	}
	
	.vbo-availability-controls select{
		width: 100%;
	}
	
	/* Legenda */
	.vblegendediv{
		width: 100%;
		justify-content: flex-start;
	}
	
	/* Wrapper de disponibilidade */
	.vbo-availability-wrapper{
		padding: 25px;
	}
	
	/* Detalhes do quarto */
	.vbo-availability-room-details{
		flex-direction: column;
	}
	
	.vbo-availability-room-details-first{
		flex-direction: column;
	}
	
	.vbo-availability-room-details-left{
		width: 100%;
		max-width: 400px;
	}
	
	/* ltima seo - Boto de reserva */
	.vbo-availability-room-details-last{
		width: 100%;
		align-items: stretch;
	}
	
	/* Indicador visual de scroll horizontal */
	.vbo-availability-room-monthcal{
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
	
	.vbo-availability-room-monthcal table{
		min-width: 1000px;
	}
	
}

/* 767px and smaller screen sizes */
@media (max-width: 767px){

	/* Ttulo principal - alinhado  esquerda */
	.plugin-container h3{
		font-size: 20px;
		margin-bottom: 20px;
	}
	
	/* Controles de disponibilidade */
	.vbo-availability-controls{
		padding: 15px;
	}
	
	/* Legenda */
	.vblegendediv{
		gap: 15px;
		flex-wrap: wrap;
	}
	
	/* Wrapper de disponibilidade */
	.vbo-availability-wrapper{
		padding: 20px;
	}
	
	/* Detalhes do quarto */
	.vbo-availability-room-details{
		gap: 20px;
		padding-bottom: 20px;
	}
	
	.vbo-availability-room-details-right h4{
		font-size: 20px;
	}
	
	.vbo-room-carats{
		gap: 5px;
	}
	
	/* Boto de reserva */
	.btn.vbo-pref-color-btn{
		height: 45px;
		font-size: 15px;
	}
	
}

/* 480px and smaller screen sizes */
@media (max-width: 480px){

	/* Ttulo principal - alinhado  esquerda */
	.plugin-container h3{
		font-size: 18px;
		margin-bottom: 15px;
	}
	
	/* Controles de disponibilidade */
	.vbo-availability-controls{
		padding: 12px;
		margin-bottom: 20px;
	}
	
	.vbo-availability-controls select{
		height: 45px;
		font-size: 14px;
	}
	
	.vblegenda{
		gap: 5px;
	}
	
	.vblegenda-status{
		width: 16px;
		height: 16px;
	}
	
	.vblegenda-lbl{
		font-size: 13px;
	}
	
	/* Wrapper de disponibilidade */
	.vbo-availability-wrapper{
		padding: 15px;
	}
	
	/* Container do quarto */
	.vbo-availability-room-container{
		gap: 20px;
	}
	
	/* Detalhes do quarto */
	.vbo-availability-room-details{
		gap: 15px;
		padding-bottom: 15px;
	}
	
	.vbo-availability-room-details-right h4{
		font-size: 18px;
		margin-bottom: 10px;
	}
	
	.vbo-availability-room-details-descr{
		font-size: 14px;
		margin-bottom: 15px;
	}
	
	/* Amenidades do quarto - espaamento reduzido */
	.room_carats{
		margin-top: 15px;
	}
	
	.vbo-room-carat img{
		width: 30px;
		height: 30px;
		padding: 3px;
	}
	
	/* Boto de reserva */
	.btn.vbo-pref-color-btn{
		height: 42px;
		font-size: 14px;
	}
	
	/* Check-in selecionado */
	.vbo-availability-room-details-last-checkin{
		font-size: 13px;
		margin-top: 10px;
		padding-top: 10px;
	}
	
	/* Ajuste do calendrio para mobile */
	.vbo-availability-month-name{
		padding: 10px;
		font-size: 14px;
		width: 80px;
	}
	
	/* Dias do ms */
	.vbo-availability-month-day{
		min-width: 28px;
		padding: 5px 2px;
	}
	
	.vbo-availability-daynumber{
		font-size: 13px;
	}
	
	.vbo-availability-weekday{
		font-size: 11px;
	}
	
	/* Clulas ainda menores para telas muito pequenas */
	.vbo-availability-room-avdays td{
		height: 28px;
		width: 28px;
		font-size: 14px;
		padding: 2px;
	}
	
	/* Indicadores de check-in/check-out em mobile */
	.vbo-checkinday-cell{
		border-left: 2px solid #253F2A;
	}
	
	.vbo-checkoutday-cell{
		border-right: 2px solid #253F2A;
	}
	
	.vbo-availability-room-monthcal table{
		min-width: 900px;
	}
	
	/* Indicador visual de scroll horizontal */
	.vbo-availability-room-monthcal{
		position: relative;
		box-shadow: inset -10px 0 10px -10px rgba(0,0,0,0.1);
	}
	
}

/* 480px and smaller screen sizes */
@media (max-width:480px){

	/* Vbo availability controls */
	.page-content .vbo-availability-controls{
		padding-top:20px;
		padding-bottom:20px;
		padding-left:15px;
		padding-right:15px;
	}
	
	/* Vbo availability wrapper */
	.page-content .vbo-availability-wrapper{
		padding-left:20px;
		padding-right:20px;
		padding-top:20px;
		padding-bottom:20px;
	}
	
	/* Form Division */
	#content .page-content .plugin-container .vbo-availability-controls form{
		width:100% !important;
	}
	
}

/* 360px and smaller screen sizes */
@media (max-width: 360px){

	/* Ttulo principal - alinhado  esquerda */
	.plugin-container h3{
		font-size: 16px;
	}
	
	/* Controles de disponibilidade */
	.vbo-availability-controls{
		padding: 10px;
	}
	
	.vbo-availability-controls select{
		height: 42px;
		min-width: auto;
	}
	
	/* Wrapper de disponibilidade */
	.vbo-availability-wrapper{
		padding: 12px;
	}
	
	.vbo-availability-room-details-left{
		max-width: 100%;
	}
	
	.vbo-availability-room-details-right h4{
		font-size: 16px;
	}
	
	.vbo-availability-room-details-descr{
		font-size: 13px;
	}
	
	.vbo-room-carat img{
		width: 28px;
		height: 28px;
	}
	
	/* Boto de reserva */
	.btn.vbo-pref-color-btn{
		height: 40px;
		font-size: 13px;
	}
	
	/* Clulas ainda menores para telas muito pequenas */
	.vbo-availability-room-avdays td{
		height: 26px;
		width: 26px;
		font-size: 13px;
	}
	
}