/**
 * CzarCommerce — Botão "voltar ao topo" (F12-B).
 *
 * Reproduz 1:1 o css/parts/opt-scrolltotop.min.css (LTR). As classes
 * .scrollToTop/.button-show são consumidas pelo JS legacy
 * (js/scripts/global/scrollTop.js + combine.js) — rename czar-* só na
 * F12-E, quando o módulo de scroll for reescrito. Propriedades físicas
 * (right/bottom) mantidas verbatim; logical properties ficam para o
 * rewrite. `pointer-events: visible` replicado verbatim (legacy).
 */

.scrollToTop {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 350;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: rgba(var(--bgcolor-white-rgb), 0.9);
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.17);
	color: var(--color-gray-800);
	font-size: 16px;
	opacity: 0;
	pointer-events: none;
	text-decoration: none !important;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	transform: translateX(100%);
}

.scrollToTop.button-show {
	opacity: 1;
	transform: none;
	pointer-events: visible;
}

.scrollToTop:after {
	content: "\f115";
	font-family: "woodmart-font";
}

.scrollToTop:hover {
	color: var(--color-gray-500);
}

.wd-search-opened .scrollToTop {
	display: none;
}

@media (max-width: 1024px) {
	.scrollToTop {
		right: 12px;
		bottom: 12px;
		width: 40px;
		height: 40px;
		font-size: 14px;
	}
}