/* Global mobile booking bar. Kept separate so page-specific responsive CSS loads last. */
.voh-site-booking-bar {
	display: none;
}

html.voh-has-homepage,
body.voh-has-homepage {
		height: auto !important;
		min-height: 0 !important;
		margin-bottom: 0 !important;
		padding-bottom: 0 !important;
}

body.voh-has-homepage .voh-homepage-tail {
		display: none !important;
		height: 0 !important;
		min-height: 0 !important;
		max-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		overflow: hidden !important;
}

body.voh-has-homepage .voh-homepage-branch {
	height: auto !important;
	min-height: 0 !important;
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
	margin-block-end: 0 !important;
	padding-block-end: 0 !important;
	flex-grow: 0 !important;
}

html.voh-has-homepage::after,
body.voh-has-homepage::after,
body.voh-has-homepage .voh-homepage-branch::after {
	display: none !important;
	content: none !important;
}

@media (max-width: 767px) {
	.voh-site-booking-bar {
		position: fixed;
		z-index: 999900;
		right: 0;
		bottom: 0;
		left: 0;
		display: grid;
		grid-template-columns: minmax(72px, .72fr) minmax(100px, .95fr) minmax(108px, 1.05fr);
		align-items: center;
		gap: 7px;
		width: 100%;
		min-height: calc(78px + env(safe-area-inset-bottom));
		padding: 9px 10px calc(9px + env(safe-area-inset-bottom));
		border-top: 1px solid rgba(6, 29, 49, .14);
		background: rgba(244, 239, 230, .97);
		box-shadow: 0 -12px 36px rgba(6, 29, 49, .13);
		-webkit-backdrop-filter: blur(14px) saturate(140%);
		backdrop-filter: blur(14px) saturate(140%);
		font-family: "VO Instrument Sans", "Helvetica Neue", Arial, sans-serif;
	}

	.voh-site-booking-bar :where(a) {
		width: 100%;
		min-width: 0;
		min-height: 50px;
		margin: 0 !important;
		padding: 0 7px !important;
		border-radius: 999px !important;
		box-shadow: none !important;
		text-decoration: none !important;
	}

	.voh-site-booking-bar .jlvb-mobile-booking-bar__enquiry {
		display: flex;
		align-items: center;
		justify-content: center;
		border: 1px solid rgba(6, 29, 49, .18);
		color: #061d31 !important;
		font-size: 13px !important;
		font-weight: 650;
		line-height: 1.1;
		text-align: center;
	}

	.voh-site-booking-bar .jlvb-mobile-booking-bar__price {
		display: grid;
		grid-template-columns: auto auto;
		align-content: center;
		justify-content: center;
		gap: 0 3px;
		color: #061d31 !important;
		text-align: center;
	}

	.voh-site-booking-bar .jlvb-mobile-booking-bar__price strong {
		font-size: 17px !important;
		font-weight: 750;
		white-space: nowrap;
	}

	.voh-site-booking-bar .jlvb-mobile-booking-bar__price span,
	.voh-site-booking-bar .jlvb-mobile-booking-bar__price small {
		font-size: 12px !important;
		white-space: nowrap;
	}

	.voh-site-booking-bar .jlvb-mobile-booking-bar__price small {
		grid-column: 1 / -1;
		text-decoration: underline;
		text-underline-offset: 2px;
	}

	.voh-site-booking-bar .jlvb-mobile-booking-bar__open {
		display: flex;
		align-items: center;
		justify-content: center;
		border: 0 !important;
		color: #fff !important;
		background: linear-gradient(135deg, #0d4f7c, #061d31) !important;
		font-size: 13px !important;
		font-weight: 750;
		text-align: center;
	}

	body:has([data-jlvb-mobile-booking-bar]:not([data-voh-global-booking-bar])) .voh-site-booking-bar,
	body:has([data-voc-checkout]) .voh-site-booking-bar {
		display: none !important;
	}

	html:has(.voh-homepage),
	body:has(.voh-homepage),
	body:has(.voh-homepage) :where(#page, #content, #primary, #main, .site, .site-content, .content-area, .site-main, .page-content, .entry-content, .elementor, .elementor-section-wrap) {
		height: auto !important;
		min-height: 0 !important;
		margin-bottom: 0 !important;
		padding-bottom: 0 !important;
	}

	body:has(.voh-homepage) :where(#site-footer, #colophon, .site-footer, .elementor-location-footer) {
		display: none !important;
		height: 0 !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow: hidden !important;
	}

	/* The homepage widget contains its own footer: collapse every outer wrapper
	 * and remove only Elementor siblings placed after the complete widget. */
	body:has(.voh-homepage) :where(.elementor-element, .e-con, .elementor-container, .elementor-column, .elementor-column-wrap, .elementor-widget-wrap):has(.voh-homepage) {
		height: auto !important;
		min-height: 0 !important;
		margin-bottom: 0 !important;
		padding-bottom: 0 !important;
		flex-grow: 0 !important;
	}

	body:has(.voh-homepage) .elementor-element:has(.voh-homepage) ~ .elementor-element,
	body:has(.voh-homepage) .elementor-widget-villa-olivia-hero ~ *,
	body:has(.voh-homepage) .elementor-section-wrap > *:has(.voh-homepage) ~ * {
		display: none !important;
		height: 0 !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow: hidden !important;
	}

	body:has(.voh-homepage) :where(.site-footer-wrap, .footer-wrap, footer[role="contentinfo"]) {
		display: none !important;
	}
}