/**
 * Arreglo flechas hero: Prime Slider General (BDThemes) + fallback Swiper Elementor.
 *
 * Tras activar el child o cambiar este archivo:
 * - WordPress: Elementor > Herramientas > Regenerar archivos y datos.
 * - Vaciar caché (WP Super Cache / hosting) y probar en ventana privada.
 *
 * Diagnóstico en navegador (F12): inspeccionar clic en la flecha; si resalta otra
 * capa (mapa, overlay), subir z-index del slider o mover ese widget en Elementor.
 */

/*
 * La columna vecina (otro .elementor-widget-wrap) suele solaparse por ancho/márgenes
 * y quedar encima en el paint order; hay que subir toda la columna del slider.
 */
.elementor-column:has(.elementor-widget-prime-slider-general) {
	position: relative;
	z-index: 100 !important;
}

/* Widget prime-slider-general — capa interna */
.elementor-widget-prime-slider-general {
	position: relative;
	z-index: 10;
}

.elementor-widget-prime-slider-general .elementor-widget-container {
	position: relative;
	z-index: 1;
}

.elementor-widget-prime-slider-general .bdt-prime-slider .bdt-position-relative.bdt-visible-toggle {
	position: relative;
	z-index: 2;
}

/*
 * Prime Slider General: el plugin pone ambas flechas con bdt-position-bottom-right (misma esquina).
 * Mismo HTML y mismos atributos bdt-slidenav (no se “borran” flechas en PHP): se reubican con flex
 * a borde izquierdo / derecho y centro vertical del área del slide.
 */
.elementor-widget-prime-slider-general
	.bdt-position-relative.bdt-visible-toggle
	> .reveal-muted:has(.bdt-prime-slider-previous) {
	position: absolute;
	inset: 0;
	z-index: 30;
	pointer-events: none;
	display: flex !important;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	padding: 0 max(0.75rem, env(safe-area-inset-right)) 0 max(0.75rem, env(safe-area-inset-left));
	box-sizing: border-box;
}

.elementor-widget-prime-slider-general .bdt-prime-slider-previous.bdt-position-bottom-right,
.elementor-widget-prime-slider-general .bdt-prime-slider-next.bdt-position-bottom-right {
	position: static !important;
	top: auto !important;
	right: auto !important;
	bottom: auto !important;
	left: auto !important;
	margin: 0 !important;
	transform: none !important;
	z-index: 200 !important;
	pointer-events: auto !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

/*
 * Móvil: flechas abajo en las esquinas (no al medio del slide).
 * Padding lateral simétrico: el FAB/WA suele quedar más abajo en el viewport y no exige hueco extra aquí.
 */
@media (max-width: 767px) {
	.elementor-widget-prime-slider-general
		.bdt-position-relative.bdt-visible-toggle
		> .reveal-muted:has(.bdt-prime-slider-previous) {
		align-items: flex-end;
		padding-top: 0;
		padding-bottom: max(0.65rem, calc(env(safe-area-inset-bottom) + 0.5rem));
		padding-left: max(0.65rem, env(safe-area-inset-left));
		padding-right: max(0.65rem, env(safe-area-inset-right));
	}

	/*
	 * Ken Burns: solo recorte suave (sin clip-path / will-change / JS de alto: peleaban con el plugin
	 * y el borde “temblaba” más rápido).
	 */
	.elementor-widget-prime-slider-general .bdt-position-relative.bdt-visible-toggle.bdt-slideshow {
		overflow: hidden;
	}

	.elementor-widget-prime-slider-general .bdt-slideshow-items,
	.elementor-widget-prime-slider-general .bdt-slideshow-item,
	.elementor-widget-prime-slider-general .bdt-slideshow-item .bdt-position-cover.bdt-animation-kenburns {
		overflow: hidden;
	}
}

/*
 * Skin “general” del plugin: en hover alarga el botón, redondea como píldora y desplaza el SVG.
 * Color de hover acorde al sitio; círculo fijo y flecha sin animación.
 */
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-previous:hover,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-next:hover {
	background: var(--chaniar-brand-accent) !important;
	border-color: var(--chaniar-brand-accent) !important;
	width: 36px !important;
	height: 36px !important;
	min-width: 36px !important;
	max-width: 36px !important;
	border-radius: 50% !important;
	transform: none !important;
	box-sizing: border-box !important;
}

.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-previous:hover::before,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-next:hover::before {
	width: 0 !important;
	opacity: 0 !important;
}

.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-previous:hover svg,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-next:hover svg {
	transform: none !important;
}

@media (min-width: 768px) {
	.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-previous:hover,
	.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-next:hover {
		width: 48px !important;
		height: 48px !important;
		min-width: 48px !important;
		max-width: 48px !important;
	}
}

/*
 * Legibilidad del texto blanco sobre fotos claras del hero (Prime Slider):
 * recuadro semitransparente oscuro + sombra suave en títulos.
 * El alto del recuadro sigue al contenido (sin hueco vacío abajo en flex del slide).
 */
.elementor-widget-prime-slider-general .bdt-slideshow-item.bdt-flex > .bdt-prime-slider-wrapper {
	flex: 0 0 auto;
	align-self: center;
	height: auto !important;
	min-height: 0 !important;
}

.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-prime-slider-content,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-content,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-meteor .bdt-prime-slider-content {
	height: auto !important;
	min-height: 0 !important;
}

.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-prime-slider-desc,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-meteor .bdt-prime-slider-desc {
	position: relative;
	z-index: 2;
	display: block;
	/*
	 * No usar fit-content: el bloque se encogía al “min-content” del título y el h2
	 * pasaba a dos líneas aunque hubiera sitio en el slide.
	 */
	width: min(100%, 52rem);
	max-width: min(100%, 52rem);
	min-width: 0;
	box-sizing: border-box;
	height: auto !important;
	min-height: 0 !important;
	margin-left: auto;
	margin-right: auto;
	flex: none;
	align-self: stretch;
	padding: clamp(1rem, 3vw, 1.75rem) clamp(1.25rem, 4vw, 2.75rem);
	border-radius: 14px;
	background: rgba(0, 0, 0, 0.5);
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.22);
}

.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-prime-slider-desc .bdt-title-tag,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc .bdt-title-tag,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-meteor .bdt-prime-slider-desc .bdt-title-tag {
	max-width: 100%;
}

/* Título principal del slide: el kit/Elementor suele dejarlo enorme; tope legible en desktop. */
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-prime-slider-desc .bdt-title-tag,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-prime-slider-desc .bdt-title-tag :where(h1, h2, h3, h4),
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc .bdt-title-tag,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc .bdt-title-tag :where(h1, h2, h3, h4),
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-meteor .bdt-prime-slider-desc .bdt-title-tag,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-meteor .bdt-prime-slider-desc .bdt-title-tag :where(h1, h2, h3, h4) {
	font-size: clamp(1.6rem, 3vw + 0.7rem, 3.4rem) !important;
	line-height: 1.12 !important;
}

.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-prime-slider-desc .bdt-ps-sub-title {
	color: var(--chaniar-false-white) !important;
}

.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc .bdt-sub-title .bdt-ps-sub-title {
	color: rgba(var(--chaniar-false-white-rgb), 0.95) !important;
}

.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-prime-slider-desc .bdt-title-tag,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-prime-slider-desc .bdt-ps-sub-title,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-slide-text-mobile .bdt-slider-excerpt,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc .bdt-title-tag,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc .bdt-ps-sub-title,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-meteor .bdt-prime-slider-desc .bdt-title-tag,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-meteor .bdt-prime-slider-desc .bdt-ps-sub-title {
	color: var(--chaniar-false-white) !important;
	text-shadow: var(--chaniar-hero-text-shadow) !important;
}

.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-prime-slider-desc .bdt-slider-excerpt,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc .bdt-slider-excerpt,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-meteor .bdt-prime-slider-desc .bdt-slider-excerpt {
	color: var(--chaniar-false-white) !important;
	text-shadow: var(--chaniar-hero-text-shadow) !important;
}

.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-prime-slider-desc .bdt-slider-excerpt p,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-prime-slider-desc .bdt-slider-excerpt strong,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-prime-slider-desc .bdt-slider-excerpt span,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc .bdt-slider-excerpt p,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc .bdt-slider-excerpt strong,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc .bdt-slider-excerpt span,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-meteor .bdt-prime-slider-desc .bdt-slider-excerpt p,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-meteor .bdt-prime-slider-desc .bdt-slider-excerpt strong,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-meteor .bdt-prime-slider-desc .bdt-slider-excerpt span {
	color: inherit !important;
	text-shadow: var(--chaniar-hero-text-shadow) !important;
}

/* Skin general: reduce hueco vertical entre título/texto y elimina bloque vacío de botón */
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc .bdt-slider-excerpt {
	margin: 0.85rem 0 0 !important;
	max-width: 42rem;
}

.elementor-widget-prime-slider-general .bdt-prime-slider-skin-slide .bdt-prime-slider-desc .bdt-slider-excerpt,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-meteor .bdt-prime-slider-desc .bdt-slider-excerpt {
	max-width: 42rem;
}


.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc .bdt-btn-wrapper:empty,
.elementor-widget-prime-slider-general .bdt-prime-slider-skin-general .bdt-prime-slider-desc > div:has(.bdt-btn-wrapper:empty) {
	display: none !important;
}

/* Otros carruseles Elementor (por si el hero cambia de widget) */
.elementor-widget-slides .swiper-button-prev,
.elementor-widget-slides .swiper-button-next,
.elementor-widget-image-carousel .swiper-button-prev,
.elementor-widget-image-carousel .swiper-button-next,
.elementor-widget-media-carousel .swiper-button-prev,
.elementor-widget-media-carousel .swiper-button-next {
	z-index: 50 !important;
	pointer-events: auto !important;
}