/* MEK7 Produktzoom – Akzentfarbe kommt per --mek7-pz-akzent aus dem Plugin (Mister-MX orange, ZAP rot) */

/* Produktseite: Bilder klickbar, alter Woo-Auslöser weg */
.mek7-pz { position: relative; }
.mek7-pz .woocommerce-product-gallery__image img { cursor: zoom-in; }
.mek7-pz .woocommerce-product-gallery__trigger,
.mek7-pz .zoomImg { display: none !important; }

.mek7-zoom-knopf {
	position: absolute; top: 12px; right: 12px; z-index: 3;
	display: flex !important; align-items: center; justify-content: center;
	width: 36px; height: 36px; min-width: 0; min-height: 0; padding: 0 !important; margin: 0;
	border: 0 !important; border-radius: 50% !important;
	background: #fff !important; color: var(--mek7-pz-akzent, #e85f00) !important;
	box-shadow: 0 0 5px rgba(0,0,0,.3) !important;
	cursor: pointer; line-height: 0; transition: transform .15s ease, box-shadow .15s ease;
}
.mek7-zoom-knopf svg { width: 18px; height: 18px; }
.mek7-zoom-knopf:hover, .mek7-zoom-knopf:focus-visible { transform: scale(1.08); box-shadow: 0 2px 10px rgba(0,0,0,.3) !important; outline: none; }

/* Vollbildansicht */
.mek7-pswp {
	--pswp-bg: #fff;
	--pswp-placeholder-bg: #f4f4f4;
	--pswp-icon-color: #1a1a1a;
	--pswp-icon-color-secondary: #fff;
	--pswp-icon-stroke-color: transparent;
	--pswp-icon-stroke-width: 0;
	--pswp-error-text-color: #1a1a1a;
	--pswp-root-z-index: 2147483000;
	font-family: inherit;
}
/* Eigene Hintergrundebene: das Theme (mx-compat.css) zwingt .pswp__bg per !important auf 70 % Deckkraft */
.mek7-pswp .mek7-pswp__bg {
	position: absolute; top: 0; left: 0; width: 100%; height: 100%;
	background: var(--pswp-bg); transform: translateZ(0); will-change: opacity;
}
/* Globale Bildregel im Shop (img:not(...) { max-width:100% !important }) drückt das Vollbild sonst auf 0 px */
.pswp.mek7-pswp img.pswp__img { max-width: none !important; max-height: none !important; }
/* Alte PhotoSwipe-4-Regeln aus Theme/WooCommerce neutralisieren */
.mek7-pswp .pswp__top-bar { height: 56px; padding: 8px 8px 0; align-items: center; background: none !important; }
.mek7-pswp button.pswp__button { background-image: none !important; box-shadow: none; }
.mek7-pswp .pswp__button { opacity: 1; }
.mek7-pswp .pswp__button--close,
.mek7-pswp .pswp__button--zoom {
	width: 44px; height: 44px; margin: 0 4px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: #f2f2f2 !important; transition: background .15s ease, color .15s ease;
}
.mek7-pswp .pswp__button--close:hover,
.mek7-pswp .pswp__button--zoom:hover { background: var(--mek7-pz-akzent, #e85f00) !important; --pswp-icon-color: #fff; }
.mek7-pswp .pswp__button--close .pswp__icn,
.mek7-pswp .pswp__button--zoom .pswp__icn { position: static; width: 22px; height: 22px; top: auto; left: auto; }
.mek7-pswp .pswp__icn { fill: none; stroke: var(--pswp-icon-color); color: var(--pswp-icon-color); }
.mek7-pswp .pswp__icn-shadow { display: none; }
.mek7-pswp.pswp--zoomed-in .pz-plus { display: none; }

.mek7-pswp .pswp__counter {
	margin: 0 0 0 12px; height: auto; padding: 6px 12px; border-radius: 999px;
	background: #f2f2f2; color: #1a1a1a; font-size: 14px; font-weight: 600; line-height: 1.2;
	opacity: 1; text-shadow: none; font-variant-numeric: tabular-nums;
}

.mek7-pswp .pswp__button--arrow {
	width: 52px; height: 52px; margin-top: -26px; top: 50%;
	display: flex; align-items: center; justify-content: center;
	border-radius: 50%; background: #fff !important; box-shadow: 0 2px 12px rgba(0,0,0,.14) !important;
	transition: background .15s ease, transform .15s ease;
}
.mek7-pswp .pswp__button--arrow--prev { left: 16px; }
.mek7-pswp .pswp__button--arrow--next { right: 16px; }
.mek7-pswp .pswp__button--arrow:hover { background: var(--mek7-pz-akzent, #e85f00) !important; --pswp-icon-color: #fff; transform: scale(1.05); }
.mek7-pswp .pswp__button--arrow .pswp__icn { position: static; width: 26px; height: 26px; margin: 0; top: auto; left: auto; transform: none; }
.mek7-pswp .pswp__button--arrow:disabled { display: none; }

/* Daumenleiste */
.mek7-pswp-daumen {
	position: absolute; left: 0; right: 0; bottom: 16px; z-index: 12;
	display: flex; gap: 8px; justify-content: safe center;
	padding: 4px 16px; overflow-x: auto; scrollbar-width: none;
	transition: opacity .2s ease;
}
.mek7-pswp-daumen::-webkit-scrollbar { display: none; }
.mek7-pswp-daumen__bild {
	flex: 0 0 auto; width: 72px; height: 72px; padding: 0; margin: 0;
	border: 2px solid #e6e6e6; border-radius: 8px; background: #fff; overflow: hidden;
	cursor: pointer; opacity: .7; transition: opacity .15s ease, border-color .15s ease;
}
.mek7-pswp-daumen__bild img { display: block; width: 100%; height: 100%; object-fit: contain; }
.mek7-pswp-daumen__bild:hover { opacity: 1; }
.mek7-pswp-daumen__bild.is-aktiv { opacity: 1; border-color: var(--mek7-pz-akzent, #e85f00); }
.pswp:not(.pswp--ui-visible) .mek7-pswp-daumen { opacity: 0; pointer-events: none; }

@media (max-width: 767px) {
	.mek7-pswp .pswp__button--arrow { display: none; }
	.mek7-pswp-daumen { bottom: 12px; gap: 6px; justify-content: flex-start; }
	.mek7-pswp-daumen__bild { width: 56px; height: 56px; border-radius: 6px; }
	.mek7-zoom-knopf { top: 10px; right: 10px; }
}
@media (prefers-reduced-motion: reduce) {
	.mek7-zoom-knopf, .mek7-pswp .pswp__button--arrow { transition: none; }
}