/*******************************************************************************
 * BOTAO FLUTUANTE WHATSAPP - IMPLEMENTACAO ISOLADA
 * 
 * CSS completamente isolado para o botao flutuante do WhatsApp.
 * Nao depende de nenhum estilo global do projeto.
 * Usa classe unica "whatsapp-float-button" para evitar conflitos.
 * 
 * ESPECIFICACOES:
 * - position: fixed (permanece fixo durante scroll)
 * - bottom: 20px, right: 20px (posicionamento exato)
 * - z-index: 9999 (sobrepoe todos os elementos)
 * - Tamanho: 56x56px (circular)
 * - Icone: 28x28px (50% do botao, controlado)
 * - Nao usa width:100%, display:block ou classes globais
 * - Nao interfere no layout da pagina
 *******************************************************************************/

/* Reset completo para o botao - sobrescreve qualquer estilo global */
.whatsapp-float-button {
    /* POSICIONAMENTO FIXO - nao interfere no layout */
    position: fixed !important;
    bottom: 20px !important;
    right: 20px !important;
    
    /* DIMENSOES FIXAS - formato circular */
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    min-height: 56px !important;
    max-width: 56px !important;
    max-height: 56px !important;
    
    /* VISUAL - circulo verde do WhatsApp */
    background-color: #25D366 !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
    
    /* Z-INDEX ALTO - sempre visivel */
    z-index: 9999 !important;
    
    /* FLEXBOX - centraliza o icone */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    
    /* RESET DE PROPRIEDADES QUE PODEM INTERFERIR */
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    float: none !important;
    clear: none !important;
    
    /* LINK - remove sublinhado */
    text-decoration: none !important;
    
    /* TRANSICAO SUAVE */
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    
    /* CURSOR */
    cursor: pointer !important;
}

/* Efeito hover - aumenta levemente */
.whatsapp-float-button:hover {
    transform: scale(1.1) !important;
    box-shadow: 0 6px 20px rgba(37, 211, 102, 0.6) !important;
    text-decoration: none !important;
}

/* Icone SVG - tamanho controlado (28x28px) */
.whatsapp-float-button img {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    float: none !important;
}

/* Responsividade - mantem o mesmo em mobile */
@media screen and (max-width: 768px) {
    .whatsapp-float-button {
        bottom: 20px !important;
        right: 20px !important;
        width: 56px !important;
        height: 56px !important;
    }
    
    .whatsapp-float-button img {
        width: 28px !important;
        height: 28px !important;
    }
}

/* Garante que o botao nao seja afetado por resets globais */
.whatsapp-float-button,
.whatsapp-float-button * {
    box-sizing: border-box !important;
}