.wsp-float {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 9999;

  display: inline-flex;
  align-items: center;
  gap: 0.6rem;

  padding: 0.85rem 1rem;
  border-radius: 999px;
  text-decoration: none;

  background: #25d366; /* WhatsApp green */
  color: #fff;
  font-weight: 700;

  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.18);
}

.wsp-icon {
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 1.1rem;
  line-height: 1;
}

.wsp-icon img {
  width: 100%;
  height: 100%;
  display: block;
}

/* Hover/active */
.wsp-float:hover {
  transform: translateY(-1px);
}
.wsp-float:active {
  transform: translateY(0);
}

/* Responsive: smaller on phones */
@media (max-width: 480px) {
  .wsp-float {
    right: 0.9rem;
    bottom: 0.9rem;
    padding: 0.75rem 0.85rem;
  }

  /* Hide text on very small screens: show only round icon */
  .wsp-text {
    display: none;
  }

  .wsp-icon {
    width: 2.75rem;
    height: 2.75rem;
    font-size: 1.2rem;
  }
}

/* iOS safe-area support (avoids home indicator overlap) */
@supports (bottom: env(safe-area-inset-bottom)) {
  .wsp-float {
    bottom: calc(1.25rem + env(safe-area-inset-bottom));
    right: calc(1.25rem + env(safe-area-inset-right));
  }

  @media (max-width: 480px) {
    .wsp-float {
      bottom: calc(0.9rem + env(safe-area-inset-bottom));
      right: calc(0.9rem + env(safe-area-inset-right));
    }
  }
}