/**
 * Галерея шкафа: главное фото + лента миниатюр. Тёмная стилистика,
 * адаптивно для мобильных и десктопа. Открытие в полный размер и
 * перелистывание — через PhotoSwipe (см. cabinet-gallery-frontend.js).
 */

.ed-gallery {
	background: #15181d;
	border-radius: 10px;
	padding: 14px;
	margin-bottom: 1.5em;
}

.ed-gallery-main {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #000;
	border-radius: 8px;
	overflow: hidden;
	margin-bottom: 10px;
	max-height: 280px;
}

.ed-gallery-main-image {
	display: block;
	width: 100%;
	max-height: 280px;
	object-fit: contain;
	cursor: zoom-in;
}

.ed-gallery-thumbs {
	display: flex;
	gap: 8px;
	overflow-x: auto;
	padding-bottom: 2px;
	scrollbar-width: thin;
}

.ed-gallery-thumbs--single {
	display: none;
}

.ed-gallery-thumb {
	flex: 0 0 auto;
	width: 60px;
	height: 60px;
	border-radius: 6px;
	overflow: hidden;
	border: 2px solid transparent;
	opacity: 0.6;
	transition: opacity 0.15s ease, border-color 0.15s ease;
}

.ed-gallery-thumb:hover {
	opacity: 0.9;
}

.ed-gallery-thumb.is-active {
	opacity: 1;
	border-color: #4dabf7;
}

.ed-gallery-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Десктоп: больше главное фото, миниатюры чуть крупнее и без скролла. */
@media (min-width: 700px) {
	.ed-gallery-main,
	.ed-gallery-main-image {
		max-height: 420px;
	}

	.ed-gallery-thumbs {
		flex-wrap: wrap;
		overflow-x: visible;
	}

	.ed-gallery-thumb {
		width: 76px;
		height: 76px;
	}
}

/* PhotoSwipe рисует свой UI поверх страницы (position: fixed), тут только
   лёгкая правка для консистентности с тёмной темой сайта. */
.pswp {
	--pswp-bg: #0b0d10;
}