/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Sep 30 2026 | 16:03:38 */
/* =========================================================
WOOCOMMERCE – SINGLE PRODUCT
========================================================= */
/* ---------------------------------------------------------
Produktgalerie – Thumbnails
--------------------------------------------------------- */
body.single-product .woocommerce-product-gallery .flex-control-thumbs {
	display: flex;
	flex-wrap: nowrap;
	gap: 10px;
	margin: 15px 0 0 !important;
	padding: 0;
	clear: both;
}
body.single-product .woocommerce-product-gallery .flex-control-thumbs li {
	width: 70px !important;
	flex: 0 0 70px;
	margin: 0 !important;
}
body.single-product .woocommerce-product-gallery .flex-control-thumbs img {
	display: block;
	width: 70px !important;
	height: 70px !important;
	object-fit: cover;
}
/* ---------------------------------------------------------
Produktgalerie – Hauptbild stabil halten
--------------------------------------------------------- */
body.single-product .woocommerce-product-gallery {
	display: flow-root;
	margin-bottom: 24px !important;
}
body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper {
	margin: 0 !important;
}
/*
FlexSlider gibt es nur bei mehreren Bildern.
Keine feste Aspect-Ratio auf den Flex-Viewport setzen.
*/
body.single-product .woocommerce-product-gallery .flex-viewport {
	height: auto !important;
	overflow: hidden;
}
/*
Diese Bildfläche existiert bei einem UND mehreren Bildern.
*/
body.single-product .woocommerce-product-gallery__image {
	aspect-ratio: 1 / 1;
}
body.single-product .woocommerce-product-gallery__image > a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}
body.single-product .woocommerce-product-gallery__image img {
	display: block;
	width: 100%;
	height: 100% !important;
	object-fit: contain;
}
/* ---------------------------------------------------------
Produktgalerie – wenn KEINE Thumbnails vorhanden sind
zusätzlichen Abstand zu den Tabs schaffen
--------------------------------------------------------- */
body.single-product
.woocommerce-product-gallery:not(:has(.flex-control-thumbs)) {
	margin-bottom: 70px !important;
}
/* ---------------------------------------------------------
Doppelte Überschriften in WooCommerce-Tabs entfernen
--------------------------------------------------------- */
body.single-product .woocommerce-Tabs-panel--description > h2:first-child,
body.single-product .woocommerce-Tabs-panel--additional_information > h2:first-child,
body.single-product .woocommerce-Reviews-title {
	display: none !important;
}
/* ---------------------------------------------------------
Beschreibung + zusätzliche Informationen einrücken
--------------------------------------------------------- */
body.single-product .woocommerce-Tabs-panel--description,
body.single-product .woocommerce-Tabs-panel--additional_information {
	padding: 24px 4% 20px !important;
	box-sizing: border-box;
}
/* ---------------------------------------------------------
Zusätzliche Informationen – Tabelle
--------------------------------------------------------- */
body.single-product table.woocommerce-product-attributes,
body.single-product table.woocommerce-product-attributes tr,
body.single-product table.woocommerce-product-attributes th,
body.single-product table.woocommerce-product-attributes td {
	border: none !important;
	background: transparent !important;
}
body.single-product table.woocommerce-product-attributes th,
body.single-product table.woocommerce-product-attributes td {
	padding: 6px 0 !important;
	vertical-align: middle;
	line-height: 1.4;
}
body.single-product table.woocommerce-product-attributes th {
	text-align: left;
	width: 190px;
	padding-right: 25px !important;
}
body.single-product table.woocommerce-product-attributes td p {
	margin: 0 !important;
	padding: 0 !important;
}
/* ---------------------------------------------------------
Rezensionen – Hinweistexte einrücken
--------------------------------------------------------- */
body.single-product .woocommerce-Reviews .woocommerce-noreviews,
body.single-product .woocommerce-Reviews .woocommerce-verification-required {
	margin-left: 4% !important;
	margin-right: 4% !important;
}
/* ---------------------------------------------------------
Schatten Kategoriebilder
--------------------------------------------------------- */
.woocommerce ul.products li.product a img {
	box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.15) !important;
	transition: box-shadow 0.3s ease-in-out;
}
/* ---------------------------------------------------------
Variables Produkt – Preisrange
--------------------------------------------------------- */
p.price > span.woocommerce-Price-amount:nth-last-child(2) {
	padding-right: 30px;
	padding-left: 20px;
}
/* ---------------------------------------------------------
Preis nach rechts ausrichten
--------------------------------------------------------- */
.product-list .wrapper-cart-price {
	text-align: right;
}
/* ---------------------------------------------------------
Kategorie auf Single Product ausblenden
--------------------------------------------------------- */
span.posted_in.detail-container {
	display: none !important;
}
/* ---------------------------------------------------------
Related Products – kompakter und mittig
--------------------------------------------------------- */
#related--products {
	width: 75% !important;
	margin-left: auto !important;
	margin-right: auto !important;
}
/* ---------------------------------------------------------
Breadcrumbs im Shop – Farbe auf Standard setzen
--------------------------------------------------------- */
.pt_plus_breadcrumbs_bar_inner.bred_style_2
#breadcrumbs > span:not(.del)::before {
	border-left-color: color-mix(
		in srgb,
		var(--e-global-color-secondary) 50%,
		transparent
	);
	left: calc(100% - 40px);
}
.pt_plus_breadcrumbs_bar_inner.bred_style_2 a {
	background-color: var(--e-global-color-secondary);
}
/* CURRENT – letztes Element */
.pt_plus_breadcrumbs_bar_inner.bred_style_2
#breadcrumbs > span.current .current_tab_sec {
	background-color: var(--e-global-color-accent) !important;
}
.pt_plus_breadcrumbs_bar_inner.bred_style_2
#breadcrumbs > span.current::before {
	border-left-color: color-mix(
		in srgb,
		var(--e-global-color-accent) 50%,
		transparent
	) !important;
	left: calc(100% - 40px);
}
/* Abstand nach unten */
.pt_plus_breadcrumbs_bar #breadcrumbs>span:not(.del) {
	margin: 0 5px 8px 0;
}
/* ---------------------------------------------------------
Shopbilder in der Productlist auf gleichmäßige Höhe bringen
--------------------------------------------------------- */
.product-list-content .product-content-image > a.product-image {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: 10px 10px 0 0;
}
.product-list-content .product-content-image > a.product-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}
/* =========================================================
PRODUKT-FILTER
========================================================= */
/* ---------------------------------------------------------
Reset
--------------------------------------------------------- */
.tp-search-filter .tp-search-wrap,
.tp-search-filter span.tp-tag-reset {
	width: 100%;
}
/* ---------------------------------------------------------
Material/Gestein + Farbe
Automatisches Raster ohne Überstand
--------------------------------------------------------- */
.tp-search-filter .tp-woo-button {
	display: grid !important;
	/*
	Spaltenzahl passt sich automatisch der verfügbaren
	Containerbreite an.
	*/
	grid-template-columns: repeat(auto-fit, minmax(105px, 1fr));
	gap: 12px !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	box-sizing: border-box !important;
}
/* ---------------------------------------------------------
The-Plus-Spalten vollständig neutralisieren
--------------------------------------------------------- */
.tp-search-filter .tp-woo-button .tp-buttonBox {
	width: auto !important;
	max-width: none !important;
	min-width: 0 !important;
	flex: none !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	box-sizing: border-box !important;
}
/* ---------------------------------------------------------
Label auf komplette Grid-Zelle setzen
--------------------------------------------------------- */
.tp-search-filter .tp-woo-button .tp-buttonBox label {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	margin: 0 !important;
	box-sizing: border-box !important;
}
/* ---------------------------------------------------------
Innere Button-Wrapper
--------------------------------------------------------- */
.tp-search-filter .tp-woo-button .tp-color-wrap,
.tp-search-filter .tp-woo-button .tp-color-opt {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	box-sizing: border-box !important;
}
/* ---------------------------------------------------------
Sichtbarer Button
--------------------------------------------------------- */
.tp-search-filter .tp-woo-button .tp-color-opt {
	display: flex !important;
	align-items: center;
	justify-content: center;
	padding-left: 6px !important;
	padding-right: 6px !important;
	text-align: center;
	white-space: nowrap;
}
/* =========================================================
ACF – ZUSATZINFO
========================================================= */
/* ---------------------------------------------------------
Das übergeordnete p-Tag zur Flex-Zeile machen
--------------------------------------------------------- */
.product--info .elementor-heading-title {
	display: flex !important;
	align-items: flex-start !important;
	margin-bottom: 8px !important;
}
/* ---------------------------------------------------------
Label als feste Spalte definieren
--------------------------------------------------------- */
.product--info .elementor-heading-title > span {
	font-size: 1.1rem !important;
	font-weight: 600 !important;
	flex: 0 0 230px !important;
	max-width: 230px !important;
	padding-right: 15px !important;
	margin: 0 !important;
	box-sizing: border-box !important;
}
/* ---------------------------------------------------------
Vorrätig ausblenden
--------------------------------------------------------- */
.tp-woo-stock,
.tp-woo-add-to-cart .stock.in-stock {
	display: none !important;
}
/* ---------------------------------------------------------
Mengenfeld – native Browser-Pfeile ausblenden
--------------------------------------------------------- */
body.single-product .tp-woo-add-to-cart input.qty::-webkit-inner-spin-button,
body.single-product .tp-woo-add-to-cart input.qty::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
body.single-product .tp-woo-add-to-cart input.qty[type="number"] {
	appearance: textfield;
	-moz-appearance: textfield;
}
/* ---------------------------------------------------------
Bei nur einem kaufbaren Stück
keine nutzlosen Plus/Minus-Tasten
--------------------------------------------------------- */
body.single-product
.tp-woo-add-to-cart form.cart
.quantity:has(input.qty[type="hidden"]) {
	display: none;
}
/* =========================================================
RESPONSIV
========================================================= */
/* ---------------------------------------------------------
Tablet
--------------------------------------------------------- */
@media (max-width: 1024px) {
	#related--products {
		width: 90% !important;
	}
}
/* ---------------------------------------------------------
Smartphone
--------------------------------------------------------- */
@media (max-width: 767px) {
	#related--products {
		width: 100% !important;
	}
	.product--info .elementor-heading-title {
		flex-direction: column !important;
		margin-bottom: 20px !important;
	}
	.product--info .elementor-heading-title > span {
		flex: none !important;
		padding-right: 0 !important;
		margin-bottom: -5px !important;
	}
	body.single-product .tp-woo-price  p.price{
		flex-direction: column !important;
		align-items: center !important;
	}
}
