<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta name="description" content="Plataforma profesional para gestión y visualización de coberturas de internet en Argentina. Conectamos empresas y usuarios.">
      <meta name="keywords" content="cobertura internet, fibra óptica, ISP, Argentina, telecomunicaciones">
      <meta name="theme-color" content="#0D47A1">
      <title>TIVOR</title>
  <link rel="manifest" href="/manifest.json">
  <!-- Favicon (192/512 ≥48px para Google Search); rutas absolutas en raíz del sitio -->
  <link rel="icon" href="/favicon.ico" sizes="any">
  <link rel="icon" type="image/png" sizes="192x192" href="/icon-192.png">
  <link rel="icon" type="image/png" sizes="512x512" href="/icon-512.png">
  <link rel="icon" type="image/png" href="/favicon.png">
  <link rel="shortcut icon" type="image/png" href="/favicon.png">
  <link rel="apple-touch-icon" href="/icon-192.png">
  <!-- Google Maps API - Cargado dinámicamente cuando se necesita -->
  <link rel="stylesheet" href="/styles/main.css">
  <link rel="stylesheet" href="/styles/mobile-fixes.css">
  <link rel="stylesheet" href="/styles/animations.css">
  <link rel="stylesheet" href="/styles/landing.css">
  <script src="/custom/google-maps-proxy-fetch.js?v=20260427-1"></script>
  <script type="module" crossorigin src="/assets/index-Dlp-VMR0-stable20260429.js"></script>
  <script type="module" crossorigin src="/custom/supply-providers.js?v=20260426-5"></script>
  <script type="module" crossorigin src="/custom/coverage-map-admin.js?v=20260429-1"></script>
  <script type="module" crossorigin src="/custom/support-panel-tabs.js?v=20260427-2"></script>
  <script src="/custom/promo-select-all-coverages.js?v=20260427-3"></script>
  <script src="/custom/compact-public-results.js?v=20260427-1"></script>
  <link rel="modulepreload" crossorigin href="/assets/rolldown-runtime-DOVq8ry0.js">
  <link rel="modulepreload" crossorigin href="/assets/admin-Bjv2MJuu.js">
</head>
<body>
  <div id="app">
    <!-- Header -->
    <header id="header" class="header">
      <div class="header-content">
        <div class="logo-container" id="logo-home" style="cursor: pointer; display: flex; align-items: center; gap: 0.75rem; background: transparent !important;" title="Volver al mapa">
          <img src="/logo/logo.png" alt="Logo" class="logo-img" style="max-width: 180px; height: auto; object-fit: contain; display: block; background: transparent !important;" onerror="console.error('Error al cargar logo desde:', this.src); this.style.display='none';" onload="console.log('Logo cargado correctamente:', this.src);">
        </div>
        <nav class="nav">
          <button id="btn-register-company" class="btn btn-primary">Registrar Empresa</button>
          <button id="btn-login" class="btn btn-secondary" style="display: none;">Iniciar Sesión</button>
          <button id="btn-logout" class="btn btn-secondary" style="display: none;">Cerrar Sesión</button>
          <button id="btn-user" class="btn btn-secondary" style="display: none;">Mi cuenta</button>
          <button id="btn-dashboard" class="btn btn-secondary" style="display: none;">Dashboard</button>
          <button id="btn-support" class="btn btn-secondary" style="display: none;">Soporte</button>
          <button id="btn-admin" class="btn btn-secondary" style="display: none;">Admin</button>
        </nav>
      </div>
    </header>

    <!-- Main Content -->
    <main id="main-content" class="main-content">
      <!-- Landing Page View -->
      <div id="landing-view" class="view active">
        <div id="landing-content"></div>
      </div>

      <!-- Map View (para búsqueda activa) -->
      <div id="map-view" class="view">
        <div class="map-container">
          <div id="map" class="map"></div>
          <div class="search-bar">
            <input
              type="text"
              id="address-search"
              placeholder="Buscar dirección..."
              class="search-input"
              autocomplete="off"
              autocapitalize="none"
              autocorrect="off"
              spellcheck="false"
            >
            <button type="button" id="btn-current-location" class="btn btn-icon" title="Ubicación actual" aria-label="Usar mi ubicación actual">📍</button>
          </div>
        </div>
        <aside id="companies-sidebar" class="sidebar">
          <div class="sidebar-header">
            <button id="btn-close-sidebar" class="btn-close">×</button>
          </div>
          <div id="companies-list" class="companies-list"></div>
        </aside>
        <div id="sidebar-overlay" class="sidebar-overlay"></div>
      </div>

      <!-- Register Company View -->
      <div id="register-view" class="view">
        <div class="container">
          <h2>Registrar Empresa</h2>
          <form id="register-company-form" class="form">
            <!-- Form fields will be loaded dynamically -->
          </form>
        </div>
      </div>

      <!-- Login View -->
      <div id="login-view" class="view">
        <div class="container">
          <h2>Iniciar Sesión</h2>
          <form id="login-form" class="form">
            <!-- Form fields will be loaded dynamically -->
          </form>
        </div>
      </div>

      <!-- Dashboard View -->
      <div id="dashboard-view" class="view">
        <div class="container">
          <h2>Dashboard Empresarial</h2>
          <div id="dashboard-content"></div>
        </div>
      </div>

      <!-- User View -->
      <div id="user-view" class="view">
        <div class="container">
          <h2>Mi cuenta</h2>
          <div id="user-content"></div>
        </div>
      </div>

      <!-- Admin View -->
      <div id="admin-view" class="view">
        <div class="container">
          <h2>Panel Administrador</h2>
          <div id="admin-content"></div>
        </div>
      </div>

      <!-- Support View -->
      <div id="support-view" class="view">
        <div class="container">
          <h2>Panel de Soporte</h2>
          <div id="support-content"></div>
        </div>
      </div>

      <!-- Plans View -->
      <div id="plans-view" class="view">
        <div class="container">
          <h2>Planes Disponibles</h2>
          <div id="plans-content"></div>
        </div>
      </div>
    </main>

    <footer class="site-footer-legal" role="contentinfo">
      <a href="/legal/terminos.html">Términos y condiciones</a>
      <span class="site-footer-legal__sep" aria-hidden="true">·</span>
      <a href="/legal/privacidad.html">Política de privacidad</a>
    </footer>

    <!-- Modals -->
    <div id="modal-overlay" class="modal-overlay" style="display: none;">
      <div class="modal">
        <button class="modal-close">×</button>
        <div id="modal-content"></div>
      </div>
    </div>
  </div>

</body>
</html>

