/* Fix chat widget on speedtest page - 03.12.2025 */

/* Prevent chat from expanding full width */
.wrapper-chat,
app-root,
[class*='chat-widget'],
[class*='chat-container'] {
    width: auto !important;
    max-width: 380px !important;
    min-width: 0 !important;
}

/* Chat button - fixed position */
#openChat,
.chat-button,
[class*='chat-btn'] {
    position: fixed !important;
    bottom: 90px !important;
    right: 20px !important;
    width: 60px !important;
    height: 60px !important;
    max-width: 60px !important;
    border-radius: 50% !important;
    z-index: 2147483641 !important;
}

/* Chat window when open */
.chat-window,
[class*='chat-box'],
[class*='chat-panel'] {
    position: fixed !important;
    bottom: 160px !important;
    right: 20px !important;
    width: 350px !important;
    max-width: calc(100vw - 40px) !important;
    height: auto !important;
    max-height: 500px !important;
    border-radius: 16px !important;
    z-index: 2147483640 !important;
}

/* Operator bar at bottom - prevent full width */
.operator-bar,
[class*='operator'],
.chat-operator {
    position: fixed !important;
    bottom: 0 !important;
    left: auto !important;
    right: 20px !important;
    width: 280px !important;
    max-width: 280px !important;
    border-radius: 16px 16px 0 0 !important;
}

@media (max-width: 768px) {
    .wrapper-chat,
    app-root {
        max-width: 100% !important;
    }
    
    .chat-window,
    [class*='chat-box'] {
        width: calc(100vw - 30px) !important;
        right: 15px !important;
        bottom: 140px !important;
    }
    
    .operator-bar,
    [class*='operator'] {
        width: calc(100vw - 30px) !important;
        right: 15px !important;
    }
}