/**
 * ERA Portal — novedades de la ficha.
 *
 * Presentación del apartado «Características» (lista de comprobación) y del
 * bloque «Certificado energético» (insignia + escala A–G). Usa las variables
 * del tema cuando existen y cae a los valores de marca de ERA.
 *
 * @since 1.6.5
 */

/* -------------------------------------------------------------------------
   Características con marca de verificación (debajo de la descripción)
   ---------------------------------------------------------------------- */
.era-portal-ficha__features .era-portal-features {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 0.55rem 1.5rem;
}

.era-portal-features__item {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
	font-size: 0.95rem;
	line-height: 1.4;
	color: var(--era-ink, #1b2a3a);
}

.era-portal-features__check {
	flex: 0 0 auto;
	font-weight: 700;
	line-height: 1.4;
	color: var(--era-primary, #C8102E);
}

.era-portal-features__label {
	min-width: 0;
}

@media (max-width: 640px) {
	.era-portal-ficha__features .era-portal-features {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* -------------------------------------------------------------------------
   Certificado energético
   ---------------------------------------------------------------------- */
.era-portal-energy {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem 1.5rem;
}

.era-portal-energy__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 3rem;
	min-height: 3rem;
	padding: 0.25rem 0.65rem;
	border-radius: var(--era-radius, 6px);
	background-color: #5b6570;
	color: #ffffff;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1;
}

/* Colores de la escala oficial A–G. */
.era-portal-energy__badge--a { background-color: #00a651; }
.era-portal-energy__badge--b { background-color: #50b848; }
.era-portal-energy__badge--c { background-color: #bfd730; color: #1b2a3a; }
.era-portal-energy__badge--d { background-color: #fff200; color: #1b2a3a; }
.era-portal-energy__badge--e { background-color: #fdb913; color: #1b2a3a; }
.era-portal-energy__badge--f { background-color: #f37021; }
.era-portal-energy__badge--g { background-color: #ed1c24; }

/* Sin dato: se muestra «G*» en el peor valor, marcado con borde discontinuo. */
.era-portal-energy__badge--unknown {
	background-color: #ed1c24;
	border: 2px dashed rgba(255, 255, 255, 0.85);
}

.era-portal-energy__scale {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: stretch;
	border-radius: var(--era-radius, 6px);
	overflow: hidden;
}

.era-portal-energy__step {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.1rem;
	padding: 0.4rem 0.45rem;
	font-size: 0.8rem;
	font-weight: 600;
	line-height: 1;
	color: #ffffff;
	background-color: var(--era-muted, #6b7681);
	opacity: 0.55;
}

.era-portal-energy__step--a { background-color: #00a651; }
.era-portal-energy__step--b { background-color: #50b848; }
.era-portal-energy__step--c { background-color: #bfd730; color: #1b2a3a; }
.era-portal-energy__step--d { background-color: #fff200; color: #1b2a3a; }
.era-portal-energy__step--e { background-color: #fdb913; color: #1b2a3a; }
.era-portal-energy__step--f { background-color: #f37021; }
.era-portal-energy__step--g { background-color: #ed1c24; }

.era-portal-energy__step.is-active {
	opacity: 1;
	box-shadow: inset 0 0 0 3px rgba(27, 42, 58, 0.55);
}

.era-portal-energy__note {
	flex: 1 1 100%;
	margin: 0;
	font-size: 0.8rem;
	color: var(--era-ink-light, #5b6570);
}

@media (max-width: 640px) {
	.era-portal-energy__step {
		min-width: 1.7rem;
		padding: 0.35rem;
		font-size: 0.72rem;
	}
}

/* -------------------------------------------------------------------------
   Galería de la ficha: composición de tres fotos y ventana superpuesta
   ---------------------------------------------------------------------- */

/* Franja roja de marca detrás de la mitad superior de la foto principal. */
.era-portal--ficha-with-gallery {
	position: relative;
}

.era-portal--ficha-with-gallery::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: var(--era-gallery-band-height, 0);
	background-color: var(--era-primary, #C8102E);
	pointer-events: none;
	z-index: 0;
}

.era-portal--ficha-with-gallery > .era-portal-gallery {
	position: relative;
	z-index: 1;
}

/* La cabecera y la franja roja forman una sola superficie, sin línea. */
body.single-era_property .site-header {
	border-bottom-color: transparent;
}

.era-portal-gallery {
	max-width: 1200px;
	margin: 0 auto 1.5rem;
	padding: 0 1rem;
	position: relative;
}

.era-portal-gallery__grid {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	grid-template-rows: repeat(2, minmax(0, 1fr));
	gap: 0.5rem;
	aspect-ratio: 2 / 1;
	margin: 0;
	padding: 0;
	list-style: none;
}

.era-portal-gallery__cell {
	position: relative;
	min-width: 0;
	min-height: 0;
	margin: 0;
	padding: 0;
}

.era-portal-gallery__cell--1 {
	grid-column: 1;
	grid-row: 1 / span 2;
}

.era-portal-gallery__cell--2 {
	grid-column: 2;
	grid-row: 1;
}

.era-portal-gallery__cell--3 {
	grid-column: 2;
	grid-row: 2;
}

/* Con dos fotos la composición pasa a dos columnas iguales. */
.era-portal-gallery__grid--count-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-template-rows: minmax(0, 1fr);
}

.era-portal-gallery__grid--count-2 .era-portal-gallery__cell--1 {
	grid-column: 1;
	grid-row: 1;
}

.era-portal-gallery__grid--count-2 .era-portal-gallery__cell--2 {
	grid-column: 2;
	grid-row: 1;
}

/* Con una sola foto, ocupa todo el ancho. */
.era-portal-gallery__grid--count-1 {
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: minmax(0, 1fr);
	aspect-ratio: 16 / 9;
}

.era-portal-gallery__grid--count-1 .era-portal-gallery__cell--1 {
	grid-column: 1;
	grid-row: 1;
}

.era-portal-gallery__item {
	position: absolute;
	inset: 0;
	display: block;
	overflow: hidden;
	border-radius: var(--era-radius-img, 1.25rem 1.25rem 3.75rem 1.25rem);
	background-color: var(--era-surface, #f5f6f8);
	cursor: pointer;
}

.era-portal-gallery__item:focus-visible {
	outline: 3px solid var(--era-primary, #C8102E);
	outline-offset: 2px;
}

.era-portal-gallery__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: inherit;
	transition: transform 0.35s ease;
}

.era-portal-gallery__item:hover .era-portal-gallery__image,
.era-portal-gallery__item:focus-visible .era-portal-gallery__image {
	transform: scale(1.03);
}

/* Contador «N fotos»: píldora sobre la foto principal. */
.era-portal-gallery__count {
	position: absolute;
	left: 0.75rem;
	bottom: 0.75rem;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	max-width: calc(100% - 1.5rem);
	padding: 0.45rem 0.8rem;
	border-radius: 999px;
	background-color: rgba(255, 255, 255, 0.95);
	color: var(--era-ink, #1a1a1a);
	font-family: var(--era-font-body, inherit);
	font-size: 0.85rem;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
	cursor: pointer;
}

.era-portal-gallery__count:hover,
.era-portal-gallery__count:focus-visible {
	background-color: #ffffff;
	outline: 2px solid var(--era-primary, #C8102E);
	outline-offset: 2px;
}

.era-portal-gallery__count-icon {
	flex: 0 0 auto;
}

/* -------------------------------------------------------------------------
   Ventana superpuesta con todas las fotos apiladas
   ---------------------------------------------------------------------- */

body.era-portal-gallery-open {
	overflow: hidden;
}

.era-portal-gallery__dialog {
	position: fixed;
	inset: 0;
	width: min(1100px, calc(100% - 2rem));
	max-width: none;
	height: fit-content;
	max-height: calc(100vh - 2rem);
	max-height: calc(100dvh - 2rem);
	margin: auto;
	padding: 0;
	border: 0;
	border-radius: var(--era-radius-lg, 0.625rem);
	background-color: var(--era-white, #ffffff);
	color: var(--era-ink, #1a1a1a);
	box-shadow: 0 24px 70px rgba(0, 0, 0, 0.35);
	overflow: hidden;
}

.era-portal-gallery__dialog[open] {
	display: flex;
	flex-direction: column;
}

.era-portal-gallery__dialog::backdrop {
	background-color: rgba(15, 23, 42, 0.7);
}

.era-portal-gallery__dialog-bar {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.7rem 1rem;
	border-bottom: 1px solid var(--era-border, #dcdcdc);
	background-color: var(--era-white, #ffffff);
}

.era-portal-gallery__dialog-title {
	margin: 0;
	font-family: var(--era-font-heading, inherit);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.3;
}

.era-portal-gallery__dialog-close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background-color: var(--era-surface, #f5f6f8);
	color: var(--era-ink, #1a1a1a);
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
}

.era-portal-gallery__dialog-close:hover,
.era-portal-gallery__dialog-close:focus-visible {
	background-color: var(--era-primary, #C8102E);
	color: var(--era-white, #ffffff);
	outline: none;
}

.era-portal-gallery__dialog-scroll {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 1rem;
	min-height: 0;
	padding: 1rem;
	overflow-y: auto;
	overscroll-behavior: contain;
}

.era-portal-gallery__figure {
	margin: 0;
}

.era-portal-gallery__photo {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--era-radius-img, 1.25rem 1.25rem 3.75rem 1.25rem);
	background-color: var(--era-surface, #f5f6f8);
}

@media (max-width: 767px) {
	.era-portal-gallery {
		margin-bottom: 1rem;
	}

	.era-portal-gallery__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-rows: minmax(0, 2fr) minmax(0, 1fr);
		aspect-ratio: 3 / 4;
	}

	.era-portal-gallery__cell--1 {
		grid-column: 1 / -1;
		grid-row: 1;
	}

	.era-portal-gallery__cell--2 {
		grid-column: 1;
		grid-row: 2;
	}

	.era-portal-gallery__cell--3 {
		grid-column: 2;
		grid-row: 2;
	}

	.era-portal-gallery__grid--count-2 {
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: minmax(0, 2fr) minmax(0, 1fr);
		aspect-ratio: 4 / 3;
	}

	.era-portal-gallery__grid--count-2 .era-portal-gallery__cell--1 {
		grid-column: 1;
		grid-row: 1;
	}

	.era-portal-gallery__grid--count-2 .era-portal-gallery__cell--2 {
		grid-column: 1;
		grid-row: 2;
	}

	.era-portal-gallery__grid--count-1 {
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: minmax(0, 1fr);
		aspect-ratio: 4 / 3;
	}

	.era-portal-gallery__count {
		left: 0.6rem;
		bottom: 0.6rem;
	}

	.era-portal-gallery__dialog {
		width: 100%;
		height: 100vh;
		height: 100dvh;
		max-height: 100vh;
		max-height: 100dvh;
		border-radius: 0;
	}

	.era-portal-gallery__dialog-scroll {
		padding: 0.75rem;
	}
}

/* Mismo margen lateral que la ficha en teléfono. */
@media (max-width: 560px) {
	.era-portal-gallery {
		padding: 0 0.75rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.era-portal-gallery__image {
		transition: none;
	}
}