/* ──────────────────────────────────────────────────────────────
   Relevance AI chat bubble — launcher placement

   The widget script appends <div class="relevanceai-chat-bubble-container">
   to <body> with inline styles (position:fixed; bottom:20px; right:20px) and
   no z-index, which lands it directly on top of the WhatsApp float button and
   behind it in paint order (.floats sits at z-index 900).

   Inline styles outrank normal stylesheet rules, so !important is required
   here to reposition the launcher.

   Offsets are safe-area aware and mirror the ones on .floats, so the two
   buttons move together on devices that expose an inset (notch, home
   indicator). env() resolves to 0px where there is no inset, which keeps the
   placement identical to the plain-pixel values on every other screen.

   Result: gold chat launcher stacked directly above the green WhatsApp button,
   both fully visible in the bottom-right corner.
   ────────────────────────────────────────────────────────────── */

.relevanceai-chat-bubble-container{
  /* the widget already sets this inline; stated here so the launcher stays
     pinned to the viewport even if the embed's own styling changes */
  position:fixed !important;
  /* .floats bottom (1.5rem = 24px) + .fb height (54px) + 12px gap */
  bottom:calc(90px + env(safe-area-inset-bottom,0px)) !important;
  /* centres the 60px bubble over the 54px WhatsApp button at right:1rem */
  right:calc(13px + env(safe-area-inset-right,0px)) !important;
  /* above .floats (900) and the sticky header (1000), below modals (2000) */
  z-index:1200 !important;
}

@media(max-width:768px){
  .relevanceai-chat-bubble-container{
    /* .floats bottom (1rem = 16px) + .fb height (46px) + 12px gap */
    bottom:calc(74px + env(safe-area-inset-bottom,0px)) !important;
    right:calc(8px + env(safe-area-inset-right,0px)) !important;
  }
}
