/* Vihaalaya Floating Social - frontend */
.vfs-floating-social{
  position: fixed;
  top: var(--vfs-top, 22vh);
  display: flex;
  flex-direction: column;
  gap: var(--vfs-gap, 12px);
  z-index: 99999;
}
.vfs-floating-social.side-right{ right: var(--vfs-right, 14px); }
.vfs-floating-social.side-left{ left: var(--vfs-left, 14px); }

.vfs-floating-social a{
  width: var(--vfs-size, 52px);
  height: var(--vfs-size, 52px);
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-decoration: none;
  box-shadow: 0 6px 16px rgba(0,0,0,.18);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  position: relative;
  will-change: transform;
}
.vfs-floating-social a:hover{ transform: translateX(-4px); filter: brightness(1.05); }
.vfs-floating-social a:active{ transform: translateX(-2px) scale(.98); }

.vfs-floating-social a span{
  position: absolute;
  right: calc(100% + 8px);
  background: var(--vfs-tooltip-bg, #1993cc);
  color: #fff;
  padding: .38rem .6rem;
  border-radius: 8px;
  font: 600 12px/1 system-ui, -apple-system, "Segoe UI", Roboto, Arial;
  white-space: nowrap;
  opacity: 0;
  transform: translateX(6px);
  pointer-events: none;
  transition: .18s ease;
  box-shadow: 0 6px 16px rgba(0,0,0,.18);
}
.vfs-floating-social a:hover span{ opacity: 1; transform: translateX(0); }

/* Brand colours */
.vfs-fb { background:#1877f2; }
.vfs-ig { background:#e4405f; }
.vfs-li { background:#0a66c2; }
.vfs-x  { background:#000000; }
.vfs-yt { background:#ff0000; }
.vfs-wa { background:#25d366; }
.vfs-g  { background:#ea4335; }
.vfs-jd { background:#f79556; }

.vfs-floating-social i{ font-size: 22px; }
.vfs-floating-social .jd-badge{ font-weight:800; font-size:15px; letter-spacing:.5px; }

@media (max-width: 768px){
  .vfs-floating-social{ top: 28vh; }
  .vfs-floating-social a span{ display: none; } /* hide tooltips to keep UI clean */
}
@media (max-width: 480px){
  .vfs-floating-social{ --vfs-size: 44px; --vfs-right: 10px; --vfs-left: 10px; }
}
