/* ===============================
   Digital Pehal WhatsApp Widget
================================ */

.dp-whatsapp{

position:fixed;

right:25px;

bottom:25px;

width:64px;

height:64px;

background:#25D366;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

text-decoration:none;

box-shadow:0 12px 30px rgba(0,0,0,.20);

z-index:9999;

transition:.35s;

animation:dpPulse 2s infinite;

}

/*==================================
    WhatsApp Label
==================================*/

.dp-whatsapp-label{

    position:absolute;

    right:80px;

    top:50%;

    transform:translateY(-50%);

    white-space:nowrap;

    background:#ffffff;

    color:#222;

    padding:12px 18px;

    border-radius:30px;

    font-size:14px;

    font-weight:600;

    box-shadow:0 10px 25px rgba(0,0,0,.15);

    transition:.35s;

}

.dp-whatsapp-label.hide{

    opacity:0;

    visibility:hidden;

    transform:translateY(-50%) translateX(20px);

}

.dp-whatsapp:hover{

transform:translateY(-6px) scale(1.08);

box-shadow:0 18px 40px rgba(0,0,0,.25);

}

.dp-whatsapp img{

width:36px;

height:36px;

}

.tooltip{

position:absolute;

right:80px;

white-space:nowrap;

background:#1f2937;

color:#fff;

padding:10px 15px;

border-radius:8px;

font-size:14px;

font-weight:500;

opacity:0;

visibility:hidden;

transition:.3s;

}

.dp-whatsapp:hover .tooltip{

opacity:1;

visibility:visible;

}

@keyframes dpPulse{

0%{

box-shadow:0 0 0 0 rgba(37,211,102,.6);

}

70%{

box-shadow:0 0 0 18px rgba(37,211,102,0);

}

100%{

box-shadow:0 0 0 0 rgba(37,211,102,0);

}

}

@media(max-width:768px){

.dp-whatsapp{

width:58px;

height:58px;

right:18px;

bottom:18px;

}

.dp-whatsapp img{

width:32px;

height:32px;

}

.tooltip{

display:none;

}

}