/**
 * Light-DOM styling for the Cloudbeds booking widgets.
 *
 * The host elements themselves sit in the normal document, so these rules
 * apply. Anything inside the widget needs muse-booking-widget.js, which
 * injects styles into the shadow root.
 */

cb-property-date-picker,
cb-accommodation-date-picker,
cb-book-now-button {
	display: block;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

/* Optional wrapper for the booking area on property pages. */
.muse-booking-panel {
	width: 100%;
	max-width: 100%;
	overflow-x: hidden;
}

@media (max-width: 767px) {
	cb-property-date-picker,
	cb-accommodation-date-picker,
	cb-book-now-button {
		width: 100% !important;
		max-width: 100% !important;
	}

	/* Stops any stubborn widget forcing horizontal scroll on the page. */
	.muse-booking-panel {
		overflow-x: hidden;
	}
}