/**
 * Nice PageBuilder — Logo Carousel (frontend)
 *
 * The PHP component passes configuration through CSS custom properties:
 *   --npb-lc-per-view   Logos visibles simultáneamente
 *   --npb-lc-gap        Espaciado entre logos
 *   --npb-lc-logo-h     Altura de los logos
 *   --npb-lc-bullet / --npb-lc-bullet-active  Colores de los bullets
 */

.nice-pb-logo-carousel {
	width: 100%;
}

.nice-pb-lc__viewport {
	overflow: hidden;
	width: 100%;
}

.nice-pb-lc__track {
	display: flex;
	align-items: center;
	gap: var(--npb-lc-gap, 30px);
	will-change: transform;
}

.nice-pb-lc__item {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 calc((100% - (var(--npb-lc-per-view, 4) - 1) * var(--npb-lc-gap, 30px)) / var(--npb-lc-per-view, 4));
	min-width: 0;
}

.nice-pb-lc__item img {
	display: block;
	width: auto;
	max-width: 100%;
	height: var(--npb-lc-logo-h, 60px);
	object-fit: contain;
}

/* ── Animación: slide (paso a paso) ─────────────────────────────────────── */

.nice-pb-lc--slide .nice-pb-lc__track {
	transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.nice-pb-lc--slide .nice-pb-lc__track.npb-lc-no-transition {
	transition: none;
}

/* ── Animación: marquee (scroll continuo) ───────────────────────────────── */

.nice-pb-lc--marquee .nice-pb-lc__track {
	width: max-content;
	animation: npb-lc-marquee var(--npb-lc-marquee-duration, 30s) linear infinite;
}

.nice-pb-lc--marquee .nice-pb-lc__item {
	flex: 0 0 auto;
	padding: 0 calc(var(--npb-lc-gap, 30px) / 2);
}

.nice-pb-lc--marquee .nice-pb-lc__track {
	gap: 0;
}

.nice-pb-lc--marquee.nice-pb-lc--pause-hover:hover .nice-pb-lc__track {
	animation-play-state: paused;
}

@keyframes npb-lc-marquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

/* ── Animación: fade (por páginas) ──────────────────────────────────────── */

.nice-pb-lc--fade .nice-pb-lc__viewport {
	position: relative;
}

.nice-pb-lc--fade .nice-pb-lc__track {
	display: block;
}

.nice-pb-lc__page {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--npb-lc-gap, 30px);
	opacity: 0;
	position: absolute;
	inset: 0;
	pointer-events: none;
	transition: opacity 0.6s ease;
}

.nice-pb-lc__page.is-active {
	opacity: 1;
	position: relative;
	pointer-events: auto;
}

.nice-pb-lc__page .nice-pb-lc__item {
	flex: 1 1 0;
}

/* ── Bullets ─────────────────────────────────────────────────────────────── */

.nice-pb-lc__bullets {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	margin-top: 20px;
}

.nice-pb-lc__bullet {
	width: 10px;
	height: 10px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--npb-lc-bullet, #d6d6d6);
	cursor: pointer;
	transition: background 0.25s ease, transform 0.25s ease;
}

.nice-pb-lc__bullet:hover {
	transform: scale(1.15);
}

.nice-pb-lc__bullet.is-active {
	background: var(--npb-lc-bullet-active, #3858e9);
	transform: scale(1.25);
}

/* ── Efecto escala de grises ─────────────────────────────────────────────── */

.nice-pb-lc--grayscale .nice-pb-lc__item img {
	filter: grayscale(1);
	opacity: 0.65;
	transition: filter 0.3s ease, opacity 0.3s ease;
}

.nice-pb-lc--grayscale .nice-pb-lc__item img:hover {
	filter: none;
	opacity: 1;
}