/**
 * Global Back to Top component.
 */
.nyli-back-to-top {
	position: fixed;
	bottom: var(--nyli-back-to-top-offset-bottom);
	z-index: 1100;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--nyli-back-to-top-size);
	height: var(--nyli-back-to-top-size);
	margin: 0;
	padding: 0;
	border: var(--nyli-back-to-top-border-width) solid var(--nyli-back-to-top-border-color);
	border-radius: var(--nyli-back-to-top-radius);
	background: var(--nyli-back-to-top-bg);
	color: var(--nyli-back-to-top-color);
	cursor: pointer;
	opacity: 0;
	pointer-events: none;
	transform: translateY(0.65rem);
	transition: opacity 0.2s ease, transform 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.nyli-back-to-top--right {
	right: var(--nyli-back-to-top-offset-right);
}

.nyli-back-to-top--left {
	left: var(--nyli-back-to-top-offset-left);
}

.nyli-back-to-top.is-visible {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0);
}

.nyli-back-to-top.has-shadow {
	box-shadow: 0 5px 14px rgba(0, 0, 0, 0.32);
}

.nyli-back-to-top svg {
	width: var(--nyli-back-to-top-icon-size);
	height: var(--nyli-back-to-top-icon-size);
}

.nyli-back-to-top:hover,
.nyli-back-to-top:focus {
	background: var(--nyli-back-to-top-hover-bg);
	color: var(--nyli-back-to-top-hover-color);
}

.nyli-back-to-top:focus-visible {
	outline: 2px solid var(--nyli-light-gold);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.nyli-back-to-top {
		transition: none;
	}
}