/* ==========================================================================
   Kenyt AI Agent - floating element positioning
   --------------------------------------------------------------------------
   Loaded on every page alongside the Kenyt bot-loader script.

   Kenyt renders #kenytChatBubble as a fixed 55px circle, 25px from the bottom
   and 20px from the right, with no responsive variation - so by default it
   owns the band 25px-80px above the bottom edge, on every screen size.

   This site has its own floating buttons in that exact corner:
     - #button      main-site back-to-top, injected by js/footercon.js
     - #backToTop   Sylvanor project page back-to-top
   Both are re-stacked above the bubble here, sharing right:20px so the corner
   reads as one tidy column.

   !important is used throughout because these buttons are positioned in
   several places (css/stylesw.css, per-page inline <style> blocks, and three
   separate breakpoints in sylvanorbybluefin/styleBLU.css) with conflicting
   left/right/bottom/transform values.
   ========================================================================== */

#button,
#backToTop {
  right: 20px !important;
  bottom: 96px !important;   /* 16px clear of the chat bubble's 80px top edge */
  left: auto !important;
  transform: none !important;
}

#backToTop {
  width: 52px !important;
  height: 52px !important;
  padding: 0 !important;
  line-height: 52px !important;
  text-align: center !important;
  border-radius: 50% !important;
}

#backToTop:hover {
  transform: none !important;
}

/* --------------------------------------------------------------------------
   Pages carrying a fixed bottom CTA bar (the Sylvanor project page: below
   768px .mobile-action-buttons becomes a fixed full-width bar at bottom:15px,
   43px tall, whose "Enquiry" pill runs to within ~3px of the right edge -
   straight underneath the chat bubble).

   On those pages only, lift the bubble clear of the bar and re-stack the
   back-to-top button above the lifted bubble. The body class keeps this off
   pages that have no bottom bar, where the bubble should stay in the corner.
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
  .has-fixed-bottom-bar #kenytChatBubble.style1 {
    margin-bottom: 70px !important;   /* bubble now owns 70px-125px */
  }

  .has-fixed-bottom-bar #button,
  .has-fixed-bottom-bar #backToTop {
    bottom: 141px !important;         /* 16px clear of the bubble's 125px top */
  }
}
