/* Scroll-to-top button */

.lh-scroll-to-top {
  position: fixed;
  bottom: calc(2rem + var(--lh-fab-safe-bottom));
  right: 2rem;
  width: 3rem;
  height: 3rem;
  border-radius: var(--radius-md);
  background-color: var(--color-primary);
  color: var(--color-on-action, #fff);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background-color var(--duration-base) var(--ease-standard),
    box-shadow var(--duration-base) var(--ease-standard),
    transform var(--duration-base) var(--ease-out),
    opacity var(--duration-base) var(--ease-standard),
    visibility var(--duration-base) var(--ease-standard),
    scale var(--duration-fast) var(--ease-out);
  opacity: 0;
  visibility: hidden;
  /* Sits above page content/header but BELOW drawers (z 300) and modals (z 1000)
     so the cart drawer, search modal and quick-view always overlay it. */
  z-index: 250;
  box-shadow: var(--shadow-md);
}

/* Lift on a real pointer only — a tap would leave it raised on touch. Press
   feedback is the shared scale in base.css. */
@media (hover: hover) and (pointer: fine) {
  .lh-scroll-to-top:hover {
    background-color: var(--color-primary-hover);
    box-shadow: var(--shadow-lg);
    transform: translateY(-2px);
  }
}

.lh-scroll-to-top.is-visible {
  opacity: 1;
  visibility: visible;
}

/* Mobile adjustment */
@media (max-width: 640px) {
  .lh-scroll-to-top {
    bottom: calc(1.5rem + var(--lh-fab-safe-bottom));
    right: 1.5rem;
    width: 2.5rem;
    height: 2.5rem;
  }

  /* Hidden on phones unless the merchant opts in (settings.scroll_to_top_show_mobile). */
  .lh-scroll-to-top--hide-mobile {
    display: none;
  }
}

/* ---------------------------------------------------------------
   Floating launchers vs the page's own bottom bars.
   A bottom sticky bar (PDP add to cart, service Book Now, Club join)
   reserves --lh-fab-safe-bottom, so neither the scroll-to-top button
   nor the Shopify Inbox launcher sits on its CTA. `shopify-chat`
   exposes its button as ::part(activator), the one hook the app offers.
   --------------------------------------------------------------- */
html:has(.lh-pdp-sticky.is-visible, .lh-service-sticky.is-visible),
html.lh-club-stickybar-on {
  --lh-fab-safe-bottom: 5.5rem;
}
@media (min-width: 900px) {
  /* The Club join bar is phones-only (lh-membership.css). */
  html.lh-club-stickybar-on:not(:has(.lh-pdp-sticky.is-visible, .lh-service-sticky.is-visible)) {
    --lh-fab-safe-bottom: 0px;
  }
}
shopify-chat::part(activator) {
  translate: 0 calc(-1 * var(--lh-fab-safe-bottom));
  transition: translate var(--duration-base) var(--ease-standard);
}
/* Any drawer or modal (cart, quick view, search, menu, filters) sets
   body.lh-no-scroll: the launcher would float over its subtotal / CTA.
   The host's own :host display wins over ours, so hide the part itself. */
body.lh-no-scroll shopify-chat::part(activator) { visibility: hidden; }
/* PDPs carry their own sticky add to cart: the scroll-to-top button would
   only compete with it for the same corner. */
html:has(.lh-pdp-sticky) .lh-scroll-to-top { display: none; }