/*
 * Floating festival widget (AmoonCore\Frontend\FestivalWidget).
 * A pill fixed to the bottom of the page. All motion is CSS: WP Rocket delays
 * scripts until the first touch, so nothing here may wait for JavaScript.
 * Only transform and opacity animate, apart from the ring and the sweep, which
 * repaint one small pill.
 */

.amoon-festival {
	/* Clear of the mobile navbar (86px tall on phones, 98px on tablets). */
	--amoon-festival-bottom: 98px;
	position: fixed;
	/* Above the call button and navbar (1000), below the chat button (9999)
	   and the full-screen overlays (99990+). */
	z-index: 9980;
	right: 0;
	bottom: var(--amoon-festival-bottom);
	left: 0;
	display: flex;
	justify-content: center;
	padding: 0 12px;
	direction: rtl;
	pointer-events: none;
	animation: amoon-festival-in .85s cubic-bezier(.2, 1.25, .3, 1) 1.2s both;
}

@media (min-width: 768px) {
	.amoon-festival {
		--amoon-festival-bottom: 110px;
	}
}

/* The navbar is hidden from 1024px up; the chat and call buttons hold the corners. */
@media (min-width: 1024px) {
	.amoon-festival {
		--amoon-festival-bottom: 24px;
	}
}

/* Landscape phones and an open on-screen keyboard leave no room for it. */
@media (max-height: 520px) {
	.amoon-festival {
		display: none;
	}
}

.amoon-festival .amoon-festival__link {
	position: relative;
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	max-width: 100%;
	min-height: 54px;
	padding: 8px 10px;
	border: 1.5px solid rgba(243, 212, 137, .8);
	border-radius: 999px;
	background: linear-gradient(115deg, #4e1b59 0%, #8f429a 50%, #4e1b59 100%);
	box-shadow: 0 10px 28px rgba(78, 27, 89, .45), 0 0 18px rgba(216, 166, 70, .35);
	color: #fff;
	font-family: inherit;
	text-decoration: none;
	pointer-events: auto;
	-webkit-tap-highlight-color: transparent;
	transition: transform .25s ease, box-shadow .25s ease;
}

/* The theme and Elementor kit colour links in every state. */
.amoon-festival .amoon-festival__link:link,
.amoon-festival .amoon-festival__link:visited,
.amoon-festival .amoon-festival__link:hover,
.amoon-festival .amoon-festival__link:focus,
.amoon-festival .amoon-festival__link:active {
	color: #fff;
	text-decoration: none;
}

.amoon-festival .amoon-festival__link:hover,
.amoon-festival .amoon-festival__link:focus-visible {
	transform: translateY(-3px) scale(1.03);
	box-shadow: 0 14px 34px rgba(78, 27, 89, .55), 0 0 26px rgba(216, 166, 70, .6);
}

.amoon-festival .amoon-festival__link:focus-visible {
	outline: 3px solid #fff;
	outline-offset: 3px;
}

/* Gold ring that radiates out of the pill and fades. */
.amoon-festival__link::before {
	content: "";
	position: absolute;
	inset: -1.5px;
	border-radius: inherit;
	pointer-events: none;
	animation: amoon-festival-ring 2.6s ease-out 2.1s infinite;
}

/* Light sweep across the pill, then a pause. */
.amoon-festival__link::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	pointer-events: none;
	background: linear-gradient(105deg, transparent 42%, rgba(255, 255, 255, .55) 50%, transparent 58%) 0 0 / 250% 100% no-repeat;
	animation: amoon-festival-shine 4.2s ease-in-out 2.4s infinite;
}

.amoon-festival__icon {
	flex: none;
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: linear-gradient(180deg, #f3d489, #d8a646);
	box-shadow: inset 0 -2px 4px rgba(120, 78, 0, .25), 0 2px 6px rgba(0, 0, 0, .25);
	transform-origin: 50% 60%;
	animation: amoon-festival-wiggle 4.2s ease-in-out 2.4s infinite;
}

.amoon-festival__icon svg {
	width: 22px;
	height: 22px;
	fill: #3b1246;
	overflow: visible;
}

.amoon-festival__spark {
	transform-box: fill-box;
	transform-origin: center;
	animation: amoon-festival-twinkle 1.6s ease-in-out infinite alternate;
}

.amoon-festival__spark--b {
	animation-delay: .8s;
}

.amoon-festival__label {
	flex: 0 1 auto;
	font-size: var(--amoon-fs-ui, .9375rem);
	font-weight: 700;
	line-height: 1.4;
	white-space: nowrap;
	text-shadow: 0 1px 2px rgba(0, 0, 0, .3);
}

.amoon-festival__cta {
	flex: none;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	height: 34px;
	padding: 0 12px;
	border-radius: 999px;
	background: linear-gradient(180deg, #f3d489, #d8a646);
	color: #3b1246;
	font-size: var(--amoon-fs-small, .875rem);
	font-weight: 700;
	line-height: 1;
	text-shadow: none;
}

.amoon-festival__cta svg {
	width: 16px;
	height: 16px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2.6;
	stroke-linecap: round;
	stroke-linejoin: round;
	animation: amoon-festival-nudge 1.4s ease-in-out infinite;
}

/* Very narrow phones: the arrow alone keeps the pill inside the screen. */
@media (max-width: 359px) {
	.amoon-festival__cta {
		padding: 0 9px;
	}

	.amoon-festival__cta-text {
		display: none;
	}
}

@keyframes amoon-festival-in {
	from {
		opacity: 0;
		transform: translateY(160%);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes amoon-festival-ring {
	0% {
		box-shadow: 0 0 0 0 rgba(243, 212, 137, .75);
	}

	70%,
	100% {
		box-shadow: 0 0 0 16px rgba(243, 212, 137, 0);
	}
}

@keyframes amoon-festival-shine {
	0% {
		background-position: 0 0;
	}

	45%,
	100% {
		background-position: 100% 0;
	}
}

@keyframes amoon-festival-wiggle {
	0%,
	52%,
	78%,
	100% {
		transform: rotate(0) scale(1);
	}

	58% {
		transform: rotate(-16deg) scale(1.14);
	}

	64% {
		transform: rotate(13deg) scale(1.14);
	}

	70% {
		transform: rotate(-8deg) scale(1.08);
	}
}

@keyframes amoon-festival-twinkle {
	from {
		opacity: .35;
		transform: scale(.6);
	}

	to {
		opacity: 1;
		transform: scale(1.15);
	}
}

@keyframes amoon-festival-nudge {
	0%,
	100% {
		transform: translateX(0);
	}

	50% {
		transform: translateX(-4px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.amoon-festival,
	.amoon-festival__link::before,
	.amoon-festival__link::after,
	.amoon-festival__icon,
	.amoon-festival__spark,
	.amoon-festival__cta svg {
		animation: none;
	}

	.amoon-festival .amoon-festival__link {
		transition: none;
	}

	/* The ring and sweep are gone, so keep a steady gold glow. */
	.amoon-festival .amoon-festival__link {
		box-shadow: 0 10px 28px rgba(78, 27, 89, .45), 0 0 0 4px rgba(243, 212, 137, .35);
	}
}

@media print {
	.amoon-festival {
		display: none;
	}
}