.whatsapp-chat-container {
    position: fixed;
    bottom: 50px;
    left: 20px;
    z-index: 9999;
}

.whatsapp-chat-button {
    background-color: #25D366; /* WhatsApp Green */
    color: white;
    border-radius: 50%; /* Circular button */
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    transition: transform 0.2s ease-in-out; /* Smooth hover effect */
}

.whatsapp-chat-button:hover {
    transform: scale(1.1); /* Slightly enlarge on hover */
}

.whatsapp-chat-icon {
    width: 50px;
    height: 50px;
}

.whatsapp-chat-popup {
    display: none; /* Hidden by default */
    position: absolute;
    bottom: 30px; /* Position above button */
    left: 0px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    padding: 10px;
    min-width: 250px; /* Adjust as needed */
}

.whatsapp-chat-popup.show { /* Class to show the popup */
    display: block;
}


.whatsapp-chat-widget {
    position: fixed; /* Or absolute, depending on your needs */
    bottom: 20px;
    left: 20px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    padding: 0px;
    z-index: 9999; /* Ensure it's on top */
}

.whatsapp-chat-header {
  font-weight: bold;
  margin-bottom: 10px;
  text-align: center;
  border-bottom : solid 1px #25D366;
}

.whatsapp-account {
    display: flex;
    align-items: center;
    margin-bottom: 10px; /* Space between accounts */
    text-decoration: none; /* Remove underlines from links */
    color: inherit;      /* Inherit text color from parent */
}

.whatsapp-account-image {
    width: 50px;
    height: 50px;
    border-radius: 50%; /* Make images circular */
    margin-right: 10px;
}

.whatsapp-account-info {
    display: flex;
    flex-direction: column; /* Name and status stacked */
}

.whatsapp-account-name {
    font-weight: 500;
}

.whatsapp-account-status {
    font-size: smaller;
    color: #888;
}

.whatsapp-account-status {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-left: 5px; /* Space between name and status */
}

.online {
    background-color: green;
}

.offline {
    background-color: red;
}