/**
 * Booking Pylot – fast spinner for Date & Time step only.
 *
 * Size/color are driven by CSS variables so Elementor Style → Loader
 * controls still work when this file is printed late in the footer.
 *   --bp-loader-size   (default 32px)
 *   --bp-loader-color  / --bp-gl-yellow  (primary / spin color)
 *   --bp-loader-track  (default / track color)
 *
 * BookingPress defaults the SVG fill to --bpa-pt-main-green (#12D488).
 * That green is overridden here so the calendar loader never shows green.
 */

.bpa-frontend-main-container .bpa-front-module--date-and-time {
	position: relative;
	--bp-loader-color: var(--bp-gl-yellow, #f5c400);
	--bp-loader-track: #e6e6e6;
	--bp-loader-size: 32px;
}

.bpa-frontend-main-container .bpa-front-module--date-and-time > .bpa-full-container-loader {
	display: flex !important;
	align-items: center;
	justify-content: center;
	position: absolute;
	inset: 0;
	z-index: 12;
	min-height: 180px;
	background: rgba(255, 255, 255, 0.82) !important;
	visibility: visible !important;
	opacity: 1 !important;
	pointer-events: auto !important;
}

/* Current Day Booking uses one whole-widget spinner — never show the datetime module loader there. */
.bp-current-day-booking .bpa-frontend-main-container .bpa-front-module--date-and-time > .bpa-full-container-loader,
.bp-current-day-booking .bpa-frontend-main-container .bpa-front-loader-container,
.bp-current-day-booking .bpa-frontend-main-container .bpa-front-loader {
	display: none !important;
	visibility: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

.bpa-frontend-main-container .bpa-front-module--date-and-time > .bpa-full-container-loader .bpa-front-loader-container {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: calc(var(--bp-loader-size, 32px) + 12px) !important;
	height: calc(var(--bp-loader-size, 32px) + 12px) !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	visibility: visible !important;
	opacity: 1 !important;
	pointer-events: none !important;
}

.bpa-frontend-main-container .bpa-front-module--date-and-time > .bpa-full-container-loader .bpa-front-loader {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: var(--bp-loader-size, 32px) !important;
	height: var(--bp-loader-size, 32px) !important;
	visibility: visible !important;
	opacity: 1 !important;
}

/* Hide BookingPress green SVG spinner; CSS ring below replaces it. */
.bpa-frontend-main-container .bpa-front-module--date-and-time > .bpa-full-container-loader .bpa-front-loader svg {
	display: none !important;
}

/* Kill BookingPress green fill even if the SVG flashes before hide rules apply. */
.bpa-frontend-main-container .bpa-front-module--date-and-time .bpa-front-loader .bpa-front-loader-cl-primary,
.bpa-frontend-main-container .bpa-front-loader .bpa-front-loader-cl-primary {
	fill: var(--bp-loader-color, var(--bp-gl-yellow, #f5c400)) !important;
}

.bpa-frontend-main-container .bpa-front-module--date-and-time > .bpa-full-container-loader .bpa-front-loader::after {
	content: '';
	display: block;
	width: var(--bp-loader-size, 32px);
	height: var(--bp-loader-size, 32px);
	border: 3px solid var(--bp-loader-track, #e6e6e6);
	border-top-color: var(--bp-loader-color, var(--bp-gl-yellow, #f5c400)) !important;
	border-radius: 50%;
	animation: bp-gl-datetime-spin 0.5s linear infinite;
	box-sizing: border-box;
}

@keyframes bp-gl-datetime-spin {
	to {
		transform: rotate(360deg);
	}
}
