/* Estilos gerais do botão */
.whatsapp-button {
    display: inline-flex; /* Alinha o conteúdo no botão */
    background-color: #25D366; /* Cor do botão */
    color: white;
    font-size: 16px; 
    padding: 12px 20px;
    border-radius: 25px; /* Cantos arredondados */
    text-decoration: none !important;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease, transform 0.3s ease;
    text-align: center;
    max-width: fit-content; /* Limita o botão ao tamanho do conteúdo */
    width: auto;
    box-sizing: border-box; /* Garante que o padding não afete o tamanho do botão */
}

i.fab.fa-whatsapp{
    margin-right: 5px !important; /* Espaçamento entre o ícone e o texto */
}

.whatsapp-button img {
    width: 18px; /* Tamanho do ícone */
    height: 18px;
    margin-right: 12px !important; /* Espaçamento entre o ícone e o texto */
}

/* Efeito hover */
.whatsapp-button:hover {
    background-color: #128C7E; /* Cor do botão ao passar o mouse */
    transform: translateY(-4px); /* Efeito de elevação */
    text-decoration: none !important;
    color: white;    
}

/* Efeito de foco para acessibilidade */
.whatsapp-button:focus {
    outline: none;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}