/* =====================================================
   CanaHelper WhatsApp Button
   Version : 1.0
===================================================== */

.chw-whatsapp-button{
    position:fixed;
    width:60px;
    height:60px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#25D366;
    border-radius:50%;
    text-decoration:none;
    box-shadow:0 8px 25px rgba(37,211,102,.35);
    transition:all .3s ease;
    z-index:999999;
}

.chw-whatsapp-button:hover{
    transform:scale(1.08);
    box-shadow:0 12px 30px rgba(37,211,102,.45);
}

.chw-whatsapp-button img{

width:30px;

height:30px;

display:block;

}

/* ===========================
Position
=========================== */

.chw-right{

right:25px;

bottom:25px;

}

.chw-left{

left:25px;

bottom:25px;

}

/* ===========================
Shape
=========================== */

.chw-circle{

border-radius:50%;

}

.chw-rounded{

border-radius:18px;

}

.chw-square{

border-radius:6px;

}

/* ===========================
Button Size
=========================== */

.chw-small{

width:50px;

height:50px;

}

.chw-small img{

width:24px;

height:24px;

}

.chw-medium{

width:60px;

height:60px;

}

.chw-medium img{

width:30px;

height:30px;

}

.chw-large{

width:70px;

height:70px;

}

.chw-large img{

width:36px;

height:36px;

}

/* ===========================
Hover Effect
=========================== */

.chw-whatsapp-button:hover{

transform:translateY(-4px) scale(1.05);

box-shadow:0 16px 35px rgba(0,0,0,.28);

}

/* ===========================
Mobile Responsive
=========================== */

@media(max-width:768px){

.chw-right{

right:18px;

bottom:18px;

}

.chw-left{

left:18px;

bottom:18px;

}

.chw-small{

width:48px;

height:48px;

}

.chw-medium{

width:56px;

height:56px;

}

.chw-large{

width:64px;

height:64px;

}

.chw-small img{

width:22px;

height:22px;

}

.chw-medium img{

width:28px;

height:28px;

}

.chw-large img{

width:32px;

height:32px;

}

}


.chw-icon{
    width:32px;
    height:32px;
    display:block;
    object-fit:contain;
}