let deferredPrompt;

/* -----------------------------
   ANDROID / CHROME INSTALL FLOW
------------------------------*/
window.addEventListener("beforeinstallprompt", (e) => {
    e.preventDefault();
    deferredPrompt = e;

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

    showInstallBanner({
        message: '📱 Install <b>Quality</b> App?',
        buttonText: 'Install',
        onClick: async () => {
            deferredPrompt.prompt();
            const { outcome } = await deferredPrompt.userChoice;
            console.log("User install choice:", outcome);
            deferredPrompt = null;
        }
    });
});

// /* -----------------------------
//    IOS SAFARI MANUAL INSTALL
// ------------------------------*/
// function isIosSafari() {
//     return (
//         /iP(ad|hone|od)/.test(navigator.userAgent) &&
//         /Safari/.test(navigator.userAgent) &&
//         !/CriOS|FxiOS|OPiOS/.test(navigator.userAgent)
//     );
// }

// function isInStandaloneMode() {
//     return window.navigator.standalone == true;
// }

// document.addEventListener("DOMContentLoaded", () => {
//     if (
//         isIosSafari() &&
//         !isInStandaloneMode() &&
//         !localStorage.getItem("iosInstallShown")
//     ) {
//         showInstallBanner({
//             message: '📱 Install <b>Quality</b> App<br><small>Tap Share ⬆️ → Add to Home Screen</small>',
//             buttonText: 'Got it',
//             onClick: () => {
//                 localStorage.setItem("iosInstallShown", "1");
//             }
//         });
//     }
// });

/* -----------------------------
   COMMON INSTALL BANNER UI
------------------------------*/
function showInstallBanner({ message, buttonText, onClick }) {
    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;">${message}</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;
            ">${buttonText}</button>
        </div>
    `;
    document.body.appendChild(banner);

    document.getElementById("installBtn").addEventListener("click", () => {
        banner.remove();
        onClick();
    });
}

/* -----------------------------
   APP INSTALLED EVENT
------------------------------*/
window.addEventListener("appinstalled", () => {
    console.log("🎉 App installed successfully!");
    const banner = document.getElementById("install-banner");
    if (banner) banner.remove();
});