.stonexpo-wa{
  --stonexpo-wa-green:#25D366;
  --stonexpo-wa-green-dark:#128C4A;
  --stonexpo-wa-shadow:0 14px 36px rgba(8,31,20,.24);
  position:fixed;
  z-index:999999;
  bottom:24px;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:10px;
  font-family:Vazirmatn,Tahoma,Arial,sans-serif;
  pointer-events:none
}
.stonexpo-wa--left{left:var(--stonexpo-wa-side,24px)}
.stonexpo-wa--right{right:var(--stonexpo-wa-side,24px)}
.stonexpo-wa__button,.stonexpo-wa__hint{pointer-events:auto}
.stonexpo-wa__button{
  position:relative;
  min-height:58px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:7px 10px 7px 18px;
  color:#fff!important;
  background:linear-gradient(135deg,var(--stonexpo-wa-green),var(--stonexpo-wa-green-dark));
  border:1px solid rgba(255,255,255,.28);
  border-radius:999px;
  box-shadow:var(--stonexpo-wa-shadow);
  text-decoration:none!important;
  transform:translateZ(0);
  transition:transform .22s ease,box-shadow .22s ease,filter .22s ease;
  -webkit-tap-highlight-color:transparent
}
.stonexpo-wa--right .stonexpo-wa__button{padding:7px 18px 7px 10px}
.stonexpo-wa__button:hover{
  color:#fff!important;
  transform:translateY(-3px) scale(1.015);
  box-shadow:0 18px 42px rgba(8,31,20,.3);
  filter:saturate(1.05)
}
.stonexpo-wa__button:focus-visible{
  outline:3px solid rgba(37,211,102,.38);
  outline-offset:4px
}
.stonexpo-wa__icon{
  position:relative;
  z-index:2;
  width:44px;
  height:44px;
  flex:0 0 44px;
  display:grid;
  place-items:center;
  color:#fff;
  background:rgba(255,255,255,.13);
  border:1px solid rgba(255,255,255,.2);
  border-radius:50%;
  backdrop-filter:blur(4px)
}
.stonexpo-wa__icon svg{width:29px;height:29px;display:block}
.stonexpo-wa__label{
  position:relative;
  z-index:2;
  white-space:nowrap;
  font-size:13px;
  font-weight:700;
  line-height:1;
  letter-spacing:-.2px
}
.stonexpo-wa__ring{
  position:absolute;
  inset:0;
  border-radius:999px;
  border:2px solid rgba(37,211,102,.42);
  opacity:0
}
.stonexpo-wa--pulse .stonexpo-wa__ring{animation:stonexpoWaPulse 2.5s ease-out infinite}
@keyframes stonexpoWaPulse{
  0%{transform:scale(1);opacity:.7}
  65%{transform:scale(1.18);opacity:0}
  100%{transform:scale(1.18);opacity:0}
}
.stonexpo-wa__hint{
  max-width:230px;
  margin-inline:4px;
  padding:10px 13px;
  color:#24352c;
  background:rgba(255,255,255,.97);
  border:1px solid rgba(18,140,74,.12);
  border-radius:14px 14px 4px 14px;
  box-shadow:0 10px 30px rgba(10,40,25,.12);
  font-size:12px;
  font-weight:600;
  line-height:1.7;
  opacity:0;
  transform:translateY(8px);
  animation:stonexpoWaHint .45s ease 1.2s forwards
}
.stonexpo-wa--right .stonexpo-wa__hint{border-radius:14px 14px 14px 4px}
.stonexpo-wa__hint-dot{
  width:7px;
  height:7px;
  display:inline-block;
  margin-left:5px;
  border-radius:50%;
  background:var(--stonexpo-wa-green);
  box-shadow:0 0 0 4px rgba(37,211,102,.12);
  vertical-align:middle
}
@keyframes stonexpoWaHint{to{opacity:1;transform:translateY(0)}}
.stonexpo-wa--no-label .stonexpo-wa__button{
  width:58px;
  height:58px;
  min-height:58px;
  padding:6px;
  justify-content:center
}
.stonexpo-wa--no-label .stonexpo-wa__icon{
  width:44px;
  height:44px;
  flex-basis:44px
}
@media (max-width:767px){
  .stonexpo-wa{
    bottom:var(--stonexpo-wa-mobile-bottom,20px)
  }
  .stonexpo-wa--left{left:16px}
  .stonexpo-wa--right{right:16px}
  .stonexpo-wa__button{
    width:58px;
    height:58px;
    min-height:58px;
    padding:6px;
    justify-content:center
  }
  .stonexpo-wa__label{display:none}
  .stonexpo-wa__hint{
    max-width:205px;
    font-size:11px;
    padding:9px 11px
  }
}
@media (prefers-reduced-motion:reduce){
  .stonexpo-wa__button,.stonexpo-wa__ring,.stonexpo-wa__hint{
    transition:none!important;
    animation:none!important
  }
  .stonexpo-wa__hint{opacity:1;transform:none}
}
@media print{
  .stonexpo-wa{display:none!important}
}
