/* =====================================
   PROMOBAM Commerce v2.0
   Hoja principal de estilos
===================================== */

:root{

    background:var(--color-whatsapp);

    --shadow-whatsapp:0 8px 25px rgba(0,0,0,.30);

    --shadow-whatsapp-hover:0 10px 35px rgba(37,211,102,.60);

    --animation-time:.30s;

}

body{
    scroll-behavior:smooth;
}
/* ==========================================
   BOTÓN FLOTANTE WHATSAPP
========================================== */

.whatsapp-float{
    position:fixed;
    bottom:25px;
    right:25px;
    width:65px;
    height:65px;
    background:#25D366;
    border-radius:50%;
    display:flex;
    justify-content:center;
    align-items:center;
    text-decoration:none;
    box-shadow:var(--shadow-whatsapp);
    z-index:9999;
    transition:var(--animation-time);
    animation:whatsappFloat 2.5s ease-in-out infinite;
}

.whatsapp-float:hover{
    transform:scale(1.10);
box-shadow:var(--shadow-whatsapp-hover);
}

.whatsapp-float svg{
    width:34px;
    fill:white;
}

@keyframes whatsappFloat{

    0%{
        transform:translateY(0px);
    }

    50%{
        transform:translateY(-6px);
    }

    100%{
        transform:translateY(0px);

        will-change:transform;
    }

}@media (max-width:768px){

    .whatsapp-float{

        width:58px;

        height:58px;

        bottom:18px;

        right:18px;

    }

    .whatsapp-float svg{

        width:30px;

    }

}
.whatsapp-float:focus{

    outline:3px solid white;

    outline-offset:4px;

}