/* CodLab Editor PRO — Popup Builder frontend styles. */

.codlab-popup-overlay {
	position: fixed;
	inset: 0;
	z-index: 999998;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(29,27,32,0.55);
	opacity: 0;
	transition: opacity 220ms ease;
	padding: 16px;
}

.codlab-popup-overlay.is-open {
	opacity: 1;
}

.codlab-popup-modal {
	position: relative;
	background: #FFFFFF;
	color: #1D1B20;
	border-radius: 12px;
	box-shadow: 0 30px 80px rgba(0,0,0,.35);
	max-width: 92vw;
	max-height: 90vh;
	overflow: auto;
	padding: 32px;
	width: 480px;
	transform: translateY(8px) scale(.98);
	opacity: 0;
	transition: transform 240ms cubic-bezier(.2,.7,.2,1), opacity 220ms ease;
}

.codlab-popup-overlay.is-open .codlab-popup-modal {
	transform: translateY(0) scale(1);
	opacity: 1;
}

.codlab-popup-content > *:first-child { margin-top: 0; }
.codlab-popup-content > *:last-child  { margin-bottom: 0; }

.codlab-popup-close {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 32px;
	height: 32px;
	border: 0;
	background: transparent;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
	color: #1D1B20;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background-color 160ms ease;
}
.codlab-popup-close:hover {
	background: rgba(29,27,32,.08);
}
.codlab-popup-close:focus-visible {
	outline: 2px solid #CA1414;
	outline-offset: 2px;
}

/* Positions */
.codlab-popup-pos--top         { align-items: flex-start; padding-top: 32px; }
.codlab-popup-pos--bottom      { align-items: flex-end;   padding-bottom: 32px; }
.codlab-popup-pos--left        { justify-content: flex-start; padding-left: 32px; }
.codlab-popup-pos--right       { justify-content: flex-end;   padding-right: 32px; }
.codlab-popup-pos--corner-tl   { align-items: flex-start; justify-content: flex-start; padding: 24px; }
.codlab-popup-pos--corner-tr   { align-items: flex-start; justify-content: flex-end;   padding: 24px; }
.codlab-popup-pos--corner-bl   { align-items: flex-end;   justify-content: flex-start; padding: 24px; }
.codlab-popup-pos--corner-br   { align-items: flex-end;   justify-content: flex-end;   padding: 24px; }

/* Animations IN */
.codlab-popup-anim-in--none .codlab-popup-modal {
	transition: none;
	transform: none;
	opacity: 1;
}
.codlab-popup-anim-in--fade .codlab-popup-modal { /* default */ }

.codlab-popup-anim-in--slide-up .codlab-popup-modal {
	transform: translateY(40px);
}
.codlab-popup-anim-in--slide-up.is-open .codlab-popup-modal {
	transform: translateY(0);
}

.codlab-popup-anim-in--zoom .codlab-popup-modal {
	transform: scale(.85);
}
.codlab-popup-anim-in--zoom.is-open .codlab-popup-modal {
	transform: scale(1);
}

/* Animations OUT */
.codlab-popup-anim-out--fade {
	opacity: 0;
}
.codlab-popup-anim-out--slide-up .codlab-popup-modal {
	transform: translateY(-30px);
	opacity: 0;
}
.codlab-popup-anim-out--zoom .codlab-popup-modal {
	transform: scale(.85);
	opacity: 0;
}
.codlab-popup-anim-out--none {
	opacity: 0;
}

@media (max-width: 640px) {
	.codlab-popup-modal {
		width: 100% !important;
		max-width: calc(100vw - 24px) !important;
		padding: 24px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.codlab-popup-overlay,
	.codlab-popup-modal {
		transition: none !important;
	}
}