/**
 * Styling of the surrounding container.
 *
 * Only the frame and its surroundings can be styled - the booking page inside
 * lives on another origin and is out of reach for this stylesheet. Colours are
 * therefore kept neutral so the embed sits quietly inside any theme.
 */

.fewohbee-booking {
	position: relative;
	margin: 0 auto;
	width: 100%;
}

.fewohbee-booking__frame {
	display: block;
	width: 100%;
	border: 0;
	overflow: hidden;
	background: transparent;
	transition: height 0.2s ease;
}

.fewohbee-booking__loading {
	display: flex;
	align-items: center;
	gap: 0.6em;
	padding: 1.5em 0;
	color: currentColor;
	opacity: 0.75;
	font-size: 0.95em;
}

.fewohbee-booking__spinner {
	width: 1.1em;
	height: 1.1em;
	border: 2px solid currentColor;
	border-top-color: transparent;
	border-radius: 50%;
	animation: fewohbee-booking-spin 0.8s linear infinite;
}

@keyframes fewohbee-booking-spin {
	to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
	.fewohbee-booking__spinner { animation: none; }
	.fewohbee-booking__frame { transition: none; }
}

/* The fallback link matters when the frame stays blank, so it is always
   present - just quiet while everything works. */
.fewohbee-booking__fallback {
	margin: 0.75em 0 0;
	font-size: 0.9em;
	opacity: 0.75;
}

.fewohbee-booking.is-error .fewohbee-booking__fallback {
	opacity: 1;
	font-size: 1em;
}

.fewohbee-booking__privacy {
	margin: 0.75em 0 0;
	font-size: 0.85em;
	opacity: 0.8;
}

.fewohbee-booking__notice {
	margin: 0 0 1em;
	padding: 0.9em 1.1em;
	border-left: 4px solid currentColor;
	background: rgba(0, 0, 0, 0.04);
}

/* ── Schaltfläche statt Einbettung ──────────────────────────────
   Bewusst zurückhaltend: Umriss statt Farbfläche. Eine geratene
   Hintergrundfarbe passt in fremden Themes fast nie, ein Rahmen in
   der Textfarbe dagegen immer - auf hellen wie auf dunklen Seiten.
   Wer es anders will, überschreibt eine einzige Klasse. */

.fewohbee-booking__cta {
	margin: 0;
}

.fewohbee-booking__button {
	display: inline-block;
	padding: 0.85em 1.6em;
	border: 2px solid currentColor;
	border-radius: 4px;
	text-decoration: none;
	font-weight: 600;
	line-height: 1.2;
	color: inherit;
}

.fewohbee-booking__button:hover,
.fewohbee-booking__button:focus-visible {
	text-decoration: underline;
}

.fewohbee-booking__frame[hidden],
.fewohbee-booking__cta[hidden],
.fewohbee-booking__fallback[hidden],
.fewohbee-booking__loading[hidden] {
	display: none;
}
