/* Keep the launcher out of modal flows and mobile navigation. */
html[data-avid-chat-suppressed] #cw-bubble-holder,
html[data-avid-chat-suppressed] .woot--notification {
  visibility: hidden !important;
  pointer-events: none !important;
}

@media (max-width: 1023px) {
  #cw-bubble-holder .woot-widget-bubble:not(.woot--close) {
    width: 48px !important;
    height: 48px !important;
    left: max(12px, calc(env(safe-area-inset-left, 0px) + 12px)) !important;
    right: auto !important;
    bottom: max(calc(env(safe-area-inset-bottom, 0px) + 12px), var(--avid-chat-bottom, 12px)) !important;
    border-radius: 50%;
    box-shadow: 0 4px 16px rgb(16 52 88 / 18%);
  }

  #cw-bubble-holder .woot-widget-bubble:not(.woot--close)::before {
    width: 24px !important;
    height: 24px !important;
  }

  #cw-bubble-holder .woot-widget-bubble:not(.woot--close) svg {
    width: 24px;
    height: 24px;
  }

  /* The mobile chat already has its own close control inside the iframe. */
  #cw-bubble-holder .woot-widget-bubble.woot--close {
    display: none !important;
  }

  #cw-widget-holder:not(.woot--hide) {
    top: var(--avid-chat-viewport-top, 0px) !important;
    left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: none !important;
    height: var(--avid-chat-viewport-height, 100dvh) !important;
    max-height: var(--avid-chat-viewport-height, 100dvh) !important;
    margin: 0 !important;
    padding: env(safe-area-inset-top, 0px) 0 env(safe-area-inset-bottom, 0px);
    border-radius: 0 !important;
    box-sizing: border-box;
    background: #fff;
  }

  #cw-widget-holder:not(.woot--hide) iframe {
    width: 100% !important;
    height: 100% !important;
    border-radius: 0 !important;
  }
}