/**
 * Public-facing styles
 *
 * @package ProductRecommender
 */

/* ==========================================================================
   CLASES POR TIPO DE NODO
   ==========================================================================

   NODO INICIAL (Primera pregunta del flujo)
   ------------------------------------------
   Clase: .product-recommender-node--initial
   Uso: Se aplica al primer nodo del cuestionario (el que tiene main: true)
   Ejemplo: La primera pregunta que ve el usuario al iniciar

   NODO INTERMEDIO (Preguntas con opciones)
   ------------------------------------------
   Clase: .product-recommender-node--intermediate
   Uso: Se aplica a todos los nodos de preguntas que NO son el inicial
   Ejemplo: Preguntas 2, 3, 4... con sus opciones para seleccionar

   NODO FINAL (Resultados/Productos)
   ------------------------------------------
   Clase: .product-recommender-node--final
   Uso: Se aplica al contenedor de resultados cuando muestra productos
   Ejemplo: La pantalla final con los productos recomendados

   CLASES DE IMAGEN
   ------------------------------------------
   Clase: .product-recommender-node--has-image
   Uso: Se aplica cuando el nodo tiene una imagen configurada
   Ejemplo: .product-recommender-node--initial.product-recommender-node--has-image

   Clase: .product-recommender-node--no-image
   Uso: Se aplica cuando el nodo NO tiene imagen
   Ejemplo: .product-recommender-node--intermediate.product-recommender-node--no-image

   ATRIBUTO DE PASO
   ------------------------------------------
   Atributo: [data-step="N"]
   Uso: Indica el numero de paso actual (1, 2, 3, etc.)
   Ejemplo: [data-step="1"] es el primer paso, [data-step="2"] el segundo...

   ========================================================================== */

/* --------------------------------------------------------------------------
   ESTILOS BASE
   -------------------------------------------------------------------------- */

.question-description {
    white-space: pre-line;
}

/* --------------------------------------------------------------------------
   NODO INICIAL
   Primera pregunta del cuestionario (main: true)
   -------------------------------------------------------------------------- */