/* Shared back-to-top entry: the last contact action, or a compact entry when the dock is hidden. */
.back-to-top-slot {
  position: fixed;
  z-index: 85;
  right: 24px;
  bottom: 24px;
}

#back-to-top,
#contact-dock > #back-to-top {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 64px;
  min-height: 48px;
  gap: 4px;
  margin: 0 0 0 8px;
  padding: 4px 8px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #536073;
  font: 500 12px/1.25 Arial, "Microsoft YaHei", sans-serif;
  cursor: pointer;
  transition: background .16s ease, color .16s ease;
}

#back-to-top > i,
#contact-dock > #back-to-top > i { color: inherit; font-size: 20px; line-height: 1; }
#back-to-top > i::before { display: block; vertical-align: 0; }
#back-to-top > span { white-space: nowrap; }
#contact-dock > #back-to-top { width: 58px; min-height: 40px; font-size: 11px; }
#contact-dock > #back-to-top > i { font-size: 18px; }
#back-to-top[hidden],
#contact-dock > #back-to-top[hidden] { display: none; }

#back-to-top:hover,
#back-to-top:focus-visible,
#contact-dock > #back-to-top:hover,
#contact-dock > #back-to-top:focus-visible { background: #fff3f2; color: var(--red, #ed2729); }
#back-to-top:focus-visible { outline: 2px solid var(--red, #ed2729); outline-offset: 3px; }
#contact-dock > #back-to-top::before {
  content: "";
  position: absolute;
  top: calc(50% - 12px);
  left: -4px;
  height: 24px;
  border-left: 1px solid #eeecea;
}

#back-to-top > .back-to-top-tooltip {
  position: absolute;
  right: 0;
  bottom: calc(100% + 12px);
  padding: 5px 9px;
  border-radius: 5px;
  background: #252c3d;
  color: #fff;
  font-size: 12px;
  line-height: 1.5;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
#back-to-top:hover > .back-to-top-tooltip,
#back-to-top:focus-visible > .back-to-top-tooltip { opacity: 1; visibility: visible; }

.back-to-top-slot > #back-to-top {
  margin: 0;
  padding: 8px;
  min-height: 60px;
  border: 1px solid #e7e5e3;
  border-top: 2px solid var(--red, #ed2729);
  background: #fff;
  box-shadow: 0 3px 6px #29231e05, 0 10px 28px #29231e0a;
}
.back-to-top-slot > #back-to-top:hover,
.back-to-top-slot > #back-to-top:focus-visible { background: #fff3f2; }

@media (min-width: 1680px) {
  #contact-dock > #back-to-top { width: auto; min-height: 48px; margin: 6px 0 0; padding: 6px 0; }
  #contact-dock > #back-to-top::before {
    top: -4px;
    left: calc(50% - 16px);
    width: 32px;
    height: 0;
    border-left: 0;
    border-top: 1px solid #eeecea;
  }
  #contact-dock > #back-to-top > .back-to-top-tooltip {
    right: calc(100% + 16px);
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
  }
}

@media (prefers-reduced-motion: reduce) { #back-to-top, #contact-dock > #back-to-top { transition: none; } }
@media print { .back-to-top-slot { display: none; } }
