/* Utilidades para mostrar/ocultar contenido segun dispositivo,
   ya que la propiedad "display" no se compila en los estilos atomicos de Elementor. */

.soon-hide-mobile {
	display: block !important;
}
.soon-show-mobile {
	display: none !important;
}

/* Variantes para contenedores flex (filas/columnas con varios hijos):
   usar estas en vez de las de arriba cuando el elemento oculto/mostrado
   es un e-flexbox, para no perder su layout en fila/columna. */
.soon-hide-mobile-flex {
	display: flex !important;
}
.soon-show-mobile-flex {
	display: none !important;
}

@media (max-width: 767px) {
	.soon-hide-mobile {
		display: none !important;
	}
	.soon-show-mobile {
		display: block !important;
	}
	.soon-hide-mobile-flex {
		display: none !important;
	}
	.soon-show-mobile-flex {
		display: flex !important;
	}
}

/* Elementor tampoco compila "white-space" ni "flex-shrink" en sus estilos
   atomicos (se pierden en silencio igual que "display"). Usar esta clase
   cuando un texto corto dentro de un flex row no debe partirse en 2 lineas. */
.soon-nowrap {
	white-space: nowrap !important;
	flex-shrink: 0 !important;
}