.whatsapp-button {
    position: fixed; /* Isso faz com que o botão flutue na tela */
    bottom: 20px;    /* 20px do rodapé */
    right: 20px;     /* 20px da direita */
    z-index: 1000;   /* Garante que o botão fique por cima de outros elementos */
    background-color: #25D366; /* Cor de fundo do botão (verde WhatsApp) */
    border-radius: 50%; /* Torna o botão redondo */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Sombra para dar profundidade */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px; /* Largura do botão */
    height: 80px; /* Altura do botão */
    transition: transform 0.3s ease-in-out; /* Transição suave para o hover */
}

.whatsapp-button:hover {
    transform: scale(1.1); /* Efeito de zoom ao passar o mouse */
}

/* Estilos para o link DENTRO do botão flutuante (para não herdar estilos globais) */
.whatsapp-link {
    display: flex; /* Para centralizar a imagem dentro do link */
    align-items: center;
    justify-content: center;
    width: 100%; /* Ocupa toda a largura do pai */
    height: 100%; /* Ocupa toda a altura do pai */
    text-decoration: none; /* Remove sublinhado */
    color: inherit; /* Garante que a cor do texto não seja alterada (embora não tenhamos texto aqui) */
    /* Reseta estilos comuns de links, se aplicável em seu CSS principal */
    font-size: initial;
    font-weight: initial;
    line-height: initial;
    padding: 0;
    margin: 0;
    border: none;
    background-color: transparent;
}

/* Estilos para o ícone do WhatsApp */
.whatsapp-icon {
    width: 50px; /* Tamanho da imagem do WhatsApp */
    height: 50px; /* Tamanho da imagem do WhatsApp */
    display: block; /* Remove espaços extras em linha */
    border: none; /* Remove qualquer borda que o CSS principal possa adicionar */
    padding: 0;
    margin: 0;
}