{"id":1667,"date":"2025-10-06T21:40:36","date_gmt":"2025-10-06T21:40:36","guid":{"rendered":"https:\/\/narino.gov.co\/lamejortaza\/?page_id=1667"},"modified":"2025-10-13T22:05:53","modified_gmt":"2025-10-13T22:05:53","slug":"pasaporte","status":"publish","type":"page","link":"https:\/\/narino.gov.co\/lamejortaza\/pasaporte\/","title":{"rendered":"Pasaporte"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1667\" class=\"elementor elementor-1667\" data-elementor-settings=\"{&quot;ha_cmc_init_switcher&quot;:&quot;no&quot;}\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8e8f84c e-con-full e-flex e-con e-parent\" data-id=\"8e8f84c\" data-element_type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a56a1e3 elementor-widget elementor-widget-html\" data-id=\"a56a1e3\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\r\n    <!-- Tailwind CSS -->\r\n  <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n  \r\n  <!-- Google Fonts -->\r\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Courier+Prime:wght@400;700&family=Inter:wght@400;600;800&display=swap\" rel=\"stylesheet\">\r\n  \r\n  <style>\r\n    \/* Reset para Elementor *\/\r\n    \/*.elementor-widget-container {\r\n      overflow: visible !important;\r\n    }*\/\r\n    header, .ast-header-break-point{\r\n        padding: 0px !important;\r\n    }\r\n    \/*body {\r\n      font-family: 'Inter', system-ui, sans-serif;\r\n      background-color: #000;\r\n      height: 100vh !important;\r\n    }*\/\r\n    \r\n    .passport-text {\r\n      font-family: 'Courier Prime', monospace;\r\n    }\r\n    \r\n    \/* Login centrado *\/\r\n    #loginScreen {\r\n      position: fixed;\r\n      inset: 0;\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      z-index: 10;\r\n    }\r\n    \r\n    \/* Contenedor principal del pasaporte *\/\r\n    #mainContent {\r\n      width: 900%;\r\n      height: 90vh;\r\n      overflow: hidden;\r\n      position: relative;\r\n     \r\n    }\r\n    \r\n    \/* Scroll horizontal *\/\r\n    .passport-container {\r\n      display: flex;\r\n      \/*gap: 2rem;*\/\r\n      overflow-x: auto !important;\r\n      overflow-y: hidden;\r\n      scroll-snap-type: x mandatory;\r\n      scroll-behavior: smooth;\r\n      padding: 0.5rem 1rem;\r\n      height: 100vh;\r\n      width: 100%;\r\n      -webkit-overflow-scrolling: touch;\r\n      \/* Forzar scroll horizontal *\/\r\n      flex-wrap: nowrap;\r\n      background:#333;\r\n    }\r\n    \r\n    .passport-container::-webkit-scrollbar {\r\n      height: 12px;\r\n    }\r\n    \r\n    .passport-container::-webkit-scrollbar-track {\r\n      background: background: #333;\r\n      border-radius: 10px;\r\n    }\r\n    \r\n    .passport-container::-webkit-scrollbar-thumb {\r\n      background: #333;\r\n      border-radius: 10px;\r\n    }\r\n    \r\n    .passport-container::-webkit-scrollbar-thumb:hover {\r\n      background: #333;\r\n    }\r\n    \r\n    \/* P\u00e1gina individual *\/\r\n    .passport-page {\r\n      min-width: min(100vw, 600px);\r\n      max-width: 600px;\r\n      height: min(90vh, 850px);\r\n      scroll-snap-align: center;\r\n      flex-shrink: 0;\r\n      position: relative;\r\n      border-radius: 8px;\r\n      overflow: hidden;\r\n      box-shadow: 0 10px 40px rgba(0,0,0,0.15);\r\n      \/*background-image: url('https:\/\/narino.gov.co\/lamejortaza\/wp-content\/uploads\/2025\/10\/PasaporteInterno.jpg');*\/\r\n    }\r\n    \r\n    \/* Imagen de fondo *\/\r\n    .page-background {\r\n      position: absolute;\r\n      inset: 0;\r\n      width: 100%;\r\n      height: 100%;\r\n      object-fit: cover;\r\n      object-position: center;\r\n      background-size: cover;\r\n    }\r\n    \r\n    \/* Contenido sobre el fondo *\/\r\n    .page-content {\r\n      position: relative;\r\n      z-index: 10;\r\n      height: 100%;\r\n      padding: 3rem 2rem;\r\n      display: flex;\r\n      flex-direction: column;\r\n    }\r\n    .colortext{\r\n        color: #efce82 !important;\r\n    }\r\n    \r\n    \/* Animaci\u00f3n del sello *\/\r\n    @keyframes stampIn {\r\n      0% {\r\n        transform: scale(0) rotate(-15deg);\r\n        opacity: 0;\r\n      }\r\n      50% {\r\n        transform: scale(1.2) rotate(-12deg);\r\n      }\r\n      100% {\r\n        transform: scale(1) rotate(-8deg);\r\n        opacity: 1;\r\n      }\r\n    }\r\n    \r\n    .stamp {\r\n      animation: stampIn 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;\r\n      animation-delay: 0.3s;\r\n      opacity: 0;\r\n    }\r\n    \r\n    \/* Efecto hover en estrellas *\/\r\n    .star {\r\n      display: inline-block;\r\n      transition: transform 0.2s ease;\r\n    }\r\n    \r\n    .star:hover {\r\n      transform: scale(1.3) rotate(72deg);\r\n    }\r\n    \r\n    \/* Loading spinner *\/\r\n    @keyframes spin {\r\n      to { transform: rotate(360deg); }\r\n    }\r\n    \r\n    .spinner {\r\n      animation: spin 1s linear infinite;\r\n    }\r\n.passport-page-stand::after {\r\n    content: '';\r\n    position: absolute;\r\n    bottom: 20px;\r\n    right: 20px;\r\n    width: 45%;\r\n    height: 200px;\r\n    background-image: url('https:\/\/narino.gov.co\/lamejortaza\/wp-content\/uploads\/2025\/10\/SelloVisita.png');\r\n    background-size: contain;\r\n    background-repeat: no-repeat;\r\n    background-position: center;\r\n    z-index: 99;\r\n    opacity: 0.85;\r\n    pointer-events: none;\r\n    transform: rotate(-8deg);\r\n}\r\n\r\n\/* Versi\u00f3n responsive para m\u00f3viles *\/\r\n@media (max-width: 640px) {\r\n  .passport-page-stand::after {\r\n    width: 55%;\r\n    bottom: 15px;\r\n    right: 15px;\r\n  }\r\n}\r\n    \/* Responsive *\/\r\n    @media (max-width: 640px) {\r\n      .passport-page {\r\n        min-width: 95vw;\r\n        height: min(95vh, 700px) !important;\r\n      }\r\n      \r\n      .page-content {\r\n        padding: 2rem 1.5rem;\r\n      }\r\n      \r\n      .passport-container {\r\n        gap: 0.1rem;\r\n      }\r\n    }\r\n  <\/style>\r\n\r\n\r\n\r\n  \r\n  <!-- Login Screen (Centrado) -->\r\n  <div id=\"loginScreen\" class=\"transition-opacity duration-500\" style=\" background: url(https:\/\/narino.gov.co\/lamejortaza\/wp-content\/uploads\/2025\/10\/Poppup_mejorTaza_login.jpg); background-size:100%;\">\r\n    <div class=\"bg-white rounded-3xl p-8 sm:p-12 shadow-2xl max-w-md w-full mx-4 text-center\" style=\"background: #fff2\">\r\n      <!--svg class=\"w-20 h-20 mx-auto colortext mb-6\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n        <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z\"\/-->\r\n      <\/svg>\r\n      <h1 class=\"text-3xl font-bold text-slate-800 mb-2 colortext\" >Pasaporte Caf\u00e9<\/h1>\r\n      <p class=\"text-slate-600 mb-8 colortext\">La Mejor Taza<\/p>\r\n      \r\n      <button id=\"btnSignIn\" class=\"w-full px-6 py-4 bg-blue-600 hover:bg-blue-700 text-white font-semibold rounded-xl transition-all duration-200 shadow-lg shadow-blue-600\/30 hover:shadow-blue-600\/50 hover:scale-[1.02] flex items-center justify-center gap-3\">\r\n        <svg class=\"w-6 h-6\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\r\n          <path d=\"M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z\"\/>\r\n          <path d=\"M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z\"\/>\r\n          <path d=\"M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z\"\/>\r\n          <path d=\"M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z\"\/>\r\n        <\/svg>\r\n        Ingresar con Google\r\n      <\/button>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- Header (oculto inicialmente) -->\r\n  <header id=\"mainHeader\" class=\"hidden sticky top-0 z-50  \" style=\"padding:0px !important; display:none;\">\r\n    <div class=\"sm:px-6 \">\r\n      <div class=\"flex items-center justify-between \">\r\n        <div class=\"flex items-center \">\r\n          <span id=\"userInfo\" class=\"hidden sm:inline text-sm text-slate-600 font-medium\"><\/span>\r\n          <!--button id=\"btnSignOut\" class=\"px-4 py-2 bg-slate-200 hover:bg-slate-300 text-slate-700 font-semibold rounded-lg transition-colors duration-200 text-sm\">\r\n            Salir\r\n          <\/button-->\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/header>\r\n\r\n  <!-- Main Content (Scroll Horizontal) -->\r\n  <main id=\"mainContent\" class=\"hidden\">\r\n    <div id=\"passportContainer\" class=\"passport-container\">\r\n      <!-- Las p\u00e1ginas se insertar\u00e1n aqu\u00ed din\u00e1micamente -->\r\n    <\/div>\r\n  <\/main>\r\n\r\n  <!-- Firebase -->\r\n  <script type=\"module\">\r\n    import { initializeApp } from \"https:\/\/www.gstatic.com\/firebasejs\/10.12.1\/firebase-app.js\";\r\n    import {\r\n      getAuth, GoogleAuthProvider, signInWithPopup, onAuthStateChanged, signOut\r\n    } from \"https:\/\/www.gstatic.com\/firebasejs\/10.12.1\/firebase-auth.js\";\r\n    import {\r\n      getFirestore, collection, doc, getDoc, getDocs, setDoc, serverTimestamp\r\n    } from \"https:\/\/www.gstatic.com\/firebasejs\/10.12.1\/firebase-firestore.js\";\r\n\r\n    const firebaseConfig = {\r\n      apiKey: \"AIzaSyCOmIq-GGBIK3MqfIe-2QIKVyqiW6kZwIA\",\r\n      authDomain: \"lamejortaza-f9a71.firebaseapp.com\",\r\n      projectId: \"lamejortaza-f9a71\",\r\n      storageBucket: \"lamejortaza-f9a71.appspot.com\",\r\n      messagingSenderId: \"425216588000\",\r\n      appId: \"1:425216588000:web:f12e7d323142b688997885\"\r\n    };\r\n\r\n    const app = initializeApp(firebaseConfig);\r\n    const auth = getAuth(app);\r\n    const db = getFirestore(app);\r\n\r\n    const loginScreen = document.getElementById(\"loginScreen\");\r\n    const mainHeader = document.getElementById(\"mainHeader\");\r\n    const mainContent = document.getElementById(\"mainContent\");\r\n    const btnSignIn = document.getElementById(\"btnSignIn\");\r\n    const btnSignOut = document.getElementById(\"btnSignOut\");\r\n    const userInfo = document.getElementById(\"userInfo\");\r\n    const container = document.getElementById(\"passportContainer\");\r\n\r\n    btnSignIn.addEventListener(\"click\", async () => {\r\n      try {\r\n        await signInWithPopup(auth, new GoogleAuthProvider());\r\n      } catch (error) {\r\n        console.error(\"Error:\", error);\r\n        alert(\"Error al iniciar sesi\u00f3n. Intenta de nuevo.\");\r\n      }\r\n    });\r\n\r\n    btnSignOut.addEventListener(\"click\", async () => {\r\n      await signOut(auth);\r\n    });\r\n\r\n    onAuthStateChanged(auth, async (user) => {\r\n      if (user) {\r\n        \/\/ Ocultar login y mostrar contenido\r\n        loginScreen.style.opacity = \"0\";\r\n        setTimeout(() => {\r\n          loginScreen.classList.add(\"hidden\");\r\n          mainHeader.classList.remove(\"hidden\");\r\n          mainContent.classList.remove(\"hidden\");\r\n        }, 500);\r\n\r\n        userInfo.textContent = user.displayName || user.email;\r\n        userInfo.classList.remove(\"hidden\");\r\n\r\n        await ensureUserProfile(user);\r\n        await loadPassport(user);\r\n\r\n      } else {\r\n        \/\/ Mostrar login\r\n        loginScreen.classList.remove(\"hidden\");\r\n        loginScreen.style.opacity = \"1\";\r\n        mainHeader.classList.add(\"hidden\");\r\n        mainContent.classList.add(\"hidden\");\r\n        container.innerHTML = \"\";\r\n      }\r\n    });\r\n\r\n    async function ensureUserProfile(user) {\r\n      const userRef = doc(db, \"users\", user.uid);\r\n      const userSnap = await getDoc(userRef);\r\n      \r\n      if (!userSnap.exists()) {\r\n        await setDoc(userRef, {\r\n          displayName: user.displayName || \"\",\r\n          email: user.email || \"\",\r\n          photoURL: user.photoURL || \"\",\r\n          provider: user.providerData?.[0]?.providerId || \"google\",\r\n          role: \"user\",\r\n          createdAt: serverTimestamp()\r\n        });\r\n      }\r\n    }\r\n\r\nasync function loadPassport(user) {\r\n  container.innerHTML = `\r\n    <div class=\"flex items-center justify-center w-full\">\r\n      <div class=\"w-12 h-12 border-4 border-blue-600 border-t-transparent rounded-full spinner\"><\/div>\r\n    <\/div>\r\n  `;\r\n\r\n  try {\r\n    container.innerHTML = \"\";\r\n    \r\n    \/\/ 1. PRIMERO: Cargar stands visitados y calcular estad\u00edsticas\r\n    const standsRef = collection(db, \"stands\");\r\n    const standsSnap = await getDocs(standsRef);\r\n    const userStands = [];\r\n    let totalVisits = 0;\r\n    let totalPurchases = 0;\r\n\r\n    for (const standDoc of standsSnap.docs) {\r\n      const standId = standDoc.id;\r\n      const standData = standDoc.data();\r\n      const userVisits = (standData.visits || []).filter(v => v.userId === user.uid);\r\n      \r\n      if (userVisits.length > 0) {\r\n        const userRatings = (standData.ratings || []).filter(r => r.userId === user.uid);\r\n        const userPurchases = (standData.purchases || []).filter(p => p.userId === user.uid);\r\n        const purchaseAmount = userPurchases.reduce((sum, p) => sum + (p.amount || 0), 0);\r\n        \r\n        totalVisits += userVisits.length;\r\n        totalPurchases += purchaseAmount;\r\n        \r\n        userStands.push({\r\n          standId,\r\n          name: standData.name || standId,\r\n          logoUrl: standData.logoUrl || \"\",\r\n          visitedAt: userVisits[0].visitedAt,\r\n          lastVisit: userVisits[userVisits.length - 1].visitedAt,\r\n          visitCount: userVisits.length,\r\n          purchasesTotal: purchaseAmount,\r\n          hasRating: userRatings.length > 0,\r\n          rating: userRatings.length > 0 ? userRatings[userRatings.length - 1] : null\r\n        });\r\n      }\r\n    }\r\n\r\n    \/\/ Ordenar por fecha\r\n    userStands.sort((a, b) => parseDate(b.visitedAt) - parseDate(a.visitedAt));\r\n\r\n    \/\/ Crear objeto con estad\u00edsticas\r\n    const userStats = {\r\n      standsVisited: userStands.length,\r\n      totalVisits: totalVisits,\r\n      totalSpent: totalPurchases,\r\n      hasVisits: userStands.length > 0\r\n    };\r\n\r\n    \/\/ 2. PORTADA (Primera hoja)\r\n    container.appendChild(buildCoverPage());\r\n\r\n    \/\/ 3. DATOS DEL USUARIO con estad\u00edsticas (Segunda hoja)\r\n    container.appendChild(buildUserPage(user, userStats));\r\n\r\n    \/\/ 4. Agregar p\u00e1ginas de stands (desde la tercera hoja en adelante)\r\n    if (userStands.length === 0) {\r\n      container.appendChild(buildEmptyPage());\r\n    } else {\r\n      userStands.forEach(stand => {\r\n        container.appendChild(buildStandPage(stand));\r\n      });\r\n    }\r\n\r\n  } catch (error) {\r\n    console.error(\"Error:\", error);\r\n    container.innerHTML = `\r\n      <div class=\"flex items-center justify-center w-full text-center p-8\">\r\n        <div>\r\n          <svg class=\"w-16 h-16 mx-auto text-red-400 mb-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z\"\/>\r\n          <\/svg>\r\n          <p class=\"text-red-500 mb-4\">Error al cargar tu pasaporte<\/p>\r\n          <button onclick=\"location.reload()\" class=\"px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition\">\r\n            Reintentar\r\n          <\/button>\r\n        <\/div>\r\n      <\/div>\r\n    `;\r\n  }\r\n}\r\n\r\n    \/\/ P\u00c1GINA 1: PORTADA\r\n    function buildCoverPage() {\r\n      const page = document.createElement(\"div\");\r\n      page.className = \"passport-page\";\r\n      \r\n      page.innerHTML = `\r\n        <img decoding=\"async\" \r\n          src=\"https:\/\/narino.gov.co\/lamejortaza\/wp-content\/uploads\/2025\/10\/PasaporteMejorTaza.jpg\" \r\n          alt=\"Portada del Pasaporte\"\r\n          class=\"page-background\"\r\n        \/>\r\n        \r\n        <div class=\"page-content flex items-end justify-center pb-12\">\r\n          <div class=\"text-center text-white animate-pulse\">\r\n            <p class=\"text-lg font-semibold mb-2\">Desliza para comenzar \u2192<\/p>\r\n            <!--svg class=\"w-8 h-8 mx-auto\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n              <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 7l5 5m0 0l-5 5m5-5H6\"\/>\r\n            <\/svg-->\r\n          <\/div>\r\n        <\/div>\r\n      `;\r\n      \r\n      return page;\r\n    }\r\n\r\n    \/\/ P\u00c1GINA 2: DATOS DEL USUARIO\r\n    \/\/ P\u00c1GINA 2: DATOS DEL USUARIO\r\nfunction buildUserPage(user, stats = {}) {\r\n  const page = document.createElement(\"div\");\r\n  page.className = \"passport-page\";\r\n  \r\n  page.innerHTML = `\r\n    <img decoding=\"async\" \r\n      src=\"https:\/\/narino.gov.co\/lamejortaza\/wp-content\/uploads\/2025\/10\/portada-pasaporte-celular.jpg\" \r\n      alt=\"Fondo pasaporte\"\r\n      class=\"page-background\"\r\n    \/>\r\n    \r\n    <div class=\"page-content\">\r\n      <div class=\"flex-1 flex flex-col justify-center items-center text-center\" >\r\n        \r\n        <!-- Foto del usuario -->\r\n        <div class=\"mb-6\">\r\n          <img decoding=\"async\" \r\n            src=\"${user.photoURL || 'https:\/\/ui-avatars.com\/api\/?name=' + encodeURIComponent(user.displayName || user.email) + '&size=200&background=3b82f6&color=fff'}\"\r\n            alt=\"Foto\"\r\n            class=\"w-32 h-32 rounded-full border-4 border-white shadow-xl\"\r\n            onerror=\"this.src='https:\/\/ui-avatars.com\/api\/?name=' + encodeURIComponent('${user.displayName || user.email}') + '&size=200&background=3b82f6&color=fff'\"\r\n          \/>\r\n        <\/div>\r\n\r\n        <!-- Nombre -->\r\n        <div class=\"mb-6\">\r\n          <h2 class=\"text-3xl sm:text-4xl font-bold text-slate-800 mb-2 passport-text\">${user.displayName || \"Usuario\"}<\/h2>\r\n          <p class=\"text-lg text-slate-600\">${user.email}<\/p>\r\n        <\/div>\r\n\r\n        <!-- \u2728 NUEVA SECCI\u00d3N: Estad\u00edsticas de visitas \u2728 -->\r\n        ${stats.hasVisits ? `\r\n          <div class=\"space-y-4 w-full max-w-sm bg-white\/48 backdrop-blur-sm rounded-lg p-4 mb-2\">\r\n            <div class=\"text-xs text-slate-500 uppercase tracking-wide mb-1\">Estad\u00edsticas<\/div>\r\n            <div class=\"grid grid-cols-3 gap-2\">\r\n              <div class=\"bg-white\/24 rounded-lg p-1\">\r\n                <div class=\"text-2xl font-bold text-blue-600\">${stats.standsVisited}<\/div>\r\n                <div class=\"text-xs text-slate-600 mt-1\">Stand${stats.standsVisited !== 1 ? 's' : ''}<\/div>\r\n              <\/div>\r\n              <div class=\"bg-white\/24 rounded-lg p-1\">\r\n                <div class=\"text-2xl font-bold text-green-600\">${stats.totalVisits}<\/div>\r\n                <div class=\"text-xs text-slate-600 mt-1\">Visita${stats.totalVisits !== 1 ? 's' : ''}<\/div>\r\n              <\/div>\r\n              <div class=\"bg-white\/24 rounded-lg p-1\">\r\n                <div class=\"text-xl font-bold text-purple-600\">${money(stats.totalSpent)}<\/div>\r\n                <div class=\"text-xs text-slate-600 mt-1\">Compras<\/div>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n        ` : ''}\r\n\r\n        <!-- Datos del pasaporte -->\r\n        <div class=\"space-y-4 w-full max-w-sm\">\r\n          <div class=\"bg-white\/48 backdrop-blur-sm rounded-lg p-4\">\r\n            <div class=\"text-xs text-slate-500 uppercase tracking-wide mb-1\">Tipo de Documento<\/div>\r\n            <div class=\"text-lg font-bold text-slate-800 passport-text\">PASAPORTE CAF\u00c9<\/div>\r\n          <\/div>\r\n          \r\n          <div class=\"bg-white\/48 backdrop-blur-sm rounded-lg p-4\">\r\n            <div class=\"text-xs text-slate-500 uppercase tracking-wide mb-1\">Fecha de Emisi\u00f3n<\/div>\r\n            <div class=\"text-lg font-bold text-slate-800 passport-text\">${new Date().toLocaleDateString('es-CO', { day: '2-digit', month: 'short', year: 'numeric' }).toUpperCase()}<\/div>\r\n          <\/div>\r\n          \r\n          <div class=\"bg-white\/48 backdrop-blur-sm rounded-lg p-4\">\r\n            <div class=\"text-xs text-slate-500 uppercase tracking-wide mb-1\">Estado<\/div>\r\n            <div class=\"inline-flex items-center gap-2 text-green-700 font-bold\">\r\n              <svg class=\"w-5 h-5\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n                <path fill-rule=\"evenodd\" d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\" clip-rule=\"evenodd\"\/>\r\n              <\/svg>\r\n              ACTIVO\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Indicador -->\r\n        <div class=\"mt-8 text-slate-700 text-sm animate-pulse\" style=\"padding-top:${stats.hasVisits ? '40px' : '100px'} !important;\">\r\n          Desliza para ver ${stats.hasVisits ? 'tus visitas' : 'm\u00e1s'} \u2192\r\n        <\/div>\r\n\r\n      <\/div>\r\n    <\/div>\r\n  `;\r\n  \r\n  return page;\r\n}\r\n\r\n    \/\/ P\u00c1GINA 3+: STAND VISITADO\r\n    function buildStandPage({ standId, name, logoUrl, visitedAt, lastVisit, visitCount, purchasesTotal, hasRating, rating }) {\r\n      const page = document.createElement(\"div\");\r\n      page.className = \"passport-page passport-page-stand\";\r\n      \r\n      page.innerHTML = `\r\n        <img decoding=\"async\" \r\n          src=\"https:\/\/narino.gov.co\/lamejortaza\/wp-content\/uploads\/2025\/10\/portada-pasaporte-celular.jpg\" \r\n          alt=\"Fondo pasaporte\"\r\n          class=\"page-background\"\r\n        \/>\r\n        \r\n        <div class=\"page-content\">\r\n          \r\n          <!-- Sello del stand (logo) -->\r\n          <!--img src=\"https:\/\/narino.gov.co\/lamejortaza\/wp-content\/uploads\/2025\/10\/sELLO.jpeg\" clase=\"sello\"-->\r\n          <div class=\"stamp absolute top-6 right-6 sm:top-10 sm:right-10 w-24 h-24 sm:w-28 sm:h-28 transform -rotate-8\">\r\n            <div class=\"relative w-full h-full\">\r\n              <div class=\"absolute inset-0 border-4 border-red-500\/30 rounded-full\"><\/div>\r\n              <div class=\"absolute inset-2 border-2 border-red-500\/30 rounded-full\"><\/div>\r\n              <img decoding=\"async\" \r\n                src=\"${logoUrl || 'https:\/\/dummyimage.com\/120x120\/e5e7eb\/9ca3af&text=Stand'}\" \r\n                alt=\"Sello\"\r\n                class=\"absolute inset-0 w-full h-full object-cover rounded-full opacity-90\"\r\n                onerror=\"this.src='https:\/\/dummyimage.com\/120x120\/e5e7eb\/9ca3af&text=Stand'\"\r\n              \/>\r\n              <div class=\"absolute inset-0 bg-red-500\/10 rounded-full mix-blend-multiply\"><\/div>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <!-- Contenido -->\r\n          <div class=\"max-w-md\">\r\n            \r\n            <!-- Badge verificado -->\r\n            <div class=\"inline-block px-3 py-1 rounded-full bg-gradient-to-r from-purple-500 to-indigo-600 text-white text-xs font-bold mb-4\">\r\n              \u2713 VERIFICADO\r\n            <\/div>\r\n\r\n            <!-- Nombre del stand -->\r\n            <h2 class=\"text-2xl sm:text-3xl font-bold text-slate-800 mb-1 break-words\">${name}<\/h2>\r\n            <p class=\"text-xs sm:text-sm text-slate-500 passport-text uppercase tracking-wider mb-6\">Stand Oficial<\/p>\r\n\r\n            <!-- Informaci\u00f3n de visita -->\r\n            <div class=\"space-y-4 mb-6\">\r\n              <div class=\"bg-white\/48 backdrop-blur-sm rounded-lg p-3\">\r\n                <div class=\"text-xs text-slate-500 uppercase tracking-wide mb-1\">Fecha de Entrada<\/div>\r\n                <div class=\"text-base sm:text-lg font-semibold text-slate-800 passport-text\">${fmtDate(visitedAt)}<\/div>\r\n              <\/div>\r\n              \r\n              ${visitCount > 1 ? `\r\n                <div class=\"bg-white\/48 backdrop-blur-sm rounded-lg p-3\">\r\n                  <div class=\"text-xs text-slate-500 uppercase tracking-wide mb-1\">\u00daltima Visita<\/div>\r\n                  <div class=\"text-base sm:text-lg font-semibold text-slate-800 passport-text\">${fmtDate(lastVisit)}<\/div>\r\n                <\/div>\r\n              ` : ''}\r\n              \r\n              <div class=\"grid grid-cols-2 gap-3\">\r\n                <div class=\"bg-white\/48 backdrop-blur-sm rounded-lg p-3\">\r\n                  <div class=\"text-xs text-slate-500 uppercase tracking-wide mb-1\">Visitas<\/div>\r\n                  <div class=\"text-2xl sm:text-3xl font-bold text-blue-600\">${visitCount}<\/div>\r\n                <\/div>\r\n                <div class=\"bg-white\/48 backdrop-blur-sm rounded-lg p-3\">\r\n                  <div class=\"text-xs text-slate-500 uppercase tracking-wide mb-1\">Compras<\/div>\r\n                  <div class=\"text-xl sm:text-2xl font-bold text-green-600\">${money(purchasesTotal)}<\/div>\r\n                <\/div>\r\n              <\/div>\r\n            <\/div>\r\n\r\n            <!-- Calificaciones -->\r\n            ${hasRating && rating ? `\r\n              <div class=\"bg-white\/48 backdrop-blur-sm rounded-lg p-4\">\r\n                <div class=\"text-xs text-slate-500 uppercase tracking-wide mb-3\">Tu Calificaci\u00f3n<\/div>\r\n                <div class=\"grid grid-cols-3 gap-3\">\r\n                  <div class=\"text-center\">\r\n                    <div class=\"text-xs text-slate-600 mb-1\">Innovaci\u00f3n<\/div>\r\n                    <div class=\"text-lg font-bold text-amber-500\">\r\n                      ${renderStars(rating.innovation)}\r\n                    <\/div>\r\n                    <div class=\"text-sm font-semibold text-slate-700\">${rating.innovation}\/5<\/div>\r\n                  <\/div>\r\n                  <div class=\"text-center\">\r\n                    <div class=\"text-xs text-slate-600 mb-1\">Calidad<\/div>\r\n                    <div class=\"text-lg font-bold text-amber-500\">\r\n                      ${renderStars(rating.quality)}\r\n                    <\/div>\r\n                    <div class=\"text-sm font-semibold text-slate-700\">${rating.quality}\/5<\/div>\r\n                  <\/div>\r\n                  <div class=\"text-center\">\r\n                    <div class=\"text-xs text-slate-600 mb-1\">Servicio<\/div>\r\n                    <div class=\"text-lg font-bold text-amber-500\">\r\n                      ${renderStars(rating.service)}\r\n                    <\/div>\r\n                    <div class=\"text-sm font-semibold text-slate-700\">${rating.service}\/5<\/div>\r\n                  <\/div>\r\n                <\/div>\r\n              <\/div>\r\n            ` : `\r\n              <div class=\"bg-white\/48 backdrop-blur-sm rounded-lg p-4 text-center\">\r\n                <svg class=\"w-8 h-8 mx-auto mb-2 text-slate-400\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n                  <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M11.049 2.927c.3-.921 1.603-.921 1.902 0l1.519 4.674a1 1 0 00.95.69h4.915c.969 0 1.371 1.24.588 1.81l-3.976 2.888a1 1 0 00-.363 1.118l1.518 4.674c.3.922-.755 1.688-1.538 1.118l-3.976-2.888a1 1 0 00-1.176 0l-3.976 2.888c-.783.57-1.838-.197-1.538-1.118l1.518-4.674a1 1 0 00-.363-1.118l-3.976-2.888c-.784-.57-.38-1.81.588-1.81h4.914a1 1 0 00.951-.69l1.519-4.674z\"\/>\r\n                <\/svg>\r\n                <div class=\"text-slate-500 text-sm\">Sin calificaci\u00f3n<\/div>\r\n              <\/div>\r\n            `}\r\n\r\n            <!-- C\u00f3digo del stand -->\r\n            <div class=\"mt-4 pt-4 border-t border-slate-300\">\r\n              <div class=\"text-xs text-slate-400 passport-text\">ID: ${standId.toUpperCase()}<\/div>\r\n            <\/div>\r\n\r\n          <\/div>\r\n        <\/div>\r\n      `;\r\n      \r\n      return page;\r\n    }\r\n\r\n    \/\/ P\u00e1gina vac\u00eda (sin visitas)\r\n    function buildEmptyPage() {\r\n      const page = document.createElement(\"div\");\r\n      page.className = \"passport-page\";\r\n      \r\n      page.innerHTML = `\r\n        <img decoding=\"async\" \r\n          src=\"https:\/\/narino.gov.co\/lamejortaza\/wp-content\/uploads\/2025\/10\/portada-pasaporte-celular.jpg\" \r\n          alt=\"Fondo pasaporte\"\r\n          class=\"page-background\"\r\n        \/>\r\n        \r\n        <div class=\"page-content flex items-center justify-center\">\r\n          <div class=\"text-center\">\r\n            <a href=\"https:\/\/lamejortaza-f9a71.web.app\/\">\r\n                <svg class=\"w-20 h-20 mx-auto text-slate-300 mb-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n                  <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"\/>\r\n                <\/svg>\r\n            <\/a>\r\n            <h3 class=\"text-2xl font-bold text-slate-700 mb-2\">Sin visitas registradas<\/h3>\r\n            <p class=\"text-slate-500\"><a href=\"https:\/\/lamejortaza-f9a71.web.app\/\">\u00a1Comienza a explorar los stands!<\/a><\/p>\r\n          <\/div>\r\n        <\/div>\r\n      `;\r\n      \r\n      return page;\r\n    }\r\n\r\n    function renderStars(rating) {\r\n      const stars = [];\r\n      for (let i = 0; i < 5; i++) {\r\n        if (i < rating) {\r\n          stars.push('<span class=\"star\">\u2b50<\/span>');\r\n        }\r\n      }\r\n      return stars.join('');\r\n    }\r\n\r\n    function fmtDate(ts) {\r\n      if (!ts) return \"\u2014\";\r\n      const d = parseDate(ts);\r\n      return d.toLocaleDateString('es-CO', { \r\n        day: '2-digit', \r\n        month: 'short', \r\n        year: 'numeric'\r\n      }).toUpperCase();\r\n    }\r\n\r\n    function parseDate(ts) {\r\n      if (!ts) return new Date();\r\n      if (ts.toDate) return ts.toDate();\r\n      return new Date(ts);\r\n    }\r\n\r\n    function money(n) {\r\n      try {\r\n        return new Intl.NumberFormat(\"es-CO\", { \r\n          style: \"currency\", \r\n          currency: \"COP\", \r\n          maximumFractionDigits: 0 \r\n        }).format(Number(n || 0));\r\n      } catch {\r\n        return `$${n || 0}`;\r\n      }\r\n    }\r\n  <\/script>\r\n  \r\n  \r\n  \r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-8849bed e-con-full e-flex e-con e-parent\" data-id=\"8849bed\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;position&quot;:&quot;fixed&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div data-ha-element-link=\"{&quot;url&quot;:&quot;https:\\\/\\\/lamejortaza-f9a71.web.app\\\/&quot;,&quot;is_external&quot;:&quot;&quot;,&quot;nofollow&quot;:&quot;&quot;}\" style=\"cursor: pointer\" class=\"elementor-element elementor-element-bd3957b elementor-view-default elementor-position-top elementor-mobile-position-top elementor-widget elementor-widget-icon-box\" data-id=\"bd3957b\" data-element_type=\"widget\" data-widget_type=\"icon-box.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-icon-box-wrapper\">\n\n\t\t\t\t\t\t<div class=\"elementor-icon-box-icon\">\n\t\t\t\t<span  class=\"elementor-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"huge huge-qr-code\"><\/i>\t\t\t\t<\/span>\n\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t<div class=\"elementor-icon-box-content\">\n\n\t\t\t\t\t\t\t\t\t<h3 class=\"elementor-icon-box-title\">\n\t\t\t\t\t\t<span  >\n\t\t\t\t\t\t\tEscanea Stand\t\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/h3>\n\t\t\t\t\n\t\t\t\t\n\t\t\t<\/div>\n\t\t\t\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div data-ha-element-link=\"{&quot;url&quot;:&quot;https:\\\/\\\/chatgpt.com\\\/g\\\/g-68cb1f9648f4819198cc387088558d15-la-mejor-taza&quot;,&quot;is_external&quot;:&quot;&quot;,&quot;nofollow&quot;:&quot;&quot;}\" style=\"cursor: pointer\" class=\"elementor-element elementor-element-15edac0 elementor-view-default elementor-position-top elementor-mobile-position-top elementor-widget elementor-widget-icon-box\" data-id=\"15edac0\" data-element_type=\"widget\" data-widget_type=\"icon-box.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-icon-box-wrapper\">\n\n\t\t\t\t\t\t<div class=\"elementor-icon-box-icon\">\n\t\t\t\t<span  class=\"elementor-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"huge huge-robotic\"><\/i>\t\t\t\t<\/span>\n\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t<div class=\"elementor-icon-box-content\">\n\n\t\t\t\t\t\t\t\t\t<h3 class=\"elementor-icon-box-title\">\n\t\t\t\t\t\t<span  >\n\t\t\t\t\t\t\tHabla con \u00d1a\u00f1o\t\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/h3>\n\t\t\t\t\n\t\t\t\t\n\t\t\t<\/div>\n\t\t\t\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d5443e7 elementor-view-default elementor-position-top elementor-mobile-position-top elementor-widget elementor-widget-icon-box\" data-id=\"d5443e7\" data-element_type=\"widget\" data-widget_type=\"icon-box.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-icon-box-wrapper\">\n\n\t\t\t\t\t\t<div class=\"elementor-icon-box-icon\">\n\t\t\t\t<span  class=\"elementor-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"huge huge-map-pinpoint-02\"><\/i>\t\t\t\t<\/span>\n\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t<div class=\"elementor-icon-box-content\">\n\n\t\t\t\t\t\t\t\t\t<h3 class=\"elementor-icon-box-title\">\n\t\t\t\t\t\t<span  >\n\t\t\t\t\t\t\tMapa Caf\u00e9\t\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/h3>\n\t\t\t\t\n\t\t\t\t\n\t\t\t<\/div>\n\t\t\t\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b2a463f elementor-view-default elementor-position-top elementor-mobile-position-top elementor-widget elementor-widget-icon-box\" data-id=\"b2a463f\" data-element_type=\"widget\" id=\"btnSignOut\" data-widget_type=\"icon-box.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-icon-box-wrapper\">\n\n\t\t\t\t\t\t<div class=\"elementor-icon-box-icon\">\n\t\t\t\t<span  class=\"elementor-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"huge huge-logout-04\"><\/i>\t\t\t\t<\/span>\n\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t<div class=\"elementor-icon-box-content\">\n\n\t\t\t\t\t\t\t\t\t<h3 class=\"elementor-icon-box-title\">\n\t\t\t\t\t\t<span  >\n\t\t\t\t\t\t\tSalir\t\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/h3>\n\t\t\t\t\n\t\t\t\t\n\t\t\t<\/div>\n\t\t\t\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Pasaporte Caf\u00e9 La Mejor Taza Ingresar con Google Escanea Stand Habla con \u00d1a\u00f1o Mapa Caf\u00e9 Salir<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1667","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/narino.gov.co\/lamejortaza\/wp-json\/wp\/v2\/pages\/1667","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/narino.gov.co\/lamejortaza\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/narino.gov.co\/lamejortaza\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/narino.gov.co\/lamejortaza\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/narino.gov.co\/lamejortaza\/wp-json\/wp\/v2\/comments?post=1667"}],"version-history":[{"count":458,"href":"https:\/\/narino.gov.co\/lamejortaza\/wp-json\/wp\/v2\/pages\/1667\/revisions"}],"predecessor-version":[{"id":2777,"href":"https:\/\/narino.gov.co\/lamejortaza\/wp-json\/wp\/v2\/pages\/1667\/revisions\/2777"}],"wp:attachment":[{"href":"https:\/\/narino.gov.co\/lamejortaza\/wp-json\/wp\/v2\/media?parent=1667"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}