/* BI Pop Up Dinámico */

.bi-dpp-slot { display: none !important; }

html.bi-dpp-lock,
html.bi-dpp-lock body { overflow: hidden; }

/* ---------- Pop up ---------- */
.bi-dpp-overlay {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	background: rgba(0, 0, 0, .6);
	opacity: 0;
	transition: opacity .3s ease;
}
.bi-dpp-overlay.is-visible { opacity: 1; }

.bi-dpp-modal {
	position: relative;
	width: 100%;
	max-height: calc(100vh - 40px);
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 20px 60px rgba(0, 0, 0, .3);
	transform: translateY(20px) scale(.98);
	transition: transform .3s ease;
}
.bi-dpp-overlay.is-visible .bi-dpp-modal { transform: none; }

.bi-dpp-modal .bi-dpp-content { padding: 0; }
.bi-dpp-content > .vc_row:last-child,
.bi-dpp-content > .wpb-content-wrapper > .vc_row:last-child { margin-bottom: 0; }
.bi-dpp-content img { max-width: 100%; height: auto; }

/* ---------- Botón cerrar ---------- */
.bi-dpp-close {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 2;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(0, 0, 0, .55);
	color: #fff;
	font-size: 24px;
	line-height: 36px;
	text-align: center;
	cursor: pointer;
	transition: background .2s ease;
}
.bi-dpp-close:hover,
.bi-dpp-close:focus { background: #f47920; outline: none; }

/* ---------- Sticky ---------- */
.bi-dpp-sticky {
	position: fixed;
	left: 0;
	right: 0;
	z-index: 99998;
	background: #fff;
	box-shadow: 0 -4px 20px rgba(0, 0, 0, .15);
	transition: transform .3s ease;
}
.bi-dpp-sticky--bottom { bottom: 0; transform: translateY(100%); }
.bi-dpp-sticky--top { top: 0; transform: translateY(-100%); box-shadow: 0 4px 20px rgba(0, 0, 0, .15); }
.bi-dpp-sticky.is-visible { transform: none; }

.bi-dpp-sticky .bi-dpp-content { padding: 10px 56px 10px 16px; }
.bi-dpp-sticky .bi-dpp-close {
	top: 50%;
	margin-top: -16px;
	width: 32px;
	height: 32px;
	font-size: 20px;
	line-height: 32px;
}

@media (max-width: 767px) {
	.bi-dpp-overlay { padding: 12px; }
	.bi-dpp-modal { border-radius: 12px; max-height: calc(100vh - 24px); }
	.bi-dpp-sticky .bi-dpp-content { padding: 8px 48px 8px 12px; }
}

/* ---------- Modo imágenes (escritorio / móvil) ---------- */
/* Sin fondo, sin sombra: solo la imagen. */
.bi-dpp-images,
.bi-dpp-images picture,
.bi-dpp-images a { display: block; line-height: 0; }
.bi-dpp-images { text-align: center; }
.bi-dpp-images picture,
.bi-dpp-images a { display: inline-block; max-width: 100%; }
.bi-dpp-images img { display: block; width: auto; height: auto; max-width: 100%; margin: 0 auto; }

.bi-dpp-modal.bi-dpp-modal--images {
	width: auto;
	max-width: 100% !important;
	overflow: visible;
	background: transparent !important;
	box-shadow: none;
	border-radius: 0;
}
.bi-dpp-modal--images img { max-height: calc(100vh - 40px); }

.bi-dpp-sticky.bi-dpp-sticky--images {
	background: transparent !important;
	box-shadow: none;
	pointer-events: none; /* deja clicar la página alrededor de la imagen */
}
.bi-dpp-sticky--images .bi-dpp-images a,
.bi-dpp-sticky--images .bi-dpp-images img,
.bi-dpp-sticky--images .bi-dpp-close { pointer-events: auto; }
.bi-dpp-sticky--images .bi-dpp-content { padding: 0; }

@media (max-width: 767px) {
	.bi-dpp-modal--images img { max-height: calc(100vh - 24px); }
}

/* Sin efectos de hover del tema (opacidad / filtros) sobre la imagen ni su enlace. */
.bi-dpp-images a,
.bi-dpp-images a:hover,
.bi-dpp-images a:focus,
.bi-dpp-images a:active,
.bi-dpp-images picture,
.bi-dpp-images img,
.bi-dpp-images a:hover img,
.bi-dpp-images a:focus img {
	opacity: 1 !important;
	filter: none !important;
	-webkit-filter: none !important;
	transform: none !important;
	box-shadow: none !important;
	background: transparent !important;
}

/* X de cierre en la esquina superior derecha de la imagen, siempre dentro de su contenedor. */
.bi-dpp-images .bi-dpp-img-box {
	position: relative;
	display: inline-block;
	max-width: 100%;
	line-height: 0;
	vertical-align: top;
}
.bi-dpp-images .bi-dpp-img-box > .bi-dpp-close {
	top: 8px;
	right: 8px;
	margin: 0;
	width: 32px;
	height: 32px;
	font-size: 20px;
	line-height: 32px;
	transform: none;
	pointer-events: auto;
}
@media (max-width: 767px) {
	.bi-dpp-images .bi-dpp-img-box > .bi-dpp-close { top: 4px; right: 4px; width: 28px; height: 28px; font-size: 18px; line-height: 28px; }
}
