/* ================================================================
   JaGedo, floating chat button stack (Zoho SalesIQ above WhatsApp)
   Loaded by every published page. It is a file of its own because the
   Tailwind landing page does not load jagedo-shared.css.

   SalesIQ and the WhatsApp FAB both want the same corner. Keep one
   column on the right: WhatsApp on the bottom, SalesIQ above it.
   The brand is configured "left" in the SalesIQ console, so their
   [position*=left] rules have to be undone here as well as the
   vertical offset applied. Each override needs to out-specify
   `[position*=left] .x` (0,2,0), hence the body + container prefix.
   Set the widget position to bottom-right in the SalesIQ console and
   the side-flipping half of this becomes a harmless no-op.

   Offsets = WhatsApp bottom + its height + a 16px gap. The landing
   page uses the Tailwind twin of .wa-fab at identical sizes (20/56,
   28/60), so one set of numbers covers every page.
   ================================================================ */
body [data-id="zsalesiq"] {
  --jg-fab-right: 20px;
  --jg-fab-bottom: 92px;   /* 20 + 56 + 16 */
}
@media (min-width: 640px) {
  body [data-id="zsalesiq"] {
    --jg-fab-right: 28px;
    --jg-fab-bottom: 104px; /* 28 + 60 + 16 */
  }
}
body [data-id="zsalesiq"] .zsiq-float {
  left: auto !important;
  right: var(--jg-fab-right) !important;
  top: auto !important;
  bottom: var(--jg-fab-bottom) !important;
}
/* Greeting bubble and its arrow belong on the left of a right-hand button. */
body [data-id="zsalesiq"] .zsiq-float-tooltip {
  left: auto !important;
  right: calc(100% + 20px) !important;
}
body [data-id="zsalesiq"] .zsiq-float-tooltip:before {
  left: auto !important;
  right: -5px !important;
  transform: rotate(135deg) !important;
}
body [data-id="zsalesiq"] .zsiq-count-elem { left: -6px !important; right: auto !important; }
body [data-id="zsalesiq"] .zsiq-tultip-close { left: -10px !important; right: auto !important; }

/* The chat panel opens off the button, so it moves up with it. Below 555px
   SalesIQ takes the panel full screen, and the attachment/bot previews and
   the fullscreen window type set their own geometry, so leave all of those
   alone. --zsiqf-float-close-height is SalesIQ's own launcher size. */
@media (min-width: 555px) {
  body [data-id="zsalesiq"] .chat-iframe-wrap:not(.zsiq-fullscreen-size):not(.attach-preview):not(.bot-preview) {
    left: auto !important;
    right: 5px !important;
    bottom: calc(var(--jg-fab-bottom) + var(--zsiqf-float-close-height) + 10px) !important;
    max-height: calc(100% - var(--jg-fab-bottom) - var(--zsiqf-float-close-height) - 20px) !important;
    transform-origin: bottom right !important;
  }
}