.wfb-float-wrap {
	position: fixed;
	z-index: 99999;
	pointer-events: auto;
}

.wfb-float-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border-radius: 50%;
/*	background: #25D366;*/
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	text-decoration: none;
	color: #fff;
	transition: transform .18s ease, box-shadow .18s ease;
	overflow: visible;
}

.wfb-float-button:hover {
	transform: translateY(-4px);
	box-shadow: 0 10px 30px rgba(0,0,0,0.25);
}

.wfb-icon-wrap img.wfb-icon-img,
.wfb-icon-wrap .wfb-svg, .wfb-icon-wrap img {
	display: block;
	width: 64px;
	height: 64px;
}

/* tooltip */
.wfb-tooltip {
	position: absolute;
	bottom: calc(100% + 8px);
	background: #111;
	color: #fff;
	padding: 6px 10px;
	border-radius: 4px;
	font-size: 13px;
	white-space: nowrap;
	opacity: 0;
	transform: translateY(6px);
	transition: opacity .18s ease, transform .18s ease;
	pointer-events: none;
}

/* show on hover */
.wfb-float-button:hover + .wfb-tooltip,
.wfb-float-button:hover .wfb-tooltip {
	opacity: 1;
	transform: translateY(0);
}

/* position side helpers (JS also uses side classes) */
.wfb-right { right: 1.2rem; left: auto; }
.wfb-left{ left: 1.2rem; right: auto; }

/* small screens */
@media (max-width: 768px) {
	.wfb-icon-wrap img.wfb-icon-img,
	.wfb-icon-wrap .wfb-svg {
		width: 30px;
		height: 30px;
	}
	.wfb-float-button { width: 56px; height: 56px; }
}

/* hide on mobile class */
.wfb-hide-mobile { display: block; }
@media (max-width: 768px) {
	.wfb-hide-mobile { display: none !important; }
}
