/*
 * BubatzBuddy - seitenweites CSS (Produktkarten-Badges, Bewertungs-Widget). Wird per Snippet "Cali-Badge und Site-CSS" eingebunden.
 */

/* Alle Badges gleich: Angebots-Banner von Shoptimizer (Farbe im Customizer) und CommerceKit-Badges (Cali Weed, Bestseller, Sale) */
.onsale,
.ckit-badge { padding: 3px 6px; border-radius: 3px; font-family: "Open Sans", sans-serif; font-size: 11px; font-weight: 700; line-height: 15px; letter-spacing: normal; text-transform: none; }
.ckit-badge { opacity: 1; }

/* Google-Bewertungs-Widget: lokale Poppins statt Trustindex-CDN (spart externe Schrift-Downloads) */
.ti-widget, .ti-widget * { font-family: Poppins, sans-serif !important; }

/* Produktkarten: Anzahl als Segment-Leiste '1 Stk. | 3 Stk. | 5 Stk.' in einer Zeile, Auswahl in der Farbe des Warenkorb-Buttons (Snippet Produktkarten: Mengenauswahl) */
ul.products li.product .cgkit-as-wrap-plp ul[data-attribute="attribute_pa_anzahl"], ul.products li.product .cgkit-as-wrap-plp ul[data-attribute="attribute_pa_saemlinge"] { display: flex; flex-wrap: nowrap; gap: 0; width: 100%; margin: 0; border: 1px solid #D4D4D4; border-radius: 4px; overflow: hidden; }
ul.products li.product .cgkit-as-wrap-plp ul[data-attribute="attribute_pa_anzahl"] .cgkit-attribute-swatch, ul.products li.product .cgkit-as-wrap-plp ul[data-attribute="attribute_pa_saemlinge"] .cgkit-attribute-swatch { flex: 1 1 0; min-width: 0; margin: 0; }
ul.products li.product .cgkit-as-wrap-plp ul[data-attribute="attribute_pa_anzahl"] .cgkit-attribute-swatch + .cgkit-attribute-swatch, ul.products li.product .cgkit-as-wrap-plp ul[data-attribute="attribute_pa_saemlinge"] .cgkit-attribute-swatch + .cgkit-attribute-swatch { border-left: 1px solid #D4D4D4; }
ul.products li.product .cgkit-as-wrap-plp ul[data-attribute="attribute_pa_anzahl"] .cgkit-attribute-swatch.cgkit-button button, ul.products li.product .cgkit-as-wrap-plp ul[data-attribute="attribute_pa_saemlinge"] .cgkit-attribute-swatch.cgkit-button button { width: 100%; min-width: 0; min-height: 36px; padding: 0 2px; border: 0; border-radius: 0; box-shadow: none; font-size: 13px; line-height: 36px; white-space: nowrap; }
ul.products li.product .cgkit-as-wrap-plp ul[data-attribute="attribute_pa_anzahl"] .cgkit-attribute-swatch.cgkit-button button.cgkit-swatch-selected, ul.products li.product .cgkit-as-wrap-plp ul[data-attribute="attribute_pa_saemlinge"] .cgkit-attribute-swatch.cgkit-button button.cgkit-swatch-selected { background: #333333; color: #FFFFFF; }

/* Stueckpreis neben dem Preis (Snippet Mengen-Varianten), Schrift wie das fruehere "ab" */
.bb-stueck { font-size: 0.7em; font-weight: 400; color: #6B6B6B; white-space: nowrap; }
.bb-stueck .woocommerce-Price-amount { font-weight: 400; color: inherit; }

/* Startseite: Bewertungsgrid, linksbuendig wie die anderen Sektionen */
.bb-home-reviews-intro { max-width: 640px; margin: 0 0 24px; text-align: left; }
.bb-home-reviews .bbr-head { justify-content: flex-start; }
/* Bewertungs-Zusammenfassung: Sterne und Anzahl mittig neben 4,7/5 (Startseite und Bewertungsseite) */
.bbr .bbr-sum { align-items: center; }
.bbr .bbr-sum-meta { margin-bottom: 0; }
.bbr .bbr-count { top: 0; }

/* Produktkarten: Warenkorb-Button immer sichtbar, auch am Desktop ohne Hover */
ul.products li.product .cgkit-as-loop-atc-wrap { display: block; }
ul.products li.product .button, ul.products li.product .cgkit-as-single-atc-wrap .button { opacity: 1; }

/* Footer: Marke + Kontakt, drei Linklisten, untere Zeile mit Zahlarten (Widgets "Footer" + "Copyright") */
.site-footer .col-full { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 0; }
.site-footer .col-full > .widget { width: auto; margin: 0; float: none; }
.site-footer .widget ul { margin: 0; padding: 0; list-style: none; }
.site-footer .widget li { margin: 0 0 8px; }
.bb-footer-logo { display: inline-block; margin-bottom: 16px; }
.bb-footer-logo img { display: block; width: 180px; height: auto; filter: brightness(0) invert(1); }
.bb-footer-intro { max-width: 340px; margin: 0 0 16px; line-height: 1.6; }
.bb-footer-kontakt a { display: inline-flex; align-items: center; gap: 10px; }
.bb-footer-kontakt svg { flex: none; color: #FFF; opacity: .85; }
.bb-footer-unten { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; font-size: 13px; }
.bb-footer-unten img { display: block; width: 300px; max-width: 100%; height: auto; }
@media (max-width: 992px) {
	.site-footer .col-full { grid-template-columns: 1fr 1fr; gap: 32px 0; }
	.site-footer .col-full > .widget:first-child { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
	.site-footer .col-full > .widget:last-child { grid-column: 1 / -1; }
	.bb-footer-unten { flex-direction: column; }
}

/* Mega-Menue: Linkgruppen untereinander in der linken Spalte, Produktkarten rechts daneben (nur Desktop) */
@media (min-width: 993px) {
	.main-navigation ul.menu > li.full-width > .sub-menu-wrapper > .container > ul.sub-menu { display: grid; grid-template-columns: 240px repeat(3, minmax(0, 1fr)); grid-template-rows: auto auto 1fr; grid-auto-flow: column dense; column-gap: 24px; align-items: start; }
	.main-navigation ul.menu > li.full-width > .sub-menu-wrapper > .container > ul.sub-menu > li:not(.menu-item-product) { grid-column: 1; width: auto; }
	.main-navigation ul.menu > li.full-width > .sub-menu-wrapper > .container > ul.sub-menu > li:not(.menu-item-product) + li:not(.menu-item-product) { margin-top: 18px; }
	.main-navigation ul.menu > li.full-width > .sub-menu-wrapper > .container > ul.sub-menu > li.menu-item-product { grid-row: 1 / -1; width: auto; }
}

/* Handy-Menue: Hauptpunkte gross mit feinen Linien, Spaltenueberschriften als kleine Labels, Links einheitlich 15px */
@media (max-width: 992px) {
	.main-navigation ul.menu > li { border-bottom: 1px solid #EEEEEE; }
	.main-navigation ul.menu > li > a { padding: 14px 0; font-size: 16px; font-weight: 600; color: #333; }
	.main-navigation ul.menu > li > a span:before { display: none; }
	.main-navigation ul.menu > li > .caret { top: 8px; }
	.main-navigation ul.menu > li.full-width .sub-menu-wrapper { padding: 0 0 12px; }
	.main-navigation ul.menu > li.full-width .sub-menu-wrapper ul.sub-menu > li > a,
	.main-navigation ul.menu > li.full-width .sub-menu-wrapper ul.sub-menu > li.nolink > span { display: block !important; margin: 12px 0 2px; padding: 0; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #8C8C8C; }
	.main-navigation ul.menu > li.full-width .sub-menu-wrapper ul.sub-menu > li > .caret,
	.main-navigation ul.menu > li.full-width .sub-menu-wrapper ul.sub-menu > li.nolink > span:after { display: none; }
	.main-navigation ul.menu > li.full-width .sub-menu-wrapper ul.sub-menu ul.sub-menu > li > a { display: block !important; margin: 0; padding: 8px 0; font-size: 15px; font-weight: 400; letter-spacing: 0; text-transform: none; color: #333; }
	.main-navigation ul.menu > li.full-width .sub-menu-wrapper ul.sub-menu > li.menu-item-product { display: none; }
	.mobile-extra { margin-top: 8px; }
	.mobile-extra h4 { margin: 18px 0 6px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #8C8C8C; }
	.mobile-extra ul { margin: 0; padding: 0; list-style: none; }
	.mobile-extra li a { display: flex; align-items: center; gap: 10px; padding: 8px 0; font-size: 15px; color: #333; }
	.mobile-extra li svg { flex: none; }
}

/* Menue: Links unter einer Ueberschrift ohne Link ("Für jeden Geschmack") erben sonst Block + Innenabstand der Ueberschrift */
.main-navigation ul.menu li.full-width li.nolink ul.sub-menu a > span:not(.caret), .main-navigation ul.menu li.nolink ul.sub-menu a > span { display: inline; padding: 0; }
/* Handy-Menue: Pfeil auf Hoehe des Menuepunkts (52px) zentrieren */
@media (max-width: 992px) {
	.main-navigation ul.menu > li.menu-item-has-children > span.caret { top: 0; height: 52px; display: flex; align-items: center; justify-content: center; }
}

/* Produktkarten am Handy: Preis 16px fett, Strich- und Stueckpreis kleiner, Mengenleiste flacher */
@media (max-width: 767px) {
	.woocommerce ul.products li.product .price, ul.products li.product .price { font-size: 16px; }
	ul.products li.product .price ins, ul.products li.product .price ins .woocommerce-Price-amount, ul.products li.product .price > .woocommerce-Price-amount { font-size: 16px; font-weight: 700; }
	.woocommerce ul.products li.product .price del[aria-hidden], ul.products li.product .price del { margin-right: 0; font-size: 11px; }
	ul.products li.product .price .bb-stueck { display: inline-block; font-size: 10px; }
	ul.products li.product .cgkit-as-wrap-plp ul[data-attribute="attribute_pa_anzahl"] .cgkit-attribute-swatch.cgkit-button button, ul.products li.product .cgkit-as-wrap-plp ul[data-attribute="attribute_pa_saemlinge"] .cgkit-attribute-swatch.cgkit-button button { height: 32px; min-height: 32px; line-height: 32px; }
	ul.products li.product .cgkit-as-single-atc-wrap { margin-top: 6px; }
}

/* Mega-Menue Desktop: Spaltenueberschriften fett */
@media (min-width: 993px) {
	.main-navigation ul.menu > li.full-width > .sub-menu-wrapper > .container > ul.sub-menu > li:not(.menu-item-product) > a,
	.main-navigation ul.menu > li.full-width > .sub-menu-wrapper > .container > ul.sub-menu > li.nolink > span { font-weight: 700; }
}

/* Navigation dunkelgrau #333, Footer dunkler #111 */
.col-full-nav { background-color: #333; }
.site-footer,
footer.copyright { background-color: #111; }

/* Navigation: aktiver Link unterstrichen */
@media (min-width: 993px) {
	.main-navigation ul.menu > li.current-menu-item > a,
	.main-navigation ul.menu > li.current-menu-ancestor > a,
	.main-navigation ul.menu > li.current-menu-parent > a,
	.main-navigation ul.menu > li.current-product-ancestor > a,
	.main-navigation ul.menu > li.current_page_item > a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }
}

/* Badges: Desktop rund mit 8px Abstand, Handy buendig am Bildrand (links eckig, rechts rund); Produktlisten auf der Startseite (Elementor-Shortcode) ohne die 5px vom Theme, wie in den Kategorien */
ul.products li.product .ckit-badge_wrapper,
ul.products li.product .onsale { left: 8px; }
@media (max-width: 767px) {
	ul.products li.product .ckit-badge_wrapper,
	ul.products li.product .onsale { left: 0; }
	.onsale, li.product .onsale, .product .onsale, .ckit-badge { padding: 3px 7px 3px 6px; border-radius: 0 6px 6px 0; }
}
@media (max-width: 992px) {
	.elementor-shortcode ul.products { padding-left: 0; padding-right: 0; }
}

/* Topbar am Handy: die vier Hinweise wechseln automatisch (nur CSS) */
@media (max-width: 992px) {
	.top-bar { padding: 7px 0; font-size: 12px; }
	.top-bar .col-full { position: relative; height: 18px; overflow: hidden; }
	.top-bar .col-full > div { position: absolute; inset: 0; display: flex !important; align-items: center; justify-content: center; width: 100%; margin: 0; padding: 0; opacity: 0; text-align: center; animation: bb-topbar 12s infinite; }
	.top-bar .col-full > div:nth-child(2) { animation-delay: 3s; }
	.top-bar .col-full > div:nth-child(3) { animation-delay: 6s; }
	.top-bar .col-full > div:nth-child(4) { animation-delay: 9s; }
	.top-bar .col-full > div p { margin: 0; }
}
@keyframes bb-topbar {
	0% { opacity: 0; transform: translateY(6px); }
	3%, 22% { opacity: 1; transform: none; }
	25%, 100% { opacity: 0; transform: translateY(-6px); }
}
@media (max-width: 992px) and (prefers-reduced-motion: reduce) {
	.top-bar .col-full > div { animation: none; }
	.top-bar .col-full > div:first-child { opacity: 1; }
}

/* Produktkarten am Handy: halben Pixel des zweiten Bildes rechts abschneiden (Rundung bei 2-spaltigem Raster) */
@media (max-width: 767px) {
	ul.products li.product .shoptimizer-plp-carousel-container { clip-path: inset(0 1px 0 0); }
}

/* Startseite: Hervorhebung in Ueberschriften immer kursiv, gleiche Farbe wie die Ueberschrift */
.elementor-heading-title em { font-style: italic; }

/* Startseite: auf Handy und Tablet hoechstens 6 Bewertungen */
@media (max-width: 992px) {
	.bb-home-reviews .bbr-grid > .bbr-card:nth-child(n+7) { display: none; }
}

/* Produktraster: mehr Luft zwischen den Reihen am Desktop (Karten ohne Mengen-Auswahl wirkten gequetscht) */
@media (min-width: 993px) {
	ul.products li.product { margin-bottom: 32px; }
}

/* Header: Herz mobil so fein wie am Desktop, Zaehler am Herz wie beim Warenkorb */
.shoptimizer-myaccount a { position: relative; color: #333; }
/* Zahl kommt als CSS-Variable --bb-wl vom <html> (schon im <head> gesetzt, dadurch kein Flackern beim Seitenwechsel) */
.bb-wunsch-zahl { display: none; }
html.bb-wl .shoptimizer-myaccount a[href*="wunschliste"]::after,
html.bb-wl li.menu-item > a[href*="wunschliste"] .icon-wrapper::after { content: var(--bb-wl); position: absolute; top: -5px; right: -9px; box-sizing: border-box; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; background: #1E4700; color: #FFFFFF; font-family: 'Open Sans', sans-serif; font-size: 10px; font-weight: 700; line-height: 17px; text-align: center; letter-spacing: 0; }

/* Wunschlisten-Hinweis (CommerceKit-Popup) als schlanker Toast unten mittig */
#commercekit-flash-popup { position: fixed; top: auto !important; bottom: 24px; left: 50%; transform: translateX(-50%) !important; z-index: 99999; box-sizing: border-box; width: auto; max-width: calc(100vw - 32px); padding: 10px 16px 10px 38px !important; border-radius: 8px !important; background: #333 !important; color: #FFFFFF !important; font-family: 'Open Sans', sans-serif; font-size: 14px !important; font-weight: 600 !important; line-height: 20px; letter-spacing: 0 !important; text-transform: none !important; white-space: nowrap; box-shadow: 0 8px 24px rgba(0, 0, 0, .18) !important; opacity: 1 !important; }
#commercekit-flash-popup::before { content: ""; position: absolute; left: 14px; top: 50%; width: 16px; height: 16px; margin-top: -8px; background: #FFFFFF; -webkit-mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8.25c0-2.485-2.099-4.5-4.688-4.5-1.935 0-3.597 1.126-4.312 2.733-.715-1.607-2.377-2.733-4.313-2.733C5.1 3.75 3 5.765 3 8.25c0 7.22 9 12 9 12s9-4.78 9-12Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8.25c0-2.485-2.099-4.5-4.688-4.5-1.935 0-3.597 1.126-4.312 2.733-.715-1.607-2.377-2.733-4.313-2.733C5.1 3.75 3 5.765 3 8.25c0 7.22 9 12 9 12s9-4.78 9-12Z'/%3E%3C/svg%3E") center / contain no-repeat; }

/* Sortierung in den Kategorien: Feld so breit wie der Text, Pfeil direkt daneben */
.woocommerce-ordering select.orderby { field-sizing: content; width: auto; min-width: 0; max-width: 100%; padding-right: 26px !important; background-position: right 4px center; font-size: 14px; }
.woocommerce-ordering select.orderby option { font-size: 15px; }

/* Produkte laden beim Scrollen automatisch nach: Button ausgeblendet, waehrend des Ladens ein schmaler Balken */
.shoptimizer-load-more-wrapper { position: relative; }
.shoptimizer-load-more-wrapper #shoptimizer-load-more-btn { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.shoptimizer-load-more-wrapper::after { content: ""; display: block; width: 160px; height: 3px; margin: 18px auto 0; border-radius: 3px; background: linear-gradient(90deg, #E5E5E5 0 35%, #333 35% 65%, #E5E5E5 65%) 0 0 / 300% 100%; opacity: 0; transition: opacity .2s; }
.shoptimizer-load-more-wrapper:has(.is-loading)::after { opacity: 1; animation: bb-laden 1s linear infinite; }
@keyframes bb-laden { from { background-position: 100% 0; } to { background-position: 0 0; } }

/* Mein Konto: einheitliche Formulare und Buttons wie im restlichen Shop */
.woocommerce-account .woocommerce form .form-row { margin-bottom: 16px; }
.woocommerce-account .woocommerce form label { margin-bottom: 6px; font-size: 14px; font-weight: 600; color: #333; }
.woocommerce-account .woocommerce input.input-text, .woocommerce-account .woocommerce select, .woocommerce-account .woocommerce textarea { border: 1px solid #E5E5E5; border-radius: 8px; background: #FFFFFF; }
.woocommerce-account .woocommerce .button, .woocommerce-account .woocommerce button.button { padding: 11px 20px; border: 1px solid #333; border-radius: 8px; background: #333; color: #FFFFFF; font-family: 'Open Sans', sans-serif; font-size: 15px; font-weight: 600; line-height: 1.2; }
.woocommerce-account .woocommerce .button:hover { background: #111; border-color: #111; color: #FFFFFF; }
.woocommerce-account .woocommerce .woocommerce-LostPassword a, .woocommerce-account .woocommerce-MyAccount-content a:not(.button) { color: #333; text-decoration: underline; }
.woocommerce-account .woocommerce-form-login, .woocommerce-account .woocommerce-form-register { margin: 0 0 24px; padding: 24px; border: 1px solid #E5E5E5; border-radius: 14px; }
.woocommerce-account .woocommerce-MyAccount-navigation ul { margin: 0 0 24px; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li a { display: block; padding: 10px 0; border-bottom: 1px solid #E5E5E5; color: #333; text-decoration: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { font-weight: 700; }
@media (max-width: 767px) {
	.woocommerce-account .woocommerce-form-login, .woocommerce-account .woocommerce-form-register { padding: 18px; }
	.woocommerce-account .woocommerce .button { width: 100%; }
}

/* Blog-Uebersicht: alle Titelbilder im gleichen 16:9-Format */
.site-main article .post-thumbnail img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }


/* Handy-Menue: Scrollsperre auf html statt body, sonst verliert der Sticky-Header seinen Halt und verschwindet */
body.mobile-toggled { overflow: visible !important; }
html:has(body.mobile-toggled) { overflow: hidden; }
body.mobile-toggled.sticky-m header.site-header { position: sticky !important; top: 0; z-index: 9; }

/* Header: alle Icons mit exakt 1px-Linie (unabhaengig von der Icongroesse), Menue-Striche etwas feiner */
.site-header svg path, .site-header svg circle, .site-header svg rect, .site-header svg line, .site-header svg polyline,
.col-full-nav .icon-wrapper svg path, .col-full-nav .icon-wrapper svg circle { stroke-width: 1px; vector-effect: non-scaling-stroke; }
.menu-toggle .bar { height: 1.5px; }

/* Ueberschriften auf Theme-Seiten (Kategorie, Blog-Beitrag) wie der globale Stil "Ueberschrift H1" */
.woocommerce-products-header__title.page-title, .single-post .entry-header h1.entry-title {
	font-family: var(--e-global-typography-bbh1-font-family, Poppins), sans-serif; font-size: var(--e-global-typography-bbh1-font-size, 40px);
	font-weight: var(--e-global-typography-bbh1-font-weight, 600); line-height: var(--e-global-typography-bbh1-line-height, 1.15); letter-spacing: var(--e-global-typography-bbh1-letter-spacing, -0.5px);
}
@media (max-width: 767px) {
	.woocommerce-products-header__title.page-title { margin-bottom: 10px; }
}

/* Blogbeitraege: Luft zum Footer, Bildunterschriften, Abschluss-Kasten */
.single-post .site-main { padding-bottom: 88px; }
.single-post .elementor-widget-image .widget-image-caption { margin-top: 8px; font-size: 13px; line-height: 1.5; color: #666; text-align: left; }
.single-post .bb-beitrag-ende .elementor-button { width: auto; }
@media (max-width: 767px) { .single-post .site-main { padding-bottom: 56px; } .single-post .bb-beitrag-ende .elementor-button-wrapper, .single-post .bb-beitrag-ende .elementor-button { width: 100%; } }

/* Produkte ohne Bewertung: kein "(0)" unter dem Titel */
.woocommerce-product-rating:not(:has(.star-rating)) { display: none; }

/* Kopfzeile: Kontakt/Wunschliste/Konto per Flexbox, damit nicht minifizierte Seiten (Mein Konto) nicht verrutschen */
.site-header .secondary-navigation ul.menu { display: flex; align-items: center; }

/* Mein Konto: Ueberschriften wie im Rest der Seite */
.woocommerce-account .entry-header h1.entry-title { font-family: var(--e-global-typography-bbh1-font-family, Poppins), sans-serif; font-size: var(--e-global-typography-bbh1-font-size, 40px); font-weight: var(--e-global-typography-bbh1-font-weight, 600); line-height: var(--e-global-typography-bbh1-line-height, 1.15); letter-spacing: var(--e-global-typography-bbh1-letter-spacing, -0.5px); }
.woocommerce-account .entry-content h2, .woocommerce-account .entry-content h3 { font-family: var(--e-global-typography-bbh3-font-family, Poppins), sans-serif; font-size: var(--e-global-typography-bbh3-font-size, 22px); font-weight: var(--e-global-typography-bbh3-font-weight, 600); line-height: 1.25; }

/* Handy: Warenkorb-Icon etwas kleiner, Suchleiste mit Abstand zum Header */
@media (max-width: 992px) {
	.site-header .cart-contents { transform: scale(.88); transform-origin: center; }
	.site-header .main-header .site-search { padding-top: 12px !important; }
}

/* Handy: Produkte ohne Mengen-Auswahl (z. B. Sets) - Button direkt unter dem Preis wie am Desktop */
@media (max-width: 992px) {
	ul.products li.product a.button.product_type_simple { margin-top: 0 !important; }
}

/* Startseite: Karussells mit Anschnitt (Snippet 50) zeigen schon vor dem Start ihre Endgroesse.
   Bis Snippet 50 fertig ist (Klasse bb-peek-ok), gelten diese Breiten statt der Swiper-Startwerte (sonst kurz eine Karte randlos auf voller Breite).
   Werte = Swiper-Rechnung: (Bildschirmbreite - (Karten - 1) x Abstand) / Karten, 15px Rand vor der ersten Karte. */
@media (max-width: 766px) {
	.elementor-element-a7a02a9 { --bb-peek-w: calc((100vw - 8.4px) / 1.7); --bb-peek-gap: 12px; }
	.elementor-element-160b5ad { --bb-peek-w: calc((100vw - 2.4px) / 1.2); --bb-peek-gap: 12px; }
	.elementor-element-de8f0d9 { --bb-peek-w: calc((100vw - 3.2px) / 1.2); --bb-peek-gap: 16px; }
}
@media (min-width: 767px) and (max-width: 991px) {
	.elementor-element-a7a02a9 { --bb-peek-w: calc((100vw - 37.6px) / 3.35); --bb-peek-gap: 16px; }
	.elementor-element-160b5ad { --bb-peek-w: calc((100vw - 22.5px) / 2.25); --bb-peek-gap: 18px; }
	.elementor-element-de8f0d9 { --bb-peek-w: calc((100vw - 30px) / 2.25); --bb-peek-gap: 24px; }
}
@media (max-width: 991px) {
	.bb-peek .swiper:not(.bb-peek-ok) > .swiper-wrapper { display: flex; gap: 0 !important; box-sizing: border-box; padding-inline-start: 15px; transform: none !important; }
	.bb-peek .swiper:not(.bb-peek-ok) > .swiper-wrapper > .swiper-slide { flex: 0 0 auto; width: var(--bb-peek-w) !important; max-width: none !important; margin-inline-end: var(--bb-peek-gap) !important; }
}

/* Handy: mehr Abstand ueber der Copyright-Zeile */
@media (max-width: 767px) {
	footer.copyright { padding-top: 48px; }
}

/* Startseite: Breeder-Logos. Eingestellt im Elementor-Widget "Bild-Karussell" (Klasse bb-logo-karussell), Snippet "Logo-Laufband"
   gibt daraus eine CSS-Laufschrift aus: --bb-n = sichtbare Logos, --bb-g = Abstand, --bb-dauer = Zeit fuer einen Durchlauf. */
.elementor-widget.bb-logo-karussell { align-self: stretch; width: 100%; }
.bb-lauf { container-type: inline-size; position: relative; width: 100%; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.bb-lauf ul { --k: var(--bb-n); --g: var(--bb-g); display: flex; align-items: center; gap: var(--g); width: max-content; margin: 0; padding: 0; list-style: none; animation: bb-lauf var(--bb-dauer) linear infinite; }
.bb-lauf li { flex: none; width: calc((100cqw - (var(--k) - 1) * var(--g)) / var(--k)); margin: 0; }
.bb-lauf img { display: block; width: 100%; height: auto; }
@keyframes bb-lauf { to { transform: translateX(calc(-50% - var(--g) / 2)); } }
@media (max-width: 992px) { .bb-lauf ul { --k: var(--bb-n-t); --g: var(--bb-g-t); } }
@media (max-width: 767px) { .bb-lauf ul { --k: var(--bb-n-m); --g: var(--bb-g-m); } }
@media (prefers-reduced-motion: reduce) { .bb-lauf ul { animation: none; } }

/* PageSpeed: Hover-Zweitbild der Produktkarten auf Touch-Geraeten nicht laden (dort gibt es kein Hover; display:none + loading=lazy = kein Download) */
@media (hover: none) {
	ul.products li.product img.gallery-image { display: none !important; }
}
/* Barrierefreiheit: Such-Button am Handy gross genug (mind. 24px, ohne Ueberlappung mit dem Menue-Button) */
@media (max-width: 992px) {
	.site-header button.mobile-search-toggle { display: inline-flex; align-items: center; justify-content: flex-start; min-width: 32px; margin-left: 4px; }
}

/* Handy: Suchleiste mit gleichem Abstand oben und unten (feste Hoehe 60px liess unten nur 8px) */
@media (max-width: 992px) {
	.site-header .main-header .site-search { padding-top: 12px !important; padding-bottom: 12px !important; height: auto !important; }
}
/* Kein seitliches Verrutschen der Seite am Handy (clip statt hidden: sticky Kopfzeile funktioniert weiter) */
html, body { overflow-x: clip; }
/* Leere Wunschliste: Button wie die uebrigen Buttons */
.commercekit-wishlist-table a.button.wsl-no-shop,
a.button.wsl-no-shop { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 48px; padding: 0 24px; border: 0; border-radius: 8px; background: #333; color: #FFFFFF; font-family: 'Open Sans', sans-serif; font-size: 15px; font-weight: 600; line-height: 1; letter-spacing: 0; text-transform: none; text-decoration: none; }
a.button.wsl-no-shop:hover { background: #111; color: #FFFFFF; }
/* Wunschliste: Zaehler "1 Artikel" rutschte durch negativen Abstand unter den Warenkorb-Button */
.commercekit-wishlist-pages { margin-top: 24px !important; color: #666; font-size: 14px; }