/* =====================================================================
   Swisslogistik · Interaktions-Styles
   Konfetti-Erfolgsanimation (slCelebrate) + Tastatur-Zeilennavigation.
   Dezent & performant – nur Transform/Opacity, keine Layout-Reflows.
   ===================================================================== */

/* --- Konfetti ------------------------------------------------------- */
.sl-confetti {
	position: fixed;
	top: 0;
	left: 0;
	width: 8px;
	height: 8px;
	border-radius: 2px;
	z-index: 1100;
	pointer-events: none;
	will-change: transform, opacity;
	opacity: 0;
	animation: sl-confetti-fall 1.6s cubic-bezier(.25, .65, .4, 1) forwards;
}

@keyframes sl-confetti-fall {
	0% {
		opacity: 1;
		transform: translate3d(0, 0, 0) rotate(0deg);
	}
	80% {
		opacity: 1;
	}
	100% {
		opacity: 0;
		transform: translate3d(var(--sl-dx, 0), 78vh, 0) rotate(var(--sl-rot, 360deg));
	}
}

@media (prefers-reduced-motion: reduce) {
	.sl-confetti {
		animation-duration: .4s;
		animation-timing-function: ease-out;
	}
}

/* --- Tastatur-Zeilen-Hervorhebung (.sl-dt j/k) ---------------------- */
.sl-dt tr.sl-row-active > * {
	background-color: var(--bs-primary-bg-subtle, rgba(13, 110, 253, .08)) !important;
}

.sl-dt tr.sl-row-active {
	box-shadow: inset 3px 0 0 var(--bs-primary, #0d6efd);
	outline: none;
}