/* Только галерея товара; карточки каталога остаются в products.css. */
.product-media__image
{
    position: relative;

    padding: 0 0 8px 0;
}

.product-media__label
{
    font-size: 14px;
    line-height: 1;
    position: absolute;
    top: 7px;
    right: -9px;
    padding: 5px 13px 5px 8px;
    color: #fff;
    background-color: #e40606;
    z-index: 1;
}
.product-media__label:after
{
    position: absolute;
    bottom: -9px;
    right: 0;
    transform: rotate(270deg);
    width: 0;
    height: 0;
    content: '';
    border-width: 0 9px 9px 0;
    border-style: solid;
    border-color: transparent #e40606 transparent transparent;
}
.product-media__label .icon-svg
{
    display: inline;

    margin-right: 3px;

    vertical-align: middle;

    fill: #fff;
}
.product-media__label span
{
    vertical-align: middle;
}

/*Квардратные изображения, разработка от 28.02.2025*/
/* Основное изображение */
.product-media__slider {
	width: 100%;
	max-width: 405px;
	height: auto;
	position: relative;
	margin: 0 0 10px;
	overflow: hidden;
}

 .product-media__slider-item {
	width: 100%;
	max-width: 405px;
	height: auto;
	aspect-ratio: 1/1;
}

 .product-media__slider-item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}


/*Превью*/
.product-media__previews {
	font-size: 0;
	line-height: 0;
	margin: 0 -8px;
	padding: 0 0 16px 0;
	white-space: nowrap;
}

.product-media__previews-item {
	display: inline-block;
	padding: 0 8px;
	vertical-align: top;
}

.product-media__photo-link[aria-pressed="true"] {
	border-color: #337516;
}

 .product-media__photo-link {
	display: block;
	width: 56px;
	height: 56px;
	cursor: pointer;
	transition: border-color .3s ease-in-out;
	border: 1px solid #f3f3f3;
}

.product-media__photo-link:hover {
	border-color: #337516;
}

 .product-media__photo-link img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.product-media__video-link {
	position: relative;
	display: block;
	width: 56px;
	height: 56px;
}

.product-media__video-link:before {
	position: absolute;
	top: 50%;
	left: 50%;
	display: block;
	width: 26px;
	height: 26px;
	margin: -13px 0 0 -13px;
	content: '';
	border-radius: 20%;
	background: rgba(207, 0, 15, .65);
}

.product-media__video-link:after {
	position: absolute;
	top: 50%;
	left: 50%;
	display: block;
	margin: -5px 0 0 -2px;
	content: '';
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 8px solid #fff;
}

.product-media__video-link img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
/* Ограничиваем галерею шириной колонки. Старые fit-content/absolute давали
   трек миниатюр около 15 000px на планшетах; отдельный wrapper-padding не нужен. */
.product-media {width: 100%; max-width: 405px; min-width: 0; margin: 0 auto;}
.product-media .product-media__image {width: 100%;}
.product-media .product-media__slider {min-width: 0;}
.product-media .product-media__slider .swiper-wrapper {transition-timing-function: linear;}
.product-media .product-media__slider-item {height: auto;}
.product-media .product-media__slider-item > a {display: block; width: 100%; height: 100%;}
.product-media .product-media__slider-item img {display: block;}
.product-media .product-media__previews.swiper {width: calc(100% + 16px); max-width: calc(405px + 16px); overflow: hidden;}
.product-media .product-media__previews .swiper-wrapper {height: 56px;}
.product-media .product-media__previews-item.swiper-slide {width: 72px; height: 56px; flex-shrink: 0;}
.product-media button.product-media__photo-link {padding: 0; background: transparent;}
.product-media .product-media__photo-link:focus-visible {outline: 2px solid #337516; outline-offset: -2px;}
.product-media .lenwood-slider__arrow {top: calc(50% - 15px);}
.product-media .lenwood-slider__prev {left: 5px;}
.product-media .lenwood-slider__next {right: 5px;}
@media (max-width: 767px) {
    .product-media[data-media-ready] .product-media__image {display: grid; grid-template-columns: 1fr 1fr; column-gap: 8px;}
    .product-media .product-media__slider {grid-column: 1 / -1;}
    .product-media .lenwood-slider__arrow {position: relative; top: auto; left: auto; right: auto; width: 100%; height: 32px; --slider-control-background: #f3f3f3; --slider-control-color: #4c504a;}
}
