/* ============================================================
   Backhand Series – Design · Rândul de carduri derulabil
   (folosit de blocul de articole și de galeria Instagram)
   ============================================================ */

.bhsd-carusel{
	position:relative;
	min-width:0;
}
.bhsd-carusel .bhsd-carusel__scroll{
	display:flex;
	overflow-x:auto;
	overflow-y:hidden;
	scroll-snap-type:x mandatory;
	scroll-behavior:smooth;
	scrollbar-width:none;
	-webkit-overflow-scrolling:touch;
	outline:none;
}
.bhsd-carusel .bhsd-carusel__scroll::-webkit-scrollbar{ display:none; }
.bhsd-carusel .bhsd-carusel__item{
	flex:0 0 auto;
	scroll-snap-align:start;
}

/* Estomparea marginilor (apare doar când mai sunt carduri în acea direcție) */
.bhsd-carusel .bhsd-carusel__fade{
	position:absolute;
	top:0;
	bottom:0;
	z-index:2;
	width:80px;
	pointer-events:none;
	opacity:0;
	transition:opacity .2s ease;
}
.bhsd-carusel .bhsd-carusel__fade--l{
	left:0;
	background:linear-gradient(90deg, var(--bhsd-bg,#FFFFFF) 0%, var(--bhsd-bg,#FFFFFF) 20%, transparent 100%);
}
.bhsd-carusel .bhsd-carusel__fade--r{
	right:0;
	background:linear-gradient(270deg, var(--bhsd-bg,#FFFFFF) 0%, var(--bhsd-bg,#FFFFFF) 20%, transparent 100%);
}
.bhsd-carusel.is-prev .bhsd-carusel__fade--l,
.bhsd-carusel.is-next .bhsd-carusel__fade--r{ opacity:1; }

/* Săgețile rotunde (apar la trecerea cu mouse-ul) */
.bhsd-carusel .bhsd-carusel__btn{
	-webkit-appearance:none;
	appearance:none;
	position:absolute;
	top:var(--bhsd-btn-top, 50%);
	z-index:3;
	display:flex;
	align-items:center;
	justify-content:center;
	width:48px;
	min-width:0;
	max-width:none;
	height:48px;
	min-height:0;
	margin:0;
	padding:0;
	border:0;
	border-radius:50%;
	background:#FFFFFF;
	box-shadow:0 2px 10px rgba(0,0,0,.16);
	color:#121619;
	cursor:pointer;
	opacity:0;
	pointer-events:none;
	transform:translateY(-50%);
	transition:opacity .2s ease, background-color .2s ease;
}
.bhsd-carusel .bhsd-carusel__btn:hover,
.bhsd-carusel .bhsd-carusel__btn:focus{ background:#F2F4F3; color:#121619; }
.bhsd-carusel .bhsd-carusel__btn:active{ transform:translateY(-50%) scale(.95); }
.bhsd-carusel .bhsd-carusel__btn:focus-visible{ outline:2px solid #17573C; outline-offset:2px; }
.bhsd-carusel .bhsd-carusel__btn svg{ display:block; width:22px; height:22px; }
.bhsd-carusel .bhsd-carusel__btn--prev{ left:16px; }
.bhsd-carusel .bhsd-carusel__btn--next{ right:16px; }

@media (hover:hover){
	.bhsd-carusel.is-prev:hover .bhsd-carusel__btn--prev,
	.bhsd-carusel.is-next:hover .bhsd-carusel__btn--next,
	.bhsd-carusel.is-prev:focus-within .bhsd-carusel__btn--prev,
	.bhsd-carusel.is-next:focus-within .bhsd-carusel__btn--next{
		opacity:1;
		pointer-events:auto;
	}
}

@media (max-width:767.98px){
	.bhsd-carusel .bhsd-carusel__fade{ width:60px; }
	.bhsd-carusel .bhsd-carusel__btn{ width:40px; height:40px; }
	.bhsd-carusel .bhsd-carusel__btn--prev{ left:8px; }
	.bhsd-carusel .bhsd-carusel__btn--next{ right:8px; }
}

@media (prefers-reduced-motion:reduce){
	.bhsd-carusel .bhsd-carusel__scroll{ scroll-behavior:auto; }
	.bhsd-carusel .bhsd-carusel__fade,
	.bhsd-carusel .bhsd-carusel__btn{ transition:none; }
}