/* =========================================
   Logo Carousel Block – Frontend Styles
   ========================================= */

.lcb-wrapper {
	overflow: hidden;
	width: 100%;
	position: relative;
}

.lcb-track {
	display: flex;
	gap: var(--lcb-gap, 30px);
	width: max-content;
	animation: lcb-scroll var(--lcb-duration, 20s) linear infinite;
	will-change: transform;
}

.lcb-wrapper.lcb-pause-hover:hover .lcb-track {
	animation-play-state: paused;
}

@keyframes lcb-scroll {
	0%   { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}

.lcb-item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 20px;
	flex-shrink: 0;
	min-width: 120px;
	box-sizing: border-box;
	transition: opacity 0.2s ease;
}

.lcb-item img {
	display: block;
	width: auto;
	max-width: 100%;
	object-fit: contain;
	user-select: none;
}

/* Fade edges */
.lcb-wrapper::before,
.lcb-wrapper::after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	width: 80px;
	z-index: 2;
	pointer-events: none;
}

.lcb-wrapper::before {
	left: 0;
	background: linear-gradient(to right, var(--lcb-fade-color, #fff) 0%, transparent 100%);
}

.lcb-wrapper::after {
	right: 0;
	background: linear-gradient(to left, var(--lcb-fade-color, #fff) 0%, transparent 100%);
}
