html {
    --support-top-right: .69rem;
    --support-top-radius: .225rem;
    --support-top-size: .45rem;
}

.woot-widget-bubble {
    background: #eb333a !important;
    bottom: 80px !important;
    right: calc(var(--support-top-right) + var(--support-top-radius) - 32px) !important;
    scale: .8;
}

.woot-widget-bubble:not(.woot--close) {
    width: 72px !important;
    height: 72px !important;
    bottom: calc(10vh + var(--support-top-size) + 8px) !important;
    right: calc(var(--support-top-right) + var(--support-top-radius) - 36px) !important;
    background: transparent url(../images/support/support-chat.svg?v=20260730.4) center / 72px 72px no-repeat !important;
    box-shadow: none !important;
    filter: none !important;
}

@media (hover: hover) {
    .woot-widget-bubble:not(.woot--close):hover {
        box-shadow: none !important;
        filter: drop-shadow(0 8px 12px rgba(0, 0, 0, .1)) !important;
    }
}

.woot-widget-bubble:not(.woot--close):focus-visible {
    box-shadow: none !important;
    filter: drop-shadow(0 8px 12px rgba(0, 0, 0, .1)) !important;
}

.woot-widget-bubble:not(.woot--close):active {
    box-shadow: none !important;
    filter: none !important;
}

.woot-widget-bubble:not(.woot--close) #woot-widget-bubble-icon {
    display: none !important;
}

@media (max-width: 1920px) {
    html {
        --support-top-radius: 22.5px;
        --support-top-size: 45px;
    }
}

@media (max-width: 1199px) {
    html {
        --support-top-right: .3rem;
        --support-top-radius: .38rem;
        --support-top-size: .76rem;
    }
}

@media (min-width: 668px) {
    html body .woot-widget-holder {
        right: calc(var(--support-top-right) + var(--support-top-radius) - 32px) !important;
    }

    html body .woot-widget-bubble.woot--close:not(.woot--hide) {
        background: transparent url(../images/support/support-chat-close.svg) center / 24px 24px no-repeat !important;
        border-radius: 0 !important;
        bottom: auto !important;
        box-shadow: none !important;
        height: 40px !important;
        right: calc(var(--support-top-right) + var(--support-top-radius) - 24px) !important;
        scale: 1;
        top: calc(var(--support-chat-close-top) + 4px) !important;
        width: 40px !important;
    }

    html body .woot-widget-bubble.woot--close:not(.woot--hide)::before,
    html body .woot-widget-bubble.woot--close:not(.woot--hide)::after {
        content: none !important;
    }
}

@media (min-width: 768px) {
    html body .woot-widget-holder {
        max-height: min(640px, calc(100dvh - 184px)) !important;
    }
}

@media (max-width: 667px) {
    html.support-chat-open,
    html.support-chat-open body {
        overflow: hidden !important;
    }

    html body .woot-widget-holder {
        height: 100dvh !important;
        max-height: 100dvh !important;
        right: 0 !important;
        width: 100% !important;
    }
}
