/* Scripto Scroll To Top - frontend styles */
#sstt-button {
	position: fixed;
	bottom: var(--sstt-bottom, 30px);
	width: var(--sstt-size, 48px);
	height: var(--sstt-size, 48px);
	background-color: var(--sstt-bg, #000000);
	border: none;
	border-radius: var(--sstt-radius, 50%);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: var(--sstt-zindex, 9999);
	opacity: 0;
	visibility: hidden;
	transform: translateY(15px);
	transition: opacity .3s ease, transform .3s ease, visibility .3s ease, background-color .2s ease;
	box-shadow: 0 3px 10px rgba(0, 0, 0, .25);
	padding: 0;
}

#sstt-button.sstt-position-right {
	right: var(--sstt-side, 30px);
}

#sstt-button.sstt-position-left {
	left: var(--sstt-side, 30px);
}

#sstt-button.sstt-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

#sstt-button:hover {
	filter: brightness(1.2);
}

#sstt-button svg {
	pointer-events: none;
	width: 45%;
	height: 45%;
}

/* Inline shortcode button (optional manual placement) */
.sstt-inline-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--sstt-size, 48px);
	height: var(--sstt-size, 48px);
	background-color: var(--sstt-bg, #000000);
	border: none;
	border-radius: var(--sstt-radius, 50%);
	cursor: pointer;
	box-shadow: 0 3px 10px rgba(0, 0, 0, .25);
}

.sstt-inline-btn:hover {
	filter: brightness(1.2);
}

@media (max-width: 480px) {
	#sstt-button {
		bottom: calc(var(--sstt-bottom, 30px) * 0.7);
	}
}