const LOGO_SVG = `
<svg viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-full h-full logo-svg">
  <!-- Parte superior: Chevron Blanco -->
  <path d="M50 10 L85 45 L50 45 L15 45 Z" fill="white" />
  
  <!-- Parte media: Chevrons Rojos -->
  <path d="M15 45 L50 80 L50 45 Z" fill="#EF4444" />
  <path d="M85 45 L50 80 L50 45 Z" fill="#DC2626" />
  
  <!-- Parte inferior: Base -->
  <path d="M50 80 L85 45 L50 90 L15 45 Z" fill="#B91C1C" opacity="0.8" />
  
  <!-- Borde estructural -->
  <path d="M50 10 L85 45 L50 80 L15 45 Z" stroke="white" stroke-width="0.5" stroke-opacity="0.1" />
</svg>
`;

function runSalvaguarda() {
  const initIcons = () => {
    if ((window as any).lucide) {
      (window as any).lucide.createIcons();
    }
  };

  const renderLogos = () => {
    const mainLogo = document.getElementById('main-logo');
    const heroLogo = document.getElementById('hero-logo');
    if (mainLogo) mainLogo.innerHTML = LOGO_SVG;
    if (heroLogo) heroLogo.innerHTML = LOGO_SVG;
  };

  function handleNavigation() {
    const hash = window.location.hash.replace('#', '') || 'home';
    const sections = document.querySelectorAll('.view-content');
    
    sections.forEach(s => s.classList.add('section-hidden'));
    
    const activeSection = document.getElementById(`view-${hash}`);
    if (activeSection) {
      activeSection.classList.remove('section-hidden');
    } else {
      document.getElementById('view-home')?.classList.remove('section-hidden');
    }

    // Reiniciar iconos de Lucide tras cambiar de sección
    setTimeout(initIcons, 10);
  }

  // Escuchar cambios de hash para navegación instantánea
  window.addEventListener('hashchange', handleNavigation);
  
  // Ejecución inicial
  renderLogos();
  handleNavigation();
  initIcons();
}

// Iniciar al cargar el DOM
if (document.readyState === 'loading') {
  document.addEventListener('DOMContentLoaded', runSalvaguarda);
} else {
  runSalvaguarda();
}