/* ==========================
   PWA INSTALL POPUP
========================== */

.pwa-install-banner{

    position:fixed;

    top:18px;
    left:50%;

    transform:
    translateX(-50%)
    translateY(-120px);

    width:92%;
    max-width:420px;

    background:
    linear-gradient(
        135deg,
        rgba(13,13,13,.98),
        rgba(22,22,22,.98)
    );

    border:
    1px solid
    rgba(255,107,0,.18);

    border-radius:22px;

    padding:16px;

    display:flex;
    align-items:center;
    gap:14px;

    box-shadow:
    0 20px 50px
    rgba(0,0,0,.28);

    backdrop-filter:
    blur(12px);

    z-index:999999;

    opacity:0;
    visibility:hidden;

    transition:
    all .45s ease;
}

.pwa-install-banner.show{

    opacity:1;
    visibility:visible;

    transform:
    translateX(-50%)
    translateY(0);
}

.pwa-install-icon{

    width:52px;
    height:52px;

    border-radius:16px;

    background:
    linear-gradient(
        135deg,
        #b71c1c,
        #ff6b00
    );

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;
    font-size:24px;

    flex-shrink:0;
}

.pwa-install-content{
    flex:1;
}

.pwa-install-title{

    color:#fff;

    font-size:15px;
    font-weight:700;

    margin-bottom:4px;
}

.pwa-install-text{

    color:#cbd5e1;

    font-size:12px;
    line-height:1.5;
}

.pwa-install-actions{

    display:flex;
    align-items:center;
    gap:8px;

    margin-top:10px;
}

.pwa-install-btn{

    border:none;

    border-radius:12px;

    background:
    linear-gradient(
        135deg,
        #b71c1c,
        #ff6b00
    );

    color:#fff;

    font-size:13px;
    font-weight:700;

    padding:10px 14px;

    cursor:pointer;
}

.pwa-close-btn{

    border:none;

    background:
    rgba(255,255,255,.08);

    color:#fff;

    width:38px;
    height:38px;

    border-radius:12px;

    cursor:pointer;

    font-size:18px;
}