.wl-zf-lightbox[hidden] {
	display: none !important;
}

/*
 * Ein vorgeladenes Zoho-iFrame muss am Layout teilnehmen, damit Zoho seine
 * korrekte Inhaltshöhe ermitteln und per postMessage melden kann. Es bleibt
 * dabei visuell verborgen und kann keine Pointer-Ereignisse empfangen.
 */
.wl-zf-lightbox[hidden][data-wl-zoho-preload="true"] {
	display: block !important;
	visibility: hidden;
	pointer-events: none;
}

.wl-zf-lightbox {
	position: fixed;
	inset: 0;
	z-index: 10000000;
}

.wl-zf-lightbox__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.8);
}

.wl-zf-lightbox__dialog {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 70%;
	height: 615px;
	max-height: calc(100% - 60px);
	margin: 0;
	padding: 0;
	transform: translate(-50%, -50%);
	background: #fff;
	box-sizing: border-box;
	outline: none;
	z-index: 1;
	transition: height 0.5s ease;
}

.wl-zf-lightbox__content {
	height: 100%;
	display: flex;
	align-items: stretch;
	overflow-x: hidden;
	overflow-y: auto;
}

.wl-zf-lightbox__loading {
	margin: auto;
	padding: 24px;
	font: inherit;
	text-align: center;
}

.wl-zf-lightbox__close {
	position: absolute;
	top: -15px;
	right: -15px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	margin: 0;
	padding: 0;
	border: 2px solid #d9d9d9;
	border-radius: 50%;
	background: #2f2e2e;
	color: #fff;
	font: 28px/1 Arial, sans-serif;
	cursor: pointer;
	z-index: 2;
}

.wl-zf-lightbox__close:hover {
	background: #111;
}

.wl-zf-lightbox__close:focus-visible {
	outline: 3px solid #fff;
	outline-offset: 2px;
}

@media (max-width: 800px) {
	.wl-zf-lightbox__dialog {
		width: calc(100% - 32px) !important;
		max-height: calc(100% - 40px);
	}
}

@media (max-width: 380px) {
	.wl-zf-lightbox__dialog {
		width: calc(100% - 24px) !important;
	}
}