\u{1F4A7}

' + '

App disponible para ' + platformLabel + '

' + '

Instalar Plombia Academia

' + '

' + platformInstructions + '

' + '

'; var btnContainer = document.createElement('div'); btnContainer.style.cssText = 'display:flex;gap:8px;flex-shrink:0;'; var closeBtn = document.createElement('button'); closeBtn.innerHTML = '\u00D7'; closeBtn.style.cssText = 'width:32px;height:32px;border:none;background:transparent;color:#666;font-size:20px;cursor:pointer;border-radius:8px;flex-shrink:0;'; closeBtn.onclick = function() { sessionStorage.setItem('plombia-install-dismissed', '1'); banner.remove(); }; var installBtn = document.createElement('button'); installBtn.textContent = 'Instalar'; installBtn.style.cssText = 'padding:10px 20px;border:none;background:linear-gradient(135deg,#22D3EE,#0EA5E9);color:#0a0a14;font-size:14px;font-weight:700;cursor:pointer;border-radius:10px;flex-shrink:0;box-shadow:0 0 12px rgba(34,211,238,0.5);transition:transform 0.15s;'; installBtn.onclick = function() { if (window.deferredPrompt) { window.deferredPrompt.prompt(); window.deferredPrompt.userChoice.then(function(choiceResult) { if (choiceResult.outcome === 'accepted') { console.log('[PWA] Usuario aceptó instalar'); } window.deferredPrompt = null; banner.remove(); }); } else if (platform === 'ios') { // Show iOS instructions modal var modal = document.createElement('div'); modal.style.cssText = 'position:fixed;inset:0;z-index:100000;background:rgba(0,0,0,0.8);display:flex;align-items:center;justify-content:center;padding:20px;'; modal.innerHTML = '

' + '

\u{1F4F1}

' + '

Instalar en iOS

' + '

Para instalar Plombia Academia en tu iPhone/iPad:

' + '

1\uFE0F\u20E3 Toca el botón Compartir \u{1F4E4} en Safari

' + '

2\uFE0F\u20E3 Selecciona "Añadir a pantalla de inicio"

' + '

3\uFE0F\u20E3 Toca "Añadir" para confirmar

' + '

' + '' + '

'; document.body.appendChild(modal); document.getElementById('pwa-ios-close').onclick = function() { modal.remove(); }; modal.onclick = function(e) { if (e.target === modal) modal.remove(); }; } else { banner.remove(); alert('Para instalar la app:\n\nChrome/Edge: Menú \u22EE \u2192 "Instalar aplicación"\nFirefox: Menú \u2261 \u2192 "Instalar"'); } }; btnContainer.appendChild(closeBtn); btnContainer.appendChild(installBtn); inner.appendChild(btnContainer); banner.appendChild(inner); document.body.appendChild(banner); // Auto-dismiss after 20 seconds setTimeout(function() { if(banner.parentNode) banner.remove(); }, 20000); } // Before install prompt (Android, Windows, Mac, Linux) window.addEventListener('beforeinstallprompt', function(e) { e.preventDefault(); window.deferredPrompt = e; setTimeout(showInstallBanner, 3000); }); // App installed event window.addEventListener('appinstalled', function() { console.log('[PWA] App instalada exitosamente'); var banner = document.getElementById('pwa-install-banner'); if (banner) banner.remove(); }); // For iOS (no beforeinstallprompt) — show banner after 5s if (getPlatform() === 'ios' && !isStandalone()) { setTimeout(showInstallBanner, 5000); } // Add slide-up animation + responsive bottom offset (clears mobile bottom nav) var style = document.createElement('style'); style.textContent = '@keyframes pwa-slide-up { from { transform: translateY(100%); opacity: 0; } to { transform: translateY(0); opacity: 1; } }' + '#pwa-install-banner { bottom: 0; }' + '@media (max-width: 1023px) { #pwa-install-banner { bottom: calc(64px + env(safe-area-inset-bottom, 0px)); } }' + '@media (max-width: 380px) { #pwa-install-banner .pwa-inner { gap: 8px !important; } #pwa-install-banner .pwa-text-desc { display: none; } }'; document.head.appendChild(style);