/*
 * Mercure Back-to-Top — Floating-Button (rechter Rand)
 *
 * Erscheint nach Scroll, sitzt rechts und weicht der Sticky-Buchungsleiste aus.
 * Smooth scroll via html { scroll-behavior: smooth }.
 */

html {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

.mc-back-to-top {
	--mc-btt-size: 46px;
	--mc-btt-right: clamp(16px, 2vw, 24px);
	--mc-btt-bottom: clamp(22px, 3vh, 32px);

	position: fixed;
	right: var(--mc-btt-right);
	bottom: var(--mc-btt-bottom);
	z-index: 85;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--mc-btt-size);
	height: var(--mc-btt-size);
	padding: 0;
	border: 1px solid rgba(40, 40, 40, 0.14);
	border-radius: 50%;
	background: var(--c-white, #fff);
	color: var(--c-dark, #282828);
	text-decoration: none;
	box-shadow: 0 8px 28px -6px rgba(0, 0, 0, 0.22);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(10px);
	transition:
		opacity 0.28s ease,
		visibility 0.28s ease,
		transform 0.28s cubic-bezier(0.16, 1, 0.3, 1),
		border-color 0.25s ease,
		background 0.25s ease,
		color 0.25s ease,
		box-shadow 0.25s ease,
		bottom 0.25s ease;
}

.mc-back-to-top.is-visible {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0);
}

.mc-back-to-top:hover,
.mc-back-to-top:focus-visible {
	border-color: var(--c-purple, #9b7ec2);
	background: var(--c-purple, #9b7ec2);
	color: var(--c-white, #fff);
	box-shadow: 0 10px 32px -8px rgba(155, 126, 194, 0.55);
	outline: none;
}

.mc-back-to-top:focus-visible {
	outline: 2px solid var(--c-purple, #9b7ec2);
	outline-offset: 3px;
}

.mc-back-to-top__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.mc-back-to-top__icon svg {
	display: block;
	width: 18px;
	height: 18px;
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.mc-back-to-top:hover .mc-back-to-top__icon svg,
.mc-back-to-top:focus-visible .mc-back-to-top__icon svg {
	transform: translateY(-2px);
}

.mc-back-to-top:active {
	transform: translateY(1px) scale(0.96);
}

.mc-back-to-top:active.is-visible {
	transform: translateY(1px) scale(0.96);
}

/* Sticky-Buchungsleiste — Button nach oben schieben */
body.mc-has-bottom-bar .mc-back-to-top {
	--mc-btt-bottom: clamp(108px, 14vh, 172px);
}

/* Footer Mobile-CTA (≤880px), wenn keine Buchungsleiste aktiv */
@media (max-width: 880px) {
	/* Links platzieren — Chat-Widget sitzt unten rechts und würde sonst überdecken. */
	.mc-back-to-top {
		right: auto;
		left: 14px;
		--mc-btt-size: 42px;
		/* Immer über der globalen .mobile-cta-Leiste (fixed, ~56px, z-index 90)
		   bleiben — inkl. Safe-Area auf Geräten mit Notch. */
		--mc-btt-bottom: calc(92px + env(safe-area-inset-bottom, 0px));
	}

	.mc-back-to-top__icon svg {
		width: 16px;
		height: 16px;
	}

	body.mc-has-mobile-cta:not(.mc-has-bottom-bar) .mc-back-to-top {
		--mc-btt-bottom: calc(92px + env(safe-area-inset-bottom, 0px));
	}

	body.mc-has-bottom-bar .mc-back-to-top {
		--mc-btt-bottom: 188px;
	}
}

@media (max-width: 480px) {
	body.mc-has-bottom-bar .mc-back-to-top {
		--mc-btt-bottom: 176px;
	}

	body.mc-has-mobile-cta:not(.mc-has-bottom-bar) .mc-back-to-top {
		--mc-btt-bottom: calc(92px + env(safe-area-inset-bottom, 0px));
	}
}

/* ─── Reduced Motion ─── */
@media (prefers-reduced-motion: reduce) {
	.mc-back-to-top,
	.mc-back-to-top__icon svg {
		transition: none;
	}

	.mc-back-to-top:hover .mc-back-to-top__icon svg,
	.mc-back-to-top:focus-visible .mc-back-to-top__icon svg {
		transform: none;
	}
}