/* Mobile-only layout corrections for Live Chat and the notification panel. */
@media (max-width: 680px) {
    html.mobile-chat-active,
    body.mobile-chat-active {
        width: 100%;
        height: var(--chat-visible-height, 100dvh);
        min-height: 0;
        overflow: hidden;
    }

    body.mobile-chat-active {
        position: fixed;
        inset: var(--chat-visible-top, 0px) 0 auto;
    }

    .heritage-app.mobile-chat-active {
        display: flex;
        flex-direction: column;
        width: 100%;
        height: var(--chat-visible-height, 100dvh);
        min-height: 0;
        max-height: var(--chat-visible-height, 100dvh);
        overflow: hidden;
    }

    .heritage-app.mobile-chat-active > .site-header {
        flex: 0 0 auto;
    }

    .heritage-app.mobile-chat-active > main {
        display: flex;
        flex: 1 1 0;
        flex-direction: column;
        min-height: 0;
        overflow: hidden;
    }

    .heritage-app.mobile-chat-active > main > .mobile-page-navigation,
    .heritage-app.mobile-chat-active > .site-footer,
    .heritage-app.mobile-chat-active > .site-copyright {
        display: none !important;
    }

    .heritage-app.mobile-chat-active .chat-shell {
        flex: 1 1 0;
        width: 100%;
        height: auto;
        min-height: 0;
        max-height: 100%;
        margin: 0;
        border-inline: 0;
    }

    .heritage-app.mobile-chat-active .chat-conversation {
        min-height: 0;
        overflow: hidden;
        grid-template-rows: auto auto minmax(0, 1fr) auto auto;
    }

    .heritage-app.mobile-chat-active .chat-message-history {
        min-height: 0;
        overscroll-behavior: contain;
        scroll-padding-bottom: 1rem;
    }

    .heritage-app.mobile-chat-active .chat-composer {
        flex: 0 0 auto;
        padding-bottom: calc(.55rem + env(safe-area-inset-bottom, 0px));
    }

    .heritage-app.mobile-chat-active .chat-composer textarea {
        min-height: 44px;
        max-height: 6rem;
    }
}

@media (max-width: 620px) {
    .notification-center__panel {
        position: fixed;
        z-index: 100;
        top: var(--notification-panel-top, calc(env(safe-area-inset-top, 0px) + 84px));
        right: 12px;
        left: 12px;
        width: auto;
        max-width: none;
        max-height: min(560px, calc(100dvh - var(--notification-panel-top, 84px) - 12px));
        display: flex;
        flex-direction: column;
        overflow: hidden;
        box-sizing: border-box;
    }

    .notification-center__panel > header,
    .notification-center__push {
        flex: 0 0 auto;
    }

    .notification-center__panel > header {
        min-height: 52px;
        padding-right: 48px;
    }

    .notification-center__panel .notification-center__mobile-close {
        position: absolute;
        top: 8px;
        right: 8px;
        z-index: 2;
        display: inline-grid;
        width: 32px;
        height: 32px;
        place-items: center;
        border: 1px solid var(--line);
        border-radius: 50%;
        background: var(--paper);
        color: var(--gold);
        font-size: 20px;
        line-height: 1;
    }

    .notification-center__list {
        min-height: 0;
        flex: 1 1 auto;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .notification-center__list a {
        min-width: 0;
        overflow-wrap: anywhere;
    }
}