.popupxd-overlay {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: none;
	opacity: 0;
	transition: opacity .25s ease;
}
.popupxd-overlay.popupxd-active {
	display: flex;
	opacity: 1;
}

/* Nút mở popup (shortcode [popupxd]) */
.popupxd-btn {
	cursor: pointer;
	border: 0;
	display: inline-block;
	text-align: center;
	text-decoration: none;
	line-height: 1.4;
	font-family: inherit;
}
.popupxd-btn:hover,
.popupxd-btn:focus {
	cursor: pointer;
	opacity: .92;
}

/* Position variants */
.popupxd-overlay.popupxd-pos-center { align-items: center; justify-content: center; }
.popupxd-overlay.popupxd-pos-top { align-items: flex-start; justify-content: center; }
.popupxd-overlay.popupxd-pos-bottom { align-items: flex-end; justify-content: center; }
.popupxd-overlay.popupxd-pos-left { align-items: center; justify-content: flex-start; }
.popupxd-overlay.popupxd-pos-right { align-items: center; justify-content: flex-end; }

.popupxd-box {
	position: relative;
	width: 92%;
	max-height: 90vh;
	overflow: auto;
	background: #fff;
	box-sizing: border-box;
	transform: scale(1) translate(0, 0);
	opacity: 1;
	transition: transform .3s ease, opacity .3s ease;
}

/* Shadow variants */
.popupxd-shadow-sm .popupxd-box { box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.popupxd-shadow-md .popupxd-box { box-shadow: 0 8px 30px rgba(0,0,0,.18); }
.popupxd-shadow-lg .popupxd-box { box-shadow: 0 20px 60px rgba(0,0,0,.28); }

.popupxd-close {
	position: absolute;
	background: transparent;
	border: 0;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
	color: #333;
	z-index: 2;
}
.popupxd-content { }

/* Entrance animations: initial (pre-active) state, then transition on .popupxd-active */
.popupxd-anim-fade .popupxd-box { opacity: 0; }
.popupxd-anim-fade.popupxd-active .popupxd-box { opacity: 1; }

.popupxd-anim-zoom-in .popupxd-box { opacity: 0; transform: scale(.85); }
.popupxd-anim-zoom-in.popupxd-active .popupxd-box { opacity: 1; transform: scale(1); }

.popupxd-anim-zoom-out .popupxd-box { opacity: 0; transform: scale(1.15); }
.popupxd-anim-zoom-out.popupxd-active .popupxd-box { opacity: 1; transform: scale(1); }

.popupxd-anim-slide-up .popupxd-box { opacity: 0; transform: translateY(60px); }
.popupxd-anim-slide-up.popupxd-active .popupxd-box { opacity: 1; transform: translateY(0); }

.popupxd-anim-slide-down .popupxd-box { opacity: 0; transform: translateY(-60px); }
.popupxd-anim-slide-down.popupxd-active .popupxd-box { opacity: 1; transform: translateY(0); }

.popupxd-anim-slide-left .popupxd-box { opacity: 0; transform: translateX(60px); }
.popupxd-anim-slide-left.popupxd-active .popupxd-box { opacity: 1; transform: translateX(0); }

.popupxd-anim-slide-right .popupxd-box { opacity: 0; transform: translateX(-60px); }
.popupxd-anim-slide-right.popupxd-active .popupxd-box { opacity: 1; transform: translateX(0); }

body.popupxd-noscroll { overflow: hidden !important; }

/* Device targeting */
@media (max-width: 767px) {
	.popupxd-overlay:not(.pxd-dev-mobile) { display: none !important; }
}
@media (min-width: 768px) and (max-width: 1024px) {
	.popupxd-overlay:not(.pxd-dev-tablet) { display: none !important; }
}
@media (min-width: 1025px) {
	.popupxd-overlay:not(.pxd-dev-desktop) { display: none !important; }
}
@media (max-width: 480px) {
	.popupxd-box { width: 94%; }
}