/**
 * Encina — Fecha de Entrega Estimada
 * Estilos del widget frontend
 *
 * Diseñados para integrarse con la paleta y tipografía
 * existente en encinadonalberto.com (Montserrat, #7f1810, #2e2e2d).
 *
 * @package EncinaFechaEntrega
 * @version 1.0.0
 */

/* ----------------------------------------------------------
   Wrapper principal del widget
   ---------------------------------------------------------- */
.encina-entrega-wrapper {
	display:          inline-flex;
	align-items:      center;
	gap:              7px;
	font-family:      Montserrat, sans-serif;
	font-size:        11px;
	font-weight:      500;
	letter-spacing:   0.18em;
	line-height:      2em;
	text-transform:   uppercase;
	color:            #2e2e2d;

	/* Evitar que el layout se rompa mientras carga */
	min-height:       22px;
}

/* ----------------------------------------------------------
   Icono SVG
   ---------------------------------------------------------- */
.encina-entrega-icono {
	display:          inline-flex;
	align-items:      center;
	flex-shrink:      0;
	color:            #7f1810;
	opacity:          0.85;
}

.encina-entrega-icono svg {
	display:          block;
}

/* ----------------------------------------------------------
   Texto del mensaje
   ---------------------------------------------------------- */
.encina-entrega-texto {
	display:          none; /* JS lo activa cuando carga la fecha */
	align-items:      center;
	gap:              4px;
}

.encina-entrega-texto strong {
	color:            #7f1810;
	font-weight:      600;
}

/* ----------------------------------------------------------
   Responsive: en móvil reducir el tamaño si el header
   no tiene espacio suficiente
   ---------------------------------------------------------- */
@media only screen and (max-width: 767.98px) {
	.encina-entrega-wrapper {
		font-size:      10px;
		letter-spacing: 0.12em;
		gap:            5px;
	}
}

/* ----------------------------------------------------------
   Carrusel (v1.6.0)
   ---------------------------------------------------------- */

.encina-widget-wrapper--carousel {
	/* El wrapper necesita altura definida para que los slides
	   absolutos no colapsen el layout */
	position:        relative;
}

.encina-carousel {
	position:        relative;
	display:         inline-flex;
	align-items:     center;
	/* Altura mínima = altura de una línea de texto para evitar
	   que el wrapper salte cuando cambia el slide */
	min-height:      1.4em;
}

.encina-carousel-slide {
	display:         inline-flex;
	align-items:     center;
	gap:             4px;
	white-space:     nowrap;
	/* El primer slide empieza visible, el resto oculto.
	   JS gestiona la transición. */
}

/* El slide activo es relative (ocupa espacio).
   Los inactivos son absolute (no ocupan espacio). */
.encina-carousel-slide[aria-hidden="true"] {
	pointer-events:  none;
}

/* Respetar preferencia de movimiento reducido:
   si el usuario lo ha activado, desactivar transiciones */
@media ( prefers-reduced-motion: reduce ) {
	.encina-carousel-slide {
		transition: none !important;
	}
}

/* ----------------------------------------------------------
   Enlace del widget (v1.6.1)
   ---------------------------------------------------------- */

.encina-widget-link {
	/* Hereda color y tipografía del widget — sin estilos propios */
	color:           inherit;
	text-decoration: none;
	display:         inline-flex;
	align-items:     center;
	gap:             inherit;
	transition:      opacity 0.2s ease;
}

.encina-widget-link:hover {
	/* La opacidad en hover se controla desde el panel de Elementor.
	   Este valor es el fallback si no se ha configurado. */
	opacity: 0.7;
}

.encina-widget-link:focus-visible {
	/* Accesibilidad: indicador de foco visible para navegación con teclado */
	outline:        2px solid currentColor;
	outline-offset: 3px;
	border-radius:  2px;
}

/* ----------------------------------------------------------
   Slider (v1.9.0)
   ---------------------------------------------------------- */
.encina-widget-wrapper--slider {
	position: relative;
}

.encina-slider {
	position:    relative;
	display:     inline-flex;
	align-items: center;
	min-height:  1.4em;
	/* overflow:hidden evita que los slides salientes sean visibles
	   fuera del contenedor en las animaciones de deslizamiento */
	overflow:    hidden;
}

.encina-slider-slide {
	display:     inline-flex;
	align-items: center;
	gap:         4px;
	white-space: nowrap;
	will-change: transform, opacity;
}

/* prefers-reduced-motion: desactivar transiciones */
@media (prefers-reduced-motion: reduce) {
	.encina-slider-slide {
		transition: none !important;
	}
}