/* Elementor master-controller + waypoint UI.
   The controller is editor-facing. The real sitewide Labby is rendered separately. */

.elementor-widget-lytl-guide-labby-3d {
	min-height: 0 !important;
	height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: visible !important;
}

.elementor-widget-lytl-guide-labby-3d > .elementor-widget-container {
	min-height: 0 !important;
	height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: visible !important;
}

.lytl-guide-labby-controller-preview {
	--lytl-preview-h: 24px;
	--lytl-preview-v: 28px;
	position: fixed;
	width: 260px;
	aspect-ratio: 3 / 4;
	z-index: 9999;
	background: transparent;
	pointer-events: auto;
	overflow: visible;
}

.lytl-preview-h-right { right: var(--lytl-preview-h); left: auto; }
.lytl-preview-h-left  { left: var(--lytl-preview-h); right: auto; }
.lytl-preview-v-bottom { bottom: var(--lytl-preview-v); top: auto; }
.lytl-preview-v-top    { top: var(--lytl-preview-v); bottom: auto; }

.lytl-guide-labby-controller-preview__float {
	position: relative;
	width: 100%;
	height: 100%;
}

.lytl-guide-labby-controller-preview model-viewer {
	display: block;
	width: 100%;
	height: 100%;
	background: transparent;
	--poster-color: transparent;
	pointer-events: none;
}

.lytl-guide-labby-controller-preview__fallback {
	display: none;
	position: absolute;
	inset: 0;
	align-items: center;
	justify-content: center;
	padding: 12px;
	border-radius: 14px;
	background: rgba(30, 20, 62, 0.82);
	color: #fff;
	text-align: center;
	font: 600 12px/1.35 system-ui, sans-serif;
}

.lytl-guide-labby-controller-preview model-viewer:not(:defined) + .lytl-guide-labby-controller-preview__fallback {
	display: flex;
}

.lytl-preview-idle-float .lytl-guide-labby-controller-preview__float {
	animation: lytl-preview-float 5.5s ease-in-out infinite;
}

@keyframes lytl-preview-float {
	0%, 100% { transform: translate3d(0,0,0); }
	50% { transform: translate3d(0,-8px,0); }
}

.lytl-guide-labby-controller-chip {
	position: fixed;
	left: 12px;
	bottom: 12px;
	z-index: 99999;
	padding: 7px 10px;
	border-radius: 999px;
	background: rgba(64, 35, 104, 0.88);
	color: #fff;
	font: 700 10px/1 system-ui, sans-serif;
	letter-spacing: .05em;
	pointer-events: none;
}

/* Waypoint widget is visually obvious in Elementor, but does not create
   a visible box on the real website. */
.elementor-widget-lytl-labby-waypoint {
	overflow: visible !important;
}

.lytl-labby-waypoint {
	display: block;
	width: 1px;
	height: 1px;
	margin: 0 auto;
	overflow: visible;
	position: relative;
}

.lytl-labby-waypoint__editor-label {
	position: absolute;
	left: 50%;
	top: 0;
	transform: translate(-50%, -50%);
	display: inline-flex;
	white-space: nowrap;
	padding: 7px 10px;
	border: 1px dashed rgba(125, 82, 190, .9);
	border-radius: 999px;
	background: rgba(246, 239, 255, .96);
	color: #4d2d76;
	font: 700 10px/1 system-ui, sans-serif;
	letter-spacing: .04em;
	box-shadow: 0 4px 14px rgba(55, 32, 86, .14);
}

@media (prefers-reduced-motion: reduce) {
	.lytl-preview-idle-float .lytl-guide-labby-controller-preview__float {
		animation: none !important;
	}
}
