let deferredPrompt;

window.addEventListener("beforeinstallprompt", (e) => {
    e.preventDefault();
    deferredPrompt = e;

    // Prevent duplicate banner
    if (document.getElementById("install-banner")) return;

    const banner = document.createElement("div");
    banner.id = "install-banner";
    banner.innerHTML = `
        <div style="
            position: fixed;
            bottom: 20px;
            left: 20px;
            right: 20px;
            background: var(--fi-color-primary, #007bff);
            color: white;
            padding: 15px;
            border-radius: 10px;
            text-align: center;
            font-family: system-ui, sans-serif;
            box-shadow: 0 4px 10px rgba(0,0,0,0.3);
            z-index: 99999;
        ">
            <span style="font-size: 16px;">📱 Install <b>Quality</b> App?</span><br>
            <button id="installBtn" style="
                margin-top: 10px;
                background: white;
                color: var(--fi-color-primary, #007bff);
                border: none;
                padding: 8px 16px;
                border-radius: 6px;
                font-weight: 600;
                cursor: pointer;
            ">Install</button>
        </div>
    `;
    document.body.appendChild(banner);

    document.getElementById("installBtn").addEventListener("click", async () => {
        banner.remove();
        deferredPrompt.prompt();
        const { outcome } = await deferredPrompt.userChoice;
        console.log("User install choice:", outcome);
        deferredPrompt = null;
    });
});

window.addEventListener("appinstalled", () => {
    console.log("🎉 PDS installed successfully!");
    const banner = document.getElementById("install-banner");
    if (banner) banner.remove();
});
