/*
 * Floating "Ask Us" chat container — Miller Library pages that do not render
 * the Library Header component (which carries its own, in the branded band).
 *
 * Geometry deliberately matches .com-library-header-chat-float in
 * editor-components/library-header/style.css, so the button sits in the same
 * place whether it is this fallback or the clone that component floats once its
 * own button scrolls away. Moving between the homepage and any other page
 * should not move the chat.
 *
 * Only the wrapper is styled. The button inside is built by the vendor script
 * and keeps its own colours and its own accessible name; nothing here touches
 * it beyond giving it a shadow so it reads as raised off the page.
 */

.wnmu-chat-float {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 9999;
}

.wnmu-chat-float > div > * {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  box-shadow: 0 6px 22px hsl(0 0% 0% / 0.35);
}

.wnmu-chat-float svg { flex: 0 0 auto; }

/*
  Keep clear of the viewport edge on small screens, where 22px of gutter is a
  larger share of the width and the button can crowd content beneath it.
*/
@media (width <= 480px) {
  .wnmu-chat-float { right: 12px; bottom: 12px; }
}

/*
  In forced-colours mode the vendor's background is discarded and the button can
  dissolve into the page behind it. A system-coloured border keeps it a distinct
  object.
*/
@media (forced-colors: active) {
  .wnmu-chat-float > div > * { border: 2px solid CanvasText; }
}

/*
  Printing a floating chat button wastes ink and covers the text underneath it.
*/
@media print {
  .wnmu-chat-float { display: none; }
}