.ssb-slideshow {
	outline: none;
}

.ssb-slides-viewport {
	touch-action: pan-y; /* deja scroll vertical libre; el horizontal lo maneja el JS */
	cursor: grab;
	-webkit-user-select: none;
	user-select: none;
}

.ssb-slides-viewport img {
	pointer-events: none; /* evita el "fantasma" de arrastre nativo de imágenes */
	-webkit-user-drag: none;
}

.ssb-nav {
	position: absolute;
	top: 50%;
	transform: translateY( -50% );
	background: rgba( 0, 0, 0, 0.5 );
	color: #fff;
	border: none;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	cursor: pointer;
	font-size: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
}

.ssb-nav-prev { left: 12px; }
.ssb-nav-next { right: 12px; }

.ssb-dots {
	position: absolute;
	bottom: 12px;
	left: 50%;
	transform: translateX( -50% );
	display: flex;
	gap: 8px;
	z-index: 2;
}

.ssb-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: rgba( 255, 255, 255, 0.6 );
	border: none;
	cursor: pointer;
	padding: 0;
}

.ssb-dot.is-active {
	background: #fff;
}

/* --- Estilo: dots (los puntos son la navegación principal, se ocultan flechas) --- */
.nav-style-dots .ssb-nav {
	display: none;
}

/* --- Estilo: numbers (Premium) --- */
.nav-style-numbers .ssb-nav {
	border-radius: 4px;
	width: auto;
	height: auto;
	padding: 6px 12px;
}

/* --- Estilo: minimal-dark (Premium) --- */
.nav-style-minimal-dark .ssb-nav {
	background: rgba( 0, 0, 0, 0.85 );
	border-radius: 0;
	width: 32px;
	height: 48px;
}

.nav-style-minimal-dark .ssb-dot {
	background: rgba( 0, 0, 0, 0.3 );
}

.nav-style-minimal-dark .ssb-dot.is-active {
	background: #000;
}