/*
 * Third-party chatbot compatibility
 * Keeps floating chatbot launchers and expanded conversation windows outside
 * the theme's article/embed sizing rules. This file is intentionally loaded last.
 */

/* Never impose editorial media dimensions on floating chat interfaces. */
:where(
  [id*="chatbot" i],
  [class*="chatbot" i],
  [id*="chat-widget" i],
  [class*="chat-widget" i],
  [id*="chat_window" i],
  [class*="chat-window" i],
  [id*="chat-popup" i],
  [class*="chat-popup" i],
  [data-chatbot],
  [data-chat-widget],
  #bp-web-widget-container,
  #tidio-chat,
  #crisp-chatbox,
  #chatbase-bubble-window,
  .voiceflow-chat,
  .vfrc-widget
) {
  box-sizing: border-box;
}

:where(
  [id*="chatbot" i],
  [class*="chatbot" i],
  [id*="chat-widget" i],
  [class*="chat-widget" i],
  [id*="chat_window" i],
  [class*="chat-window" i],
  [id*="chat-popup" i],
  [class*="chat-popup" i],
  [data-chatbot],
  [data-chat-widget],
  #bp-web-widget-container,
  #tidio-chat,
  #crisp-chatbox,
  #chatbase-bubble-window,
  .voiceflow-chat,
  .vfrc-widget
) iframe {
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
}

/* Common expanded-window names receive a comfortable desktop canvas without
   changing compact launcher buttons. Plugin inline sizing can still override. */
@media (min-width: 769px) {
  :where(
    [id*="chat" i][id*="window" i],
    [class*="chat" i][class*="window" i],
    [id*="chat" i][id*="popup" i],
    [class*="chat" i][class*="popup" i],
    [id*="chat" i][id*="panel" i],
    [class*="chat" i][class*="panel" i]
  ) {
    max-width: min(520px, calc(100vw - 32px)) !important;
  }
}

/* On phones the open conversation must remain inside the visual viewport. */
@media (max-width: 768px) {
  :where(
    [id*="chat" i][id*="window" i],
    [class*="chat" i][class*="window" i],
    [id*="chat" i][id*="popup" i],
    [class*="chat" i][class*="popup" i],
    [id*="chat" i][id*="panel" i],
    [class*="chat" i][class*="panel" i]
  ) {
    max-width: calc(100vw - 20px) !important;
    max-height: calc(100dvh - 20px) !important;
  }
}