/* Баннеры PWA ЛК (static/js/lk-pwa.js): установка и уведомления. Без исходника в css/ — правится напрямую, как lk-*.css. */

.lk-pwa-banner {
    position: fixed;
    right: 16px;
    bottom: calc(16px + env(safe-area-inset-bottom));
    left: 16px;
    z-index: 1080;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    max-width: 520px;
    margin: 0 auto;
    padding: 14px 16px;
    border-radius: var(--mp-radius-md);
    background: var(--mp-surface);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    color: var(--mp-text);
}

/* Над нижней навигацией ЛК на телефоне */
.mp-lk-body:has(.mp-lk-bottom) .lk-pwa-banner {
    bottom: calc(var(--mp-bottom-h, 64px) + 12px + env(safe-area-inset-bottom));
}

.lk-pwa-banner__icon {
    width: 44px;
    height: 44px;
    border-radius: var(--mp-radius-sm);
}

.lk-pwa-banner__text {
    flex: 1 1 200px;
    font-size: 0.9rem;
    line-height: 1.35;
}

.lk-pwa-banner__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
    justify-content: flex-end;
}

.lk-pwa-banner__btn {
    min-height: 44px;
    padding: 0 16px;
    border: 1px solid var(--mp-border);
    border-radius: var(--mp-radius-full);
    background: var(--mp-surface);
    color: var(--mp-muted);
    font-weight: 600;
    transition: background 0.2s ease;
}

.lk-pwa-banner__btn--primary {
    border-color: var(--mp-orange);
    background: var(--mp-orange);
    color: #fff;
}

.lk-pwa-banner__btn--primary:hover {
    background: var(--mp-orange-dark);
}

/* «ЛК обновлён» (lk-pwa.js): констатация факта после полной загрузки новой версии — под липкой шапкой ЛК */
.lk-pwa-toast {
    position: fixed;
    top: calc(var(--mp-header-h, 56px) + 10px + env(safe-area-inset-top));
    left: 50%;
    z-index: 1085;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: calc(100vw - 32px);
    padding: 10px 18px;
    border-radius: var(--mp-radius-full);
    background: var(--mp-green);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
    color: #fff;
    font-size: 0.95rem;
    font-weight: 600;
    transform: translateX(-50%);
    cursor: pointer;
    animation: lk-pwa-toast-in 0.25s ease;
}

.lk-pwa-toast::before {
    content: "✓";
    font-weight: 800;
}

@keyframes lk-pwa-toast-in {
    from {
        opacity: 0;
        transform: translate(-50%, -8px);
    }
}
