/* idigital-genie-cart — stage for the genie effect */

.idgc-stage {
	position: fixed !important;
	left: 0 !important;
	top: 0 !important;
	z-index: 2147483600 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	pointer-events: auto;
	touch-action: none;
	contain: strict;
	direction: ltr;
	opacity: 1;
	transition: opacity 0.34s cubic-bezier(0.4, 0, 0.2, 1);
	-webkit-tap-highlight-color: transparent;
	-webkit-user-select: none;
	user-select: none;
}

.idgc-stage.is-leaving {
	opacity: 0;
}

.idgc-stage canvas {
	position: absolute !important;
	left: 0 !important;
	top: 0 !important;
	display: block !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

.idgc-stage .idgc-backdrop {
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.idgc-stage .idgc-backdrop__img {
	width: 100% !important;
	height: 100% !important;
	filter: blur(14px) saturate(1.25);
	transform: scale(1.12);
}

.idgc-backdrop__shade {
	position: absolute;
	inset: 0;
}

.idgc-stage .idgc-genie {
	width: 100% !important;
	height: 100% !important;
}

.idgc-tile {
	position: absolute;
	overflow: hidden;
	border-radius: 0;
	transform: scale(1);
	transform-origin: 50% 50%;
	box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
	transition:
		transform 0.26s cubic-bezier(0.2, 0.9, 0.25, 1),
		border-radius 0.26s ease,
		box-shadow 0.26s ease;
	will-change: transform;
}

.idgc-tile canvas {
	position: static !important;
	width: 100% !important;
	height: 100% !important;
}

.idgc-tile.is-lifted {
	border-radius: 26%;
	transform: scale(1.16);
	box-shadow:
		0 10px 26px rgba(0, 0, 0, 0.34),
		0 0 0 0.5px rgba(0, 0, 0, 0.1);
}

.idgc-tile.is-pop {
	animation: idgc-pop 0.44s cubic-bezier(0.3, 1.6, 0.5, 1);
}

.idgc-tile--virtual {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	color: #111;
}

@keyframes idgc-pop {
	0% {
		transform: scale(1.16);
	}
	40% {
		transform: scale(1.38);
	}
	100% {
		transform: scale(1.16);
	}
}

.idgc-bump {
	animation: idgc-bump 0.52s cubic-bezier(0.3, 1.5, 0.5, 1);
}

@keyframes idgc-bump {
	0% {
		transform: scale(1);
	}
	35% {
		transform: scale(1.28);
	}
	65% {
		transform: scale(0.94);
	}
	100% {
		transform: scale(1);
	}
}

@media (prefers-reduced-motion: reduce) {
	.idgc-bump,
	.idgc-tile.is-pop {
		animation: none;
	}
}