/* Estilo para o container das miniaturas */
#fancybox-thumbs {
	position: fixed;
	left: 0;
	width: 100%;
	overflow: hidden;
	z-index: 8050;
	background: rgba(0, 0, 0, 0.8);
	/* Fundo escuro */
	padding: 20px 0;
	/* Aumentei o padding para mais espaço */
}

#fancybox-thumbs.bottom {
	bottom: 0;
}

#fancybox-thumbs.top {
	top: 0;
}

/* Estilo para a lista de miniaturas */
#fancybox-thumbs ul {
	position: relative;
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: center;
	/* Centraliza as miniaturas */
}

/* Estilo para cada miniatura */
#fancybox-thumbs ul li {
	display: inline-block;
	margin: 0 10px;
	/* Aumentei o espaçamento entre as miniaturas */
	opacity: 0.7;
	transition: opacity 0.3s ease, transform 0.3s ease;
}

#fancybox-thumbs ul li.active {
	opacity: 1;
	transform: scale(1.1);
	/* Destaque na miniatura ativa */
}

#fancybox-thumbs ul li:hover {
	opacity: 1;
	transform: scale(1.1);
	/* Efeito de hover */
}

/* Estilo para o link da miniatura */
#fancybox-thumbs ul li a {
	display: block;
	position: relative;
	overflow: hidden;
	border: 2px solid #fff;
	border-radius: 8px;
	background: #000;
	outline: none;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
	width: 150px !important;
	/* Aumentei a largura */
	height: 100px !important;
	/* Aumentei a altura */
}

/* Estilo para a imagem da miniatura */
#fancybox-thumbs ul li img {
	display: block;
	position: relative;
	border: 0;
	padding: 0;
	max-width: none;
	height: 100% !important;
	border-radius: 6px;
}

/* Estilo para a imagem principal */
.fancybox-image {
	max-width: 90%;
	/* Ajuste para a imagem principal não ficar muito pequena */
	max-height: 70vh;
	/* Limita a altura da imagem principal */
	margin-top: 10px;
	/* Reduzi a margem superior */
}

/* Estilos responsivos */
@media (max-width: 768px) {
	#fancybox-thumbs ul li a {
		width: 120px !important;
		/* Largura reduzida para telas menores */
		height: 80px !important;
		/* Altura reduzida para telas menores */
	}
}

@media (max-width: 480px) {
	#fancybox-thumbs ul li a {
		width: 100px !important;
		/* Largura ainda menor para telas muito pequenas */
		height: 70px !important;
		/* Altura ainda menor para telas muito pequenas */
	}
}