{
  "component_name": "navbar",
  "version": "1.0.0",
  "description": "Barra de navegación principal con menú Bootstrap, logo y botón CTA",
  "groups": {
    "visibility": {
      "label": "Visibilidad",
      "priority": 10,
      "fields": {
        "is_enabled": {
          "type": "boolean",
          "label": "Mostrar navbar",
          "default": true,
          "required": true,
          "description": "Activa o desactiva la barra de navegación"
        },
        "is_sticky": {
          "type": "boolean",
          "label": "Navbar fijo (sticky)",
          "default": true,
          "description": "Mantiene el navbar fijo al hacer scroll"
        },
        "hide_on_scroll": {
          "type": "boolean",
          "label": "Ocultar al hacer scroll hacia abajo",
          "default": false,
          "description": "Oculta el navbar cuando el usuario hace scroll hacia abajo"
        },
        "show_on_mobile": {
          "type": "boolean",
          "label": "Mostrar en dispositivos móviles",
          "default": true,
          "description": "Muestra el navbar en pantallas pequeñas con menú hamburguesa"
        }
      }
    },
    "logo": {
      "label": "Logo",
      "priority": 20,
      "fields": {
        "logo_type": {
          "type": "select",
          "label": "Tipo de logo",
          "default": "image",
          "options": {
            "image": "Imagen",
            "text": "Texto",
            "none": "Sin logo"
          },
          "required": true,
          "description": "Define el tipo de logo a mostrar"
        },
        "logo_image_url": {
          "type": "media",
          "label": "Imagen del logo",
          "default": "",
          "media_type": "image",
          "conditional_logic": {
            "field": "logo_type",
            "operator": "==",
            "value": "image"
          },
          "required": true,
          "description": "Sube la imagen del logo (recomendado: PNG transparente)"
        },
        "logo_image_width": {
          "type": "number",
          "label": "Ancho del logo (px)",
          "default": 150,
          "min": 50,
          "max": 400,
          "conditional_logic": {
            "field": "logo_type",
            "operator": "==",
            "value": "image"
          },
          "description": "Ancho del logo en píxeles"
        },
        "logo_text": {
          "type": "text",
          "label": "Texto del logo",
          "default": "",
          "maxlength": 50,
          "conditional_logic": {
            "field": "logo_type",
            "operator": "==",
            "value": "text"
          },
          "description": "Texto a mostrar como logo"
        },
        "logo_link": {
          "type": "url",
          "label": "Enlace del logo",
          "default": "",
          "placeholder": "Dejar vacío para usar la URL del home",
          "description": "URL de destino al hacer clic en el logo"
        },
        "logo_position": {
          "type": "select",
          "label": "Posición del logo",
          "default": "left",
          "options": {
            "left": "Izquierda",
            "center": "Centro",
            "right": "Derecha"
          },
          "description": "Posición del logo en el navbar"
        }
      }
    },
    "menu": {
      "label": "Menú de Navegación",
      "priority": 30,
      "fields": {
        "menu_location": {
          "type": "select",
          "label": "Ubicación del menú",
          "default": "primary",
          "options": {
            "primary": "Menú Principal",
            "secondary": "Menú Secundario",
            "custom": "Menú personalizado"
          },
          "required": true,
          "description": "Selecciona qué menú de WordPress mostrar"
        },
        "custom_menu_id": {
          "type": "number",
          "label": "ID del menú personalizado",
          "default": 0,
          "min": 0,
          "conditional_logic": {
            "field": "menu_location",
            "operator": "==",
            "value": "custom"
          },
          "description": "ID del menú personalizado de WordPress"
        },
        "menu_alignment": {
          "type": "select",
          "label": "Alineación del menú",
          "default": "left",
          "options": {
            "left": "Izquierda",
            "center": "Centro",
            "right": "Derecha"
          },
          "description": "Alineación de los items del menú"
        },
        "enable_dropdowns": {
          "type": "boolean",
          "label": "Habilitar menús desplegables",
          "default": true,
          "description": "Permite submenús desplegables"
        },
        "dropdown_animation": {
          "type": "select",
          "label": "Animación de dropdowns",
          "default": "fade",
          "options": {
            "none": "Sin animación",
            "fade": "Aparecer gradualmente",
            "slide": "Deslizar"
          },
          "conditional_logic": {
            "field": "enable_dropdowns",
            "operator": "==",
            "value": true
          },
          "description": "Tipo de animación para los submenús"
        },
        "mobile_breakpoint": {
          "type": "select",
          "label": "Breakpoint para menú móvil",
          "default": "lg",
          "options": {
            "sm": "Small (576px)",
            "md": "Medium (768px)",
            "lg": "Large (992px)",
            "xl": "Extra Large (1200px)"
          },
          "description": "Punto de quiebre para mostrar menú hamburguesa"
        }
      }
    },
    "cta_button": {
      "label": "Botón CTA (Call to Action)",
      "priority": 40,
      "fields": {
        "button_enabled": {
          "type": "boolean",
          "label": "Mostrar botón CTA",
          "default": true,
          "description": "Activa o desactiva el botón de llamada a la acción"
        },
        "button_text": {
          "type": "text",
          "label": "Texto del botón",
          "default": "Let's Talk",
          "maxlength": 30,
          "conditional_logic": {
            "field": "button_enabled",
            "operator": "==",
            "value": true
          },
          "required": true,
          "description": "Texto que aparece en el botón"
        },
        "button_icon": {
          "type": "text",
          "label": "Ícono del botón",
          "default": "bi-lightning-charge-fill",
          "placeholder": "Ej: bi-lightning-charge-fill",
          "conditional_logic": {
            "field": "button_enabled",
            "operator": "==",
            "value": true
          },
          "description": "Clase del ícono Bootstrap (dejar vacío para sin ícono)"
        },
        "button_action_type": {
          "type": "select",
          "label": "Tipo de acción del botón",
          "default": "modal",
          "options": {
            "modal": "Abrir modal",
            "link": "Ir a URL",
            "scroll": "Scroll a sección"
          },
          "conditional_logic": {
            "field": "button_enabled",
            "operator": "==",
            "value": true
          },
          "required": true,
          "description": "Acción que se ejecuta al hacer clic"
        },
        "button_modal_target": {
          "type": "text",
          "label": "ID del modal",
          "default": "#contactModal",
          "placeholder": "#contactModal",
          "conditional_logic": {
            "field": "button_action_type",
            "operator": "==",
            "value": "modal"
          },
          "required": true,
          "description": "ID del modal de Bootstrap a abrir (incluir #)"
        },
        "button_link_url": {
          "type": "url",
          "label": "URL del enlace",
          "default": "",
          "placeholder": "https://",
          "conditional_logic": {
            "field": "button_action_type",
            "operator": "==",
            "value": "link"
          },
          "required": true,
          "description": "URL de destino del botón"
        },
        "button_link_target": {
          "type": "select",
          "label": "Abrir enlace en",
          "default": "_self",
          "options": {
            "_self": "Misma ventana",
            "_blank": "Nueva ventana"
          },
          "conditional_logic": {
            "field": "button_action_type",
            "operator": "==",
            "value": "link"
          },
          "description": "Destino del enlace"
        },
        "button_scroll_target": {
          "type": "text",
          "label": "ID de la sección",
          "default": "",
          "placeholder": "#contact",
          "conditional_logic": {
            "field": "button_action_type",
            "operator": "==",
            "value": "scroll"
          },
          "required": true,
          "description": "ID de la sección a la que hacer scroll (incluir #)"
        },
        "button_position": {
          "type": "select",
          "label": "Posición del botón",
          "default": "right",
          "options": {
            "left": "Antes del menú",
            "right": "Después del menú"
          },
          "conditional_logic": {
            "field": "button_enabled",
            "operator": "==",
            "value": true
          },
          "description": "Ubicación del botón en el navbar"
        }
      }
    },
    "styles": {
      "label": "Estilos",
      "priority": 50,
      "fields": {
        "background_color": {
          "type": "color",
          "label": "Color de fondo",
          "default": "#1e3a5f",
          "description": "Color de fondo del navbar (por defecto: navy primary)"
        },
        "text_color": {
          "type": "color",
          "label": "Color del texto",
          "default": "#FFFFFF",
          "description": "Color del texto de los links del menú"
        },
        "hover_color": {
          "type": "color",
          "label": "Color hover",
          "default": "#FF8600",
          "description": "Color al pasar el mouse sobre los links (por defecto: orange primary)"
        },
        "active_color": {
          "type": "color",
          "label": "Color del item activo",
          "default": "#FF8600",
          "description": "Color del item de menú activo/actual"
        },
        "button_background": {
          "type": "color",
          "label": "Color de fondo del botón",
          "default": "#FF8600",
          "description": "Color de fondo del botón CTA"
        },
        "button_text_color": {
          "type": "color",
          "label": "Color del texto del botón",
          "default": "#FFFFFF",
          "description": "Color del texto del botón CTA"
        },
        "button_hover_background": {
          "type": "color",
          "label": "Color hover del botón",
          "default": "#FF6B35",
          "description": "Color de fondo del botón al hacer hover"
        },
        "padding_vertical": {
          "type": "select",
          "label": "Padding vertical",
          "default": "normal",
          "options": {
            "compact": "Compacto (0.5rem)",
            "normal": "Normal (1rem)",
            "spacious": "Espacioso (1.5rem)"
          },
          "description": "Espaciado vertical del navbar"
        },
        "shadow_enabled": {
          "type": "boolean",
          "label": "Activar sombra",
          "default": true,
          "description": "Agrega sombra debajo del navbar"
        },
        "shadow_intensity": {
          "type": "select",
          "label": "Intensidad de la sombra",
          "default": "medium",
          "options": {
            "light": "Ligera",
            "medium": "Media",
            "strong": "Fuerte"
          },
          "conditional_logic": {
            "field": "shadow_enabled",
            "operator": "==",
            "value": true
          },
          "description": "Intensidad de la sombra del navbar"
        },
        "border_bottom_enabled": {
          "type": "boolean",
          "label": "Borde inferior",
          "default": false,
          "description": "Agrega un borde en la parte inferior del navbar"
        },
        "border_bottom_color": {
          "type": "color",
          "label": "Color del borde inferior",
          "default": "#FF8600",
          "conditional_logic": {
            "field": "border_bottom_enabled",
            "operator": "==",
            "value": true
          },
          "description": "Color del borde inferior"
        },
        "border_bottom_width": {
          "type": "number",
          "label": "Grosor del borde (px)",
          "default": 3,
          "min": 1,
          "max": 10,
          "conditional_logic": {
            "field": "border_bottom_enabled",
            "operator": "==",
            "value": true
          },
          "description": "Grosor del borde inferior en píxeles"
        }
      }
    }
  }
}