.woot-widget-bubble {
  box-sizing: border-box !important;
  right: 24px !important;
  bottom: 108px !important;
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  min-height: 58px !important;
  max-width: 58px !important;
  max-height: 82px !important;
  padding: 0 !important;
  border: 0 !important;
  z-index: 39 !important;
  overflow: visible !important;
}

.woot-widget-bubble:not(.woot--close) {
  height: 82px !important;
  border-radius: 0 !important;
  background: transparent url("/assets/chatwoot-service-icon.png") center top / 58px auto no-repeat !important;
  box-shadow: none !important;
}

.woot-widget-bubble.woot--close {
  max-height: 58px !important;
  border-radius: 50% !important;
  background: #00a0e9 !important;
  box-shadow: 0 0 22px rgba(0, 160, 233, 0.5) !important;
}

.woot-widget-bubble svg,
.woot-widget-bubble img,
.woot-widget-bubble > span {
  opacity: 0 !important;
  visibility: hidden !important;
}

.woot-widget-bubble.woot--close::before,
.woot-widget-bubble.woot--close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 28px;
  height: 3px;
  border-radius: 999px;
  background: #ffffff;
  transform-origin: center;
}

.woot-widget-bubble.woot--close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.woot-widget-bubble.woot--close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.woot-widget-holder {
  right: 24px !important;
  bottom: 196px !important;
  z-index: 39 !important;
}

body:has(.wechat-float.open) .woot-widget-bubble,
body:has(.wechat-float.open) .woot-widget-holder {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

@media (max-width: 767px) {
  .woot-widget-bubble {
    right: 14px !important;
    bottom: 180px !important;
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    min-height: 52px !important;
    max-width: 52px !important;
    max-height: 73px !important;
  }

  .woot-widget-bubble:not(.woot--close) {
    height: 73px !important;
    background-size: 52px auto !important;
  }

  .woot-widget-bubble.woot--close {
    max-height: 52px !important;
  }

  .woot-widget-bubble.woot--close::before,
  .woot-widget-bubble.woot--close::after {
    width: 25px;
    height: 3px;
  }

  .woot-widget-holder {
    right: 14px !important;
    bottom: 262px !important;
    width: min(100vw - 28px, 400px) !important;
    max-height: calc(100vh - 282px) !important;
    max-height: calc(100dvh - 282px) !important;
  }
}