/* ==========================================================================
   Correção do lightbox (Magnific Popup) da galeria da single do Estatik.
   Carregado depois do CSS do plugin e do tema para prevalecer.
   ========================================================================== */

/* 1. Z-index: garante que o conteúdo do lightbox fique ACIMA do overlay.
   O tema traz uma cópia antiga do CSS do Magnific (z-index 10000/1045),
   que pode deixar a imagem atrás do fundo preto. */
.mfp-bg {
	z-index: 99999;
}

.mfp-wrap {
	z-index: 100004;
}

.mfp-container {
	z-index: 100005;
}

.mfp-wrap .mfp-content {
	z-index: 100006;
}

/* 2. Fundo do lightbox de imóveis (o plugin define branco; o tema sobrescreve). */
.mfp-bg.es-property-magnific {
	opacity: 1;
	background: #fff;
}

/* 3. A imagem grande precisa caber na tela e ser exibida inteira. */
.mfp-wrap.es-property-magnific img.mfp-img,
.mfp-wrap .mfp-figure img.mfp-img {
	max-width: 85%;
	max-height: 78vh;
	height: auto;
	width: auto;
	object-fit: contain;
	display: block;
	line-height: 0;
	padding: 40px 0 20px;
	margin: 0 auto;
}

.mfp-wrap.es-property-magnific .mfp-figure {
	background: #fff;
	line-height: 0;
}

/* 4. Estado de erro: o Magnific esconde todo o conteúdo (.mfp-content),
   deixando apenas o overlay preto e sem botão para fechar.
   Aqui mantemos o botão de fechar e a mensagem visíveis. */
.mfp-s-error .mfp-content {
	display: block !important;
}

.mfp-s-error .mfp-figure {
	display: none !important;
}

.mfp-s-error .mfp-preloader {
	color: #333;
	font-size: 14px;
	z-index: 100008;
}

/* 5. Garante que o topo (botão de fechar / contador) continue visível. */
.mfp-wrap.es-property-magnific .mfp-top-bar {
	display: block;
}

/* 6. Galeria mobile: cada imagem é um link (abre o lightbox) dentro do slick. */
.es-mobile-gallery-wrap .slick-slide > a.js-es-image {
	display: block;
	width: 100%;
}

.es-mobile-gallery-wrap .slick-slide > a.js-es-image img {
	display: block !important;
	width: 100%;
	height: auto !important;
	object-fit: cover;
}

/* 7. Imagem grande no mobile: ocupa a tela sem estourar. */
@media (max-width: 767px) {
	.mfp-wrap.es-property-magnific img.mfp-img,
	.mfp-wrap .mfp-figure img.mfp-img {
		max-width: 100%;
		max-height: 82vh;
		padding: 20px 0 10px;
	}

	.mfp-wrap.es-property-magnific .mfp-content {
		margin: 0 4%;
		padding-top: 60px;
	}
}