/* =====================================================
   ASERA Produktseiten-Design  (global, "Zero-Look")
   Gilt für ALLE Produktseiten (woobuilder + Storefront)
   v2: Tabs -> gestapelte Sektionen + Sticky-Menü
   ===================================================== */

/* --- 1) Basis: Font + Farben (wie Zero) --- */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap');

body.single-product {
	background: #ffffff !important;
	color: #111111 !important;
	font-family: 'Poppins', sans-serif !important;
}

/* --- 2) Produkt-Layout: Galerie links / Summary rechts (wie Zero) --- */
/* woobuilder-Variante */
.product.woobuilder {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	box-sizing: border-box;
	overflow: hidden;
}
.product.woobuilder > div:not([class]):first-of-type,
.product.woobuilder > .woobuilder-block.woobuilder-images {
	float: left !important;
	width: 416px !important;
	margin-left: max(75px, calc((100vw - 1250px) / 2)) !important;
	margin-right: 60px !important;
}
.product.woobuilder > .woobuilder-block.woobuilder-title,
.product.woobuilder > .woobuilder-block.woobuilder-price,
.product.woobuilder > .woobuilder-block.woobuilder-add-to-cart,
.product.woobuilder > .woobuilder-block.woobuilder-meta {
	float: right !important;
	clear: right !important;
	width: 580px !important;
	margin-right: max(75px, calc((100vw - 1250px) / 2)) !important;
}
.product.woobuilder > .woobuilder-block.woobuilder-rating {
	display: none !important;
}





/* ---------- V1.1.45: Varianten-Greying ---------- */
/* Nicht verfuegbare Attribut-Werte (Swatches) ausgrauen + unklickbar machen */
body.single-product .cfvsw-swatches-option.zs-attr-unavailable,
body.single-product .cfvsw-swatches-option.cfvsw-swatches-disabled {
	opacity: 0.35 !important;
	filter: grayscale(1) !important;
	pointer-events: none !important;
	cursor: not-allowed !important;
	box-shadow: none !important;
}
/* Ausgegraute Dropdown-Optionen (Fallback falls Custom-Switches nur HTML) */
body.single-product .variations_form option.attached.disabled {
	color: #b5b5b5 !important;
}

/* ---------- V1.1.45: Thumbnail-Leiste (Previews unter dem Bild) ---------- */
/* Wir verwenden einheitlich die eigene zs-thumbs-Leiste (gleicher Look auf
   allen Produkten, wie von Kunde gewuenscht). Die native Foxy-Leiste wird
   daher dauerhaft ausgeblendet - !important, damit weder Foxy noch JS sie
   wieder einblenden koennen (kein Doppel-Leisten-Bug). */
body.single-product .foxy-product-gallery-thumbnails {
	display: none !important;
}

/* ---------- V1.1.45: Fullscreen (PhotoSwipe) ---------- */
/* Sticky-Menue ausblenden, solange der Fullscreen offen ist (Body-Klasse
   wird per JS gesetzt, sobald PhotoSwipe init/destroy laeuft). */
body.zs-pswp-open .zs-submenu-wrap {
	display: none !important;
}
/* Sicherheitsnetz: PhotoSwipe ueber alle Menues/Zoom-Elemente legen, falls
   die Body-Klasse mal nicht rechtzeitig greift. */
.pswp {
	z-index: 100001 !important;
}

/* ---------- V1.1.42: Leeres Downloads-Panel ausblenden ---------- */
body.single-product .woocommerce-Tabs-panel.zs-dl-empty,
body.single-product div.product .woocommerce-Tabs-panel.zs-dl-empty {
	display: none !important;
}

/* ---------- V1.1.13: Single-Label zentriert UEBER der Bildergalerie, 2x groesser ----------
   Das .advanced-woo-labels.awl-label-type-single wird per JS in die Galerie
   verschoben (erstes Kind). Hier liegt es absolut zentriert ueber dem Bild.
   Nur auf Einzelproduktseiten; die Shop-Archiv-Ansicht bleibt unveraendert. */
body.single-product .woocommerce-product-gallery > .advanced-woo-labels.awl-label-type-single {
	/* V1.1.42: Label steht VOR dem Galeriebild (im Flow, kein Overlay mehr).
	   Als erstes Kind der Galerie schiebt es das Bild einfach nach unten. */
	position: relative !important;
	top: auto;
	left: auto;
	right: auto;
	z-index: 8;
	display: flex;
	/* V1.1.57: IMMER eine Zeile - bei Platzmangel skalieren die Icons
	   (via JS transform:scale auf .awl-product-label), statt umzubrechen.
	   !important: Das Advanced-Woo-Labels-Plugin setzt inline flex-wrap:wrap
	   (style="...") - nur important gewinnt dagegen. */
	flex-wrap: nowrap !important;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	width: 100%;
	margin: 0 0 14px !important;
}
body.single-product .woocommerce-product-gallery > .advanced-woo-labels.awl-label-type-single .awl-label-image,
body.single-product .woocommerce-product-gallery > .advanced-woo-labels.awl-label-type-single .awl-label-image > img,
body.single-product .woocommerce-product-gallery > .advanced-woo-labels.awl-label-type-single span.awl-label-image > img {
	height: 24px !important;
	width: auto !important;
	max-width: 90% !important;
}

/* V1.1.45: Label-Ausrichtung - Plugin setzt pro Label unterschiedliche
   Inline-Margins (z.B. margin:0 4px 5px 0 vs margin:0) -> vertikaler
   Versatz. Alle Wraps/Labels auf eine Linie zentrieren. */
body.single-product .woocommerce-product-gallery > .advanced-woo-labels.awl-label-type-single .awl-label-wrap {
	display: inline-flex !important;
	align-items: center !important;
	vertical-align: middle !important;
	margin: 0 !important;
	/* V1.1.57: Darf schrumpfen, wenn der Platz knapp wird (die Rasterbreite
	   liefert weiterhin das JS via min-width; flex-shrink macht die Wraps
	   flexibel, transform auf .awl-product-label skaliert die Icons). */
	flex: 0 1 auto !important;
}
body.single-product .woocommerce-product-gallery > .advanced-woo-labels.awl-label-type-single .awl-product-label {
	display: inline-flex !important;
	align-items: center !important;
	vertical-align: middle !important;
	margin: 0 !important;
	line-height: 1 !important;
	/* V1.1.57: Transform-Skalierung der Icons (wird bei Überlauf per JS
	   gesetzt). Das Label selbst bleibt im Raster; nur der sichtbare Inhalt
	   wird proportional verkleinert. */
	transform-origin: center center !important;
	will-change: transform;
}
body.single-product .woocommerce-product-gallery > .advanced-woo-labels.awl-label-type-single .awl-label-image {
	display: flex !important;
	align-items: center !important;
}
/* V1.1.63: Unsichtbare Platzhalter-Labels (transparent.png, Breite 0) aus
   dem Flex-Flow nehmen - sonst verschieben sie das sichtbare Label
   (z.B. KNX-Logo) aus der Bildmitte. */
body.single-product .woocommerce-product-gallery > .advanced-woo-labels.awl-label-type-single .awl-label-wrap:has(img[src*="transparent"]),
body.single-product .woocommerce-product-gallery > .advanced-woo-labels.awl-label-type-single .awl-label-wrap.awl-label-id-25481 {
	display: none !important;
}
/* Sichtbares Bild innerhalb des festen Slots zentrieren (Slot ist z.B.
   51px breit, das Bild schmaler/transform-skaliert -> sonst linksbuendig) */
body.single-product .woocommerce-product-gallery > .advanced-woo-labels.awl-label-type-single .awl-label-wrap {
	justify-content: center !important;
	text-align: center !important;
}
body.single-product .woocommerce-product-gallery > .advanced-woo-labels.awl-label-type-single .awl-label-wrap .awl-product-label,
body.single-product .woocommerce-product-gallery > .advanced-woo-labels.awl-label-type-single .awl-label-wrap .awl-label-image,
body.single-product .woocommerce-product-gallery > .advanced-woo-labels.awl-label-type-single .awl-label-wrap img {
	justify-content: center !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* V1.1.65: iX-M Farbwelten - "Serie"-Titel (H3) klebt am linken Kartenrand,
   der Text darunter hat 26px Einzug (p { margin: 0 26px }). Titel auf
   denselben Einzug bringen, damit beides bündig ist. */
.single-product .ixm-color-card .wp-block-heading {
	margin-left: 26px !important;
	margin-right: 26px !important;
}


/* Storefront-Variante (Standard): Zweispalten-Layout via Flexbox (robust) */
body.single-product div.product > .woocommerce-product-gallery,
body.single-product div.product > .summary {
	float: none !important;
	margin: 0 !important;
}
/* Spaltenabstand: Galerie bekommt rechts Margin, Summary nicht (kein 60px extra) */
body.single-product div.product > .woocommerce-product-gallery {
	margin-right: 45px !important;
}
body.single-product div.product {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: flex-start;
	/* KEIN gap: 60px hier! gap wirkt zwischen ALLEN Flex-Items - auch zwischen
	   Summary und der nach unten verschobenen Kurzbeschreibung (eigenes
	   Full-Width-Item) -> 60px Leerraum vor/nach dem Excerpt.
	   Stattdessen nur die oberen Spalten per margin beabstanden. */
	/* 1250px Breite + mind. 75px Rand links/rechts (Muster wie woobuilder):
	   100vw-Viewport + Padding -> volles Raster, Eltern (site-main 1064px) NICHT.
	   flex-start + fester Galerie-Margin: beide Spalten links starten,
	   Abstand ist konstant ~45px.
	   Galerie + Summary sind gleich breit (flex 1 1 0%) - sie teilen sich
	   den Innenraum (1250px-Raster) zu gleichen Teilen. */
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	padding-left: max(75px, calc((100vw - 1250px) / 2)) !important;
	padding-right: max(75px, calc((100vw - 1250px) / 2)) !important;
	box-sizing: border-box;
}
body.single-product div.product > .woocommerce-product-gallery {
	flex: 1 1 0%;
	width: auto !important;
	max-width: none !important;
	min-width: 0;
}
body.single-product div.product > .summary {
	flex: 1 1 0%;
	width: auto !important;
	max-width: none !important;
	min-width: 0;
	margin-left: 0;
}
body.single-product div.product::after {
	display: none !important;
}
/* Storefront-Clearfix-Pseudos dürfen in der Flexbox KEINE Flex-Items werden */
body.single-product div.product::before {
	display: none !important;
}
/* Tabs, Downloads, Related, Up-Sells: zentriert im 1250er-Raster (75..1205) */
/* Menü: volle Viewport-Breite (0..100vw). Überspannt das 1250er-Raster
   bewusst - Tabs/Downloads/Zubehör bleiben zentriert (75..1205). */
body.single-product div.product > .zs-submenu-wrap {
	flex: 0 0 100vw !important;
	flex-basis: 100vw !important;
	flex-shrink: 0 !important;
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	margin-top: 0 !important;
}
body.single-product div.product > .woocommerce-tabs,
body.single-product div.product > .woocommerce-product-documents,
body.single-product div.product > section.related,
body.single-product div.product > section.up-sells {
	/* flex-basis:auto + width:100% -> Content-Breite (1130px im 1250er-Raster),
	   zentriert 75..1205. NICHT flex-basis:100% (waere 1280px Containerbreite
	   und ragt rechts ueber den Rand). */
	flex: 0 0 auto !important;
	width: 100% !important;
	max-width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	margin-top: 0 !important;
}
body.single-product div.product > .woocommerce-products-header,
body.single-product div.product > .storefront-sorting {
	flex: 0 0 100% !important;
	width: 100% !important;
	max-width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	margin-top: 0 !important;
}

/* --- 3) Titel: Typenbezeichnung (rot) + Hauptteil --- */
.product .woobuilder-title,
body.single-product div.product .product_title {
	font-size: 38px !important;
	font-weight: 400 !important;
	color: #111 !important;
	line-height: 1.2 !important;
	margin: 0 0 12px !important;
	font-family: 'Poppins', sans-serif !important;
}
.product .woobuilder-title .typenbezeichnung,
body.single-product div.product .product_title .typenbezeichnung {
	display: block !important;
	font-size: .62em !important;
	font-weight: 700 !important;
	letter-spacing: .08em !important;
	text-transform: uppercase !important;
	color: #981211 !important;
	margin-bottom: 6px !important;
}

/* --- 4) Preis: EVP grau durchgestrichen / Netto rot --- */
.product .woobuilder-price,
body.single-product div.product .summary > .price {
	margin: 12px 0 !important;
	font-size: 21.2362px !important;
	line-height: 1.5 !important;
	color: #43454b !important;
	position: relative !important;
	min-height: 32px !important;
	font-family: 'Poppins', sans-serif !important;
}
.product .woobuilder-price p.price,
body.single-product div.product .summary > .price {
	font-size: 21.2362px !important;
	color: #43454b !important;
	line-height: 31.8543px !important;
}
/* Zero (woobuilder): inneres p.price ohne eigenen Margin (Container hat 12px) */
.product .woobuilder-price p.price {
	margin: 0 !important;
}
/* One (Storefront): Produktpreis = eigenständiger Block mit 12px Abstand wie Zero */
body.single-product div.product .summary > .price {
	margin: 12px 0 !important;
}
.product .woobuilder-price p.price .woocommerce-Price-amount,
body.single-product div.product .summary > .price .woocommerce-Price-amount {
	font-size: 21.2362px !important;
	color: #43454b !important;
}
.product .woobuilder-price .b2bking_retail_price_text,
.product .woobuilder-price .b2bking_retail_price_price,
body.single-product div.product .summary > .price .b2bking_retail_price_text,
body.single-product div.product .summary > .price .b2bking_retail_price_price {
	color: #9a9aa6 !important;
}
.product .woobuilder-price .b2bking_retail_price_price .woocommerce-Price-amount,
body.single-product div.product .summary > .price .b2bking_retail_price_price .woocommerce-Price-amount {
	color: #9a9aa6 !important;
}
.product .woobuilder-price .b2bking_b2b_price_text,
.product .woobuilder-price .b2bking_b2b_price_price,
body.single-product div.product .summary > .price .b2bking_b2b_price_text,
body.single-product div.product .summary > .price .b2bking_b2b_price_price {
	color: #981211 !important;
	font-weight: 800 !important;
}
.product .woobuilder-price .b2bking_b2b_price_price .woocommerce-Price-amount,
body.single-product div.product .summary > .price .b2bking_b2b_price_price .woocommerce-Price-amount {
	color: #981211 !important;
	font-weight: 800 !important;
}

/* Varianten-Info-Box (SKU/Name/Preis) */
.product .single_variation_wrap #zs-var-info {
	background: #f5f3f0;
	border: 1px solid #e8e5df;
	border-left: 3px solid #981211;
	padding: 10px 14px;
	margin: 14px 0;
	font-size: 14px;
	line-height: 1.6;
	color: #43454b;
	font-family: 'Poppins', sans-serif;
}
.product .single_variation_wrap #zs-var-info .zs-var-img {
	width: 44px; height: 44px; object-fit: contain; border-radius: 4px;
	background: #f5f3f0; border: 1px solid #e8e5df;
	float: left; margin: 0 12px 6px 0; box-sizing: border-box;
}
.product .single_variation_wrap #zs-var-info .zs-var-sku { font-weight: 600; }
.product .single_variation_wrap #zs-var-info .zs-var-name { color: #666; }
.product .single_variation_wrap #zs-var-info .zs-var-label {
	color: #888; font-size: 12px; text-transform: uppercase; letter-spacing: .03em;
}
.product .single_variation_wrap #zs-var-info .zs-var-price {
	margin-top: 4px; font-size: 21.2362px; line-height: 31.8543px; font-weight: 700;
}
.product .single_variation_wrap #zs-var-info .zs-var-price .zs-evp {
	color: #9a9aa6; font-weight: 400; text-decoration: line-through;
}
.product .single_variation_wrap #zs-var-info .zs-var-price .zs-netto {
	color: #981211; font-weight: 800; margin-left: 10px;
}
.product .single_variation_wrap #zs-var-info .zs-var-price .zs-evp .woocommerce-Price-amount { color: #9a9aa6 !important; }
.product .single_variation_wrap #zs-var-info .zs-var-price .zs-netto .woocommerce-Price-amount { color: #981211 !important; }

/* --- 5) Kurzbeschreibung --- */
.product .woobuilder-excerpt,
body.single-product div.product .woocommerce-product-details__short-description {
	font-size: 15px !important;
	color: #43454b !important;
	line-height: 1.6 !important;
	margin-bottom: 6px !important;
	font-family: 'Poppins', sans-serif !important;
}

/* --- 6) Attribute + ATC (Asera-Rot, Radius 5px) --- */
.cfvsw-swatches-option {
	border-radius: 5px !important;
}
/* BILD-Swatches quadratisch (Kundenwunsch): das Bild bleibt unbeschnitten sichtbar */
.cfvsw-image-option {
	border-radius: 6px !important;
}
.cfvsw-image-option .cfvsw-swatch-inner {
	border-radius: 4px !important;
}
/* FARB-Swatches rund (nur echte Farbfelder, keine Labels/Bilder) */
.cfvsw-color-option,
.single-product .cfvsw-swatches-option:not(.cfvsw-label-option):not(.cfvsw-image-option) {
	border-radius: 50% !important;
}
.single-product .cfvsw-swatches-option.cfvsw-label-option {
	border-radius: 999px !important;
}
/* Ausgewählte Swatch: roter Rahmen */
.single-product .cfvsw-swatches-option.cfvsw-selected,
.single-product .cfvsw-swatches-option.selected,
.single-product .cfvsw-swatches-option.cfvsw-active,
.single-product .cfvsw-swatches-option.cfvsw-selected-swatch {
	border: 2px solid #981211 !important;
	box-shadow: 0 0 0 1px rgba(152,18,17,.15) !important;
}
/* Inaktive Swatches: dezenter grauer Rand (wie Zero) */
.single-product .cfvsw-swatches-option:not(.cfvsw-selected):not(.selected):not(.cfvsw-active):not(.cfvsw-selected-swatch) {
	border: 1px solid #b8b4ac !important;
	background: #fff !important;
}
.single-product .cfvsw-label-option.cfvsw-selected {
	background: #981211 !important;
	color: #fff !important;
}
.single-product .cfvsw-label-option.cfvsw-selected-swatch {
	background: #981211 !important;
	color: #fff !important;
}
.single-product .variations_form .quantity .qty,
.single-product .variations_form .quantity input.qty,
.woobuilder-add-to-cart .quantity .qty,
.woobuilder-add-to-cart .quantity input.qty {
	border: 1px solid #c9c2b4 !important;
	border-radius: 5px !important;
}
.single-product .single_add_to_cart_button,
.woobuilder-add-to-cart .single_add_to_cart_button,
.woobuilder-add-to-cart button.single_add_to_cart_button {
	background: #981211 !important;
	border: 2px solid #981211 !important;
	border-radius: 5px !important;
	color: #fff !important;
	font-family: 'Poppins', sans-serif !important;
}
/* reset_variations rechts neben den Button legen, damit der Link nicht als
   eigene Zeile die Form/Höhe der Seite vergrössert. */
.single-product .woocommerce-variation-add-to-cart {
	display: flex !important;
	align-items: center !important;
	flex-wrap: wrap !important;
	gap: 12px !important;
}
.single-product .woocommerce-variation-add-to-cart .single_add_to_cart_button {
	margin: 0 !important;
}
.single-product .reset_variations {
	margin: 0 0 0 12px !important;
	padding: 0 !important;
	font-size: 13px !important;
	text-decoration: underline !important;
	color: #981211 !important;
	background: transparent !important;
	white-space: nowrap !important;
	line-height: 1.2 !important;
	border: 0 !important;
}
.single-product .reset_variations:hover { color: #7d0e0d !important; }
/* Ausblenden, solange keine Variation gewählt (bzw. von woocommerce hidden) */
.single-product .reset_variations[style*="display: none"] { display: none !important; }
.single-product .single_add_to_cart_button:hover,
.woobuilder-add-to-cart .single_add_to_cart_button:hover,
.woobuilder-add-to-cart button.single_add_to_cart_button:hover {
	background: #7d0e0d !important;
	border-color: #7d0e0d !important;
}

/* --- 7) Sticky Sub-Menü (Beschreibung / Technik / Downloads) --- */
/* Floatet je nach Scroll-Position oben oder unten (immer sichtbar).
   !important + hohe Spezifität, damit auch das Zero-Content-Script
   (position:relative !important) überschrieben wird. */
.single-product .zs-submenu-wrap,
body.single-product .zs-submenu-wrap,
body.single-product div.product .zs-submenu-wrap {
	clear: both !important;
	/* NICHT sticky im Normalzustand: das JS (Boundary-Sticky) pinnt erst,
	   wenn das Menue wirklich rauszulaufen droht. CSS-sticky hier wuerde den
	   Offset doppelt anwenden und zu frueh/verspaetet pinnen. */
	position: static !important;
	z-index: 990 !important;
	width: 100% !important;
	background: #fff !important;
	box-shadow: 0 4px 14px rgba(0,0,0,.08) !important;
	transition: top .25s ease, bottom .25s ease, box-shadow .25s ease !important;
}
/* Gepinnt (JS setzt zs-stuck): jetzt sticky/fixed aktiv - mit korrektem Abstand */
body.admin-bar .zs-submenu-wrap.zs-stuck {
	top: 173px !important;
}
/* #page hat overflow:hidden und bricht position:sticky -> auf visible */
.single-product #page {
	overflow: visible !important;
}
/* Im unteren Bereich der Seite nach unten floaten */
body.single-product .zs-submenu-wrap.zs-stuck-bottom,
body.single-product div.product .zs-submenu-wrap.zs-stuck-bottom {
	top: auto !important;
	bottom: 0 !important;
	position: fixed !important;
	left: 0;
	right: 0;
	width: 100% !important;
	box-shadow: 0 -4px 14px rgba(0,0,0,.08) !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}
body.admin-bar .zs-submenu-wrap.zs-stuck-bottom {
	top: auto !important;
	bottom: 0 !important;
}
.zs-submenu-wrap .zs-submenu {
	max-width: 1250px !important;
	margin: 0 auto;
	background: #ffffff;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	padding: 0 5vw;
	position: relative;
	left: 0; right: 0;
	z-index: 9000;
}
.zs-submenu a.zs-submenu-up {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 40px;
	height: 100%;
	margin: 0 2px 0 0;
	color: #555;
	text-decoration: none !important;
	transition: color .2s, background .2s;
}
.zs-submenu a.zs-submenu-up:hover { color: #981211; background: #f6f4f0; }
.zs-submenu a.zs-submenu-link {
	display: block;
	padding: 10px 22px;
	font-size: .92rem;
	color: #555;
	text-decoration: none !important;
	font-weight: 500;
	border-bottom: 3px solid transparent;
	transition: color .2s, border-color .2s;
	font-family: 'Poppins', sans-serif;
}
.zs-submenu a.zs-submenu-link:hover { color: #111; }
.zs-submenu a.zs-submenu-link.is-active {
	color: #981211;
	border-bottom-color: #981211;
	font-weight: 600;
}
.zs-submenu-wrap.zs-stuck {
	clear: none !important;
	position: fixed !important;
	top: 141px;
	left: 0;
	right: 0;
	width: 100% !important;
	box-shadow: 0 4px 14px rgba(0,0,0,.08);
	/* V1.1.13: negativen Rand (0 -75px) beim Pinnen entfernen - sonst
	   springt das Menue bei position:fixed um 75px nach links
	   (Layout-Kontext faellt weg, die Negative-Margin wird nicht mehr
	   kompensiert). */
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#zs-uebersicht, #zs-technik, #zs-downloads {
	scroll-margin-top: 265px;
}

/* --- 8) Thumbnail-Leiste (klickbar) unter Galerie --- */
.zs-thumbs {
	display: flex;
	gap: 8px;
	margin-top: 12px;
	margin-bottom: 20px;
	overflow-x: auto;
	overflow-y: hidden;
	padding: 0 0 16px;
	-webkit-overflow-scrolling: touch;
	/* V1.1.57: Sanftes Zentrieren statt hartem Sprung (gilt fuer JS-scrollLeft
	   und Klick-Scrolls; User-Drag bleibt direkt) */
	scroll-behavior: smooth;
	scrollbar-width: thin;
	/* Previews unter dem Bild zentrieren (Wunsch Kunde).
	   Den Scroll-Fall (Inhalt breiter als Container -> linksbuendig, damit
	   nichts links abgeschnitten wird) steuert JS eindeutig ueber die Klasse
	   .zs-scrollable - inkl. Toleranz, damit auch eine minimale Rueckstands-
	   Differenz (z.B. Scrollbar-Rundung) nicht die Zentrierung kippt. */
	justify-content: center;
}
/* Scroll-Fall: wieder linksbündiger Start (Inhalt > Container) */
.zs-thumbs.zs-scrollable {
	justify-content: flex-start;
}
.zs-thumbs .zs-thumb {
	flex: 0 0 auto;
	width: 78px;
	height: 58px;
	border: 2px solid #e4e1da;
	border-radius: 6px;
	overflow: hidden;
	cursor: pointer;
	background: #fff;
	padding: 2px;
	box-sizing: border-box;
	opacity: .75;
	transition: opacity .2s, border-color .2s;
}
.zs-thumbs .zs-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	border-radius: 3px;
}
.zs-thumbs .zs-thumb:hover { opacity: 1; border-color: #c9c2b4; }
.zs-thumbs .zs-thumb.zs-active {
	border-color: #981211;
	opacity: 1;
	box-shadow: 0 0 0 2px rgba(152,18,17,.18);
}

/* --- 9) Tabs -> gestapelte Sektionen (keine Register mehr) --- */
/* Container-Overflow: Storefront setzt .woocommerce-tabs{overflow:hidden},
   das schneidet full-bleed-media (alignfull-Video) ab -> visible */
.single-product .woocommerce-tabs {
	overflow: visible !important;
	padding-top: 0 !important;
}
/* Erste Sektion (#zs-uebersicht) direkt unter dem Menü ohne oberen Abstand */
.single-product .woocommerce-Tabs-panel#zs-uebersicht {
	padding-top: 0 !important;
}
/* Tab-Leiste ausblenden */
.single-product ul.tabs.wc-tabs,
.single-product .woocommerce-tabs ul.tabs {
	display: none !important;
}
/* Panels immer anzeigen, untereinander */
.single-product .wc-tab,
.single-product .woocommerce-Tabs-panel {
	display: block !important;
	float: none !important;
	width: 100% !important;
	max-width: 1250px !important;
	margin: 0 auto !important;
	padding: 40px 0 30px !important;
	box-sizing: border-box;
	opacity: 1 !important;
	visibility: visible !important;
}
/* Sektions-Überschriften (wie Zero, Poppins dünn) */
.single-product .wc-tab h2,
.single-product .woocommerce-Tabs-panel h2 {
	font-family: 'Poppins', sans-serif !important;
	font-size: 2.6rem !important;
	font-weight: 200 !important;
	line-height: 1.2 !important;
	color: #111 !important;
	margin: 0 0 22px !important;
}
.single-product .wc-tab h3,
.single-product .woocommerce-Tabs-panel h3 {
	font-family: 'Poppins', sans-serif !important;
	font-size: 1.25rem !important;
	font-weight: 300 !important;
	color: #111 !important;
	margin: 24px 0 10px !important;
}
.single-product .wc-tab p,
.single-product .woocommerce-Tabs-panel p {
	font-family: 'Poppins', sans-serif !important;
	font-size: 0.95rem !important;
	font-weight: 300 !important;
	line-height: 1.6 !important;
	color: #333 !important;
}
/* Technische Daten-Tabelle weich (wie Zero) */
.single-product .woocommerce-product-attributes.shop_attributes {
	width: 100%;
	max-width: 760px;
	margin: 0 auto;
	border-collapse: separate;
	border-spacing: 0 6px;
	font-family: 'Poppins', sans-serif;
}
.single-product .woocommerce-product-attributes.shop_attributes th,
.single-product .woocommerce-product-attributes.shop_attributes td {
	padding: 14px 18px;
	border: none;
	vertical-align: top;
	font-size: 0.95rem;
}
.single-product .woocommerce-product-attributes.shop_attributes th {
	background: #f3f1ed;
	border-radius: 10px 0 0 10px;
	font-weight: 600;
	color: #111;
	white-space: nowrap;
	width: 38%;
	text-align: left;
}
.single-product .woocommerce-product-attributes.shop_attributes td {
	background: #faf9f7;
	border-radius: 0 10px 10px 0;
	color: #333;
}
.single-product .woocommerce-product-attributes.shop_attributes tr:nth-child(even) th { background: #eae7e1; }
.single-product .woocommerce-product-attributes.shop_attributes tr:nth-child(even) td { background: #f4f2ee; }
.single-product .woocommerce-product-attributes.shop_attributes a { color: #981211; text-decoration: none; }

/* Downloads wie Zero: 3 Spalten, Icon-Kreis, PDF-Badge */
.single-product .woocommerce-product-documents {
	max-width: 1250px !important;
	margin: 0 auto !important;
	padding: 10px 5vw 30px;
	background: transparent !important;
	border: none !important;
}
.single-product .woocommerce-product-documents .ui-accordion-content {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
	background: transparent !important;
	border: none !important;
	padding: 8px 0 !important;
}
.single-product .woocommerce-product-documents ul {
	list-style: none;
	margin: 0 !important;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
}
.single-product .woocommerce-product-documents ul li {
	margin: 0;
	padding: 0;
}
.single-product .woocommerce-product-documents ul li a {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 20px 22px;
	background: #f6f4f0;
	border: 1px solid #ded9cf;
	border-radius: 14px;
	text-decoration: none !important;
	color: #111 !important;
	font-family: 'Poppins', sans-serif;
	font-size: 0.92rem;
	font-weight: 300;
	line-height: 1.3;
	min-height: 74px;
	transition: all .3s ease;
}
.single-product .woocommerce-product-documents ul li a:hover {
	background: #efece4;
	border-color: #c9c2b4;
	transform: translateY(-1px);
	box-shadow: 0 4px 14px rgba(0,0,0,.06);
}
/* PDF-Icon-Kreis (wie Zero) */
.single-product .woocommerce-product-documents ul li a::before {
	content: "";
	flex: 0 0 46px;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	border: 1px solid #cfc9bd;
	background: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2722%27 height=%2722%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23999%27 stroke-width=%271.2%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z%27/%3E%3Cpath d=%27M14 2v5a1 1 0 0 0 1 1h5%27/%3E%3Cpath d=%27M10 9H8%27/%3E%3Cpath d=%27M16 13H8%27/%3E%3Cpath d=%27M16 17H8%27/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	transition: all .3s ease;
}
.single-product .woocommerce-product-documents ul li a:hover::before {
	background-color: #fff;
	border-color: #b8b0a0;
}
/* Dateityp-Badge - der INHALT wird per JS aus der echten Dateiendung gesetzt
   (siehe zs_downloadsFileTypes in product-zs.js). Kein hartes "PDF" mehr -
   sonst wuerde auch Nicht-PDF (z.B. .zip oder WordPress-Seiten) faelschlich
   als PDF markiert. */
.single-product .woocommerce-product-documents ul li a::after {
	content: attr(data-zs-filetype);
	margin-left: auto;
	flex-shrink: 0;
	font-size: .72rem;
	letter-spacing: .08em;
	color: #999;
	border: 1px solid #d8d2c6;
	border-radius: 999px;
	padding: 4px 10px;
	font-weight: 600;
	transition: all .3s ease;
}
/* Link ohne bekannten Dateityp -> kein Badge anzeigen */
.single-product .woocommerce-product-documents ul li a[data-zs-filetype=""]::after,
.single-product .woocommerce-product-documents ul li a:not([data-zs-filetype])::after {
	content: "" !important;
	padding: 0 !important;
	border: none !important;
}
.single-product .woocommerce-product-documents ul li a:hover::after {
	color: #777;
	border-color: #c4bcac;
}
@media (max-width: 767px) {
	.single-product .woocommerce-product-documents ul {
		grid-template-columns: 1fr;
	}
}

/* Kurzbeschreibung unter den zwei Spalten (wie Zero kein eigener Platz in Summary) */
.zs-excerpt-below {
	display: block;
	clear: none;
	max-width: 1250px !important;
	margin: 0 auto 6px;
	width: 100%;
	box-sizing: border-box;
	padding: 0;
	font-size: 15px !important;
	color: #43454b !important;
	line-height: 1.5 !important;
	font-family: 'Poppins', sans-serif !important;
}
/* Darunter folgendes Element (Menü) nahe ranholen */
.zs-excerpt-below + .zs-submenu-wrap { margin-top: 2px !important; }
/* Accordion-Sprachtitel (Deutsch/English) sichtbar machen wie Zero zs-doc-lang */
.single-product .woocommerce-product-documents .ui-accordion-header {
	display: block !important;
	font-family: 'Poppins', sans-serif !important;
	font-size: 1.15rem !important;
	font-weight: 500 !important;
	letter-spacing: .02em;
	margin: 26px 0 10px !important;
	color: #111;
	text-align: left;
	background: transparent !important;
	border: none !important;
	cursor: default !important;
	padding: 0 !important;
}
.single-product .woocommerce-product-documents .ui-accordion-header .ui-accordion-header-icon {
	display: none !important;
}
.single-product .woocommerce-product-documents .ui-accordion-content {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
	background: transparent !important;
	border: none !important;
	padding: 4px 0 6px !important;
}
.single-product .woocommerce-product-documents .ui-accordion-content[aria-hidden="true"] {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
}

/* Menü + Sektionen hintereinander */
.single-product div.product .zs-submenu-wrap {
	clear: both;
	margin-top: 10px;
	/* Volle Breite im 1250er-Raster (siehe sticky-Block weiter unten):
	   width:100vw + negative 75px-Margins gleichen das Container-Padding aus.
	   margin-top bleibt hier als einziger Abstand. */
}
.single-product div.product .woocommerce-tabs,
.single-product div.product .woocommerce-product-documents {
	clear: both;
}

/* --- zs-Klassiker (falls woobuilder-content vorhanden) --- */
.zs-tabs { max-width: 1250px !important; margin: 0 auto; padding: 70px 0 90px; }
.zs-tabs-nav { display: none !important; }
.zs-tab-panel { display: block !important; }
.zs-tab-panel.is-active { display: block !important; }
.zs-tabs-h2 {
	font-family: 'Poppins', sans-serif !important;
	font-size: 2.0069rem !important; /* 32.11px wie Zero */
	font-weight: 200 !important;
	line-height: 1 !important;
	color: #111 !important;
	margin: 0 0 22px !important;
}
/* Technische Daten-H2 auf One wie Zero-Technik (48px) */
.zs-tech-h2 {
	font-family: 'Poppins', sans-serif !important;
	font-size: 3rem !important; /* 48px wie Zero */
	font-weight: 200 !important;
	line-height: 1.2 !important;
	color: #111 !important;
	margin: 0 0 24px !important;
}
/* Höhere Spezifität: schlägt die generische Panel-h2-Regel (2.6rem) */
.single-product .woocommerce-Tabs-panel h2.zs-tabs-h2,
.single-product .wc-tab h2.zs-tabs-h2 {
	font-size: 2.0069rem !important;
}
.single-product .woocommerce-Tabs-panel h2.zs-tech-h2,
.single-product .wc-tab h2.zs-tech-h2 {
	font-size: 3rem !important;
}
.zs-tech-table {
	width: 100%;
	max-width: 760px;
	margin: 0 auto;
	border-collapse: collapse;
}
.zs-tech-table th {
	font-family: 'Poppins', sans-serif;
	font-size: 0.8rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: #555;
	text-align: left;
	padding: 12px 18px 12px 0;
	border-bottom: 1px solid #eee;
}
.zs-tech-table td {
	font-family: 'Poppins', sans-serif;
	font-size: 0.95rem;
	font-weight: 300;
	color: #111;
	padding: 12px 0;
	border-bottom: 1px solid #eee;
}
.zs-tech-table a { color: #981211; text-decoration: none; }
.zs-doc-lang {
	font-family: 'Poppins', sans-serif !important;
	font-size: 1rem !important;
	font-weight: 500 !important;
	color: #111;
	margin: 0 0 10px !important;
}
.zs-doc-list { list-style: none; margin: 0; padding: 0; }
.zs-doc-list li { margin: 0 0 8px; }
.zs-doc-list a {
	font-family: 'Poppins', sans-serif;
	font-size: 0.92rem;
	font-weight: 300;
	color: #981211;
	text-decoration: none;
}
.zs-doc-list a:hover { text-decoration: underline; }

/* --- 10) Meta: Kategorie/Tags/+edit-link/.sku_wrapper ausblenden (wie Zero) --- */
.woobuilder-meta .posted_in, .woobuilder-meta .tagged_as { display: none !important; }
.product_meta .posted_in, .product_meta .tagged_as { display: none !important; }
.single-product .edit-link { display: none !important; }
.single-product .sku_wrapper { display: none !important; }

/* --- Responsive --- */
@media (max-width: 1080px) {
	.product.woobuilder > div:not([class]):first-of-type,
	.product.woobuilder > .woobuilder-block.woobuilder-images,
	body.single-product div.product > .woocommerce-product-gallery {
		float: none !important;
		width: 100% !important;
		margin: 0 0 2em !important;
	}
	.product.woobuilder > .woobuilder-block.woobuilder-title,
	.product.woobuilder > .woobuilder-block.woobuilder-price,
	.product.woobuilder > .woobuilder-block.woobuilder-add-to-cart,
	.product.woobuilder > .woobuilder-block.woobuilder-meta,
	body.single-product div.product > .summary {
		float: none !important;
		width: 100% !important;
		margin: 0 !important;
	}
	/* Flexbox: unter 1080px eine Spalte */
	body.single-product div.product {
		display: block !important;
		max-width: 100% !important;
	}
	body.single-product div.product > .woocommerce-product-gallery,
	body.single-product div.product > .summary {
		flex: none !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 0 2em !important;
	}
	body.single-product div.product::after { clear: both; }
}
@media (max-width: 767px) {
	.zs-submenu a.zs-submenu-link { padding: 8px 12px; font-size: .8rem; }
	.zs-submenu { overflow-x: auto; -webkit-overflow-scrolling: touch; }
	.zs-thumbs .zs-thumb { width: 64px; height: 48px; }
	.product .woobuilder-title,
	body.single-product div.product .product_title { font-size: 28px !important; }
}
/* --- HOTFIX: V1.1.8 Korrekturen --- */
#zs-downloads, .related.products, .up-sells.upsells { max-width: 100% !important; margin: 0 !important; }
#zs-technik h2.zs-tech-h2 { font-size: 2.0069rem !important; }
body.single-product div.product .summary > .price { font-size: 16px !important; line-height: 1.5 !important; }
.zs-excerpt-below { margin-bottom: 0 !important; }
.zs-submenu-wrap { margin-top: 0 !important; }
.product_meta { display: none !important; }

/* --- HOTFIX: V1.1.9 Korrekturen --- */
#zs-zubehoer { max-width: 100% !important; margin: 0 !important; }
.single-product .product_meta { display: none !important; }

/* --- HOTFIX: V1.1.10 Korrekturen (User-Feedback) --- */
/* Alle Inhalts-Sektionen wie Zero auf 1400px */
.zs-tabs { max-width: 100% !important; }
#zs-downloads, #zs-zubehoer, .related.products, .up-sells.upsells { max-width: 100% !important; }
/* Technische Daten + Downloads Titel: 48px wie Zero */
#zs-technik h2.zs-tech-h2, #zs-downloads h2.zs-tabs-h2 { font-size: 2.0069rem !important; }
/* Produktpreis (nicht Variantenpreis vermischen) — auf 16px wie Zero */
body.single-product div.product .summary > .price { font-size: 1rem !important; line-height: 1.5 !important; font-weight: 600 !important; color: #111 !important; }
/* Variantenpreis (zs-var-info) eigenständig — auf 16px wie Zero */
#zs-var-info .zs-var-price { font-size: 1rem !important; font-weight: 700 !important; }
/* b2bking Preise dezenter */
.b2bking_retail_price_price, .b2bking_b2b_price_price { font-size: 1rem !important; line-height: 1.4 !important; font-weight: 400 !important; }
/* Sticky unten: wenn Klasse .zs-stuck-bottom gesetzt (JS) */
.zs-submenu-wrap.zs-stuck-bottom { position: sticky !important; bottom: 0 !important; top: auto !important; box-shadow: 0 -4px 14px rgba(0,0,0,.08); }

/* V1.1.10: natives WooCommerce-Variantenpreis-Div ausblenden (wie Zero) —
   verhindert doppelte Preisausgabe vor #zs-var-info */
.single_variation .woocommerce-variation-price,
.single_variation_wrap .woocommerce-variation-price { display: none !important; }

/* --- HOTFIX: V1.1.11 (User-Feedback 18.10.) --- */
/* Ähnliche Produkte auf 1400px zwingen (überschreibt max-width:100% mit höherer Spezifität) */
body.single-product div.product > section.related.products,
body.single-product div.product > section.related { max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; }
/* Downloads + Zubehör: innere Grids/Container ebenfalls auf 1400px */
#zs-downloads .woocommerce-product-documents,
#zs-downloads > .woocommerce,
#zs-downloads h2.zs-tabs-h2,
#zs-zubehoer > .woocommerce,
#zs-zubehoer h2,
#zs-downloads .woocommerce-product-documents ul,
#zs-downloads .woocommerce-product-documents .ui-accordion { max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; }
/* Kein seitliches Padding im Panel + documents-Container (Inhalt soll volle 1400px bekommen) */
#zs-downloads, #zs-zubehoer,
#zs-downloads .woocommerce-product-documents { padding-left: 0 !important; padding-right: 0 !important; }

/* ===== ZS-FIX 2026-10-18: Preis-uncached-Pattern + Breite + Sticky ===== */
/* =========================================================================
   ZS-FIX (2026-10-18): Preis nie cachen + Breite stabil unter 1400px
   Wird IN product-zs.css eingebettet (einmalig, danach löschen).
   ========================================================================= */

/* --- 1) PREIS: NIE cachen / nie flackern — Zero-Pattern ---
   Der im Fragment-Cache eingebackene Preis (Range) wird versteckt,
   bis unser uncached-Endpoint den echten Single-Preis geliefert hat.
   Ohne .price-loaded: Spinner + unsichtbarer Inhalt. Mit: nur Preis. */
@keyframes zs_hide_spin { to { visibility: hidden !important; } }
@keyframes zs_spin { to { transform: rotate(360deg); } }
@keyframes zs_show_price { to { visibility: visible !important; } }

/* Container (p.price / .woobuilder-price): Spinner zeigen, Inhalt verstecken */
body.single-product .summary .price,
body.single-product div.product .woobuilder-price,
body.single-product .entry-summary .price {
	position: relative !important;
	min-height: 28px !important;
	animation: zs_hide_spin 0s 4s forwards !important;
}
body.single-product .summary .price::before,
body.single-product div.product .woobuilder-price::before {
	content: "" !important;
	position: absolute !important;
	left: 0 !important;
	top: 6px !important;
	width: 20px !important;
	height: 20px !important;
	border: 2px solid #e8e5df !important;
	border-top-color: #981211 !important;
	border-radius: 50% !important;
	animation: zs_spin .75s linear infinite !important;
	box-sizing: border-box !important;
	z-index: 2 !important;
}
body.single-product .summary .price > *,
body.single-product div.product .woobuilder-price > * {
	visibility: hidden !important;
	animation: zs_show_price 0s 4s forwards !important;
}

/* Sobald JS den Endpoint-Daten gesetzt hat: nur Preise zeigen, kein Spinner */
body.single-product .summary .price.price-loaded,
body.single-product div.product .woobuilder-price.price-loaded,
body.single-product .entry-summary .price.price-loaded {
	animation: none !important;
	visibility: visible !important;
}
body.single-product .summary .price.price-loaded::before,
body.single-product div.product .woobuilder-price.price-loaded::before { display: none !important; }
body.single-product .summary .price.price-loaded > *,
body.single-product div.product .woobuilder-price.price-loaded > * { visibility: visible !important; animation: none !important; }

/* Preis nie als Range anzeigen: wenn JS nicht greift, bleibt min-height +
   Spinner 4s, danach sichtbar (Fallback). Der Range im gecachten HTML wird
   durch renderPrices() IMMER durch den echten Single-Preis ersetzt. */

/* --- 2) BREITE: nie kantenlos, auch unter 1400px ---
   Statt max-width:1400 + margin auto (=> 0 bei <1400px Viewport):
   max-width:1250px + feste 75px Seiten-Margin. Bei schmalen Screens
   (mobile) wieder volle Breite mit kleinem Padding. */
@media (min-width: 768px) {
	/* Seit V1.1.32 ist div.product bereits das 1250px-Raster (100vw +
	   75px-Padding). Die Inhalts-Sektionen brauchen KEINEN 100vw-Ausbruch
	   mit eigenen 75px-Margins mehr - sie waeren sonst doppelt verschoben
	   (nach rechts). Volle Breite im Container = zentriert im Raster. */
	.zs-tabs,
	#zs-downloads,
	#zs-zubehoer,
	.related.products,
	.up-sells.upsells,
	body.single-product div.product > section.related {
		max-width: 100% !important;
		width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
	/* innerer Container der Downloads (Grid) ebenfalls */
	#zs-downloads .woocommerce-product-documents .ui-accordion {
		max-width: 100% !important;
		width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
}
@media (max-width: 767px) {
	.zs-tabs,
	#zs-downloads,
	#zs-zubehoer,
	.related.products,
	.up-sells.upsells,
	body.single-product div.product > section.related {
		max-width: 100% !important;
		width: 100% !important;
		margin-left: 12px !important;
		margin-right: 12px !important;
	}
}
/* --- 3) STICKY-MENÜ: über Header + fixed statt sticky-CSS ---
   - z-index 10000 > Header (999) -> nie mehr darunter verschwinden
   - .zs-stuck / .zs-stuck-bottom: position:fixed (JS setzt top/bottom inline
     mit !important via setProperty) + Spacer im Flow -> klebt zuverlässig
     oben NACH dem Header UND unten am Viewport, auch nach Scroll-Up */
.zs-submenu-wrap,
body.single-product div.product .zs-submenu-wrap {
	z-index: 10000 !important;
	/* Volle Breite AUCH im nicht-gepinnten Zustand (wie gepinnt mit
	   left:0/right:0/width:100%) - negative Margins heben das 75px-Padding
	   des 1250er-Rasters auf. flex-shrink:0 noetig, sonst schrumpft der
	   Flex-Container die 100vw-Breite wieder auf seine Innenbreite (1130px). */
	width: 100vw !important;
	max-width: 100vw !important;
	flex-shrink: 0 !important;
	margin-left: calc(-1 * max(75px, calc((100vw - 1250px) / 2))) !important;
	margin-right: calc(-1 * max(75px, calc((100vw - 1250px) / 2))) !important;
}
body.single-product .zs-submenu-wrap.zs-stuck,
body.single-product div.product .zs-submenu-wrap.zs-stuck {
	position: fixed !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	z-index: 10000 !important;
	box-shadow: 0 4px 14px rgba(0,0,0,.08) !important;
	/* V1.1.40-FIX: negative Margins (0 -75px) beim Pinnen entfernen -
	   bei position:fixed faellt der Layout-Kontext weg und die negative
	   Margin wuerde das Menue um 75px nach links verschieben.
	   Gleiche Spezifitaet wie die Basis-Regel (0,4,1) + spaeter = gewinnt. */
	margin-left: 0 !important;
	margin-right: 0 !important;
}
body.single-product .zs-submenu-wrap.zs-stuck-bottom,
body.single-product div.product .zs-submenu-wrap.zs-stuck-bottom {
	top: auto !important;
	bottom: 0 !important;
	box-shadow: 0 -4px 14px rgba(0,0,0,.08) !important;
	z-index: 10000 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}
/* Fallback ohne JS: klebt weiterhin unter dem Header */
body.single-product .zs-submenu-wrap:not(.zs-stuck) {
	position: sticky !important;
	top: 141px !important;
}
body.admin-bar .zs-submenu-wrap:not(.zs-stuck) {
	top: 173px !important;
}

/* ============================================================
   PRODUKTSEITEN-FULL-BLEED (2026-10-21, korrigiert):
   NUR die Beschreibungs-Sektionen brechen aus dem Content aus
   (100vw). div.product / Galerie / Summary / Tabs-Kopf bleiben
   UNANGETASTET (Standard-Layout wie Referenz thevios HUB).
   Desktop: Panel ist zentriert -> calc(50% - 50vw) startet exakt 0.
   Mobile: div.product ist schmaler als der Viewport (site-main
   16px Rand) -> Panel-Mitte = 50vw-16 -> +16px Korrektur nötig.
   ============================================================ */
/* Tab-Wrapper + Panel hart auf Content-Breite des div.product fixieren
   (bei 1280px vw = 1130px). OHNE diesen Zwang dehnen die 100vw-Sektionen
   das Panel selbst auf 1280 -> calc(50% - 50vw) greift ins Leere. */
.single-product .woocommerce-tabs.wc-tabs-wrapper:has(#zs-uebersicht),
.single-product .woocommerce-Tabs-panel#zs-uebersicht {
	width: 100% !important;
	max-width: 100% !important;
	flex-basis: 100% !important;
	flex-grow: 0 !important;
	flex-shrink: 1 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	box-sizing: border-box !important;
}
/* Sektionen full-bleed aus dem zentrierten 1130er-Panel ausbrechen */
.single-product .woocommerce-tabs.wc-tabs-wrapper:has(#zs-uebersicht) #zs-uebersicht > .wp-block-group:not(.zs-ewigkeit):not(.zs-farben):not(.zs-studio):not(.zs-material-hero):not(.zs-technik):not(.zs-material):not(.zs-uebersicht),
.single-product .woocommerce-tabs.wc-tabs-wrapper:has(#zs-uebersicht) #zs-uebersicht > section {
	width: 100vw !important;
	max-width: none !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}
@media (max-width: 768px) {
	.single-product .woocommerce-tabs.wc-tabs-wrapper:has(#zs-uebersicht) #zs-uebersicht > .wp-block-group:not(.zs-ewigkeit):not(.zs-farben):not(.zs-studio):not(.zs-material-hero):not(.zs-technik):not(.zs-material):not(.zs-uebersicht),
	.single-product .woocommerce-tabs.wc-tabs-wrapper:has(#zs-uebersicht) #zs-uebersicht > section {
		margin-left: calc(50% - 50vw + 16px) !important;
		margin-right: calc(50% - 50vw - 16px) !important;
	}
}

/* ============================================================
   VIVEROO Size-Grid Outlines stabilisieren (2026-10-22)
   - SVG-Outlines (one/flex/kiosk): in 130px-Wrap sauber skalieren,
     `width:X%` + Aspect-Ratio via height:auto, nie abschneiden.
   - img-Outlines (free): schwarz färben, sauber skalieren.
   Einheitlich für alle Produkt-Content-Kopien.
   ============================================================ */
#zs-uebersicht .zs-size-svgwrap{
	display:flex;align-items:flex-end;justify-content:center;width:100%;margin-bottom:8px;
	height:130px !important;overflow:visible !important;
}
#zs-uebersicht .zs-size-svgwrap svg{
	height:auto;display:block;max-width:100%;max-height:130px !important;
	width:auto;color:#111;
	flex:0 0 auto;
}
#zs-uebersicht .zs-size-svgwrap img{
	filter:brightness(0) saturate(0);height:auto;display:block;max-width:100%;max-height:130px !important;
}
/* Standfuss-Outlines (flex/kiosk) sind höher als breit: in der 130px-Höhe darf
   nichts abgeschnitten werden - wrap overflow sichtbar lassen, Karte nicht kappen. */
#zs-uebersicht .zs-size-svgwrap svg[overflow="visible"]{
	max-height:none !important;overflow:visible !important;
}
@media (max-width: 768px) {
	#zs-uebersicht .zs-size-svgwrap{height:110px !important;}
	#zs-uebersicht .zs-size-svgwrap svg{max-height:110px !important;}
}

/* ============================================================
   FIX 2026-10-22: Gutenberg-Konvertierung der Viveroo-Produktseiten
   Die Sektionen wurden in wp:group-Blöcke umgewandelt; Gutenberg fugt
   .wp-block-group__inner-container ein. Damit das Flex/Grid-Layout der
   Sektionen (Kinder wie .zs-hero-bg/.zs-hero-content sind Flex-Items)
   erhalten bleibt, muss der inner-container im Layout unsichtbar sein.
   ============================================================ */
#zs-uebersicht .wp-block-group__inner-container{
  display:contents !important;
}