/* 116-я (заказчик 31.10.2026): листание фото в плитке каталога (s=1), списке с фото (s=2) и карточках поступления — разметка
   lib/oap_tile_gallery.php (oap_gal_html), поведение oap_tile_gallery.js. Размеры фото — как у одиночного фото в oap-catalogue-redesign.css
   (плитка 170 px, на телефоне 110; список 90, на телефоне 70) и zavody.css (поступления — во всю картинку). */
.oap-gal {
	position: relative; display: block; width: 100%; height: 100%; overflow: hidden;
	touch-action: pan-y; touch-action: pan-y pinch-zoom;   /* вертикаль и масштаб — браузеру, горизонталь — листалке */
	-webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent;
}
.oap-gal-t { display: flex; width: 100%; height: 100%; transition: transform .25s ease-out; will-change: transform; }
.oap-gal-drag > .oap-gal-t, .oap-gal-now > .oap-gal-t { transition: none; }   /* за пальцем и под мышью — без задержки */
.oap-gal-s { position: relative; flex: 0 0 100%; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.oap-gal-s img { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; -webkit-user-drag: none; }
.oap-gal-s img:not([src]) { visibility: hidden; }   /* ещё не загружено */
/* точки: сколько фото и какое сейчас; белая обводка — видно и на фото, и на тёмном фоне */
.oap-gal-d { position: absolute; left: 0; right: 0; bottom: 4px; display: flex; justify-content: center; gap: 4px; pointer-events: none; }
.oap-gal-d i { width: 6px; height: 6px; border-radius: 3px; background: rgba(0, 0, 0, .2); box-shadow: 0 0 0 1px rgba(255, 255, 255, .7); transition: width .15s, background .15s; }
.oap-gal-d i.on { width: 14px; background: var(--oap-accent, #1b6bb1); }
.oap-gal-more {
	position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); white-space: nowrap; pointer-events: none;
	font-style: normal; font-size: 11px; line-height: 1.3; color: #fff; background: rgba(0, 0, 0, .55); padding: 2px 8px; border-radius: 10px;
}

/* каталог: ссылка — во всю картинку, тогда фото листаются по всей ширине плитки */
.product_div_image_wrap.has-gal > a { display: block; width: 100%; height: 100%; }
.product_div_tile .oap-gal-s img { max-width: 170px; max-height: 170px; }
.product_div_list_photo > .product_div_image_wrap.has-gal > a { height: 100px; }
.product_div_list_photo .oap-gal-s img { max-width: 90px; max-height: 90px; }
.product_div_list_photo .oap-gal-d { bottom: 0; }
.product_div_list_photo .oap-gal-more { bottom: 8px; font-size: 10px; padding: 1px 6px; }
@media screen and (max-width: 699px) {
	.product_div_list_photo > .product_div_image_wrap.has-gal > a { height: 80px; }
	.product_div_list_photo .oap-gal-s img { max-width: 70px; max-height: 70px; }
	/* слева внизу фото здесь значок «В закладки» — точки мельче и справа */
	.product_div_list_photo .oap-gal-d { justify-content: flex-end; gap: 3px; }
	.product_div_list_photo .oap-gal-d i { width: 5px; height: 5px; }
	.product_div_list_photo .oap-gal-d i.on { width: 10px; }
}
@media screen and (max-width: 600px) {
	.product_div_tile .oap-gal-s img { max-width: 110px; max-height: 110px; }
	.product_div_tile .oap-gal-d { bottom: 3px; }
}

/* поступления (zavody.css: .pc .ph — квадрат) */
.oapz .pc .ph.has-gal { display: block; }
.oapz .pc .ph.has-gal > .oap-gal { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: auto; height: auto; }
