/* _content/Chassis.UI.Common.ModuleBuilder.VDP/Components/VDPModuleCanvas.razor.rz.scp.css */
/*  VDP Global
=================================================================================================*/
.btn-spinner-overlay[b-6iprwwc14u] {
    position: absolute;
    height: 25px;
    width: 25px;
    border: 7px solid silver;
    border-top: 7px solid #337AB7;
    border-radius: 50%;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    z-index: 1001;
    animation: spin 700ms linear infinite;
    margin: auto;
}

@media (max-width: 576px) {
    .vdp__container .module[b-6iprwwc14u] {
        margin-bottom: 25px;
    }
}

.vdp__main__content__wrapper[b-6iprwwc14u] {
    margin-left: auto;
    margin-right: auto;
}

/*  The chat lives in a single fixed iframe. The iframe captures pointer events, so the frame
    must be no larger than the visible chat UI in each state — otherwise its transparent area
    sits on top of the page and swallows clicks meant for the page behind it. The chat app posts
    its open/closed state to this page (chassis-chat:expand / collapse / peek-show / peek-hide);
    interop.js toggles the is-open / is-peek classes below in response.                          */
.vdp__chat-widget[b-6iprwwc14u] {
    position: fixed;
    right: 16px;
    bottom: 16px;
    /* Collapsed: only as big as the FAB bubble, so the rest of the page stays clickable. */
    width: 88px;
    height: 88px;
    z-index: 2147483000;
    pointer-events: none;
    transition: width .2s ease, height .2s ease;
}

    /* Proactive peek nudge needs room for the message beside the bubble. */
    .vdp__chat-widget.is-peek[b-6iprwwc14u] {
        width: 360px;
        height: 132px;
    }

    /* Opened panel (desktop). */
    .vdp__chat-widget.is-open[b-6iprwwc14u] {
        width: 380px;
        height: 600px;
        max-width: calc(100vw - 32px);
        max-height: calc(100vh - 32px);
    }

    .vdp__chat-widget iframe[b-6iprwwc14u] {
        width: 100%;
        height: 100%;
        border: 0;
        background: transparent;
        pointer-events: auto;
        color-scheme: normal;
    }

/*  Mobile: lift the collapsed bubble above the Call/Message sticky tray
    (MobileStickyFooter is 80px tall and shows below the 769px breakpoint), and open the chat
    full-screen instead of a fixed floating panel that would overflow the viewport.
=================================================================================================*/
@media (max-width: 768px) {
    .vdp__chat-widget[b-6iprwwc14u] {
        bottom: 96px; /* 80px tray + 16px gap */
    }

    .vdp__chat-widget.is-peek[b-6iprwwc14u] {
        width: calc(100vw - 32px);
    }

    .vdp__chat-widget.is-open[b-6iprwwc14u] {
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        max-width: none;
        max-height: none;
    }
}