.mpx-whatsapp-icon {
    position: fixed;
    bottom: 1.25rem;
    right: 1.25rem;
    z-index: 9999;
    opacity: 0;
    transform: translateY(20px);
    animation: fadeUp 0.8s ease-out forwards;
    animation-delay: 0.5s;
}

.mpx-whatsapp-icon img {
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    cursor: pointer;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.mpx-whatsapp-icon img:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 10px rgba(7,42,20,0.25);
}

@keyframes fadeUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ================================
   Device-specific visibility
   ================================ */

/* Hide on Desktop */
@media (min-width: 1025px) {
  .mpx-whatsapp-icon.hide-desktop {
    display: none !important;
  }
}

/* Hide on Tablet */
@media (min-width: 768px) and (max-width: 1024px) {
  .mpx-whatsapp-icon.hide-tablet {
    display: none !important;
  }
}

/* Hide on Mobile */
@media (max-width: 767px) {
  .mpx-whatsapp-icon.hide-mobile {
    display: none !important;
  }
}

/* Position variants */
.mpx-whatsapp-icon.pos-bottom-right { bottom: 1.25rem; right: 1.25rem; }
.mpx-whatsapp-icon.pos-bottom-left  { bottom: 1.25rem; left: 1.25rem; }
.mpx-whatsapp-icon.pos-top-right    { top: 1.25rem; right: 1.25rem; }
.mpx-whatsapp-icon.pos-top-left     { top: 1.25rem; left: 1.25rem; }
