/* FG Álbumes emergentes
   Colores y medidas: cambiá estos valores para ajustar el look. */
.fg-album {
	--fg-fondo: #600020;
	--fg-fondo-hover: #4a0018;
	--fg-texto: #ffffff;
	--fg-padding: 16px;
	--fg-radio: 6px;
	margin: 2em 0;
	max-width: 720px;
}

/* La galería original queda oculta: solo se usa si no hay JavaScript. */
.fg-album .fg-album__respaldo { display: none; }
.fg-album.fg-album--sin-js .fg-album__respaldo { display: block; }
.fg-album.fg-album--sin-js .fg-album__tarjeta { display: none; }

/* Tarjeta: mismo padding en los 4 lados */
.fg-album .fg-album__tarjeta {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 100%;
	margin: 0;
	padding: var(--fg-padding);
	background: var(--fg-fondo);
	color: var(--fg-texto);
	border: 0;
	border-radius: var(--fg-radio);
	cursor: pointer;
	text-align: center;
	transition: background-color .2s ease;
	-webkit-tap-highlight-color: transparent;
}
.fg-album .fg-album__tarjeta:hover { background: var(--fg-fondo-hover); }
.fg-album .fg-album__tarjeta:focus { outline: none; }
.fg-album .fg-album__tarjeta:focus-visible {
	outline: 3px solid var(--fg-fondo);
	outline-offset: 3px;
}

/* Mosaico de portada */
.fg-album .fg-album__mosaico {
	display: grid;
	gap: var(--fg-padding); /* mismo espacio que el marco */
	aspect-ratio: 16 / 10;
	overflow: hidden;
	border-radius: 3px;
}
.fg-album .fg-album__tarjeta--n2 .fg-album__mosaico { grid-template-columns: 1fr 1fr; }
.fg-album .fg-album__tarjeta--n3 .fg-album__mosaico {
	grid-template-columns: 2fr 1fr;
	grid-template-rows: 1fr 1fr;
}
.fg-album .fg-album__tarjeta--n3 .fg-album__celda:first-child { grid-row: 1 / 3; }

.fg-album .fg-album__celda {
	position: relative;
	display: block;
	min-width: 0;
	min-height: 0;
	overflow: hidden;
}
.fg-album .fg-album__celda .fg-album__foto {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	object-fit: cover;
	transition: transform .4s ease;
}
.fg-album .fg-album__tarjeta:hover .fg-album__foto { transform: scale(1.04); }

.fg-album .fg-album__mas {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(96, 0, 32, .7);
	color: #fff;
	font-size: 1.6em;
	font-weight: 700;
}

/* Texto */
.fg-album .fg-album__texto {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	padding-bottom: 2px;
}
.fg-album .fg-album__titulo {
	font-size: 1.4em;
	font-weight: 800;
	line-height: 1.15;
	color: var(--fg-texto);
}
.fg-album .fg-album__cantidad {
	font-size: .9em;
	color: var(--fg-texto);
	opacity: .85;
}

@media (max-width: 560px) {
	.fg-album { --fg-padding: 12px; }
	.fg-album .fg-album__tarjeta { gap: 10px; }
	.fg-album .fg-album__titulo { font-size: 1.2em; }
}

@media (prefers-reduced-motion: reduce) {
	.fg-album .fg-album__tarjeta,
	.fg-album .fg-album__foto { transition: none; }
	.fg-album .fg-album__tarjeta:hover .fg-album__foto { transform: none; }
}

/* =========================================================
   Visor: blindaje contra los estilos de botón del tema
   ========================================================= */
.pswp.fg-pswp button.pswp__button,
.pswp.fg-pswp button.pswp__button:hover,
.pswp.fg-pswp button.pswp__button:focus,
.pswp.fg-pswp button.pswp__button:active {
	background: none !important;
	background-color: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	outline: none !important;
	padding: 0 !important;
	min-width: 0 !important;
	min-height: 0 !important;
	line-height: normal !important;
	text-shadow: none !important;
	transform: none !important;
	color: #fff !important;
	pointer-events: auto;
}
.pswp.fg-pswp button.pswp__button:focus-visible {
	outline: 2px solid rgba(255, 255, 255, .7) !important;
	outline-offset: -4px;
}
.pswp.fg-pswp button.pswp__button--close,
.pswp.fg-pswp button.pswp__button--zoom {
	width: 50px !important;
	height: 60px !important;
	margin: 0 !important;
}
.pswp.fg-pswp button.pswp__button--arrow,
.pswp.fg-pswp button.pswp__button--arrow:hover,
.pswp.fg-pswp button.pswp__button--arrow:focus,
.pswp.fg-pswp button.pswp__button--arrow:active {
	position: absolute !important;
	top: 50% !important;
	width: 75px !important;
	height: 100px !important;
	margin-top: -50px !important;
	z-index: 20 !important;
}
.pswp.fg-pswp .pswp__button--arrow--next { right: 0 !important; left: auto !important; }
.pswp.fg-pswp .pswp__button--arrow--prev { left: 0 !important; right: auto !important; }
.pswp.fg-pswp .pswp__button svg,
.pswp.fg-pswp .pswp__button .pswp__icn { pointer-events: none; }

/* Epígrafe dentro del visor */
.pswp__fg-epigrafe {
	position: absolute;
	left: 50%;
	bottom: 16px;
	transform: translateX(-50%);
	max-width: min(90%, 720px);
	padding: 8px 14px;
	background: rgba(0, 0, 0, .6);
	color: #fff;
	font-size: 14px;
	line-height: 1.4;
	text-align: center;
	border-radius: 4px;
}
