/* Random Floating WooCommerce Products - v1.2.0 */

#rfwc-floating-product.rfwc-floating-product {
	position: fixed !important;
	left: 22px !important;
	right: auto !important;
	bottom: 22px !important;
	top: auto !important;

	z-index: 2147483647 !important;
	display: flex !important;
	align-items: center;
	gap: 13px;
	width: 350px;
	max-width: calc(100vw - 44px);
	padding: 12px;
	box-sizing: border-box;

	background: #fff;
	border: 1px solid rgba(0,0,0,.08);
	border-radius: 14px;
	box-shadow: 0 10px 35px rgba(0,0,0,.18);

	color: #171717;
	text-decoration: none;
	font-family: inherit;

	opacity: 1;
	visibility: visible;
	transform: translate3d(0,0,0);
	transition:
		opacity .5s ease,
		transform .5s ease,
		box-shadow .25s ease;
}

#rfwc-floating-product.rfwc-floating-product:hover {
	transform: translate3d(0,-3px,0);
	box-shadow: 0 14px 40px rgba(0,0,0,.22);
	color: #171717;
	text-decoration: none;
}

/* Used during the 30-second product change. */
#rfwc-floating-product.rfwc-switching {
	opacity: 0 !important;
	transform: translate3d(-18px,0,0) !important;
	pointer-events: none;
}

#rfwc-floating-product.rfwc-hidden {
	display: none !important;
}

.rfwc-image-wrap {
	display: block;
	flex: 0 0 82px;
	width: 82px;
	height: 82px;
	overflow: hidden;
	border-radius: 10px;
	background: #f5f5f5;
}

.rfwc-product-image,
.rfwc-image-wrap img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rfwc-content {
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	padding-right: 14px;
}

.rfwc-name {
	display: block;
	width: 100%;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.rfwc-price {
	display: block;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.3;
}

.rfwc-price del {
	opacity: .55;
	font-weight: 500;
	margin-right: 4px;
}

.rfwc-price ins {
	text-decoration: none;
}

.rfwc-description {
	display: -webkit-box;
	width: 100%;
	font-size: 12px;
	line-height: 1.45;
	color: #666;
	overflow: hidden;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.rfwc-close {
	position: absolute;
	top: 5px;
	right: 7px;
	width: 23px;
	height: 23px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: rgba(0,0,0,.06);
	color: #555;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	opacity: 0;
	transition: opacity .2s ease, background .2s ease;
}

#rfwc-floating-product:hover .rfwc-close,
.rfwc-close:focus {
	opacity: 1;
}

.rfwc-close:hover {
	background: rgba(0,0,0,.12);
}

@media (max-width: 767px) {
	/*
	 * MOBILE ONLY
	 * The desktop layout above is intentionally unchanged.
	 * Keep the popup immediately above the common fixed mobile bottom navigation.
	 */
	#rfwc-floating-product.rfwc-floating-product {
		left: 10px !important;
		right: auto !important;
		bottom: 68px !important;
		top: auto !important;

		width: 270px;
		max-width: calc(100vw - 20px);
		min-height: 66px;
		padding: 6px 9px 6px 6px;
		gap: 9px;
		border-radius: 10px;
	}

	/* Compact product image */
	#rfwc-floating-product .rfwc-image-wrap {
		flex: 0 0 56px;
		width: 56px;
		height: 56px;
		border-radius: 7px;
	}

	/* Product name + price are on ONE horizontal line */
	#rfwc-floating-product .rfwc-content {
		min-width: 0;
		flex: 1 1 auto;
		display: flex;
		flex-direction: row;
		align-items: center;
		gap: 7px;
		padding: 0 13px 0 0;
		overflow: hidden;
	}

	#rfwc-floating-product .rfwc-name {
		display: block;
		flex: 1 1 auto;
		min-width: 0;
		width: auto;
		font-size: 13px;
		font-weight: 700;
		line-height: 1.2;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	#rfwc-floating-product .rfwc-price {
		display: block;
		flex: 0 0 auto;
		font-size: 13px;
		font-weight: 700;
		line-height: 1.2;
		white-space: nowrap;
	}

	#rfwc-floating-product .rfwc-price del {
		display: none;
	}

	#rfwc-floating-product .rfwc-price ins {
		text-decoration: none;
		white-space: nowrap;
	}

	#rfwc-floating-product .rfwc-description {
		display: none;
	}

	#rfwc-floating-product .rfwc-close {
		opacity: 1;
		top: 3px;
		right: 4px;
		width: 18px;
		height: 18px;
		font-size: 14px;
		background: rgba(0,0,0,.06);
	}

	/* Smaller phones */
	@media (max-width: 380px) {
		#rfwc-floating-product.rfwc-floating-product {
			width: 245px;
			bottom: 66px !important;
		}

		#rfwc-floating-product .rfwc-image-wrap {
			flex-basis: 52px;
			width: 52px;
			height: 52px;
		}

		#rfwc-floating-product .rfwc-name,
		#rfwc-floating-product .rfwc-price {
			font-size: 12px;
		}
	}
}

@media (prefers-reduced-motion: reduce) {
	#rfwc-floating-product.rfwc-floating-product {
		transition: none;
	}
}
