.wppb-popup-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.6);
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 999999;
	padding: 20px;
	box-sizing: border-box;
}

.wppb-popup-overlay.wppb-open {
	display: flex;
}

.wppb-popup-box {
	position: relative;
	background: #fff;
	width: 100%;
	max-width: min(var(--wppb-w, 600px), 95vw);
	max-height: 90vh;
	overflow: auto;
	border-radius: 6px;
	box-shadow: 0 10px 40px rgba(0,0,0,0.25);
	padding: 30px;
	box-sizing: border-box;
}

.wppb-popup-content {
	font-size: 16px;
	line-height: 1.6;
}

/* Force any image/embed inside the popup to scale to the box instead of
   rendering at its native pixel size — this is what previously made images
   look small with excess background padding around them. */
.wppb-popup-content img,
.wppb-popup-content video,
.wppb-popup-content iframe:not(.wppb-video-wrap iframe) {
	max-width: 100%;
	height: auto;
	display: block;
}

.wppb-popup-close {
	position: absolute;
	top: 10px;
	right: 14px;
	background: none;
	border: none;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
	color: #555;
	padding: 4px;
}
.wppb-popup-close:hover { color: #000; }

/* Positions */
.wppb-position-top .wppb-popup-box { align-self: flex-start; margin-top: 40px; }
.wppb-position-bottom .wppb-popup-box { align-self: flex-end; margin-bottom: 40px; }
.wppb-position-left { justify-content: flex-start; }
.wppb-position-left .wppb-popup-box { height: 100%; max-height: 100%; border-radius: 0; margin: 0; }
.wppb-position-right { justify-content: flex-end; }
.wppb-position-right .wppb-popup-box { height: 100%; max-height: 100%; border-radius: 0; margin: 0; }

/* Device visibility */
@media (max-width: 767px) {
	.wppb-desktop-only { display: none !important; }
}
@media (min-width: 768px) {
	.wppb-mobile-only { display: none !important; }
}

/* Animations */
.wppb-anim-fade { opacity: 0; transition: opacity 0.25s ease; }
.wppb-open .wppb-anim-fade { opacity: 1; }

.wppb-anim-zoom { opacity: 0; transform: scale(0.85); transition: all 0.25s ease; }
.wppb-open .wppb-anim-zoom { opacity: 1; transform: scale(1); }

.wppb-anim-slide-up { opacity: 0; transform: translateY(40px); transition: all 0.3s ease; }
.wppb-open .wppb-anim-slide-up { opacity: 1; transform: translateY(0); }

.wppb-anim-slide-down { opacity: 0; transform: translateY(-40px); transition: all 0.3s ease; }
.wppb-open .wppb-anim-slide-down { opacity: 1; transform: translateY(0); }

body.wppb-locked { overflow: hidden; }

/* Video embed */
.wppb-video-wrap {
	position: relative;
	width: 100%;
	margin-bottom: 20px;
	overflow: hidden;
	border-radius: 4px;
	background: #000;
}
.wppb-video-wrap:not(.wppb-video-native) {
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}
.wppb-video-wrap:not(.wppb-video-native) iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}
.wppb-video-wrap.wppb-video-native video {
	width: 100%;
	display: block;
}

/* CTA button */
.wppb-popup-cta {
	margin-top: 20px;
	display: flex;
}
.wppb-popup-cta.wppb-align-left { justify-content: flex-start; }
.wppb-popup-cta.wppb-align-center { justify-content: center; }
.wppb-popup-cta.wppb-align-right { justify-content: flex-end; }

.wppb-popup-button {
	display: inline-block;
	padding: 12px 28px;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
	border: none;
	cursor: pointer;
	transition: opacity 0.15s ease, transform 0.15s ease;
}
.wppb-popup-button:hover {
	opacity: 0.9;
	transform: translateY(-1px);
	color: inherit;
}