.wfs-float{
  position: fixed;
  z-index: 99999;
  width: var(--wfs-size, 56px);
  height: var(--wfs-size, 56px);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #25D366;
  box-shadow: 0 12px 26px rgba(0,0,0,.18);
  transform: translateZ(0);
  transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
  opacity: .98;
  text-decoration: none;
}

.wfs-float:hover{
  transform: scale(1.06);
  box-shadow: 0 16px 34px rgba(0,0,0,.22);
}

.wfs-float svg{
  width: calc(var(--wfs-size, 56px) * 0.55);
  height: calc(var(--wfs-size, 56px) * 0.55);
  fill: #fff;
}

/* Side */
.wfs-side-right{ right: var(--wfs-side, 24px); }
.wfs-side-left{ left: var(--wfs-side, 24px); }

/* Vertical */
.wfs-vert-bottom{ bottom: var(--wfs-bottom, 24px); top: auto; transform: translateZ(0); }
.wfs-vert-top{ top: var(--wfs-bottom, 24px); bottom: auto; transform: translateZ(0); }
.wfs-vert-middle{
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
}

/* Mobile: slightly smaller & safer offsets */
@media (max-width: 480px){
  .wfs-float{ opacity: .96; }
  .wfs-side-right{ right: 14px; }
  .wfs-side-left{ left: 14px; }
}
