#wa-icon{width:60px;height:60px;background:linear-gradient(135deg,#25d366 0,#128c7e 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(37,211,102,.4);cursor:pointer;transition:all .3s ease;border:none;animation:pulse 2s infinite;position:fixed;bottom:20px;left:20px}
div#wa-icon::before{content:'';position:absolute;width:100%;height:100%;border-radius:50%;background:rgba(37,211,102,.3);animation:ripple 2s infinite}
.wa-icon-svg-bg{display:flex;align-items:center;justify-content:center;width:56px;height:56px}
#wa-icon svg{display:block;width:32px;height:32px;fill:#ffffff;position:relative;z-index:1}
#wa-icon:hover{box-shadow:0 8px 24px rgba(0,0,0,.28)}
#wa-icon:hover{box-shadow:0 8px 24px rgba(0,0,0,.28)}
.notification-badge{position:absolute;top:6px;right:6px;background:#ff3b30;color:#fff;border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:.95em;font-weight:700;box-shadow:0 2px 6px rgba(0,0,0,.15);z-index:10000;border:2px solid #fff;pointer-events:none}
#wa-icon:hover{box-shadow:0 8px 24px rgba(0,0,0,.28)}
#wa-widget {
  position: fixed;
  bottom: 94px;
  left: 20px;
  width: 320px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 5px 20px rgba(0,0,0,.2);
  overflow: hidden;
  z-index: 9999;
  border: 1px solid #e0e0e0;
  opacity: 0;
  transform: scale(0.7) translateY(60px);
  pointer-events: none;
  transition: opacity 0.55s cubic-bezier(0.23, 1, 0.32, 1), transform 0.55s cubic-bezier(0.23, 1, 0.32, 1);
}

#wa-widget.active {
  opacity: 1;
  transform: scale(1) translateY(0);
  pointer-events: auto;
}
.wa-header{background:#8908d4;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:16px 16px 12px 16px;position:relative}
.wa-header::before{content:"";display:inline-block;background:url('https://upload.wikimedia.org/wikipedia/commons/6/6b/WhatsApp.svg') no-repeat center center/cover;width:32px;height:32px;margin-right:12px;border-radius:50%;background-color:#25d366}
.wa-title{flex:1}
.wa-title strong{font-size:1em;font-weight:500;font-family:ProximaNovaBold}
.wa-title small{font-size:.8em;font-family:ProximaNovaRegular;color:#e0f2f1}
.wa-close{transition:all .3s ease;font-size:1.5em;cursor:pointer;color:#fff;transition:opacity .2s;background:#000;width:20px;height:20px;border-radius:20px;display:flex;align-items:center;justify-content:center}
.wa-close:hover{background:rgba(255,255,255,.3);transform:rotate(90deg)}
.wa-body{background:#ece5dd;padding:20px;min-height:150px}
.wa-message{color:#222;background:#fff;padding:12px 15px;border-radius:8px;margin-bottom:15px;position:relative;box-shadow:0 1px 2px rgba(0,0,0,.1);animation:slideIn .3s ease;line-height:22px}
.wa-message::before{content:'';position:absolute;left:-8px;top:12px;width:0;height:0;border-style:solid;border-width:0 8px 8px 0;border-color:transparent #fff transparent transparent}
.wa-message .time{display:block;font-size:.8em;color:#999;margin-top:4px}
.wa-footer{display:flex;align-items:center;padding:12px 16px 16px 16px;background:#f0f0f0;border-top:1px solid #e0e0e0}
#wa-input{flex:0 0 80%;border:none;border-radius:20px;padding:10px 16px;font-size:14px;outline:0;margin-right:10px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.03)}
.wa-footer button{background:linear-gradient(45deg,#7c3aed,#b367ff);border:none;border-radius:50%;width:45px;height:45px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.2em;cursor:pointer;transition:background .2s;box-shadow:0 2px 6px rgba(0,0,0,.08);flex:0 0 16%;padding:unset}
.wa-footer button:hover{background:#128c7e}

.wa-title strong {
    position: relative;
}

/* .wa-title strong::after {
    content: "";
    position: absolute;
    right: -23px;
    top: -2px;
    background: url("https://www.blackmarlintechnologies.com/wp-content/uploads/2026/04/Vector.png");
    width: 20px;
    height: 20px;
    background-size: 100%;
    filter: brightness(2);
} */
.wa-header::before {
    background-size: 75%;
}

.wa-close {
    margin-top: -15px;
    margin-right: -5px;
}
#wa-icon {
    z-index: 9999;
}


@media (max-width:767px){
#wa-widget {
    bottom: 115px;
}
}

@media only screen and (max-width: 767px) {
#wa-icon {width: 50px; height: 50px; bottom: 60px; left: 5px;}
#wa-icon svg {width: 28px; height: 28px;}
.notification-badge {top: 0; right: -8px;}
}