/* Mobile — miniatury na dole głównego zdjęcia (#14, #1134, #5891) */

@media (max-width: 768px) {
	body.postid-14.single-product .woocommerce-product-gallery,
	body.postid-1134.single-product .woocommerce-product-gallery,
	body.hoker-seat-build-1134-active.single-product .woocommerce-product-gallery,
	body.postid-5891.single-product .woocommerce-product-gallery,
	body.hoker-chair-card-active.single-product .woocommerce-product-gallery {
		position: relative !important;
		overflow: hidden !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	body.postid-14.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs,
	body.postid-1134.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs,
	body.hoker-seat-build-1134-active.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs,
	body.postid-5891.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs,
	body.hoker-chair-card-active.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs {
		position: absolute !important;
		left: 10px !important;
		right: auto !important;
		bottom: 10px !important;
		top: auto !important;
		z-index: 6 !important;
		display: flex !important;
		flex-wrap: nowrap !important;
		gap: 6px !important;
		max-width: calc(100% - 20px) !important;
		width: auto !important;
		margin: 0 !important;
		padding: 6px !important;
		border: 1px solid rgba(141, 28, 47, 0.14) !important;
		border-radius: 12px !important;
		background: rgba(255, 250, 244, 0.92) !important;
		box-shadow: 0 8px 20px rgba(36, 31, 28, 0.12) !important;
		overflow-x: auto !important;
		-webkit-overflow-scrolling: touch;
	}

	body.postid-14.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li,
	body.postid-1134.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li,
	body.hoker-seat-build-1134-active.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li,
	body.postid-5891.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li,
	body.hoker-chair-card-active.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li {
		float: none !important;
		flex: 0 0 52px !important;
		width: 52px !important;
		margin: 0 !important;
	}

	body.postid-14.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs img,
	body.postid-1134.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs img,
	body.hoker-seat-build-1134-active.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs img,
	body.postid-5891.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs img,
	body.hoker-chair-card-active.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs img {
		display: block !important;
		width: 52px !important;
		height: 52px !important;
		border: 1px solid #eadad1 !important;
		border-radius: 8px !important;
		background: #fff !important;
		object-fit: cover !important;
	}

	body.postid-14.single-product div.product div.images .flex-viewport,
	body.postid-1134.single-product div.product div.images .flex-viewport,
	body.hoker-seat-build-1134-active.single-product div.product div.images .flex-viewport,
	body.postid-5891.single-product div.product div.images .flex-viewport,
	body.hoker-chair-card-active.single-product div.product div.images .flex-viewport,
	body.postid-14.single-product .woocommerce-product-gallery .flex-viewport,
	body.postid-1134.single-product .woocommerce-product-gallery .flex-viewport,
	body.postid-5891.single-product .woocommerce-product-gallery .flex-viewport,
	body.hoker-chair-card-active.single-product .woocommerce-product-gallery .flex-viewport {
		margin-bottom: 0 !important;
	}
}

/* ===========================================================================
 * GENERYCZNY OVERLAY (wzorzec #14) — laptop + mobile, dla KAŻDEGO produktu
 * konfiguratora (klasa body.hoker-gallery-overlay-active): miniatury nałożone
 * na dole głównego zdjęcia, nie pod spodem. Klony i nowe ID też to dostają.
 * =========================================================================== */
body.hoker-gallery-overlay-active.single-product div.product div.images.woocommerce-product-gallery,
body.hoker-gallery-overlay-active.single-product .woocommerce-product-gallery,
body.hoker-gallery-overlay-active.single-product .woocommerce-product-gallery.images {
	position: relative !important;
	overflow: hidden !important;
}

body.hoker-gallery-overlay-active.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs {
	position: absolute !important;
	left: 16px !important;
	right: auto !important;
	bottom: 16px !important;
	top: auto !important;
	z-index: 6 !important;
	display: flex !important;
	flex-wrap: nowrap !important;
	gap: 8px !important;
	max-width: calc(100% - 32px) !important;
	width: auto !important;
	margin: 0 !important;
	padding: 8px !important;
	border: 1px solid rgba(141, 28, 47, 0.14) !important;
	border-radius: 14px !important;
	background: rgba(255, 250, 244, 0.92) !important;
	box-shadow: 0 10px 24px rgba(36, 31, 28, 0.12) !important;
	overflow-x: auto !important;
	-webkit-overflow-scrolling: touch;
}

body.hoker-gallery-overlay-active.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li {
	float: none !important;
	flex: 0 0 72px !important;
	width: 72px !important;
	margin: 0 !important;
}

body.hoker-gallery-overlay-active.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs img {
	display: block !important;
	width: 72px !important;
	height: 72px !important;
	border: 1px solid #eadad1 !important;
	border-radius: 9px !important;
	background: #fff !important;
	object-fit: cover !important;
}

body.hoker-gallery-overlay-active.single-product .woocommerce-product-gallery .flex-viewport {
	margin-bottom: 0 !important;
}

/* Lupka zoomu — w rogu zdjęcia (nie zasłaniana przez miniatury) */
body.hoker-gallery-overlay-active.single-product .woocommerce-product-gallery__trigger {
	z-index: 7 !important;
}

/* Mobile — mniejsze miniatury, bliżej krawędzi (jak dotychczasowy wzór) */
@media (max-width: 768px) {
	body.hoker-gallery-overlay-active.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs {
		left: 10px !important;
		bottom: 10px !important;
		gap: 6px !important;
		max-width: calc(100% - 20px) !important;
		padding: 6px !important;
		border-radius: 12px !important;
		box-shadow: 0 8px 20px rgba(36, 31, 28, 0.12) !important;
	}

	body.hoker-gallery-overlay-active.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li {
		flex: 0 0 52px !important;
		width: 52px !important;
	}

	body.hoker-gallery-overlay-active.single-product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs img {
		width: 52px !important;
		height: 52px !important;
		border-radius: 8px !important;
	}
}