/* Standalone contact control, available outside the marketplace homepage. */
body.sma-whatsapp-active {
	--sma-whatsapp-size: 56px;
	--sma-whatsapp-edge: 24px;
	--sma-whatsapp-bottom-offset: 0px;
}

a.sma-whatsapp-float,
a.sma-whatsapp-float:visited {
	position: fixed;
	right: calc(var(--sma-whatsapp-edge, 24px) + env(safe-area-inset-right, 0px));
	bottom: calc(var(--sma-whatsapp-edge, 24px) + var(--sma-whatsapp-bottom-offset, 0px) + env(safe-area-inset-bottom, 0px));
	z-index: 998;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: var(--sma-whatsapp-size, 56px);
	height: var(--sma-whatsapp-size, 56px);
	padding: 0;
	margin: 0;
	border: 2px solid #fff;
	border-radius: 50%;
	background: #168c49;
	color: #fff;
	text-decoration: none;
	box-shadow: 0 4px 18px rgba(15, 60, 34, .24);
	line-height: 1;
	-webkit-tap-highlight-color: transparent;
	touch-action: manipulation;
}

a.sma-whatsapp-float:hover,
a.sma-whatsapp-float:focus {
	background: #0e703a;
	color: #fff;
	text-decoration: none;
}

a.sma-whatsapp-float:focus-visible {
	outline: 3px solid #182b21;
	outline-offset: 4px;
	box-shadow: 0 0 0 4px #fff;
}

.sma-whatsapp-float .sma-whatsapp-icon {
	display: block;
	width: 30px;
	height: 30px;
	flex: 0 0 30px;
	fill: currentColor;
	color: inherit;
}

.sma-whatsapp-float .sma-whatsapp-label {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Keep Sinatra's own return-to-top control above the WhatsApp control. */
body.sma-whatsapp-active #si-scroll-top {
	right: calc(var(--sma-whatsapp-edge) + env(safe-area-inset-right, 0px) + (var(--sma-whatsapp-size) - 2.5rem) / 2);
	bottom: calc(var(--sma-whatsapp-edge) + var(--sma-whatsapp-bottom-offset) + env(safe-area-inset-bottom, 0px) + var(--sma-whatsapp-size) + 12px);
}

/* WooCommerce Blocks fixes this checkout button across the viewport bottom. */
body.sma-whatsapp-active:has(.wc-block-cart__submit-container--sticky) {
	--sma-whatsapp-bottom-offset: 96px;
}

@media (max-width: 767px) {
	body.sma-whatsapp-active {
		--sma-whatsapp-size: 52px;
		--sma-whatsapp-edge: 16px;
	}
}

@media print {
	a.sma-whatsapp-float {
		display: none;
	}
}