From fe24b3e72424945c5f8a88c09a4f636aafb50f07 Mon Sep 17 00:00:00 2001
From: josedario87 <jodarioel87@gmail.com>
Date: Sun, 19 Oct 2025 01:40:06 -0600
Subject: [PATCH] Refactor: Simplificar SelectorFamilia y agregar iconos
 contextuales
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Eliminar títulos de secciones para interfaz más limpia
  - Quitar "Categorías (selección múltiple)"
  - Quitar "Subcategorías (selección múltiple)"
  - Quitar "Nota Específica"

- Implementar iconos contextuales para marcar selecciones
  - Fragancia/Aroma: i-lucide-wind (viento/aroma)
  - Sabor: i-lucide-ice-cream-cone (comida/sabor)
  - Aplicar tanto en categorías como subcategorías
  - Reemplazar check genérico por iconos específicos según tipo

- Interfaz más intuitiva con iconos semánticos
---
 nuxt4/app/components/cata/SelectorFamilia.vue | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/nuxt4/app/components/cata/SelectorFamilia.vue b/nuxt4/app/components/cata/SelectorFamilia.vue
index b741d20..7a4f6d7 100644
--- a/nuxt4/app/components/cata/SelectorFamilia.vue
+++ b/nuxt4/app/components/cata/SelectorFamilia.vue
@@ -8,7 +8,6 @@
 
     <!-- Nivel 1: Categorías principales (selección múltiple) -->
     <div class="nivel-container">
-      <h4 class="nivel-title cata-text">Categorías (selección múltiple)</h4>
       <div class="categorias-grid">
         <button
           v-for="categoria in categoriasDisponibles"
@@ -35,7 +34,7 @@
           </div>
           <UIcon
             v-if="modelValue.categorias.includes(categoria)"
-            name="i-lucide-check-circle"
+            :name="tipo === 'fragancia-aroma' ? 'i-lucide-wind' : 'i-lucide-ice-cream-cone'"
             class="categoria-check"
           />
         </button>
@@ -44,7 +43,6 @@
 
     <!-- Nivel 2: Subcategorías (unión de todas las categorías seleccionadas, selección múltiple) -->
     <div v-if="subcategoriasDisponibles.length > 0" class="nivel-container mt-4">
-      <h4 class="nivel-title cata-text">Subcategorías (selección múltiple)</h4>
       <div class="subcategorias-grid">
         <button
           v-for="subcategoria in subcategoriasDisponibles"
@@ -64,7 +62,7 @@
           <span class="subcategoria-text cata-text">{{ subcategoria }}</span>
           <UIcon
             v-if="modelValue.subcategorias.includes(subcategoria)"
-            name="i-lucide-check"
+            :name="tipo === 'fragancia-aroma' ? 'i-lucide-wind' : 'i-lucide-ice-cream-cone'"
             class="subcategoria-check"
           />
         </button>
@@ -73,7 +71,6 @@
 
     <!-- Nivel 3: Nota específica (input libre) -->
     <div v-if="modelValue.categorias.length > 0" class="nivel-container mt-4">
-      <h4 class="nivel-title cata-text">Nota Específica</h4>
       <input
         v-model="notaEspecificaLocal"
         type="text"