﻿/* Fotopana Embed: estilos del evento embebido. */
.fp-embed {
	--fp-rojo: #d32029;
	/* Hover de los elementos del álbum; en los embeds lo inyecta el
	   shortcode desde Ajustes (si no se guarda, sigue al primario). */
	--fp-hover: #d32029;
	--fp-tinta: #1c1c1e;
	--fp-suave: #f5f5f7;
	font-family: inherit;
	color: var(--fp-tinta);
}

/* Un `display` de autor pisa el `display:none` con que el navegador
   aplica el atributo hidden: sin estas reglas, la barra del carrito o los
   botones con display:flex/inline-flex se verían siempre. La barra se muda
   al body desde JavaScript, así que se cubre su caso explícitamente. */
.fp-embed [hidden],
.fp-embed__carrito[hidden] {
	display: none !important;
}

.fp-embed__cabecera {
	position: relative;
	border-radius: 12px;
	overflow: hidden;
	margin-bottom: 1.5rem;
	background: var(--fp-suave);
}

/* La portada no se pinta dentro del álbum: la galería es solo fotos
   (las tarjetas del listado siguen llevando la suya). */

/* Cabecera al estilo de las noticias del sitio (plantilla single-post de
   Elementor): título en la tipografía y el color primarios del kit —en
   Españalzola, Raleway 800 naranja—, y meta como el entradilla. */
.fp-embed__titulo {
	padding: 0.9rem 1.1rem;
}

.fp-embed__titulo h2 {
	margin: 0;
	font-family: var(--e-global-typography-primary-font-family, inherit), sans-serif;
	font-weight: var(--e-global-typography-primary-font-weight, 700);
	color: var(--e-global-color-primary, var(--fp-rojo));
	font-size: clamp(1.5rem, 1rem + 1.8vw, 2.6rem);
	line-height: 1.15;
}

.fp-embed__meta {
	margin: 0.35rem 0 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 1.25rem;
	font-family: var(--e-global-typography-text-font-family, inherit), sans-serif;
	font-weight: 600;
	color: var(--e-global-color-text, #666);
	font-size: 0.95rem;
}

/* Mismos iconos que las tarjetas del listado, en el color del sitio. */
.fp-embed__meta-dato {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
}

.fp-embed__meta-dato i {
	color: var(--e-global-color-primary, var(--fp-rojo));
	font-size: 0.95rem;
}

/* Página de evento: mucho más amplia que el contenedor del tema (1140px
   en Elementor), hasta casi el ancho del viewport. El margen de 40px por
   lado es aire alrededor del álbum y a la vez la barra de seguridad
   contra scroll horizontal (100vw cuenta el ancho de la barra de
   scroll). */
.fp-embed--ancho {
	width: calc(100% + 2 * max(0px, (100vw - 1140px) / 2 - 40px));
	margin-left: calc(-1 * max(0px, (100vw - 1140px) / 2 - 40px));
	margin-top: 1.5rem;
	margin-bottom: 2.5rem;
}

.fp-embed__albumes {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 1.1rem;
}

.fp-embed__album {
	border: 1px solid #ddd;
	background: #fff;
	border-radius: 999px;
	padding: 0.35rem 0.9rem;
	cursor: pointer;
	font-size: 0.9rem;
	transition: border-color 0.15s ease, color 0.15s ease;
}

.fp-embed__album:hover:not([aria-selected="true"]) {
	border-color: var(--fp-hover);
	color: var(--fp-hover);
}

.fp-embed__album[aria-selected="true"] {
	background: var(--fp-tinta);
	color: #fff;
	border-color: var(--fp-tinta);
}

/* Tira de descuento bajo las pestañas: lo mismo que aplica el servidor.
   Se ajusta a su contenido (con su padding) en vez de estirarse a todo
   el ancho del embed. */
.fp-embed__descuentos {
	display: inline-block;
	width: fit-content;
	max-width: 100%;
	margin: 0 0 1.1rem;
	padding: 0.45rem 0.75rem;
	background: #fff8e6;
	border: 1px solid #f0dfae;
	border-radius: 8px;
	font-size: 0.85rem;
}

/* Cuadrícula de fotos del álbum: 4 columnas en escritorio (3 en tablet,
   2 en móvil), al ancho de la página del evento. El margen superior
   compensa el hueco que dejaba el contador sobre las fotos. */
.fp-embed__grid {
	display: grid;
	margin-top: 0.75rem;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
}

@media (max-width: 1024px) {
	.fp-embed__grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 640px) {
	.fp-embed__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* Skeleton: la cuadrícula «parpadea» mientras llegan las fotos (en vez
   del aviso en texto, que queda para errores y estados vacíos). */
.fp-embed__esqueleto {
	aspect-ratio: 3 / 2;
	border-radius: 10px;
	background: linear-gradient(90deg, #ececee 25%, #f7f7f9 37%, #ececee 63%);
	background-size: 400% 100%;
	animation: fp-shimmer 1.4s ease infinite;
}

@keyframes fp-shimmer {
	from {
		background-position: 100% 0;
	}
	to {
		background-position: -100% 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fp-embed__esqueleto {
		animation: none;
	}
}

.fp-embed__foto {
	position: relative;
	border-radius: 10px;
	overflow: hidden;
	background: var(--fp-suave);
	border: 2px solid transparent;
	transition: border-color 0.15s ease;
}

/* Pasar el cursor por una foto la resalta y enciende su botón. */
.fp-embed__foto:hover {
	border-color: var(--fp-hover);
}

.fp-embed__foto img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

/* La elegida conserva SU borde de color incluso bajo el cursor: la regla
   de hover (más específica) no debe colar el color de hover encima. */
.fp-embed__foto--elegida,
.fp-embed__foto--elegida:hover {
	border-color: var(--fp-rojo);
}

/* Y además un velo semitransparente del color SECUNDARIO de los ajustes
   (el primario es de selección/CTA): la foto en el carrito se
   identifica de un vistazo, incluso en miniatura. El ::before pinta
   sobre la foto pero por debajo de los iconos y la marca de agua. */
.fp-embed__foto--elegida::before {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--e-global-color-secondary, #54595f);
	opacity: 0.22;
	pointer-events: none;
}

/* Icono de carrito (en vez de los antiguos botones «Elegir/Quitar»):
   a añadir —fa-cart-plus— y, en la foto elegida, «en el carrito». */
.fp-emit-elegir {
	position: absolute;
	inset: 0.4rem 0.4rem auto auto;
	border: 0;
	border-radius: 999px;
	background: rgba(28, 28, 30, 0.75);
	color: #fff;
	line-height: 1;
	font-size: 0.9rem;
	padding: 0.45rem 0.55rem;
	min-width: 2rem;
	min-height: 2rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background 0.15s ease;
}

.fp-embed__foto:hover .fp-emit-elegir {
	background: var(--fp-hover);
}

.fp-embed__foto--elegida .fp-emit-elegir {
	background: var(--fp-rojo);
}

.fp-embed__dorsal-tag {
	position: absolute;
	inset: 0.4rem auto auto 0.4rem;
	background: rgba(255, 255, 255, 0.9);
	border-radius: 6px;
	font-size: 0.72rem;
	padding: 0.1rem 0.45rem;
}

/* ── Lightbox: pulsar la foto la muestra en grande ──────────────────── */
/* Las fotos abren el visor: cursor de zoom. */
.fp-embed__foto,
.fp-carrito__foto {
	cursor: zoom-in;
}

/* Se crea en el body desde JavaScript (mismo motivo que la píldora:
   escapar de contenedores con transform para que el fixed mire el
   viewport). */

.fp-luz {
	position: fixed;
	inset: 0;
	z-index: 200;
	background: rgba(15, 15, 17, 0.92);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: inherit;
}

.fp-luz[hidden] {
	display: none !important;
}

.fp-luz__figura {
	margin: 0;
	text-align: center;
}

/* Marco de la imagen: la marca de agua se dibuja encima, alineada. */
.fp-luz__marco {
	position: relative;
	display: inline-block;
	max-width: 100%;
}

.fp-luz__img {
	max-width: calc(100vw - 10rem);
	max-height: calc(100vh - 7rem);
	border-radius: 8px;
	display: inline-block;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
	-webkit-user-drag: none;
	user-select: none;
}

.fp-luz__pie {
	color: rgba(255, 255, 255, 0.9);
	font-size: 0.85rem;
	margin: 0.6rem 0 0;
}

.fp-luz__cerrar,
.fp-luz__anterior,
.fp-luz__siguiente {
	position: absolute;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.12);
	color: #fff;
	line-height: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background 0.15s ease;
}

.fp-luz__cerrar:hover,
.fp-luz__anterior:hover:not(:disabled),
.fp-luz__siguiente:hover:not(:disabled) {
	background: var(--fp-rojo, #d32029);
}

.fp-luz__cerrar {
	top: 1rem;
	right: 1rem;
	width: 2.6rem;
	height: 2.6rem;
	font-size: 1.3rem;
}

.fp-luz__anterior,
.fp-luz__siguiente {
	top: 50%;
	transform: translateY(-50%);
	width: 3rem;
	height: 3rem;
	font-size: 1.1rem;
}

.fp-luz__anterior {
	left: 1rem;
}

.fp-luz__siguiente {
	right: 1rem;
}

.fp-luz__anterior:disabled,
.fp-luz__siguiente:disabled {
	opacity: 0.3;
	cursor: default;
}

.fp-luz__contador {
	position: absolute;
	top: 1.4rem;
	left: 50%;
	transform: translateX(-50%);
	margin: 0;
	color: rgba(255, 255, 255, 0.85);
	font-size: 0.9rem;
}

/* Añadir/quitar el carrito desde el propio lightbox. */
.fp-luz__carrito {
	position: absolute;
	bottom: 1.25rem;
	left: 50%;
	transform: translateX(-50%);
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	border: 0;
	border-radius: 999px;
	padding: 0.6rem 1.2rem;
	background: var(--fp-rojo, #d32029);
	color: #fff;
	font: inherit;
	font-weight: 600;
	font-size: 0.95rem;
	cursor: pointer;
	transition: background 0.15s ease;
}

.fp-luz__carrito:hover {
	background: var(--fp-hover, var(--fp-rojo, #d32029));
}

@media (max-width: 640px) {
	.fp-luz__img {
		max-width: calc(100vw - 5rem);
		max-height: calc(100vh - 9rem);
	}

	.fp-luz__anterior,
	.fp-luz__siguiente {
		width: 2.4rem;
		height: 2.4rem;
	}
}

/* Capa de marca de agua del fotógrafo: encima de la foto, sin tragarse
   los clics (el botón «Elegir» sigue siendo pulsable). */
.fp-embed__marca {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

/* Ni arrastrar ni guardar desde el álbum a simple vista. */
.fp-embed__foto img,
.fp-carrito__foto img {
	-webkit-user-drag: none;
	user-select: none;
}

.fp-embed__estado {
	color: #666;
	font-size: 0.9rem;
	min-height: 1.2em;
}

/* «Cargar más fotos»: píldora con el color de la marca —contorno por
   fuera, sólida al pasar el cursor— y su icono. */
.fp-embed__mas {
	display: flex;
	width: fit-content;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	margin: 1.25rem auto 0;
	border: 1px solid var(--fp-rojo, #d32029);
	background: #fff;
	color: var(--fp-rojo, #d32029);
	border-radius: 999px;
	padding: 0.6rem 1.6rem;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.fp-embed__mas:hover:not(:disabled) {
	/* background explícito: los temas (p. ej. Hello Elementor) tiñen los
	   button:hover y el rosa del tema se colaba aquí. */
	background: var(--fp-hover, var(--fp-rojo, #d32029));
	border-color: var(--fp-hover, var(--fp-rojo, #d32029));
	color: #fff;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18);
}

.fp-embed__mas:disabled {
	opacity: 0.6;
	cursor: default;
}

/* Píldora angosta, flotante a la derecha y centrada verticalmente: siempre
   visible mientras el visitante recorre la galería, sin ocupar el ancho del
   embed. Los fallbacks de color son la red de seguridad: la píldora vive en
   el body, donde las variables de .fp-embed no llegan (si el JavaScript no
   las copia, el fondo no queda transparente). */
.fp-embed__carrito {
	position: fixed;
	right: 1rem;
	left: auto;
	top: 50%;
	bottom: auto;
	transform: translateY(-50%);
	z-index: 90;
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.65rem;
	width: auto;
	max-width: calc(100vw - 2rem);
	background: var(--fp-tinta, #1c1c1e);
	color: #fff;
	border-radius: 14px;
	padding: 0.8rem 1.15rem;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
}

.fp-embed__resumen {
	font-size: 0.88rem;
	line-height: 1.35;
	opacity: 0.85;
}

/* La barra enlaza a la página de selección y compra ([fp_pedido]). */
.fp-embed__continuar {
	display: inline-block;
	background: var(--fp-rojo, #d32029);
	color: #fff;
	border-radius: 8px;
	padding: 0.35rem 0.9rem;
	font-size: 0.85rem;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.fp-embed__continuar:hover {
	background: var(--fp-hover, var(--fp-rojo, #d32029));
	border-color: var(--fp-hover, var(--fp-rojo, #d32029));
	color: #fff;
}

/* ── Página de selección y compra ([fp_pedido]) ────────────────────── */

.fp-carrito__titulo {
	margin: 0 0 1rem;
	font-family: var(--e-global-typography-primary-font-family, inherit), sans-serif;
	font-weight: var(--e-global-typography-primary-font-weight, 700);
}

/* La página vive dentro del contenido del tema: margen inferior para que
   el bloque no pegue con el pie de página (ambos modos, selección y
   seguimiento). */
.fp-carrito {
	margin-bottom: 3rem;
}

.fp-carrito__grupo {
	margin-bottom: 1.5rem;
}

/* Margen fijo debajo del set de fotos, antes de descuentos y total. */
.fp-carrito__grupos {
	margin-bottom: 1.5rem;
}

/* Título del evento y título de los descuentos, misma medida. */
.fp-carrito__grupo-titulo,
.fp-carrito__reglas-titulo {
	margin: 0 0 0.8rem;
	font-family: var(--e-global-typography-primary-font-family, inherit), sans-serif;
	font-weight: var(--e-global-typography-primary-font-weight, 700);
	font-size: 1.4rem;
	color: var(--e-global-color-secondary, #54595f);
}

/* En la página de compra la foto conserva su borde de color: el mismo
   que llevaba al ser añadida desde el álbum. */
.fp-carrito__foto {
	position: relative;
	margin: 0;
	border-radius: 10px;
	overflow: hidden;
	background: var(--fp-suave);
	border: 2px solid var(--fp-rojo);
}

.fp-carrito__foto img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.fp-carrito__foto figcaption {
	position: absolute;
	inset: 0.4rem auto auto 0.4rem;
	background: rgba(255, 255, 255, 0.9);
	border-radius: 6px;
	font-size: 0.72rem;
	padding: 0.1rem 0.45rem;
}

/* Icono de carrito: quita la foto de la selección. */
.fp-carrito__quitar {
	position: absolute;
	inset: auto 0.4rem 0.4rem auto;
	border: 0;
	border-radius: 999px;
	background: rgba(28, 28, 30, 0.75);
	color: #fff;
	line-height: 1;
	font-size: 0.9rem;
	padding: 0.45rem 0.55rem;
	min-width: 2rem;
	min-height: 2rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.fp-carrito__quitar:hover {
	background: var(--fp-hover);
}

.fp-carrito__vacio {
	color: #666;
	padding: 1rem 0;
}

/* Descuentos por lote: cada evento en su fila, con icono. */
.fp-carrito__reglas {
	margin: 0.9rem 0 0;
}

.fp-carrito__reglas-titulo {
	margin-bottom: 0.45rem;
}

/* Filas a la medida de su contenido, no estiradas a la columna. */
.fp-carrito__reglas ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.4rem;
}

.fp-carrito__regla {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
	font-size: 0.9rem;
	background: #fff8e6;
	border: 1px solid #f0dfae;
	border-radius: 8px;
	padding: 0.45rem 0.75rem;
	max-width: 100%;
}

.fp-carrito__regla i {
	color: #c98a12;
	font-size: 0.85rem;
}

.fp-carrito__regla strong {
	color: var(--e-global-color-secondary, #54595f);
}

/* Ya alcanzado: la fila se tiñe de verde con un check. */
.fp-carrito__regla--ok {
	background: #eaf7ee;
	border-color: #bfe3c9;
}

.fp-carrito__regla--ok i {
	color: #1e7e34;
}

.fp-carrito__total {
	font-weight: 600;
	font-size: 1.05rem;
	margin: 0.4rem 0 1rem;
}

.fp-carrito__checkout {
	border: 1px solid #e4e4e7;
	border-radius: 10px;
	padding: 1rem 1.2rem;
	background: #fff;
	max-width: 480px;
}

.fp-carrito__checkout h3 {
	margin-top: 0;
}

.fp-carrito__checkout label {
	display: block;
	margin-bottom: 0.7rem;
	font-weight: 600;
	font-size: 0.9rem;
}

.fp-carrito__checkout input {
	display: block;
	width: 100%;
	margin-top: 0.25rem;
	font: inherit;
	padding: 0.45rem 0.6rem;
	border: 1px solid #d7d7db;
	border-radius: 6px;
}

.fp-carrito__checkout input:focus {
	outline: 2px solid var(--fp-hover);
	outline-offset: 1px;
}

/* Teléfono: prefijo venezolano (0412…) en un selector estrecho y7
   dígitos en un campo amplio. */
.fp-carrito__telefono {
	display: flex;
	gap: 0.5rem;
	margin-top: 0.25rem;
}

.fp-carrito__telefono select {
	flex: 0 0 5.75rem;
	width: 5.75rem;
	font: inherit;
	font-size: 0.95rem;
	padding: 0.45rem 0.4rem;
	border: 1px solid #d7d7db;
	border-radius: 6px;
	background: #fff;
	color: var(--e-global-color-text, #7a7a7a);
	-webkit-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%237a7a7a'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.45rem center;
	padding-right: 1.3rem;
}

.fp-carrito__telefono select:focus {
	outline: 2px solid var(--fp-hover);
	outline-offset: 1px;
}

.fp-carrito__telefono input {
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
	margin-top: 0;
}

.fp-carrito__fallo {
	color: #b00020;
	margin: 0.6rem 0 0;
}

.fp-carrito__acciones {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin: 1rem 0;
}

.fp-carrito__seguir {
	color: var(--e-global-color-primary, #ff9933);
	font-weight: 600;
}

.fp-carrito__seguir:hover {
	color: var(--fp-hover);
}

.fp-carrito__vaciar {
	border: 1px solid #d7d7db;
	background: #fff;
	border-radius: 6px;
	padding: 0.4rem 0.9rem;
	cursor: pointer;
	font: inherit;
	font-size: 0.85rem;
	color: var(--e-global-color-secondary, #54595f);
}

.fp-carrito__vaciar:hover {
	/* background explícito contra el color de hover del tema. */
	background: #fff;
	border-color: var(--fp-hover);
	color: var(--fp-hover);
}

.fp-carrito__hecho h3 {
	margin: 0 0 0.4rem;
	font-family: var(--e-global-typography-primary-font-family, inherit), sans-serif;
}

/* Formulario de contacto y confirmación (compartido). */
.fp-embed__confirmar {
	border: 1px solid var(--fp-rojo);
	background: var(--fp-rojo);
	color: #fff;
	border-radius: 8px;
	padding: 0.55rem 1.3rem;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}

.fp-embed__confirmar:hover:not(:disabled) {
	background: var(--fp-hover);
	border-color: var(--fp-hover);
}

.fp-embed__confirmar:disabled {
	opacity: 0.6;
	cursor: default;
}

.fp-embed__nota {
	color: #666;
	font-size: 0.88rem;
	margin-top: 0;
}

/* Seguimiento: panel de pedido (confirmación y página «Mi pedido»). */
.fp-carrito__panel-pedido {
	margin-top: 0.75rem;
}

/* WhatsApp: aviso, mensaje copiable, botones y teléfono del fotógrafo. */
.fp-carrito__whatsapp {
	margin: 0.9rem 0;
	padding: 0.9rem 1rem;
	background: var(--fp-suave, #f5f5f7);
	border: 1px solid #e4e4e7;
	border-radius: 10px;
}

.fp-carrito__wa-aviso {
	margin: 0 0 0.6rem;
	font-size: 0.92rem;
}

.fp-carrito__wa-mensaje {
	margin: 0 0 0.7rem;
	padding: 0.6rem 0.75rem;
	background: #fff;
	border: 1px dashed #d7d7db;
	border-radius: 8px;
	font-size: 0.85rem;
	white-space: pre-wrap;
	word-break: break-word;
	max-height: 10rem;
	overflow: auto;
}

.fp-carrito__wa-botones {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 0.5rem;
}

.fp-carrito__wa-copiar,
.fp-carrito__wa-abrir {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	font: inherit;
	font-weight: 600;
	font-size: 0.9rem;
	border-radius: 999px;
	padding: 0.5rem 1.1rem;
	cursor: pointer;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease, filter 0.15s ease;
}

.fp-carrito__wa-copiar {
	border: 1px solid var(--fp-rojo, #d32029);
	background: #fff;
	color: var(--fp-rojo, #d32029);
}

.fp-carrito__wa-copiar:hover {
	background: var(--fp-hover, var(--fp-rojo, #d32029));
	border-color: var(--fp-hover, var(--fp-rojo, #d32029));
	color: #fff;
}

.fp-carrito__wa-abrir {
	border: 0;
	background: #25d366;
	color: #fff;
}

.fp-carrito__wa-abrir:hover {
	filter: brightness(0.95);
	color: #fff;
}

.fp-carrito__wa-tel {
	margin: 0;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--e-global-color-secondary, #54595f);
}

.fp-embed__estado-pedido {
	font-weight: 600;
	margin: 0.25rem 0;
}

.fp-embed__estado-pedido--completed {
	color: #1e7e34;
}

.fp-embed__estado-pedido--cancelled {
	color: #b00020;
}

.fp-carrito__panel-pedido .fp-embed__grid {
	margin-top: 0.5rem;
}

/* â”€â”€ Listado de eventos ([fp_eventos]) â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
/* Las tarjetas se cuelgan del diseño del sitio: en Elementor heredan las
   variables globales del kit (--e-global-*, p. ej. Raleway 800 para
   títulos, Montserrat para el texto y el color primario del sitio para
   los iconos); sin ellas, mandan los valores por defecto. */

/* Masonry por columnas CSS: 2 columnas en escritorio y 1 en móvil, con
   tarjetas horizontales — portada a la izquierda y datos a la derecha—
   que fluyen hacia abajo en cada columna. */
.fp-eventos__grid {
	column-count: 2;
	column-gap: 1.5rem;
}

@media (max-width: 640px) {
	.fp-eventos__grid {
		column-count: 1;
	}
}

.fp-eventos__tarjeta {
	display: flex;
	break-inside: avoid;
	page-break-inside: avoid;
	margin-bottom: 1.5rem;
	background: #fff;
	border: 1px solid #e4e4e7;
	border-radius: 8px;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	font-family: var(--e-global-typography-text-font-family, inherit), sans-serif;
	box-shadow: 0 2px 8px rgba(84, 89, 95, 0.08);
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

a.fp-eventos__tarjeta:hover {
	transform: translateY(-4px);
	border-color: var(--e-global-color-primary, #ff9933);
	box-shadow: 0 12px 28px rgba(84, 89, 95, 0.18);
}

/* Sin página aún (la siguiente visita la crea): no se simula un enlace. */
.fp-eventos__tarjeta--sinenlace {
	opacity: 0.75;
}

.fp-eventos__portada {
	position: relative;
	flex: 0 0 40%;
	min-height: 108px;
	background: var(--fp-suave);
}

.fp-eventos__portada img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.fp-eventos__sinportada {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, var(--fp-suave), #e8e8ec);
}

.fp-eventos__aviso {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	background: var(--e-global-color-secondary, rgba(84, 89, 95, 0.85));
	color: #fff;
	border-radius: 999px;
	font-size: 0.72rem;
	padding: 0.15rem 0.6rem;
}

.fp-eventos__cuerpo {
	flex: 1;
	min-width: 0;
	padding: 0.8rem 1rem;
}

.fp-eventos__titulo {
	margin: 0 0 0.5rem;
	font-family: var(--e-global-typography-primary-font-family, inherit), sans-serif;
	font-weight: var(--e-global-typography-primary-font-weight, 700);
	font-size: 1.1rem;
	line-height: 1.3;
}

.fp-eventos__fila {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0.2rem 0;
	font-size: 0.88rem;
	color: var(--e-global-color-text, #7a7a7a);
}

/* El icono lleva el color primario del sitio (naranja en Españalzola). */
.fp-eventos__fila i {
	color: var(--e-global-color-primary, #ff9933);
	width: 1.1em;
	text-align: center;
	font-size: 0.95rem;
}

.fp-eventos__fotos {
	font-weight: 600;
	color: var(--e-global-color-secondary, #54595f);
}

.fp-eventos__vacio {
	text-align: center;
	color: #666;
	padding: 1.5rem 0;
}

.fp-eventos__mas {
	margin-top: 1.5rem;
	text-align: center;
}

.fp-eventos__cargarmas {
	font: inherit;
	font-family: var(--e-global-typography-text-font-family, inherit), sans-serif;
	font-weight: 600;
	border: 1px solid #d7d7db;
	background: #fff;
	border-radius: 6px;
	padding: 0.55rem 1.5rem;
	cursor: pointer;
	transition: border-color 0.2s ease, color 0.2s ease;
}

.fp-eventos__cargarmas:hover:not(:disabled) {
	border-color: var(--e-global-color-primary, #ff9933);
	color: var(--e-global-color-primary, #ff9933);
}

.fp-eventos__cargarmas:disabled {
	opacity: 0.6;
	cursor: default;
}

/* Buscador del listado: título, ubicación y rango de fechas. */
.fp-eventos__buscador {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 0.8rem;
	margin-bottom: 1.5rem;
	padding: 1rem;
	background: #fff;
	border: 1px solid #e4e4e7;
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(84, 89, 95, 0.06);
	font-family: var(--e-global-typography-text-font-family, inherit), sans-serif;
}

.fp-eventos__campo {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.fp-eventos__campo label {
	font-size: 0.78rem;
	font-weight: 600;
	color: var(--e-global-color-secondary, #54595f);
}

.fp-eventos__campo input {
	font: inherit;
	font-size: 0.9rem;
	padding: 0.45rem 0.6rem;
	border: 1px solid #d7d7db;
	border-radius: 6px;
	background: #fff;
	color: var(--e-global-color-text, #7a7a7a);
	min-width: 0;
}

.fp-eventos__campo input:focus {
	outline: 2px solid var(--e-global-color-primary, #ff9933);
	outline-offset: 1px;
	border-color: var(--e-global-color-primary, #ff9933);
}

.fp-eventos__campo--titulo {
	flex: 1 1 200px;
}

.fp-eventos__campo--lugar {
	flex: 1 1 180px;
}

.fp-eventos__campo--fecha {
	flex: 0 1 160px;
}

.fp-eventos__acciones {
	display: flex;
	gap: 0.5rem;
	margin-left: auto;
}

.fp-eventos__buscar,
.fp-eventos__limpiar {
	font: inherit;
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	border-radius: 6px;
	padding: 0.5rem 1.1rem;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.fp-eventos__buscar {
	border: 1px solid var(--e-global-color-primary, #ff9933);
	background: var(--e-global-color-primary, #ff9933);
	color: #fff;
}

.fp-eventos__buscar:hover:not(:disabled) {
	filter: brightness(0.92);
}

.fp-eventos__buscar:disabled {
	opacity: 0.6;
	cursor: default;
}

.fp-eventos__limpiar {
	border: 1px solid #d7d7db;
	background: #fff;
	color: var(--e-global-color-secondary, #54595f);
}

.fp-eventos__limpiar:hover {
	border-color: var(--e-global-color-primary, #ff9933);
	color: var(--e-global-color-primary, #ff9933);
}
