/*
 * BubatzBuddy - Produktseite (Breeder, Chips, Preis, Lagerzeile, Bundles, USP-Karten, Akkordeon, Beschreibung)
 * Einzige Quelle fuer das Produktseiten-Styling. Wird per Snippet "Produktseite: CSS laden" eingebunden.
 * Farben: Flaechen #F8F8F8, Linien #E5E5E5, Text #333, Sekundaertext #666.
 */

/* Varianten-Preis und Standard-Auswahl ausblenden (ersetzt durch Preiszeile und Bundles) */
.summary .woocommerce-variation-price,
.summary .cgkit-as-variation-price { display: none !important; }
.commercekit-sticky-atc .price,
.commercekit-sticky-atc .price ins { color: #111111; }
.variations_form:has(.bb-bundles) table.variations { display: none; }
.single-product .summary .commercekit_sticky-atc .bb-bundles { display: none; }

/* Titelbereich */
.single-product .summary .product_title { font-size: 38px; line-height: 1.15; }
.single-product .summary .bb-breeder { margin: -4px 0 6px; font-size: 15px; font-weight: 400; line-height: 1.3; color: #444444; }
.single-product .summary .woocommerce-product-rating { margin: 10px 0 14px; }
.single-product .summary .woocommerce-product-rating .star-rating { margin-right: 3px; }
.single-product .summary .woocommerce-product-details__short-description { margin-bottom: 12px; }

/* Chips */
.single-product .summary .bb-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0; padding: 0; list-style: none; }
.single-product .summary .bb-chip {
	margin: 0;
	padding: 7px 14px;
	border: 1px solid #E5E5E5;
	border-radius: 10px;
	background: #F8F8F8;
	color: #333333;
	font-family: Poppins, sans-serif;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.2;
	white-space: nowrap;
}

/* Preis, Hinweis, Lagerzeile */
.single-product .summary .bb-preisbox { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 4px 0 14px; }
.single-product .summary .bb-preis { margin: 0; font-family: Poppins, sans-serif; font-size: 26px; font-weight: 700; line-height: 1.15; color: #111111; }
.single-product .summary .bb-preis .price { display: inline-flex; align-items: baseline; gap: 8px; }
.single-product .summary .bb-preis ins,
.single-product .summary .bb-preis .amount,
.single-product .summary .bb-preis bdi { color: #111111; }
.single-product .summary .bb-preis .amount { font-size: inherit; font-weight: 700; }
.single-product .summary .bb-preis ins { font-weight: 700; text-decoration: none; }
.single-product .summary .bb-preis .woocommerce-Price-currencySymbol { font-size: 0.75em; }
.single-product .summary .bb-preis .bb-ab { font-size: 0.5em; }
.single-product .summary .bb-preis del { position: relative; display: inline-block; margin: 0; font-size: 16px; font-weight: 400; line-height: 1.2; color: #6B6B6B; text-decoration: none; opacity: 1; }
.single-product .summary .bb-preis .price del .amount,
.single-product .summary .bb-preis .price del bdi { font-weight: 400; }
.single-product .summary .bb-preis del::after { content: ""; position: absolute; left: 0; right: 0; top: 52%; border-top: 1.5px solid currentColor; }
.single-product .summary .bb-preis del .woocommerce-Price-currencySymbol { font-size: inherit; }
.single-product .summary .bb-tax { font-size: 12px; line-height: 1.3; color: #666666; }
.single-product .summary .bb-tax a { color: #666666; text-decoration: underline; }
.single-product .summary .bb-tax a:hover { color: #222222; }
.single-product .summary .bb-stock { display: flex; align-items: center; gap: 8px; margin: 0 0 18px; font-size: 14px; line-height: 1.3; color: #333333; }
.single-product .summary .bb-stock-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #4FA600; box-shadow: 0 0 0 3px rgba(79, 166, 0, 0.18); }

/* Bundle-Auswahl */
.single-product .summary .bb-bundles { display: flex; flex-direction: column; gap: 14px; margin: 0 0 20px; }
.single-product .summary .bb-bundle {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	margin: 0;
	padding: 18px 20px;
	border: 1px solid #E5E5E5;
	border-radius: 10px;
	background: #FFFFFF;
	color: #222222;
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: border-color 0.15s, box-shadow 0.15s;
}
.single-product .summary .bb-bundle:hover { border-color: #BDBDBD; }
.single-product .summary .bb-bundle:focus-visible { outline: 2px solid #4FA600; outline-offset: 2px; }
.single-product .summary .bb-bundle.is-selected { border-color: #222222; box-shadow: 0 0 0 1px #222222; }
.single-product .summary .bb-bundle[disabled] { opacity: 0.5; cursor: not-allowed; }
.bb-radio { position: relative; flex: none; width: 20px; height: 20px; border: 1.5px solid #8A8A8A; border-radius: 50%; }
.is-selected .bb-radio { border-color: #222222; }
.is-selected .bb-radio::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: #222222; }
.bb-bundle-main { display: flex; flex-wrap: nowrap; align-items: center; gap: 6px 10px; flex: 1; min-width: 0; font-size: 15px; font-weight: 500; line-height: 1.3; }
.bb-pill { display: inline-block; padding: 3px 9px; border-radius: 999px; background: #4FA600; color: #FFFFFF; font-size: 12px; font-weight: 600; line-height: 1.3; }
.bb-pill .woocommerce-Price-amount { color: #FFFFFF; font-weight: 600; }
.bb-pill-off { background: #999999; }
.bb-bundle-price { flex: none; text-align: right; white-space: nowrap; }
.bb-bundle-price strong { font-size: 16px; font-weight: 700; color: #222222; }
.bb-bundle-price small { margin-left: 2px; font-size: 12px; color: #777777; }
.bb-ribbon { position: absolute; top: -10px; right: 14px; padding: 2px 10px; border-radius: 6px; background: #1E4700; color: #FFFFFF; font-size: 11px; font-weight: 600; line-height: 1.5; letter-spacing: 0.02em; }

/* USP-Karten */
.bb-usps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; margin: 0 0 12px; padding: 0; list-style: none; }
.bb-usps li { display: flex; align-items: center; gap: 10px; margin: 0; padding: 15px; border-radius: 7px; background: #F8F8F8; color: #555555; }
.bb-usps li > div { min-width: 0; }
.bb-usps svg { width: 22px; height: 22px; flex: none; fill: currentColor; }
.bb-usps strong { display: block; font-size: 13px; font-weight: 600; line-height: 18px; color: #333333; }
.bb-usps span { display: block; font-size: 12px; line-height: 16px; color: #666666; }

/* Akkordeon (Kaufbox und FAQ in der Beschreibung) */
.single-product .summary .bb-akkordeon { margin: 2px 0 0; border-top: 1px solid #E5E5E5; }
.single-product .bb-akkordeon details { border-bottom: 1px solid #E5E5E5; }
.single-product .bb-akkordeon summary {
	position: relative;
	border: 0 !important;
	padding: 14px 28px 14px 0;
	list-style: none;
	cursor: pointer;
	color: #333333;
	font-family: Poppins, sans-serif;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: normal;
	text-transform: none;
}
.single-product .bb-akkordeon summary::-webkit-details-marker { display: none; }
.single-product .bb-akkordeon summary::after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	width: 20px;
	height: 20px;
	margin-top: -10px;
	background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%231E4700" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 9l7 7 7-7"/></svg>') center / 20px 20px no-repeat;
	transition: transform 0.2s ease-out;
}
.single-product .bb-akkordeon details[open] summary::after { transform: rotate(180deg); }
.single-product .bb-akkordeon .cg-accordion-item { padding: 0 0 16px; font-size: 15px; line-height: 1.6; color: #333333; }
.single-product .bb-akkordeon .cg-accordion-item ul { margin: 0 0 10px; padding-left: 18px; }
.single-product .bb-akkordeon .cg-accordion-item li { margin-bottom: 4px; }
.single-product .bb-akkordeon .cg-accordion-item p { margin: 0 0 10px; }
.single-product .bb-akkordeon a { color: #1E4700; font-weight: 600; }
.single-product .bb-akkordeon a:hover { color: #143200; }
.single-product .summary .bb-pflanzenpass { display: block; width: 100%; max-width: 260px; height: auto; margin-top: 12px; border-radius: 8px; background: #F8F8F8; }

/* Beschreibung: Abschnitte, Tabellen [bb_tabelle], FAQ */
.woocommerce-Tabs-panel .bb-akkordeon { border-top: 1px solid #E5E5E5; }
.woocommerce-Tabs-panel .bb-akkordeon summary { padding: 20px 36px 20px 0; }
.woocommerce-Tabs-panel .bb-akkordeon .cg-accordion-item { padding-bottom: 20px; }
.bb-tabelle { width: 100%; margin: 0 0 1.5rem; border-collapse: collapse; font-size: 15px; }
.bb-tabelle th, .bb-tabelle td { padding: 12px 16px; border-bottom: 1px solid #E5E5E5; text-align: left; vertical-align: top; }
.bb-tabelle th { width: 40%; background: #F8F8F8; color: #333333; font-weight: 600; }
.woocommerce-Tabs-panel .wp-block-columns { gap: 3rem; }
.woocommerce-Tabs-panel .wp-block-image img { border-radius: 10px; }
.woocommerce-Tabs-panel .wp-block-image figcaption { margin: 8px 0 0; font-size: 13px; line-height: 1.4; color: #666666; text-align: left; }
.woocommerce-Tabs-panel :is(h2, h3) + :is(.bb-tabelle, .bb-akkordeon) { margin-top: 1.25rem; }
.bb-skala { display: inline-flex; gap: 4px; vertical-align: middle; }
.bb-skala i { width: 22px; height: 8px; border-radius: 4px; background: #E5E5E5; }
.bb-skala i.an { background: #1E4700; }
@media (max-width: 781px) {
	.woocommerce-Tabs-panel .wp-block-columns { gap: 1.25rem; }
}
/* Desktop-Rhythmus: Abschnitte 80px auseinander, Zeilen innerhalb 3rem wie der Spaltenabstand */
@media (min-width: 782px) {
	.woocommerce-Tabs-panel:has(> .wp-block-columns) { padding-top: 40px; padding-bottom: 40px; }
	.woocommerce-Tabs-panel .wp-block-columns + .wp-block-columns { margin-top: 3rem; }
	.woocommerce-Tabs-panel .wp-block-column > :last-child { margin-bottom: 0; }
}

/* KI-Hinweis in der Galerie: Video und Bilder mit data-ki (Mediathek-Meta _bb_ki_bild, Snippet 36) */
.single-product .cgkit-video-wrap,
.single-product .woocommerce-product-gallery__image:has(img[data-ki]) { position: relative; }
.single-product .cgkit-video-wrap::after,
.single-product .woocommerce-product-gallery__image:has(img[data-ki])::after { content: "KI-Visualisierung"; position: absolute; left: 10px; bottom: 6px; color: rgba(17, 17, 17, 0.3); font-size: 9px; line-height: 1.2; letter-spacing: 0.02em; pointer-events: none; }

/* Aehnliche Produkte: mobil 2er-Raster statt Slider (Shoptimizer zeigt dort sonst eine 320px-Karte) */
@media (max-width: 992px) {
	.single-product .related.products ul.products { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 12px; width: auto; margin-left: 0; padding: 0; overflow: visible; }
	.single-product .related.products ul.products li.product { min-width: 0; max-width: none; width: auto; }
	.single-product .related.products ul.products li.product .woocommerce-card__header { padding: 0; box-shadow: none; }
	.m-grid-2 .related ul.products li.product .woocommerce-loop-product__title { font-size: 16px; }
}

/* Passt gut zu (Shoptimizer Cross-Sells-Karussell): Titel und Button schwarz wie in der Shoptimizer-Demo */
.single-product .pdp-complementary--title a,
.single-product .pdp-complementary--add-to-cart a { color: #111111; }
/* Karte mit Rahmen wie das Upsell im Warenkorb (CommerceKit Order Bump) */
.single-product .pdp-complementary--single { box-sizing: border-box; padding: 14px 16px; border: 1px solid #CDCDCD; border-radius: 10px; background: #fff; }
.single-product .pdp-complementary--single img { border-radius: 6px; }

/* Badges auf dem ersten Bild: buendig mit Breadcrumb und Inhalt */
.single-product .product-details-wrapper .ckit-badge_wrapper,
.single-product .product-details-wrapper .onsale { left: 8px; }

/* Smartphone */
@media (max-width: 767px) {
	.single-product .product-details-wrapper .ckit-badge_wrapper,
	.single-product .product-details-wrapper .onsale { left: 0; }
	.single-product .summary .product_title { font-size: 30px; }
	.single-product .summary .bb-bundle { padding: 16px 12px; gap: 10px; }
	.single-product .summary .bb-bundle-main { gap: 6px 8px; }
	.single-product .summary .bb-bundle-title,
	.single-product .summary .bb-pill { white-space: nowrap; }
	.single-product .summary .bb-pill { padding: 3px 8px; font-size: 11.5px; }
	.single-product .summary .bb-bundle-price small { display: none; }
	.single-product .summary .bb-akkordeon { margin-top: 28px; }
	.bb-usps { gap: 8px; }
	.bb-usps li { gap: 8px; padding: 11px 10px; }
	.bb-usps svg { width: 18px; height: 18px; }
	.bb-usps strong { font-size: clamp(11px, 3.2vw, 13px); line-height: 16px; white-space: nowrap; }
	.bb-usps span { font-size: clamp(10.5px, 3vw, 12px); line-height: 15px; white-space: nowrap; }
}
@media (max-width: 480px) {
	.bb-bundle-main { font-size: 14px; }
	.bb-bundle-price strong { font-size: 15px; }
}

.single-product .summary .bb-preis .bb-stueck { display: none; }

/* Sets: Chips mit Sorten und Ersparnis */
.single-product .bb-chips--set a { color: inherit; text-decoration: none; }
.single-product .bb-chips--set a:hover { color: #1E4700; }
.single-product .summary .bb-chips li.bb-chip.bb-chip--spar { background: #F1F5EE; border-color: #1E4700; color: #1E4700; font-weight: 600; }
.single-product .bb-tabelle-spar th, .single-product .bb-tabelle-spar td { color: #1E4700; }
/* Sets: die drei Sorten als Karten ([bb_set_sorten]) */
.single-product .bb-set-sorten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 1.25rem 0 0; }
.single-product .bb-set-sorte { display: flex; flex-direction: column; overflow: hidden; border: 1px solid #E5E5E5; border-radius: 8px; background: #FFF; }
.single-product .bb-set-sorte-bild img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.single-product .bb-set-sorte-text { padding: 16px; }
.single-product .bb-set-sorte-text h3 { margin: 0 0 6px; font-size: 18px; }
.single-product .bb-set-sorte-text h3 a { color: #333; text-decoration: none; }
.single-product .bb-set-sorte-text p { margin: 0 0 10px; color: #666; font-size: 14px; line-height: 1.5; }
.single-product .bb-set-sorte-text ul { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.single-product .bb-set-sorte-text li { margin: 0; padding: 3px 10px; border-radius: 999px; background: #F8F8F8; color: #333; font-size: 13px; }
@media (max-width: 781px) {
	.single-product .bb-set-sorten { grid-template-columns: 1fr; gap: 12px; }
	.single-product .bb-set-sorte { flex-direction: row; }
	.single-product .bb-set-sorte-bild { flex: 0 0 110px; }
	.single-product .bb-set-sorte-bild img { height: 100%; }
	.single-product .bb-set-sorte-text { padding: 12px 14px; }
	.single-product .bb-set-sorte-text h3 { font-size: 16px; }
	.single-product .bb-set-sorte-text p { display: none; }
}

/* Sets: freistehende Ueberschrift nach einer Spaltenreihe (Diese drei Sorten ...) mit gleichem Abschnittsabstand wie die Reihen */
.single-product .woocommerce-Tabs-panel > .wp-block-columns + h2 { margin-top: 3rem; }
@media (max-width: 781px) { .single-product .woocommerce-Tabs-panel > .wp-block-columns + h2 { margin-top: 2rem; } }

/* Bundle-Auswahl: ausgewaehlt mit 2px-Rahmen statt Rahmen + Schatten (wirkte ungleich dick an den Ecken) */
.single-product .summary .bb-bundle.is-selected { border-width: 2px; border-color: #333333; box-shadow: none; padding: 17px 19px; }

/* Abstand Bewertungen zu "Aehnliche Produkte" */
.single-product .woocommerce-tabs { padding-bottom: 0; }
.single-product .commercekit-Tabs-panel--reviews, .single-product .woocommerce-Tabs-panel--reviews { padding-bottom: 0; }
.single-product .related-wrapper { margin-top: 40px; }

@media (max-width: 767px) {
	.single-product .summary .bb-bundle.is-selected { padding: 15px 11px; }
	.single-product .related-wrapper { margin-top: 28px; }
	/* Bild-Pfeile in der Galerie dezenter: kleine runde Knoepfe */
	body.single-product .cg-main-swiper .swiper-button-prev, body.single-product .cg-main-swiper .swiper-button-next { transform: scale(.72); border-radius: 50% !important; background: rgba(255, 255, 255, .85) !important; box-shadow: 0 1px 4px rgba(0, 0, 0, .12); }
}

/* Tab-Leiste: Bewertungs-Bubble mittig zur Schrift (Safari setzt die Schrift tiefer als Chrome, absolute Position rutschte ab) und in der Sternfarbe */
.commercekit-atc-tab-links li a:has(> span) { display: inline-flex; align-items: center; gap: 6px; padding-right: 10px !important; }
.commercekit-atc-tab-links li a > span { position: static !important; flex: none; margin: 0 !important; background-color: #4FA600 !important; color: #FFFFFF !important; }

/* Etwas mehr Luft unter "Aehnliche Produkte" */
.single-product .related-wrapper { padding-bottom: 24px; }
@media (max-width: 767px) {
	.single-product .related-wrapper { padding-bottom: 16px; }
}

/* Handy: Stueckpreis in den Bundles gekuerzt als "/Stk." */
@media (max-width: 767px) {
	.single-product .summary .bb-bundle-price small { display: inline; margin-left: 2px; font-size: 0; }
	.single-product .summary .bb-bundle-price small::after { content: "/Stk."; font-size: 12px; color: #777777; }
}