/* Instalada: la franja del reloj se pinta del color de marca y el contenido
       recupera el sitio que le quitó la barra transparente. Solo aquí: en el
       navegador normal esto no debe cambiar nada. */
    @media (display-mode: standalone) {
        html.is-pwa body {
            padding-top: env(safe-area-inset-top, 0px);
            background-color: #e01d48;
        }
        html.is-pwa body > * { background-color: initial; }
    }

    #bc-pwa-invite {
        position: fixed;
        left: 50%;
        bottom: 18px;
        z-index: 9999;
        transform: translate(-50%, 130%);
        display: flex;
        align-items: center;
        gap: 14px;
        width: calc(100% - 32px);
        max-width: 440px;
        padding: 14px 14px 14px 18px;
        background: #fff;
        border: 1px solid rgba(16, 24, 40, .08);
        border-radius: 16px;
        box-shadow: 0 24px 48px -24px rgba(16, 24, 40, .45);
        transition: transform .38s cubic-bezier(.22, 1, .36, 1);
    }
    #bc-pwa-invite.is-on { transform: translate(-50%, 0); }
    .bc-pwa-invite-txt { flex: 1 1 auto; min-width: 0; line-height: 1.35; }
    .bc-pwa-invite-txt b { display: block; font-size: 15px; color: #0f172a; }
    .bc-pwa-invite-txt span { display: block; font-size: 12.5px; color: #667085; }
    .bc-pwa-yes {
        flex: 0 0 auto; font: inherit; font-size: 14px; font-weight: 700;
        padding: 10px 18px; border: 0; border-radius: 10px;
        background: #e01d48; color: #fff; cursor: pointer;
    }
    .bc-pwa-no {
        flex: 0 0 auto; font-size: 22px; line-height: 1; color: #98a2b3;
        background: none; border: 0; cursor: pointer; padding: 0 4px;
    }
    /* En iOS la instrucción ES el mensaje: sin ella el aviso no dice nada. */
    #bc-pwa-invite.is-ios .bc-pwa-invite-txt span { display: block; }
    #bc-pwa-invite.is-ios { padding-right: 8px; }

    @media (max-width: 480px) {
        #bc-pwa-invite:not(.is-ios) .bc-pwa-invite-txt span { display: none; }
    }

    /* Instalada, el aviso de instalar no tiene sentido. */
    .is-pwa #bc-pwa-invite { display: none; }