.fb-floating-buttons {
	position: fixed;
	z-index: 999999;
	display: flex;
}

.fb-floating-buttons.fb-align-end {
	align-items: flex-end;
}

.fb-floating-buttons.fb-align-start {
	align-items: flex-start;
}

.fb-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}

.fb-item:not(:last-child) {
	margin-bottom: var( --fb-margin-between, 10px );
}

.fb-item-link {
	display: flex;
	align-items: center;
	height: 48px;
	border-radius: 24px;
	background-color: var( --fb-bg, #f26530 );
	color: #fff;
	text-decoration: none;
	overflow: hidden;
	box-shadow: 0 2px 10px rgba( 0, 0, 0, 0.2 );
	transition: box-shadow 0.2s ease;
}

.fb-item-link:hover,
.fb-item-link:focus {
	color: #fff;
	box-shadow: 0 4px 14px rgba( 0, 0, 0, 0.3 );
}

.fb-item-link.fb-has-image {
	background-color: transparent;
	box-shadow: none;
}

.fb-item-link.fb-has-image:hover,
.fb-item-link.fb-has-image:focus {
	box-shadow: none;
}

.fb-icon {
	flex: 0 0 48px;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	position: relative;
	z-index: 2;
}

.fb-has-image .fb-icon {
	border-radius: 50%;
	box-shadow: 0 2px 8px rgba( 0, 0, 0, 0.25 );
}

.fb-icon .dashicons {
	width: 22px;
	height: 22px;
	font-size: 22px;
}

.fb-icon img {
	width: 24px;
	height: 24px;
	object-fit: contain;
}

.fb-has-image .fb-icon img {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
}

.fb-label {
	max-width: 0;
	overflow: hidden;
	white-space: nowrap;
	font-size: 14px;
	line-height: 1;
	transition: max-width 0.3s ease, padding 0.3s ease;
}

.fb-position-bottom_right .fb-item-link,
.fb-position-center_right .fb-item-link {
	flex-direction: row-reverse;
}

.fb-position-bottom_right .fb-item-link:hover .fb-label,
.fb-position-bottom_right .fb-item-link:focus .fb-label,
.fb-position-center_right .fb-item-link:hover .fb-label,
.fb-position-center_right .fb-item-link:focus .fb-label {
	max-width: 220px;
	padding-left: 14px;
}

.fb-position-bottom_left .fb-item-link:hover .fb-label,
.fb-position-bottom_left .fb-item-link:focus .fb-label,
.fb-position-center_left .fb-item-link:hover .fb-label,
.fb-position-center_left .fb-item-link:focus .fb-label {
	max-width: 220px;
	padding-right: 14px;
}

.fb-toggle-item {
	display: none;
}

.fb-toggle-btn {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background-color: #333;
	color: #fff;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba( 0, 0, 0, 0.2 );
}

.fb-toggle-btn .fb-icon-close {
	display: none;
}

.fb-floating-buttons.fb-open .fb-toggle-btn .fb-icon-open {
	display: none;
}

.fb-floating-buttons.fb-open .fb-toggle-btn .fb-icon-close {
	display: inline-block;
}

/* Ring animation */
.fb-ring-circle,
.fb-ring-circle-fill {
	position: absolute;
	top: -8px;
	left: -8px;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	pointer-events: none;
}

.fb-ring-circle {
	border: 2px solid rgba( 30, 30, 30, 0.4 );
	opacity: 0.1;
	animation: fb-ring-circle-anim 1.2s infinite ease-in-out;
}

.fb-ring-circle-fill {
	background-color: var( --fb-bg, #f26530 );
	opacity: 0.2;
	animation: fb-ring-circle-fill-anim 2.3s infinite ease-in-out;
}

@keyframes fb-ring-circle-anim {
	0% {
		transform: scale( 0.5 );
		opacity: 0.1;
	}
	30% {
		transform: scale( 0.7 );
		opacity: 0.5;
	}
	100% {
		transform: scale( 1 );
		opacity: 0.1;
	}
}

@keyframes fb-ring-circle-fill-anim {
	0% {
		transform: scale( 0.7 );
		opacity: 0.2;
	}
	50% {
		transform: scale( 1 );
		opacity: 0.2;
	}
	100% {
		transform: scale( 0.7 );
		opacity: 0.2;
	}
}

@media screen and ( max-width: 575px ) {
	.fb-floating-buttons[ data-mobile="hide" ] {
		display: none;
	}

	.fb-floating-buttons[ data-mobile="collapsed" ] .fb-item {
		display: none;
	}

	.fb-floating-buttons[ data-mobile="collapsed" ].fb-open .fb-item {
		display: block;
	}

	.fb-floating-buttons[ data-mobile="collapsed" ] .fb-toggle-item {
		display: block;
	}

	.fb-position-bottom_right[ data-mobile="collapsed" ] .fb-toggle-item,
	.fb-position-center_right[ data-mobile="collapsed" ] .fb-toggle-item {
		text-align: right;
	}
}
