.whatsapp-float {
   position: fixed;
   bottom: 20px;
   right: 20px;
   background-color: #25D366;
   color: white;
   width: 70px;
   height: 70px;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
   text-decoration: none;
   z-index: 10;
   transition: all 0.3s ease;
   
}

.whatsapp-float:hover {
   width: 220px;
   border-radius: 30px;
   justify-content: flex-start;
   padding-left: 15px;
   box-shadow: 0 6px 16px rgba(37, 211, 102, 0.4);
}

.whatsapp-float img {
   width: 40px;
   height: 40px;
   filter: brightness(0) invert(1);
}

.whatsapp-float span {
   display: none;
   margin-left: 12px;
   font-weight: 600;
   font-size: 15px;
   white-space: nowrap;
}

.whatsapp-float:hover span {
   display: block;
}

@media (max-width: 480px) {
   .whatsapp-float {
      width: 55px;
      height: 55px;
      bottom: 15px;
      right: 15px;
   }
   
   .whatsapp-float:hover {
      width: 55px;
   }
   
   .whatsapp-float:hover span {
      display: none;
   }
}


.whatsapp-float-sm {
   position: fixed;
   bottom: 20px;
   right: 20px;
   background-color: #25D366;
   color: white;
   width: 40px;
   height: 40px;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
   text-decoration: none;
   z-index: 10;
   transition: all 0.3s ease;
}

.whatsapp-float-sm:hover {
   width: 220px;
   border-radius: 30px;
   justify-content: flex-start;
   padding-left: 15px;
   box-shadow: 0 6px 16px rgba(37, 211, 102, 0.4);
}

.whatsapp-float-sm img {
   width: 23px;
   height: 23px;
   filter: brightness(0) invert(1);
}

.whatsapp-float-sm span {
   display: none;
   margin-left: 12px;
   font-weight: 600;
   font-size: 15px;
   white-space: nowrap;
}

.whatsapp-float-sm:hover span {
   display: block;
}

@media (max-width: 480px) {
   .whatsapp-float-sm {
      width: 55px;
      height: 55px;
      bottom: 15px;
      right: 15px;
   }
   
   .whatsapp-float-sm:hover {
      width: 55px;
   }
   
   .whatsapp-float-sm:hover span {
      display: none;
   }
}