/* ==========================================================================
   LifeSport68 - اسلایدر اختصاصی گالری محصول
   ========================================================================== */

.ls-gallery{
	display:flex;
	flex-direction:column;
	gap:12px;
	width:100%;
}

/* ---- اسلایدر اصلی ---- */
.ls-gallery-main{
	position:relative;
	width:100%;
	border-radius:0;
	overflow:hidden;
	background:#f4f4f4;
}

.ls-gallery-track{
	display:flex;
	width:100%;
	overflow-x:auto;
	scroll-snap-type:x mandatory;
	scroll-behavior:smooth;
	-webkit-overflow-scrolling:touch;
	scrollbar-width:none;
}
.ls-gallery-track::-webkit-scrollbar{ display:none; }

.ls-gallery-slide{
	position:relative;
	flex:0 0 100%;
	scroll-snap-align:start;
	scroll-snap-stop:always;
	display:flex;
	align-items:center;
	justify-content:center;
	aspect-ratio:1/1;
}
.ls-gallery-slide img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	pointer-events:none;
	-webkit-user-drag:none;
	user-select:none;
}

.ls-arrow{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	width:38px;height:38px;
	border-radius:50%;
	background:rgba(255,255,255,.92);
	border:none;
	display:flex;align-items:center;justify-content:center;
	cursor:pointer;
	box-shadow:0 2px 10px rgba(0,0,0,.15);
	color:#222;
	z-index:3;
	transition:background .15s ease, transform .15s ease;
}
.ls-arrow:hover{ background:#fff; }
.ls-arrow:active{ transform:translateY(-50%) scale(.92); }
.ls-arrow-prev{ left:10px; }
.ls-arrow-next{ right:10px; }

.ls-counter{
	position:absolute;
	bottom:10px;
	left:50%;
	transform:translateX(-50%);
	background:rgba(0,0,0,.55);
	color:#fff;
	font-size:12px;
	font-weight:600;
	padding:3px 11px;
	border-radius:20px;
	z-index:3;
	letter-spacing:.5px;
}

/* ---- ردیف تصاویر کوچک (thumbnails) ---- */
.ls-thumbs{
	display:flex;
	align-items:center;
	gap:6px;
	width:100%;
}

.ls-thumbs-track{
	display:flex;
	gap:10px;
	overflow-x:auto;
	scroll-behavior:smooth;
	-webkit-overflow-scrolling:touch;
	scrollbar-width:none;
	flex:1;
	padding:2px;
}
.ls-thumbs-track::-webkit-scrollbar{ display:none; }

.ls-thumb-item{
	flex:0 0 auto;
	width:64px;
	height:64px;
	border-radius:10px;
	overflow:hidden;
	border:2px solid transparent;
	padding:0;
	background:#f4f4f4;
	cursor:pointer;
	opacity:.65;
	transition:opacity .15s ease, border-color .15s ease;
}
.ls-thumb-item img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	pointer-events:none;
}
.ls-thumb-item:hover{ opacity:.9; }
.ls-thumb-item.is-active{
	opacity:1;
	border-color:var(--pink-dark, #e0245e);
}

.ls-thumb-arrow{
	flex:0 0 auto;
	width:26px;height:26px;
	border-radius:50%;
	border:1px solid #e4e4e4;
	background:#fff;
	display:flex;align-items:center;justify-content:center;
	cursor:pointer;
	color:#333;
}
.ls-thumb-arrow:hover{ background:#f7f7f7; }

@media (max-width:600px){
	.ls-thumb-item{ width:52px; height:52px; }
	.ls-arrow{ width:32px; height:32px; }
}

/* ==========================================================================
   LifeSport68 - نمای تمام‌صفحه گالری (Lightbox)
   ========================================================================== */

.ls-gallery-slide img[data-ls-zoom]{
	cursor:zoom-in;
	pointer-events:auto;
}

.ls-lightbox{
	position:fixed;
	inset:0;
	z-index:9999;
	background:rgba(0,0,0,.95);
	display:none;
	align-items:center;
	justify-content:center;
}
.ls-lightbox.is-open{
	display:flex;
}

.ls-lightbox-inner{
	position:relative;
	width:100%;
	height:100%;
	display:flex;
	align-items:center;
	justify-content:center;
}

.ls-lightbox-track{
	display:flex;
	width:100%;
	height:100%;
	overflow-x:auto;
	scroll-snap-type:x mandatory;
	scroll-behavior:smooth;
	-webkit-overflow-scrolling:touch;
	scrollbar-width:none;
}
.ls-lightbox-track::-webkit-scrollbar{ display:none; }

.ls-lightbox-slide{
	flex:0 0 100%;
	scroll-snap-align:start;
	scroll-snap-stop:always;
	display:flex;
	align-items:center;
	justify-content:center;
	height:100%;
	padding:20px;
	box-sizing:border-box;
}
.ls-lightbox-slide img{
	max-width:100%;
	max-height:100%;
	object-fit:contain;
	display:block;
	-webkit-user-drag:none;
	user-select:none;
}

.ls-lightbox-close{
	position:absolute;
	top:14px;
	right:14px;
	width:40px;height:40px;
	border-radius:50%;
	background:rgba(255,255,255,.12);
	border:none;
	display:flex;align-items:center;justify-content:center;
	cursor:pointer;
	color:#fff;
	z-index:5;
	transition:background .15s ease;
}
.ls-lightbox-close:hover{ background:rgba(255,255,255,.22); }

.ls-lightbox-arrow{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	width:46px;height:46px;
	border-radius:50%;
	background:rgba(255,255,255,.12);
	border:none;
	display:flex;align-items:center;justify-content:center;
	cursor:pointer;
	color:#fff;
	z-index:5;
	transition:background .15s ease;
}
.ls-lightbox-arrow:hover{ background:rgba(255,255,255,.22); }
.ls-lightbox-arrow-prev{ left:14px; }
.ls-lightbox-arrow-next{ right:14px; }

.ls-lightbox-counter{
	position:absolute;
	bottom:18px;
	left:50%;
	transform:translateX(-50%);
	background:rgba(255,255,255,.12);
	color:#fff;
	font-size:13px;
	font-weight:600;
	padding:4px 14px;
	border-radius:20px;
	z-index:5;
	letter-spacing:.5px;
}

body.ls-lightbox-open{
	overflow:hidden;
}

@media (max-width:600px){
	.ls-lightbox-close{ width:36px; height:36px; top:10px; right:10px; }
	.ls-lightbox-arrow{ width:38px; height:38px; }
	.ls-lightbox-arrow-prev{ left:8px; }
	.ls-lightbox-arrow-next{ right:8px; }
}