/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* ===========================================
   BIOBALKAN – STYLESHEET
   Optimiert & sortiert
   =========================================== */


/* ==========================================
   1. CSS CUSTOM PROPERTIES (ROOT VARIABLES)
   ========================================== */

:root {
  /* Border Radius */
  --border-radius: 24px;
  --img-radius: 24px;

  /* Font Sizes */
  --fs-button:   clamp(1rem,    0.8412rem + 0.6776vw, 1.18rem);
  --fs-button-s: clamp(0.8rem,  0.6235rem + 0.7529vw, 1rem);
  --fs-h1:       clamp(2rem,    1.3382rem + 2.8235vw, 2.75rem);
  --fs-h2:       var(--fs-h1);
  --fs-h3:       clamp(1.5rem,  0.8382rem + 2.8235vw, 2.25rem);
  --fs-h4:       clamp(1.25rem, 1.0294rem + 0.9412vw, 1.5rem);
  --fs-h5:       clamp(1rem,    0.5588rem + 1.8824vw, 1.5rem);
  --fs-p:        clamp(1rem,    0.7794rem + 0.9412vw, 1.25rem);
  --fs-small:    clamp(0.8rem,  0.6941rem + 0.4518vw, 0.92rem);

  /* Line Heights */
  --lh-button: 1em !important;
  --lh-h1:     clamp(2.375rem,  1.7132rem + 2.9412vw, 3.25rem);
  --lh-h2:     var(--lh-h1);
  --lh-h3:     clamp(1.8125rem, 0.7772rem + 4.6353vw, 2.6875rem);
  --lh-h4:     clamp(1.5rem,    1.1132rem + 1.7647vw, 1.8125rem);
  --lh-h5:     clamp(1.25rem,  -0.2896rem + 3.7176vw, 2.625rem);
  --lh-p:      clamp(1.5rem,    1.2691rem + 1.2353vw, 1.875rem);

  /* Aspect Ratios */
  --ratio-hero-desktop: 16 / 10;
  --ratio-landscape:    5 / 3.5;
  --ratio-portrait:     4 / 5;
  --ratio-square:       1 / 1;

  /* Fluid Padding – Viewport-Grenzen */
  --vw-min:   360;
  --vw-max:   1300;
  --vw-range: calc(var(--vw-max) - var(--vw-min));

  /* Vertical Padding (12 → 16 px) */
  --pad-y-min:   12;
  --pad-y-max:   12;
  --pad-y-range: calc(var(--pad-y-max) - var(--pad-y-min));
  --pad-y-fluid: calc(
    var(--pad-y-min) * 1px +
    var(--pad-y-range) * ((100vw - var(--vw-min) * 1px) / var(--vw-range))
  );

  /* Horizontal Padding (20 → 24 px) */
  --pad-x-min:   20;
  --pad-x-max:   24;
  --pad-x-range: calc(var(--pad-x-max) - var(--pad-x-min));
  --pad-x-fluid: calc(
    var(--pad-x-min) * 1px +
    var(--pad-x-range) * ((100vw - var(--vw-min) * 1px) / var(--vw-range))
  );

  /* Colors */
  --color-white:  #ffffff;
  --color-body:   #1b1c1c;
  --color-green:  #52A15C;
  --color-yellow: #FFF064;
  --color-grey:   #f1f1f1;
  --color-red:    #CC252C;
  --color-purple: #4d4074;
}


/* ==========================================
   2. VIEW TRANSITION
   ========================================== */

@view-transition {
  navigation: auto !important;
}


/* ==========================================
   3. RESET & GLOBAL DEFAULTS
   ========================================== */

html,
body {
  background: white;
  margin: 0;
  padding: 0;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* Hyphenation nur für Mobile (wird in MQ aktiviert) */
p {
  hyphens: auto;
  -webkit-hyphens: auto;
  margin-top: 0;
  overflow-wrap: break-word;
}
p:last-child {
  margin-bottom: 0;
}

h1,
h2,
h3,
h4,
h5 {
  margin: 2rem 0 1.2rem 0;
  text-wrap: balance;
}
h1:first-of-type,
h2:first-of-type,
h3:first-of-type,
h4:first-of-type,
h5:first-of-type {
	margin-top: 0;
}

ol {
  margin: 0;
  padding: 0;
}

ul,
li {
  list-style-type: none;
}

button {
  cursor: pointer;
}

textarea {
  border-radius: 24px !important;
  min-height: 200px !important;
	box-shadow: inset 0 2px 10px -5px rgba(0, 0, 0, 0.2) !important;
}

select {
  border: none !important;
	box-shadow: inset 0 2px 10px -5px rgba(0, 0, 0, 0.2)!important;
}

ins {
  text-decoration: none;
}

a[href^="tel:"],
a[href^="mailto:"] {
  white-space: nowrap;
}

*:focus-visible {
  outline: none !important;
}

/* Autofill */
input:-webkit-autofill {
  -webkit-box-shadow: #FFF064 0px 0px 0px 1000px inset;
}

::placeholder,
::-webkit-input-placeholder {
  color: grey;
  opacity: 1;
}


/* ==========================================
   4. TYPOGRAPHY – LINKS & NAVIGATION
   ========================================== */

header a,
footer a {
  text-decoration: none;
}

footer img,
header img {
  border-radius: 0 !important;
}

header .elementor-button:first-child {
  border: none !important;
}

header .elementor-nav-menu .menu-item.current-page-ancestor > a.elementor-item,
header .elementor-nav-menu .menu-item.current-menu-item > a.elementor-item,
header body.single-product .elementor-nav-menu a[href*="/shop/"] {
  box-shadow: inset 0 -0.167em 0 var(--color-body);
}

.elementor-38832 .elementor-element.elementor-element-4a10ef4 .e--pointer-underline .elementor-item::after {
  height: 0.167em !important;
}

header .elementor-nav-menu {
	font-weight: bold!important;
}
.ctacopytext {
	color: var(--color-white);
}


/* ==========================================
   5. IMAGE RATIOS & WRAPPERS
   ========================================== */

.hero,
.landscape,
.portrait,
.square {
  align-items: center;
  border-radius: var(--img-radius);
  display: flex;
  justify-content: center;
  overflow: hidden;
}

.hero img,
.landscape img,
.portrait img,
.square img {
  aspect-ratio: var(--ratio, 1 / 1);
  border-radius: var(--img-radius);
  height: auto;
  object-fit: cover;
  object-position: center;
  width: 100%;
}

.hero img      { --ratio: var(--ratio-hero); }
.landscape img { --ratio: var(--ratio-landscape); }
.portrait img  { --ratio: var(--ratio-portrait); }
.square img    { --ratio: var(--ratio-square); }

/* German Market Produktbild */
.german-market-product-image {
  margin-bottom: 10px;
  margin-right: 12px;
}

.german-market-product-image img,
.german-market-product-image img:hover {
  aspect-ratio: var(--ratio, 1 / 1);
  border-radius: 12px;
  height: auto;
  object-fit: cover;
  object-position: center;
  width: 64px;
}

/* Produktbild-Hover (Loop) */
.bb-product-image-wrapper a {
  display: block;
  position: relative;
}

.bb-product-image-wrapper a img {
  display: block;
  height: auto;
  transition: opacity 0.32s ease;
  width: 100%;
}

.bb-product-image-wrapper a img.bb-hover-image {
  height: 100%;
  inset: 0;
  object-fit: cover;
  opacity: 0;
  position: absolute;
  width: 100%;
  z-index: 0;
}

/* Bildwechsel nur auf Geräten mit echtem Hover (Maus/Trackpad) UND ausreichend Platz.
   Auf Touch-Geräten (Smartphone) bleibt das Hauptbild stehen; Antippen führt ganz
   regulär über den umgebenden Link (a) zur Produktseite, ohne Zwischenschritt. */
@media (hover: hover) and (min-width: 769px) {
  .bb-product-image-wrapper a:hover img.bb-hover-image {
    opacity: 1;
  }

  .bb-product-image-wrapper a:hover img:not(.bb-hover-image) {
    opacity: 0;
  }
}

/* Galerie */
.woocommerce-product-gallery__image {
  border-radius: 24px;
  overflow: hidden;
}

.woocommerce-product-gallery .flex-control-thumbs li img {
  border-radius: 12px;
}

.woocommerce-product-gallery .flex-direction-nav .flex-prev {
  left: 12px;
}

.woocommerce-product-gallery .flex-direction-nav .flex-next {
  margin-right: 12px;
}

.woocommerce-product-gallery__trigger {
  display: none;
}


/* ==========================================
   6. ELEMENTOR – CORE OVERRIDES
   ========================================== */

.e-con > .e-con-inner > .elementor-widget {
  padding: 0 !important;
}

.elementor-button-submit.is-sending {
  cursor: not-allowed;
  opacity: 0.65;
  pointer-events: none;
}

.elementor-headline-text-wrapper {
  text-align: center !important;
  width: 100% !important;
}

/* Swiper / Loop Carousel */
.elementor-widget-loop-carousel .swiper-pagination-bullets {
  background: #fff;
  border-radius: 40px;
  padding: 0.8em 0.6em;
}

.swiper-pagination-bullet        { opacity: 0.14; }
.swiper-pagination-bullet-active { opacity: 1; }

.elementor .swiper-pagination {
  left: 50% !important;
  width: auto !important;
}

/* [bb_product_gallery] – einfache Produktbilder-Galerie (siehe functions.php) */
.bb-product-gallery {
  position: relative;
  max-width: 100%;
  overflow: hidden;
  border-radius: 24px;
}
.bb-product-gallery .swiper-slide img {
  display: block;
  width: 100%;
  height: auto;
}
.bb-product-gallery .swiper-pagination {
  position: static;
  margin-top: 1.4em;
  --swiper-pagination-size: 12px;
}
.bb-product-gallery .swiper-pagination-bullet {
  width: var(--swiper-pagination-size);
  height: var(--swiper-pagination-size);
}

/* Mobile: Punkte etwas kleiner und mit mehr Abstand zum Bild (analog Elementor-
   Werte aus den Loop-Carousel-Widgets: Desktop 12px Punkte, Mobile 10px). */
@media (max-width: 768px) {
  .bb-product-gallery .swiper-pagination {
    margin-top: 2em;
    --swiper-pagination-size: 10px;
  }
}

/* Select-Wrapper: nativen Arrow & Icon ausblenden */
.elementor-select-wrapper::before {
  content: none !important;
  display: none !important;
}

.elementor-select-wrapper i,
.elementor-select-wrapper svg {
  display: none !important;
}

.elementor-select-wrapper select {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background: var(--color-grey) url("/wp-content/uploads/arrow-bottom.svg") no-repeat right 20px center !important;
  background-size: 1.2rem !important;
  padding-right: 4rem !important;
}

.elementor-select-wrapper select::-ms-expand {
  display: none !important;
}

/* Menu Cart */
.elementor-menu-cart__product-remove {
  bottom: 0 !important;
  left: auto !important;
  right: 3px;
}

.elementor-menu-cart__subtotal {
  padding: 2em 0 0.8em;
}

.elementor-menu-cart__product-image img {
  border-radius: 12px !important;
}

.elementor-menu-cart__product-price ins .woocommerce-Price-amount.amount bdi {
  color: var(--color-green);
  font-size: 1.1rem;
  font-weight: 700;
  line-height: var(--lh-p);
  margin-left: 0.1em;
}

.elementor-menu-cart__product-price .wgm-info {
  display: none;
}

#elementor-menu-cart__toggle_button {
  padding: 0;
}

.elementor-button--checkout {
  line-height: var(--lh-button) !important;
}

/* Frosted-Glass */
.frosted {
  -webkit-backdrop-filter: blur(12px) saturate(180%);
  backdrop-filter: blur(12px) saturate(180%);
}

.danke.frosted           { display: none; }
.danke.frosted.is-visible { display: flex !important; }
.anmeldung.is-hidden      { display: none !important; }

/* Genuss-Slider */
.genuss-slider {
  mask-image: linear-gradient(to right,
    transparent 0,
    black 20%,
    black 80%,
    transparent 100%
  );
}

.elementor-sticky:has(.category-sc-nav) {
  width: fit-content;
  max-width: 100%;
}


/* BioBalkan – Discount-Badge als Reiter hinter dem Add-to-Cart-Button */
/* FOUC-Guard: Badge bleibt unsichtbar, bis bb-discount-tab.js ihn ins
   form.cart verschoben und die Klasse bb-has-discount-tab gesetzt hat.
   Verhindert das kurze Aufblitzen der alten Pille beim Seitenaufbau. */
.elementor-widget-wc-add-to-cart .wdm-discount {
	visibility: hidden;
}
.elementor-widget-wc-add-to-cart form.cart.bb-has-discount-tab .wdm-discount,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .wdm-discount {
	visibility: visible;
}
.elementor-widget-wc-add-to-cart form.cart.bb-has-discount-tab,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab {
	position: relative;
	overflow: visible;
}
.elementor-widget-wc-add-to-cart form.cart.bb-has-discount-tab .single_add_to_cart_button,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button {
	position: relative;
	z-index: 2;
}
.elementor-widget-wc-add-to-cart form.cart.bb-has-discount-tab .wdm-discount,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .wdm-discount {
	position: absolute;
	left: calc(150px + 10px);
	right: 0;
	bottom: 50%;
	margin: 0;
	z-index: 1;
	pointer-events: none;
	line-height: 0;
}
.elementor-widget-wc-add-to-cart form.cart.bb-has-discount-tab .wdm-discount > *,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .wdm-discount > * {
	display: inline-block;
	margin: 0;
	box-sizing: border-box;
	text-align: left;
	white-space: nowrap;
	line-height: 1;
	font-size: 1rem;
	color: var(--color-body);
	background: var(--color-yellow);
	border-radius: 18px 18px 0 0;
	padding: 10px 16px 36px 16px;
}
/* Variable Produkte: Badge rechtsbündig mit dem Button abschließen */
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .wdm-discount {
	left: auto;
	display: flex;
	justify-content: flex-end;
}
/* Variable Produkte: deaktivierten Button voll deckend halten, damit der
   gelbe Badge nicht durch den (sonst halbtransparenten) Button scheint. */
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.disabled,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.wc-variation-selection-needed {
	opacity: 1;
	background: rgb(236, 236, 236);
}
/* Variable Produkte: Text des deaktivierten Buttons grau (am Span, da
   Elementor die Farbe dort setzt). */
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.disabled,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.disabled .elementor-button-text,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.wc-variation-selection-needed,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.wc-variation-selection-needed .elementor-button-text {
	color: rgb(176, 176, 176);
}
/* Variable Produkte: Icon des deaktivierten Buttons grau. */
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.disabled svg path,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.disabled svg line,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.disabled svg circle,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.wc-variation-selection-needed svg path,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.wc-variation-selection-needed svg line,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.wc-variation-selection-needed svg circle,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.disabled .elementor-button-icon i,
.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .single_add_to_cart_button.wc-variation-selection-needed .elementor-button-icon i {
	stroke: rgb(176, 176, 176);
	color: rgb(176, 176, 176);
}
@media (max-width: 480px) {
	.elementor-widget-wc-add-to-cart form.cart.bb-has-discount-tab .wdm-discount > *,
	.elementor-widget-wc-add-to-cart .woocommerce-variation-add-to-cart.bb-has-discount-tab .wdm-discount > * {
		font-size: 13px;
		padding: 8px 13px 32px 13px;
		border-radius: 16px 16px 0 0;
	}
}

.elementor-widget-animated-headline .elementor-headline{overflow:hidden !important;}
.elementor-widget-animated-headline .elementor-headline-dynamic-wrapper{overflow:hidden !important;max-width:100% !important;}
.elementor-widget-animated-headline .elementor-headline-dynamic-text{white-space:nowrap !important;}


/* ==========================================
   7. BUTTONS & INTERACTIVE ELEMENTS
   ========================================== */

.button {
  background: transparent;
  border: 1px solid var(--color-body);
  color: var(--color-body);
  font-size: var(--fs-button) !important;
  line-height: var(--lh-button);
}

.button[disabled],
.button.disabled,
.button.loading {
  background: transparent;
  font-size: var(--fs-button);
  padding:
    clamp(var(--pad-y-min)*1px, var(--pad-y-fluid), var(--pad-y-max)*1px)
    clamp(var(--pad-x-min)*1px, var(--pad-x-fluid), var(--pad-x-max)*1px);
}

.bb-loop-btn a {
	display: inline-block;
  border: 1px solid;
  border-radius: 60px;
	color: var(--color-body) !important;
  padding:
    clamp(var(--pad-y-min)*1px, var(--pad-y-fluid), var(--pad-y-max)*1px) clamp(var(--pad-x-min)*1px, var(--pad-x-fluid), var(--pad-x-max)*1px) clamp(var(--pad-y-min)*1px, var(--pad-y-fluid), var(--pad-y-max)*1px) clamp(var(--pad-x-min)*1px, var(--pad-x-fluid), var(--pad-x-max)*1px);
}

.bb-loop-btn.bb-loading {
  opacity: 0.4;
  pointer-events: none;
}

/* Checkout-Button */
.biobalkan-placeorder {
  float: inherit !important;
  margin-top: 0 !important;
  width: 100% !important;
}

.biobalkan-goback {
  display: none;
}

.bb-order-detail__back {
	margin-bottom: 2em!important;
	font-size: var(--fs-button)!important;
}
.bb-account-section-label {
	margin-bottom: 1.2em!important;
}

/* Grüne Füllanimation im Hinzufügen-Button (wächst links -> rechts während
   des Requests, siehe wp_footer-Skript in functions.php). !important auf
   overflow:hidden nötig, da Elementor/WooCommerce-Basisstile hier sonst mit
   höherer Spezifität overflow:visible erzwingen (führte zu eckigen Ecken
   trotz border-radius). border-radius:inherit auf der Füllung selbst als
   zusätzliche Absicherung, falls overflow aus anderem Grund nicht greift.
   Icon und Text bleiben während der gesamten Animation sichtbar (Text
   ändert sich nicht, zeigt weiterhin "Hinzufügen" bis "Erledigt"). */
.single_add_to_cart_button.bb-adding,
.add_to_cart_button.bb-adding,
.bb-add-to-cart.bb-adding,
.single_add_to_cart_button.bb-added,
.add_to_cart_button.bb-added,
.bb-add-to-cart.bb-added {
    position: relative !important;
    overflow: hidden !important;
    pointer-events: none;
    cursor: default;
}
.single_add_to_cart_button.bb-adding::before,
.add_to_cart_button.bb-adding::before,
.bb-add-to-cart.bb-adding::before,
.single_add_to_cart_button.bb-added::before,
.add_to_cart_button.bb-added::before,
.bb-add-to-cart.bb-added::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: var(--bb-fill, 0%);
    background: linear-gradient(135deg, #3e7945 0%, #86bd8d 100%);
    z-index: 0;
    border-radius: inherit;
    transition: width 0.15s linear;
}
.single_add_to_cart_button.bb-added::before,
.add_to_cart_button.bb-added::before,
.bb-add-to-cart.bb-added::before {
    transition: width 0.2s ease-out;
}
.single_add_to_cart_button.bb-adding .elementor-button-content-wrapper,
.single_add_to_cart_button.bb-added .elementor-button-content-wrapper {
    position: relative;
    z-index: 1;
}
/* Textfarbe explizit auf Weiß erzwingen: der Grundzustand nutzt ein helles
   Grau (rgb(176,176,176)), das auf dem grünen Füllverlauf kaum lesbar ist. */
.single_add_to_cart_button.bb-adding .elementor-button-text,
.single_add_to_cart_button.bb-added .elementor-button-text,
.single_add_to_cart_button.bb-adding .elementor-button-icon,
.single_add_to_cart_button.bb-added .elementor-button-icon {
    color: #fff !important;
}
.single_add_to_cart_button.bb-adding .elementor-button-icon i,
.single_add_to_cart_button.bb-added .elementor-button-icon i {
    color: #fff !important;
}
.bb-add-to-cart.bb-adding,
.bb-add-to-cart.bb-added {
    color: #fff;
}
/* Loop-Button (Shop-Übersicht, Shortcode [bb_loop_buy_button]): Text liegt
   in einem <span class="bb-add-to-cart-label"> (siehe bb-side-cart.php),
   damit er zuverlässig über der ::before-Füllanimation liegt (ein reiner
   Textknoten hätte keinen eigenen Stacking-Context). */
.bb-add-to-cart-label {
    position: relative;
    z-index: 1;
}

/* Loop-Button auf 100% Breite der Elementor-Loop-Grid-Zelle, mit
   Warenkorb-Icon (Inline-SVG, siehe bb-side-cart.php) vor dem Text.
   display:flex statt inline-block, damit Icon und Text zentriert
   nebeneinander liegen, auch über die volle Breite. */
.bb-btn.bb-add-to-cart {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.bb-btn-cart-icon {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    width: 18px;
    height: 18px;
}

.single_add_to_cart_button svg,
.add_to_cart_button svg {
    width: 20px;
    height: auto;
}
.single_add_to_cart_button svg path,
.single_add_to_cart_button svg line,
.single_add_to_cart_button svg circle,
.add_to_cart_button svg path,
.add_to_cart_button svg line,
.add_to_cart_button svg circle {
    stroke: #fff;
}

.single_add_to_cart_button .elementor-button-text,
.add_to_cart_button .elementor-button-text {
    font-weight: normal;
}

.e-loop-item .elementor-widget-shortcode:has(.elementor-shortcode:empty) {
    display: none;
}
.widerruf-button a {
	margin-top: .4em!important;
	background: var(--color-body)!important;
	border-radius: 40px;
	padding: 12px 16px!important;
	font-size: var(--fs-button-s)!important;
	line-height: var(--lh-button)!important;
	display: inline-block!important;
	color: var(--color-grey)!important;
	opacity: 1;
}
.widerruf-button a:hover {
	opacity: .8;
}



/* ==========================================
   8. RADIO, CHECKBOX & INPUTS
   ========================================== */

input[type="checkbox"],
input[type="radio"] {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  border: none !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  display: inline-block !important;
  flex: 0 0 20px !important;
  height: 20px !important;
  line-height: 20px !important;
  margin-right: 12px !important;
  max-height: 20px !important;
  max-width: 20px !important;
  min-height: 20px !important;
  min-width: 20px !important;
  padding: 0 !important;
  position: relative;
  vertical-align: middle !important;
  width: 20px !important;
}

input[type="checkbox"]:checked,
input[type="radio"]:checked {
  background-color: var(--color-body) !important;
}

input[type="checkbox"]::after,
input[type="radio"]::after {
  border: solid #fff;
  border-width: 0 2px 2px 0;
  content: "";
  height: 10px;
  left: 50%;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -60%) rotate(45deg);
  width: 5px;
}

input[type="checkbox"]:checked::after,
input[type="radio"]:checked::after {
  opacity: 1;
}

input#rememberme {
  margin-right: 0.4em !important;
  vertical-align: middle;
}

#use_gift_card_balance,
#use_gift_card_balance:checked {
  top: -1px;
}

/* Select2 */
.select2-search--dropdown {
  display: none;
}

ul.select2-results__options > li.select2-results__option {
  padding: 0.5em 0.8em;
}

.select2-container--default .select2-selection--single {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  align-items: center !important;
  background: var(--color-grey) url("/wp-content/uploads/arrow-bottom.svg") no-repeat right 20px center !important;
  background-size: 1.2rem !important;
  border: none !important;
  border-radius: 60px !important;
  box-sizing: border-box !important;
  display: flex !important;
  height: 54px !important;
  padding: 16px 4rem 16px 24px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  display: none !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: inherit;
  font-size: var(--fs-p);
  line-height: var(--lh-p) !important;
  padding: 0 !important;
}

.select2-container--default .select2-dropdown {
  border: none !important;
  border-radius: 20px !important;
  box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.4);
  font-family: "GT Cinetype", sans-serif;
  font-size: var(--fs-p);
  overflow: hidden;
}

.select2-results__option {
  font-family: "GT Cinetype", sans-serif !important;
  font-size: var(--fs-p) !important;
  padding: 8px 24px !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected] {
  background-color: #000 !important;
  color: #fff !important;
}

.select2-container--default .select2-results__option[aria-selected="true"],
.select2-container--default .select2-results__option[data-selected="true"] {
  background-color: #000 !important;
  color: #fff !important;
}

/* Native Select Options */
select option:disabled {
  color: #999 !important;
}

select option[disabled] {
  background: #f1f1f1;
}

/* Quantity */
.quantity .qty,
.qty {
  padding: 0 !important;
}

.optional { display: none; }

.woocommerce form .form-row .country_to_state--single {
	border-radius: 40px!important;
}


/* ==========================================
   9. WOOCOMMERCE NOTIFICATIONS
   ========================================== */

.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
  background: none!important;
	margin: 0 0 2rem 0;
	padding: 0;
	border: none;
}
.woocommerce-message a,
.woocommerce-error a,
.woocommerce-info a {
  color: var(--color-body);
	text-decoration: underline;
	text-underline-offset: 4px;
	background: var(--color-yellow);
	padding: .2em .4em;
	margin-bottom: .2em;
	display: inline-block;
	border-radius: 4px;
}


/* ==========================================
   10. WOOCOMMERCE – PREISE & VARIATIONS
   ========================================== */

.price {
  margin: 0 !important;
}

.price ins,
.price ins *,
.elementor-widget-heading ins,
.elementor-widget-heading ins * {
  color: var(--color-green);
  font-size: 1.6rem;
  font-weight: 700;
  line-height: var(--lh-h4);
  margin-left: 0.12em;
  text-decoration: none;
}

/* Preis-Hochstellung + Pinselstrich-Highlight (nativ, siehe bb_highlight_price_html() in functions.php) */
.bb-price-decimals {
  font-size: 0.68em;
  font-weight: 700;
  vertical-align: super;
  position: relative;
  top: 0.16em;
  margin-left: -2px;
}

.elementor-widget-heading:has(.woocommerce-Price-amount) {
  border-bottom: none !important;
}

.bb-price-highlight-wrap {
  position: relative;
  display: inline-block;
  padding: 3px 6px 8px 6px;
  line-height: 1;
  z-index: 0;
  color: #1b1c1c !important;
}
.bb-price-highlight-wrap .woocommerce-Price-amount {
  color: #1b1c1c !important;
}
.bb-price-highlight-wrap .bb-price-decimals {
  color: #1b1c1c !important;
}
.bb-price-highlight-wrap::before {
  content: "";
  position: absolute;
  left: -8px;
  right: -6px;
  top: 0px;
  bottom: 0px;
  background: #E6D200;
  z-index: -2;
  border-radius: 255px 26px 235px 20px / 20px 235px 26px 255px;
  transform: rotate(-2deg);
}
.bb-price-highlight-wrap::after {
  content: "";
  position: absolute;
  left: -4px;
  right: -8px;
  top: -3px;
  bottom: 3px;
  background: var(--color-yellow);
  z-index: -1;
  border-radius: 23px 240px 28px 250px / 240px 28px 250px 23px;
  transform: rotate(1.5deg);
  opacity: 0.9;
}

/* "Ab"-Präfix von German Market (.german-market-from-price-prefix) ist ein eigenes
   Geschwister-Element vor unserem Wrapper, kein Teil des von uns gefilterten
   price_html. Statt German Market anzufassen, ziehen wir den Blob-Hintergrund in
   diesem Fall auf den gemeinsamen Elterncontainer (p.price), sodass "Ab" optisch
   mit im Highlight sitzt, und deaktivieren daür den Blob am inneren Wrapper. */
p.price:has(.german-market-from-price-prefix) {
  position: relative;
  display: inline-block;
  padding: 3px 6px 8px 6px;
  z-index: 0;
}
p.price:has(.german-market-from-price-prefix)::before {
  content: "";
  position: absolute;
  left: -8px;
  right: -6px;
  top: 0px;
  bottom: 0px;
  background: #E6D200;
  z-index: -2;
  border-radius: 255px 26px 235px 20px / 20px 235px 26px 255px;
  transform: rotate(-2deg);
}
p.price:has(.german-market-from-price-prefix)::after {
  content: "";
  position: absolute;
  left: -4px;
  right: -8px;
  top: -3px;
  bottom: 3px;
  background: var(--color-yellow);
  z-index: -1;
  border-radius: 23px 240px 28px 250px / 240px 28px 250px 23px;
  transform: rotate(1.5deg);
  opacity: 0.9;
}
p.price:has(.german-market-from-price-prefix) .german-market-from-price-prefix,
p.price:has(.german-market-from-price-prefix) .bb-price-highlight-wrap {
  color: #1b1c1c !important;
}
/* Inneren Wrapper-Blob deaktivieren, wenn der äußere p.price bereits den Hintergrund trägt */
p.price:has(.german-market-from-price-prefix) .bb-price-highlight-wrap {
  padding: 0;
  line-height: inherit;
}
p.price:has(.german-market-from-price-prefix) .bb-price-highlight-wrap::before,
p.price:has(.german-market-from-price-prefix) .bb-price-highlight-wrap::after {
  content: none;
}

/* "Neu"-Bild im Elementor-Loop: Widget bekommt in Elementor die Klasse .bb-new-image.
   Default: versteckt. Die tatsächliche Sichtbarkeit wird per JS gesteuert (siehe
   bb-new-image-visibility-script in functions.php) - reines CSS über einen
   Nachfahren-Selektor wie ".bb-product-new .bb-new-image" reicht hier NICHT aus,
   da auf der Produkt-Einzelseite .product-Elemente verschachtelt vorkommen
   (Hauptprodukt umschließt das "Ähnliche Produkte"-Karussell) und CSS keinen
   "nächstgelegenen" Vorfahren von mehreren gleicher Klasse unterscheiden kann. */
.bb-new-image {
  display: none;
}

del .woocommerce-Price-amount {
  display: inline-block;
  position: relative;
  text-decoration: none;
}

del .woocommerce-Price-amount::after {
  background: black;
  content: "";
  height: 3px;
  left: -5%;
  position: absolute;
  top: 40%;
  transform: rotate(-4deg);
  transform-origin: center;
  width: 110%;
}

.includes_tax,
.wgm-tax {
  font-size: var(--fs-small);
  line-height: 1.2rem;
  max-width: 12ch;
}

td .wgm-tax {
  display: block;
  margin-left: auto;
  text-align: right;
}

br.wgm-break {
  display: none;
}

/* Product Title */
.product .summary .product_title,
.woocommerce-loop-product__title {
  font-size: var(--fs-h3);
  font-weight: bold;
  line-height: var(--lh-h3);
}

.product .summary .price {
  padding: 0.4em 0 1em;
}

.product .summary .price .amount {
  color: inherit;
  font-size: var(--fs-h4);
  font-weight: bold;
  line-height: var(--lh-h4);
}

/* Variation Selects */
.variations {
  margin: 0 0 1rem !important;
  width: 100%;
}

.variations tbody,
.variations tr,
.variations td {
  display: block;
  margin: 0 !important;
  padding: 0 !important;
  width: 100%;
}

.variations select {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background:
    var(--color-grey)
    url("/wp-content/uploads/arrow-bottom.svg")
    no-repeat right 20px center !important;
  background-size: 18px !important;
  border-radius: 24px !important;
  font-family: "GT Cinetype", sans-serif;
  font-size: var(--fs-button) !important;
  padding:
    clamp(var(--pad-y-min)*1px, var(--pad-y-fluid), var(--pad-y-max)*1px)
    56px
    clamp(var(--pad-y-min)*1px, var(--pad-y-fluid), var(--pad-y-max)*1px)
    clamp(var(--pad-x-min)*1px, var(--pad-x-fluid), var(--pad-x-max)*1px) !important;
  width: 100% !important;
	margin-bottom: .4em;
}

.variations th.label,
.reset_variations,
.product .single_variation {
  display: none !important;
}

/* Woo Variations Radio (woovr) */
.woovr-variation * {
  cursor: pointer;
  font-weight: normal;
}

.woovr-variations[class*="woovr-variations-grid"] .woovr-variation {
  flex: 0 0 auto;
  margin: 0 0.32em 1em;
  width: auto !important;
}

.woovr-variation-info {
  display: flex;
  padding-left: 0.6em !important;
}

.woovr-variation-price { display: none !important; }

.woovr-variation::after,
.woovr-variation::before {
  display: none !important;
}

.woovr-variation {
  background-color: var(--color-grey) !important;
  border: 2px solid transparent !important;
  border-radius: 40px;
  color: var(--color-body);
  opacity: 0.8;
}

.woovr-variation:hover,
.woovr-variation.woovr-variation-active {
  border: 2px solid var(--color-body) !important;
  opacity: 1;
}

/* Single Variation */
.product .single_variation div {
  padding-bottom: 0;
}

.product .single_variation {
  background: none;
  font-weight: bold;
  margin: 0 !important;
  padding: 0 !important;
}

.woocommerce-variation-price span {
  font-weight: bold !important;
  padding: 0 !important;
}

/* Out of Stock */
.out-of-stock {
  border-radius: 0.2rem !important;
  font-size: var(--fs-small);
  margin-bottom: 0.2em !important;
}

.bb-oos      { display: none; }

.product-box .bb-normal { display: none; }

/* Varianten-Buttons (Eigenbau, ersetzt WPC Variations Radio Buttons Plugin) */
.bb-variation-radio-wrap select {
  display: none;
}

.bb-variation-radio-row {
  align-items: stretch;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
}

/* Strukturelle Standard-Abstände (Elementor-Widget-Margin & Table-Margin)
   nur bei aktiven Varianten-Buttons auf max. 12px reduzieren */
body.bb-variation-radio-active .elementor-widget-wc-add-to-cart {
  margin-top: 24px !important;
}

body.bb-variation-radio-active table.variations {
  margin-bottom: 12px !important;
}

/* Preis-Schriftgröße: Clamp-Minimum von 767px auf 375px verschoben,
   damit der Preis schon ab kleineren Handy-Breiten mitwächst */
body.bb-variation-radio-active .price {
  font-size: clamp(1.5rem, 1.196rem + 1.297vw, 2.25rem) !important;
}

.bb-select-divider-label {
  align-items: center;
  color: rgba(27, 28, 28, 0.4);
  display: flex;
  font-size: 1rem;
  gap: 12px;
  margin-bottom: 8px;
  white-space: nowrap;
}

.bb-select-divider-label::after {
  border-top: 1px solid #e2e0d8;
  content: '';
  flex: 1 1 auto;
}

.bb-select-divider-bottom {
  border-top: 1px solid #e2e0d8;
  /* Abstand Trennlinie -> +/-Box/Hinzufügen-Button reduziert (Bio Trio Feedback) */
  margin-bottom: 6px;
  /* Abstand Selectbox -> Trennlinie reduziert (Bio Trio Feedback) */
  margin-top: 12px;
  position: relative;
}

body.bb-select-divider-active .elementor-widget-wc-add-to-cart {
  margin-top: 12px !important;
}

.bb-select-divider-gap {
  background: #fff;
  height: 9px;
  position: absolute;
  right: 0;
  top: -4px;
  width: 12px;
}

table.variations select {
  border-radius: 60px !important;
  height: 54px !important;
}

.bb-variation-radio-label {
  align-items: center;
  color: rgba(27, 28, 28, 0.4);
  display: flex;
  font-size: 1rem;
  gap: 12px;
  white-space: nowrap;
}

.bb-variation-radio-label::after {
  border-top: 1px solid #e2e0d8;
  content: '';
  flex: 1 1 auto;
}

.bb-variation-radio-divider {
  border-top: 1px solid #e2e0d8;
  margin-bottom: 4px;
  margin-top: 18px;
  position: relative;
  width: 100%;
}

@media (max-width: 480px) {
  .bb-variation-radio-divider {
    margin-bottom: 0;
  }

  .biobalkan-base-price {
    font-size: 1rem !important;
  }

  /* Preis auf Smartphone steiler wachsen lassen: 24px bei 375px bis 30px bei 480px */
  body.bb-variation-radio-active .price {
    font-size: clamp(1.5rem, 0.1607rem + 5.714vw, 1.875rem) !important;
  }

  /* Mengenfeld (-1+) auf Smartphone um 20% schmäler (150px -> 120px), Inhalte proportional verkleinert */
  body.single-product form.cart .quantity,
  body.single-product .woocommerce-variation-add-to-cart .quantity {
    width: 120px !important;
    min-width: 120px !important;
    max-width: 120px !important;
  }

  body.single-product form.cart .quantity button,
  body.single-product .woocommerce-variation-add-to-cart .quantity button {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    flex: 0 0 42px !important;
  }

  body.single-product form.cart .quantity input.qty,
  body.single-product .woocommerce-variation-add-to-cart .quantity input.qty {
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    flex: 0 0 36px !important;
  }
}

.bb-variation-radio-divider-gap {
  background: #fff;
  height: 9px;
  position: absolute;
  right: 163px;
  top: -4px;
  width: 12px;
}

.bb-variation-radio {
  display: flex;
  gap: 8px;
  margin-top: 6px;
}

.bb-variation-radio-item {
  align-items: center;
  background: rgb(236, 236, 236);
  border-radius: 60px;
  box-shadow: inset 0 2px 10px -5px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  color: var(--color-body);
  cursor: pointer;
  display: inline-flex;
  font-size: 1.18rem;
  font-weight: 400;
  height: 54px;
  justify-content: center;
  line-height: 30px;
  padding: 12px 24px;
  white-space: nowrap;
}

.bb-variation-radio-item:not(.bb-active):hover {
  background: rgb(236, 236, 236);
  box-shadow: inset 0 2px 10px -5px rgba(0, 0, 0, 0.2), inset 0 0 0 2px var(--color-body);
}

.bb-variation-radio-item.bb-active {
  background: rgb(43, 37, 37);
  color: #fff;
}

/* Bulk Discount */
.bm-cheapest-bulk {
  background: var(--color-body);
  border-radius: 60px;
  color: #fff;
  display: inline-block !important;
  font-size: var(--fs-button-s);
  padding: 0 1em 0.1em;
  width: inherit !important;
}

.bm-cheapest-bulk .woocommerce-Price-amount bdi {
  font-size: var(--fs-button-s);
}

.bm-percentual-discount {
  font-weight: normal !important;
  padding-top: 0.2em;
}

/* ------------------------------------------
   Quantity-Selektor – Single-Produkt
   Durchgehende dunkle Pille, weiße fette Zahl,
   gleiche Höhe wie der Hinzufügen-Button.
   Nur die ZAHL poppt beim Klick (Web Animations
   API im Elementor-Snippet); die +/- Buttons
   bleiben bewusst völlig ruhig.
   transition:none verhindert Kollision mit der
   geerbten transition:all von Elementor/Theme.
   (Warenkorb-Variante .bb-qty bleibt unberührt,
   siehe Abschnitt 13.)
   ------------------------------------------ */

body.single-product form.cart .quantity,
body.single-product .woocommerce-variation-add-to-cart .quantity {
  display: inline-flex;
  flex-direction: row;
  align-items: stretch;
  flex-wrap: nowrap;
  flex: 0 0 auto;
  position: relative;
  width: 150px;
  min-width: 150px;
  max-width: 150px;
  height: 53px;
  margin: 0 12px 0 0;
  padding: 0;
  border-radius: 60px;
  overflow: hidden;
  background: var(--color-grey);
  box-shadow: inset 0 2px 10px -5px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  vertical-align: middle;
}

body.single-product form.cart .quantity .screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

body.single-product form.cart .quantity input.qty,
body.single-product .woocommerce-variation-add-to-cart .quantity input.qty {
  -moz-appearance: textfield;
  appearance: textfield;
  box-shadow: none;
  border: 0;
  border-radius: 0;
  outline: none;
  background: transparent !important;
  background-color: transparent !important;
  color: var(--color-body) !important;
  opacity: 1 !important;
  -webkit-text-fill-color: var(--color-body) !important;
  font: inherit;
  font-size: 1.35rem !important;
  font-weight: bold !important;
  text-align: center !important;
  width: 46px !important;
  min-width: 46px !important;
  max-width: 46px !important;
  flex: 0 0 46px !important;
  height: 53px !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 53px !important;
  box-sizing: border-box;
  transform-origin: center center;
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
  transition: none !important;
}

body.single-product form.cart .quantity input.qty::-webkit-outer-spin-button,
body.single-product form.cart .quantity input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

body.single-product form.cart .quantity button,
body.single-product .woocommerce-variation-add-to-cart .quantity button {
  position: static !important;
  transform: none !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 52px !important;
  min-width: 52px !important;
  max-width: 52px !important;
  height: 53px !important;
  flex: 0 0 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--color-body) !important;
  opacity: 1 !important;
  font: inherit !important;
  font-size: 1.8rem !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  touch-action: manipulation !important; /* iOS: kein Double-Tap-Zoom */
  transition: none !important;
}

.single_add_to_cart_button.disabled,
.single_add_to_cart_button:disabled,
.single_add_to_cart_button.wc-variation-selection-needed {
  background: rgb(236, 236, 236) !important;
  box-shadow: none !important;
  color: var(--color-body) !important;
}


/* ==========================================
   11. WOOCOMMERCE – SHOP / PRODUKT-TABS
   ========================================== */

.tabs.wc-tabs {
  border: none;
  display: flex;
  gap: 4px;
  justify-content: left;
  margin: 0 16px 32px;
  overflow: auto hidden;
  padding: 16px 0;
  scrollbar-width: none;
}

.tabs.wc-tabs::-webkit-scrollbar {
  display: none;
}

.tabs.wc-tabs li a {
  border-radius: 60px;
  color: inherit;
  font-size: var(--fs-button);
  line-height: var(--lh-button);
  margin: 0;
  padding:
    clamp(var(--pad-y-min)*1px, var(--pad-y-fluid), var(--pad-y-max)*1px)
    clamp(var(--pad-x-min)*1px, var(--pad-x-fluid), var(--pad-x-max)*1px) !important;
  white-space: nowrap;
}

.tabs.wc-tabs li a:hover,
.tabs.wc-tabs li.active a,
.tabs.wc-tabs li a[aria-selected="true"] {
  background: var(--color-yellow);
  border: none;
}

.woocommerce-tabs h2 {
  font-weight: bold !important;
  padding-bottom: 1.2rem;
}

.woocommerce-Tabs-panel--description > h2:first-of-type {
  display: none;
}

.woocommerce-tabs .tabs li a span {
  background: var(--color-body);
  border-radius: 20px;
  color: #fff;
  font-size: var(--fs-small);
  line-height: var(--lh-button);
  padding: 0.2em 0.4em;
}

.woocommerce-review-link { display: none; }

#gm_fic_nutritional_values {
  font-size: var(--fs-p);
  line-height: var(--lh-p);
}

.gm-fic-nutritional-values {
  margin: 20px 0;
}

.gm-fic-nutritional-values td {
  max-width: 200px;
}

.gm-fic-nutritional-values td:first-child {
  font-weight: bold;
}


/* ============================================================
   BioBalkan – Bewertungen (Alle) Shortcode
   Desktop: 4-spaltig mit Logo | Mobil (<768px): 2-spaltig ohne Logo
   ============================================================ */

.bb-reviews-all {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: 24px;
    row-gap: 48px;
    align-items: start;
    margin: 0;
}

.bb-reviews-all .bb-review-con {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    overflow: hidden;
    padding: 0 !important;
}

/* Bild */
.bb-review-col-img {
    width: 100%;
    padding: 0 !important;
}
.bb-review-col-img .elementor-widget-image {
    padding: 0 !important;
}
.bb-review-col-img img {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

/* Textblock */
.bb-review-col-text {
    width: 100%;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-areas:
        "logo name"
        "logo date"
        "stars stars"
        "text text";
    align-content: start;
    align-items: center;
    column-gap: 10px;
    row-gap: 2px;
    padding: 0 0 0 1.2em;
}
.bb-review-col-text > div:nth-child(1) { grid-area: logo;  align-self: start; }
.bb-review-col-text > div:nth-child(2) { grid-area: name;  align-self: end; }
.bb-review-col-text > div:nth-child(3) { grid-area: date;  justify-self: start; align-self: start; }
.bb-review-col-text > div:nth-child(4) { grid-area: stars; margin-top: 0.6em; }
.bb-review-col-text > div:nth-child(5) { grid-area: text;  font-style: italic; }

.bb-review-col-text > div:nth-child(1) img {
    width: 64px;
    height: auto;
}
.bb-review-col-text .p1 {
    color: #9a9a9a;
}
.bb-review-col-text .review-star {
    width: 24px;
    height: 24px;
    fill: rgb(240, 223, 65);
}
.bb-review-col-text h4,
.bb-review-col-text .p1 {
    margin: 0;
}

/* Weiterlesen-Link: eigene Zeile, linksbündig, kein Umbruch */
.bb-review-more {
    display: block;
    width: 100%;
    text-align: left;
    white-space: nowrap;
    margin-top: 6px;
    font-style: normal;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
}

/* Desktop: etwas mehr Luft zwischen Bild und Logo/Name */
@media (min-width: 768px) {
    .bb-review-col-text {
        padding-top: 14px;
    }
}

/* Smartphone: 2-spaltig, ohne Logo, linksbündig, 1em eingerückt */
@media (max-width: 767px) {
    .bb-reviews-all {
        grid-template-columns: repeat(2, 1fr);
        column-gap: 12px;
        row-gap: 28px;
    }
    .bb-review-col-text {
        grid-template-columns: 1fr;
        grid-template-areas:
            "name"
            "date"
            "stars"
            "text";
        padding-left: 1em;
        justify-items: start;
    }
    .bb-review-col-text > div:nth-child(1) {
        display: none;
    }
    .bb-review-col-text > div:nth-child(2),
    .bb-review-col-text > div:nth-child(3) {
        align-self: auto;
    }
    .bb-review-col-text .review-star {
        width: 16px;
        height: 16px;
    }
}


/* ==========================================
   12. WOOCOMMERCE – BEWERTUNGEN
   ========================================== */

/* Sterne-Rating */
.woocommerce .star-rating::before {
  content: "";
}

.star-rating {
  display: inline-block;
  height: 24px;
  margin-top: -2px !important;
  overflow: hidden;
  position: relative;
  width: 120px !important;
}

.star-rating span {
  color: transparent !important;
  display: block;
  font-size: 0 !important;
  height: 100%;
  left: 0;
  overflow: hidden;
  padding-top: 0 !important;
  position: absolute;
  top: 0;
}

/* Graue Sterne (Hintergrund) */
.star-rating::before {
  background-color: #efefef;
  content: "";
  inset: 0;
  mask-image: url('/wp-content/uploads/rating-star.svg');
  mask-repeat: repeat-x;
  mask-size: 24px 20px;
  -webkit-mask-image: url('/wp-content/uploads/rating-star.svg');
  -webkit-mask-repeat: repeat-x;
  -webkit-mask-size: 24px 20px;
  position: absolute;
}

/* Gelbe Sterne (Clipping via span-Breite) */
.star-rating span::before {
  background-color: var(--color-yellow);
  content: "";
  inset: 0;
  mask-image: url('/wp-content/uploads/rating-star.svg');
  mask-repeat: repeat-x;
  mask-size: 24px 20px;
  -webkit-mask-image: url('/wp-content/uploads/rating-star.svg');
  -webkit-mask-repeat: repeat-x;
  -webkit-mask-size: 24px 20px;
  position: absolute;
}

/* Bewertungs-Formular Sterne */
#review_form .comment-form-rating .stars a {
  background-color: #efefef;
  cursor: pointer;
  display: inline-block;
  font-size: 0;
  height: 24px;
  mask: url('/wp-content/uploads/rating-star.svg') center/28px no-repeat;
  -webkit-mask: url('/wp-content/uploads/rating-star.svg') center/28px no-repeat;
  text-indent: -9999px;
  width: 28px;
}

#review_form .comment-form-rating .stars a::before {
  content: "" !important;
}

/* Grundzustand neutralisieren */
#review_form .comment-form-rating .stars a:hover,
#review_form .comment-form-rating .stars a:hover ~ a,
#review_form .comment-form-rating .stars.selected a,
#review_form .comment-form-rating .stars.selected a.active,
#review_form .comment-form-rating .stars.selected a.active ~ a {
  background-color: #efefef !important;
}

/* Hover-Zustände */
#review_form .comment-form-rating .stars:has(a.star-1:hover) a.star-1,
#review_form .comment-form-rating .stars:has(a.star-2:hover) a.star-1,
#review_form .comment-form-rating .stars:has(a.star-2:hover) a.star-2,
#review_form .comment-form-rating .stars:has(a.star-3:hover) a.star-1,
#review_form .comment-form-rating .stars:has(a.star-3:hover) a.star-2,
#review_form .comment-form-rating .stars:has(a.star-3:hover) a.star-3,
#review_form .comment-form-rating .stars:has(a.star-4:hover) a.star-1,
#review_form .comment-form-rating .stars:has(a.star-4:hover) a.star-2,
#review_form .comment-form-rating .stars:has(a.star-4:hover) a.star-3,
#review_form .comment-form-rating .stars:has(a.star-4:hover) a.star-4,
#review_form .comment-form-rating .stars:has(a.star-5:hover) a.star-1,
#review_form .comment-form-rating .stars:has(a.star-5:hover) a.star-2,
#review_form .comment-form-rating .stars:has(a.star-5:hover) a.star-3,
#review_form .comment-form-rating .stars:has(a.star-5:hover) a.star-4,
#review_form .comment-form-rating .stars:has(a.star-5:hover) a.star-5 {
  background-color: var(--color-yellow) !important;
}

/* Klick-Zustände */
#review_form .comment-form-rating .stars.selected:has(a.star-1.active) a.star-1,
#review_form .comment-form-rating .stars.selected:has(a.star-2.active) a.star-1,
#review_form .comment-form-rating .stars.selected:has(a.star-2.active) a.star-2,
#review_form .comment-form-rating .stars.selected:has(a.star-3.active) a.star-1,
#review_form .comment-form-rating .stars.selected:has(a.star-3.active) a.star-2,
#review_form .comment-form-rating .stars.selected:has(a.star-3.active) a.star-3,
#review_form .comment-form-rating .stars.selected:has(a.star-4.active) a.star-1,
#review_form .comment-form-rating .stars.selected:has(a.star-4.active) a.star-2,
#review_form .comment-form-rating .stars.selected:has(a.star-4.active) a.star-3,
#review_form .comment-form-rating .stars.selected:has(a.star-4.active) a.star-4,
#review_form .comment-form-rating .stars.selected:has(a.star-5.active) a.star-1,
#review_form .comment-form-rating .stars.selected:has(a.star-5.active) a.star-2,
#review_form .comment-form-rating .stars.selected:has(a.star-5.active) a.star-3,
#review_form .comment-form-rating .stars.selected:has(a.star-5.active) a.star-4,
#review_form .comment-form-rating .stars.selected:has(a.star-5.active) a.star-5 {
  background-color: var(--color-yellow) !important;
}

/* Kommentarliste */
.woocommerce #reviews #comments ol.commentlist {
  padding: 0;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text {
  border: none;
  margin: 0;
  padding: 0;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text p {
  margin: 0;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text p.meta {
  margin-bottom: 1.2em;
}

.woocommerce #reviews #comments ol.commentlist li {
  border-radius: 24px;
  box-shadow: 0 0 20px -10px rgba(0, 0, 0, 0.2);
  padding: 24px;
}

.woocommerce-review__dash       { display: none; }
.woocommerce-review__published-date { display: block; }

.woocommerce-review__author {
  color: var(--color-body);
  display: inline !important;
  font-size: var(--fs-h4);
  font-weight: bold !important;
  hyphens: none;
  -webkit-hyphens: none;
  -ms-hyphens: none;
}

/* "(Verifiziert)" ausblenden, Icon anzeigen wenn vorhanden */
.commentlist > li .comment-text .meta .verified {
  display: none !important;
}

.commentlist > li .comment-text .meta:has(.verified) .woocommerce-review__author::after {
  background-color: var(--color-body);
  content: "";
  display: inline-block;
  height: 20px;
  mask: url('/wp-content/uploads/verified.svg') center/contain no-repeat;
  -webkit-mask: url('/wp-content/uploads/verified.svg') center/contain no-repeat;
  vertical-align: -0.05em;
  width: 20px;
}

/* Reviews-Bereich Layout */
#reviews {
  display: flex !important;
  flex-direction: column;
  max-width: 860px;
}

#review_form_wrapper {
  margin-bottom: 3em;
  order: -1 !important;
}

.comment-reply-title {
  display: block;
  font-size: var(--fs-h2);
  font-weight: bold;
  line-height: var(--lh-h2);
  margin-bottom: 0.8em;
}

.stars {
  margin-bottom: 1.6em !important;
}

#review_form label {
  margin-bottom: 0.4em;
}

ul.wc-item-meta li > strong,
ul.wc-item-meta li > p,
ul.variation li > div {
  display: block;
}

.woocommerce #review_form #respond .form-submit input {
  border-radius: 60px;
  color: var(--color-white);
  font-size: var(--fs-button);
	font-weight: normal;
  padding:
    clamp(var(--pad-y-min)*1px, var(--pad-y-fluid), var(--pad-y-max)*1px)
    clamp(var(--pad-x-min)*1px, var(--pad-x-fluid), var(--pad-x-max)*1px) !important;
	background: var(--color-body);
}


/* ==========================================
   13. WOOCOMMERCE – WARENKORB (CUSTOM)
   ========================================== */

.bb-cart {
  align-items: start;
  display: grid;
  gap: 50px;
  grid-template-columns: minmax(0, 1fr) 420px;
}

.bb-cart-item {
  align-items: flex-start;
  background: #fff;
  border-radius: 24px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
  padding: 30px;
  position: relative;
  transition: opacity 0.25s ease;
}

.bb-cart-item.bb-cart-loading {
  opacity: 0.45;
  pointer-events: none;
}

.bb-cart-item.bb-cart-loading::after {
  animation: bbCartSpin 0.7s linear infinite;
  border: 3px solid rgba(0, 0, 0, 0.15);
  border-radius: 50%;
  border-top-color: var(--color-body);
  content: "";
  height: 36px;
  inset: 0;
  margin: auto;
  position: absolute;
  width: 36px;
}

@keyframes bbCartSpin {
  to { transform: rotate(360deg); }
}

.bb-cart-image {
  flex-shrink: 0;
  width: 90px;
}

.bb-cart-image img {
  border-radius: 16px;
  height: 90px;
  object-fit: cover;
  width: 100%;
}

.bb-cart-content { flex: 1; }

.bb-cart-header {
  align-items: flex-start;
  display: flex;
  gap: 20px;
  justify-content: space-between;
}

.bb-cart-title {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 8px;
}

.bb-cart-title a {
  color: var(--color-body);
  text-decoration: none;
}

.bb-cart-variation {
  color: #666;
  font-size: 14px;
  margin-bottom: 6px;
}

.bb-cart-price {
  color: #666;
  font-size: 15px;
}

.bb-cart-subtotal {
  font-size: 20px;
  font-weight: 700;
  white-space: nowrap;
}

.bb-cart-actions {
  align-items: center;
  display: flex;
  gap: 14px;
  margin-top: 20px;
}

/* Menge */
.bb-qty { display: flex; align-items: center; }

.bb-qty .quantity {
  align-items: center;
  display: flex !important;
  gap: 6px;
  margin: 0 !important;
  position: relative !important;
}

.bb-qty .quantity input.qty {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  font-weight: 700 !important;
  height: auto !important;
  min-width: 24px !important;
  padding: 0 !important;
  pointer-events: none;
  text-align: center !important;
  width: 24px !important;
}

.bb-qty .quantity input.qty::-webkit-inner-spin-button,
.bb-qty .quantity input.qty::-webkit-outer-spin-button {
  display: none;
}

.bb-qty .quantity button {
  align-items: center;
  background: #fff !important;
  border: 1px solid #000 !important;
  border-radius: 50% !important;
  color: #000 !important;
  cursor: pointer;
  display: flex !important;
  flex: 0 0 30px;
  height: 30px !important;
  justify-content: center;
  left: auto !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  width: 30px !important;
}

.bb-qty .quantity button:hover {
  background: #000 !important;
  color: #fff !important;
}

/* WooCommerce doppelte Buttons entfernen */
.bb-qty > .plus,
.bb-qty > .minus { display: none !important; }

/* Löschen-Button */
.bb-remove {
  align-items: center;
  background: #fff;
  border: 1px solid var(--color-body);
  border-radius: 50%;
  display: flex;
  height: 30px;
  justify-content: center;
  position: relative;
  text-decoration: none;
  width: 30px;
}

.bb-remove img { display: none; }

.bb-remove::before {
  background: #000;
  content: "";
  display: block;
  height: 16px;
  mask: url("https://staging-09.biobalkan.shop/wp-content/uploads/Bin.svg") no-repeat center;
  -webkit-mask: url("https://staging-09.biobalkan.shop/wp-content/uploads/Bin.svg") no-repeat center;
  mask-size: contain;
  -webkit-mask-size: contain;
  width: 16px;
}

.bb-remove:hover              { background: #000; }
.bb-remove:hover::before      { background: #fff; }

/* Update-Button ausblenden */
.bb-update-cart { display: none !important; }

/* Fortschrittsbalken */
.bb-shipping-progress { margin-bottom: 30px; }

.bb-progress-text {
  font-size: 1rem;
  margin-bottom: 0.6rem;
}

.bb-progress-text .woocommerce-Price-amount { font-weight: bold; }

.bb-progress-bar {
  background: #eee;
  border-radius: 999px;
  height: 0.44em;
  overflow: hidden;
}

.bb-progress-fill {
  background: #d00;
  border-radius: 999px;
  display: block;
  height: 100%;
  transition: width 0.4s ease;
}

.bb-progress-fill.is-complete { background: #7ed957; }

/* Rechte Box (Totals) */
.bb-cart-right {
  min-height: 400px;
  position: relative;
}

.bb-cart-right.bb-cart-updating::after {
  background: rgba(255, 255, 255, 0.45);
  border-radius: 24px;
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 2;
}

.bb-cart-right.bb-cart-updating::before {
  animation: bbCartSpin 0.7s linear infinite;
  border: 3px solid rgba(0, 0, 0, 0.15);
  border-radius: 50%;
  border-top-color: var(--color-body);
  content: "";
  height: 36px;
  left: 50%;
  margin: -18px 0 0 -18px;
  pointer-events: none;
  position: absolute;
  top: 50%;
  width: 36px;
  z-index: 3;
}

.bb-cart-right .bb-cart-totals {
  background: #fff;
  border-radius: 24px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);
  display: block;
  min-height: 300px;
  opacity: 1;
  padding: 30px;
  visibility: visible;
}

.bb-cart-right.bb-cart-updating .bb-cart-totals { opacity: 0.6; }

.bb-summary {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.bb-line {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.bb-total {
  border-top: 1px solid #eee;
  font-size: var(--fs-h4);
  font-weight: bold;
  line-height: var(--lh-h4);
  margin-top: 8px;
  padding-top: 16px;
}

.bb-shipping-methods {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 8px 0;
}

.bb-shipping-option {
  align-items: center;
  display: flex;
}

.bb-shipping-option span:last-child { margin-left: auto; }

.bb-coupon {
  display: flex;
  gap: 8px;
  margin-bottom: 10px;
  width: 100%;
}

.bb-coupon input {
  flex: 1 1 auto;
  min-width: 0;
}

.bb-coupon .button { flex: 0 0 auto; white-space: nowrap; }

.checkout-button {
  justify-content: center;
  margin-top: 12px;
  width: 100%;
}

/* Elementor-Button-Styling übernehmen */
.bb-coupon .button,
.checkout-button {
  all: unset;
}

.bb-coupon .button,
.checkout-button {
  align-items: center;
  background: var(--color-body) !important;
  border: 1px solid var(--color-body) !important;
  border-radius: 60px !important;
  color: #fff !important;
  cursor: pointer;
  display: flex !important;
  font-size: var(--fs-button) !important;
  justify-content: center;
  line-height: var(--lh-button) !important;
  padding:
    clamp(var(--pad-y-min)*1px, var(--pad-y-fluid), var(--pad-y-max)*1px)
    clamp(var(--pad-x-min)*1px, var(--pad-x-fluid), var(--pad-x-max)*1px) !important;
  text-decoration: none !important;
  transition: 0.2s ease;
}

.bb-coupon .button:hover,
.checkout-button:hover { opacity: 0.85; }


/* ==========================================
   14. WOOCOMMERCE – CHECKOUT
   ========================================== */

.elementor-widget-woocommerce-checkout-page .e-checkout__container {
  gap: 2em;
  grid-template-columns: 60% auto;
}

.elementor-widget-woocommerce-checkout-page .woocommerce .shop_table thead {
  display: none;
}

.elementor-widget-woocommerce-checkout-page .woocommerce-checkout #payment .place-order {
  margin-top: 2em;
}

#order_review .shop_table,
.cart-collaterals .shop_table {
  border: none;
  border-collapse: separate;
  overflow: hidden;
}

#order_review .shop_table tfoot tr th,
#order_review .shop_table tfoot tr td {
  background: transparent !important;
  border-bottom: none !important;
  border-color: #dddddd !important;
  border-left: none !important;
  border-right: none !important;
  padding: 0 0 16px !important;
}

#order_review .shop_table tfoot tr:first-child th,
#order_review .shop_table tfoot tr:first-child td {
  padding-top: 20px !important;
}

#order_review .shop_table tbody tr th,
#order_review .shop_table tbody tr td {
  border: none;
  font-weight: bold;
}

#order_review .shop_table tbody .product-name {
  font-size: var(--fs-button);
  line-height: 1.36em;
  padding: 0 0 20px !important;
}

#order_review .shop_table tbody .product-name .product-quantity {
  display: inline-block;
  white-space: nowrap;
}

#order_review_heading {
  font-size: var(--fs-h3) !important;
  line-height: var(--lh-h3) !important;
  margin-bottom: 0.8em;
}

.cart-collaterals .cart_totals table * {
  border: none !important;
  padding: 4px 0 !important;
}

.cart-collaterals .cart_totals th,
.cart-collaterals .cart_totals td {
  background: none !important;
}

.cart-collaterals .cart_totals table.shop_table.shop_table_responsive th,
.cart-collaterals .cart_totals table.shop_table.shop_table_responsive td {
  padding: 4px 12px !important;
}

#customer_details {
  margin-bottom: 24px;
}

#customer_details h3 {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
}

#customer_details p.create-account {
  margin-bottom: 12px !important;
}

#customer_details .review_order_billing td,
#customer_details .review_order_shipping td {
  color: var(--color-body) !important;
  min-width: 160px !important;
}

#customer_details .review_order_shipping tr td:first-child,
#customer_details .review_order_billing tr td:first-child {
  font-weight: bold;
}

.woocommerce-checkout-review-order-table th > small {
  font-size: var(--fs-small);
  font-weight: normal;
  line-height: var(--lh-button);
}

.woocommerce-checkout-review-order-table tfoot td {
  text-align: right;
}

.woocommerce-checkout .product-total .amount {
  font-size: var(--fs-button);
  line-height: var(--lh-button);
}

.woocommerce-checkout .wc_payment_methods li label {
  align-items: center;
  display: flex;
  width: 100%;
}

.woocommerce-checkout .wc_payment_methods li label img {
  margin-left: auto;
}

.woocommerce-terms-and-conditions-checkbox-text {
  font-size: var(--fs-p);
  line-height: var(--lh-p);
}

.payment_methods li {
  border: none !important;
  padding-bottom: 8px !important;
  padding-top: 8px !important;
}

#payment_method {
  font-size: var(--fs-p);
  font-weight: normal;
  line-height: var(--lh-p);
}

#payment img {
  border-radius: 0;
}

.mollie-component-label {
  font-size: var(--fs-p);
  margin-bottom: 0.4rem;
}

.mollie-gateway-icon {
  margin: 0.2em 0 !important;
}

.product-name {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
}

.product-name > strong.product-quantity {
  margin-left: 0;
}

.woocommerce-table__product-name.product-name {
  display: table-cell;
  position: relative;
  vertical-align: top;
}

.woocommerce-table.order_details td.woocommerce-table__product-total {
  vertical-align: top;
}

.product-total { text-align: right; }

.product-total .wgm-tax,
.wgm-tax.product-tax { display: none; }

tfoot td.product-name  { width: 40%; }
tfoot td.product-total { width: 60%; }

/* Versand */
.woocommerce-shipping-fields__field-wrapper {
  margin-top: 0 !important;
}

#ship-to-different-address {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

label[for^="shipping_method_"] .woocommerce-Price-amount {
  font-size: var(--fs-p);
  font-weight: bold !important;
  line-height: var(--lh-p) !important;
}

.checkout-shipping-info {
  border-bottom: 1px dotted #dddddd;
  border-top: 1px dotted #dddddd;
  font-size: var(--fs-button-s);
  margin-top: 12px;
  padding: 16px 0;
  text-align: center;
}

/* Coupon */
.e-coupon-anchor        { margin-top: 2em !important; }
.e-coupon-anchor-description { display: none; }

.e-show-coupon-form {
  color: var(--color-body) !important;
  display: block;
  font-size: var(--fs-p) !important;
  font-weight: bold !important;
  position: relative;
  width: 100%;
}

.e-show-coupon-form::after {
  background-image: url('/wp-content/uploads/Bag-Happy.svg');
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  height: 28px;
  position: absolute;
  right: 0;
  top: 36%;
  transform: translateY(-50%);
  width: 28px;
}

.e-coupon-box p {
  font-size: var(--fs-h4);
  font-weight: bold;
}

.e-woocommerce-coupon-nudge a {
  display: block;
  font-size: var(--fs-p);
  font-weight: normal;
  margin-top: 0.4em;
}

/* Login Nudge */
.e-woocommerce-login-anchor  { margin-top: 2em; }
.e-woocommerce-login-nudge.e-description { display: none; }
.e-checkout-secondary-title  { margin: 0; }

.e-show-login {
  color: var(--color-body) !important;
  display: block;
  font-size: var(--fs-p);
  font-weight: bold;
  position: relative;
  width: 100%;
}

.e-show-login::after {
  background-image: url('/wp-content/uploads/d7isj0er158mh9gib5l.svg');
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  height: 28px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
}

/* Billing/Shipping Country Select */
#billing_country_field select,
#shipping_country_field select {
  padding:
    clamp(var(--pad-y-min)*1px, var(--pad-y-fluid), var(--pad-y-max)*1px)
    clamp(var(--pad-x-min)*1px, var(--pad-x-fluid), var(--pad-x-max)*1px) !important;
  width: 100% !important;
}

#order_comments_field label {
  font-size: var(--fs-h4);
  font-weight: bold;
  hyphens: none;
  line-height: var(--lh-h2);
}

/* QR-Zahlung */
.muxp-bacs-qrcode {
  display: block;
  margin: auto;
  max-width: 180px;
  padding-top: 12px;
  text-align: center;
}

/* Review Order Billing */
.review_order_billing {
  font-size: var(--fs-p);
  line-height: var(--lh-p);
}

.woocommerce-table--order-details tfoot tr:last-child th,
.woocommerce-table--order-details tfoot tr:last-child td {
  font-weight: bold !important;
}

.update_totals_on_change th,
.update_totals_on_change td {
  border-top: 1px dotted;
}

tr.update_totals_on_change td label {
  font-size: var(--fs-button);
  line-height: var(--fs-button);
}

#billing_vat_field {
  margin-bottom: 8px;
}


/* ==========================================
   15. WOOCOMMERCE – MEIN KONTO
   ========================================== */

.woocommerce-form-login {
  max-width: 480px;
  width: 50%;
}

.woocommerce-form-login__rememberme {
  align-items: center;
  display: inline-flex;
}

.login p {
  margin-bottom: 8px !important;
}

a.showcoupon,
a.showlogin {
  display: block !important;
  font-size: var(--fs-small);
  margin-bottom: 0.4em;
  margin-top: 0.2em;
}

.woocommerce-account-greeting {
  font-size: var(--fs-h3) !important;
  line-height: var(--lh-h3) !important;
}

.woocommerce-EditAccountForm fieldset {
  margin: 3em 0;
}

.woocommerce-EditAccountForm legend {
  font-size: var(--fs-h3) !important;
  line-height: var(--lh-h3) !important;
  margin-bottom: 0.4em;
}

.woocommerce-MyAccount-content address {
  font-size: var(--fs-p);
  font-style: normal;
  margin: 0.4em 0 1em;
}

.woocommerce-MyAccount-navigation ul li a {
  border-color: transparent !important;
  display: inline-block;
  font-size: var(--fs-button);
  line-height: var(--lh-p);
  margin-bottom: 8px;
  position: relative;
}

.woocommerce-MyAccount-navigation ul li a::after {
  background: transparent;
  bottom: 0;
  content: "";
  height: 3px;
  left: 0;
  position: absolute;
  transition: background 0.2s ease;
  width: 100%;
}

.woocommerce-MyAccount-navigation ul li a:hover::after,
.woocommerce-MyAccount-navigation ul li.is-active a::after {
  background: var(--color-yellow);
  border-color: inherit !important;
}

.woocommerce-MyAccount-navigation ul li:last-child a {
  border-color: var(--color-body) !important;
  border-radius: var(--border-radius);
  margin-top: 0.4em;
  padding: 8px 20px !important;
}

.woocommerce-MyAccount-navigation ul li:last-child a:hover::after {
  background: none;
}

.woocommerce-MyAccount-navigation-link--customer-logout a {
  background: none !important;
  text-decoration: underline;
  text-underline-offset: 8px;
}

.woocommerce-MyAccount-navigation ul li a::after {
  display: none;
}

.woocommerce-MyAccount-content h2:first-of-type {
  font-size: var(--fs-h2) !important;
  line-height: var(--lh-h2);
  margin-bottom: 0;
}

.woocommerce-MyAccount-content h2 {
  font-size: var(--fs-h4);
  line-height: var(--lh-h4);
  margin-bottom: 24px;
}

.woocommerce-MyAccount-content-wrapper h2 {
  margin-top: 0 !important;
}

.woocommerce-MyAccount-content-wrapper .woocommerce-Addresses {
  margin-top: 0 !important;
}

.woocommerce-MyAccount-orders tr td:last-child {
  padding: 0;
}

.woocommerce-MyAccount-orders tr td:last-child a {
  font-size: var(--fs-button-s) !important;
}

.woocommerce-MyAccount-orders tr:last-child td {
  border-bottom: 0;
}

.woocommerce-button { margin-top: 0 !important; }

.woocommerce-customer-details .woocommerce-column__title,
.woocommerce-edit-address .woocommerce-MyAccount-content .addresses h2 {
  font-size: var(--fs-h3) !important;
  line-height: var(--lh-h3) !important;
  margin-bottom: 16px;
}

.woocommerce-edit-address .woocommerce-Addresses address {
  font-size: var(--fs-p);
  line-height: var(--lh-p);
  padding: 0;
}

.woocommerce-Addresses div {
  display: block;
  margin: 0 !important;
  padding: 0 !important;
  width: 100%;
}

.edit {
  font-size: var(--fs-p);
  line-height: var(--lh-p);
}

/* Geschenkkarten */
.add_gift_card_form { margin-top: 24px; }
.add_gift_card_form button { margin-top: 12px; }
.add_gift_card_form h4 {
  font-size: var(--fs-button);
  font-weight: bold;
}

.balance,
.balance_label {
  display: inline-block !important;
  font-size: var(--fs-small) !important;
  line-height: var(--lh-button) !important;
}

.balance_label > strong {
  font-weight: normal !important;
  hyphens: none;
}

.code,
.codes_label { display: none !important; }

.input-text {
  background: #efefef;
  border: none !important;
  font-size: var(--fs-button) !important;
  line-height: var(--lh-button) !important;
  max-width: 100%;
  padding:
    clamp(var(--pad-y-min)*1px, var(--pad-y-fluid), var(--pad-y-max)*1px)
    clamp(var(--pad-x-min)*1px, var(--pad-x-fluid), var(--pad-x-max)*1px) !important;
}

.form-row textarea {
  line-height: 1.5em !important;
}

label[for="use_gift_card_balance"] .woocommerce-Price-amount.amount {
  display: inline-block;
  font-size: var(--fs-p);
  font-weight: bold;
  line-height: var(--lh-p);
}

input#use_gift_card_balance + br + strong .woocommerce-Price-amount.amount {
  color: var(--color-green);
  margin-top: 0.2em;
}

td[data-title="Guthaben"] > .woocommerce-Price-amount.amount {
  color: var(--color-green);
  display: block;
  font-weight: bold;
}

.woocommerce-MyAccount-Giftcards-balance-amount {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  margin-bottom: 40px;
}

.woocommerce-MyAccount-Giftcards-form {
  margin-bottom: 3em;
}

.woocommerce-MyAccount-Giftcards-form button {
  border: solid 1px var(--color-body);
  font-size: var(--fs-button);
  font-weight: normal;
  line-height: var(--lh-button);
  margin-left: 12px;
}

/* Mein Konto – Adressen */
.woocommerce-columns--addresses .col-1,
.woocommerce-columns--addresses .col-2 {
  margin-bottom: 40px;
}

.col-2 h3 {
  line-height: inherit;
  margin-top: 0;
  padding-top: 40px !important;
}

.wgm-second-checkout .col-1 { margin-bottom: 40px; }


/* ==========================================
   16. HEADER / TOPBAR / CATEGORY NAV
   ========================================== */

.cat-nav-list {
  align-items: center;
  display: flex;
  gap: 3px;
  height: 56px;
  list-style-type: none;
  margin: 0.2em 0.4em;
  overflow: auto;
  padding: 0;
  scrollbar-width: none;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}

.cat-nav-list::-webkit-scrollbar { display: none; }

.cat-nav-list li a {
  border-radius: 60px;
  color: var(--color-body);
  padding: 12px 16px;
}

.cat-nav-list li.active a,
.cat-nav-list li a:hover {
  background: var(--color-yellow);
}

/* Nur Smartphone: Kategorie-Links etwas kompakter, damit mehr Kategorien
   gleichzeitig sichtbar sind, plus Scroll-Hinweis rechts und Rand-Fade
   (siehe unten). Auf Desktop bleibt alles wie bisher. */
@media (max-width: 768px) {
	.cat-nav-list {
		height: 52px;
	}
	.cat-nav-list li a {
    padding: 12px 12px;
  }

  /* Rand-Fade: verhindert, dass ein am Rand angeschnittener Kategorie-Button
     während des Scrollens hart/eckig abgeschnitten wirkt. Blendet die letzten
     24px an beiden Enden weich aus statt hart zu clippen. */
  .cat-nav-list {
    -webkit-mask-image: linear-gradient(to right, transparent 0, black 24px, black calc(100% - 24px), transparent 100%);
    mask-image: linear-gradient(to right, transparent 0, black 24px, black calc(100% - 24px), transparent 100%);
  }

  /* Scroll-Hinweis rechts: die Kategorie-Navigation ist horizontal scrollbar, aber
     ohne visuellen Hinweis ist das nicht immer ersichtlich, besonders wenn nur
     2-3 Kategorien gleichzeitig sichtbar sind. Ein dezenter, dauerhaft sichtbarer
     Inner-Shadow am rechten Rand signalisiert "hier geht noch weiter", ohne
     zusätzliche UI-Elemente wie Pfeile zu benötigen. Größe (44x44px) entspricht
     bewusst der Höhe der Kategorie-Buttons selbst (siehe .cat-nav-list li a),
     damit border-radius: 60px auf beiden Elementen gleich stark gekappt wird
     und die Rundung optisch zusammenpasst. */
  /* Das Container-Template (Shortcode-Widget, das den Kategorie-Nav-Shortcode
     ausgibt) ist selbst wieder in ein äußeres .elementor-shortcode eingebettet
     (Shortcode-Widget, das das ganze Container-Template einbindet). :has(.cat-nav-list)
     ohne Kind-Kombinator matcht daher ZWEI verschachtelte Wrapper-Ebenen um dieselbe
     Navigation, wodurch der Schatten zweifach übereinander erscheint. Daher gezielt
     nur den UNMITTELBAREN Wrapper ansprechen (> .cat-nav-list als direktes Kind).
     Zusätzlich: Elementor erzeugt für "Sticky"-Elemente automatisch einen
     unsichtbaren Platzhalter-Klon (.elementor-sticky__spacer), der ebenfalls
     ausgeschlossen wird. */
  .elementor-shortcode:has(> .cat-nav-list) {
    position: relative;
  }
  .elementor-shortcode:has(> .cat-nav-list)::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    pointer-events: none;
    border-radius: 60px;
    box-shadow: inset -8px 0 6px -6px rgba(0, 0, 0, 0.18);
  }
  .elementor-sticky__spacer .elementor-shortcode:has(> .cat-nav-list)::after {
    content: none;
    box-shadow: none;
  }
}

.category-sc-nav {
  overflow-x: auto;
  overflow-y: hidden;
  position: relative;
  scrollbar-width: none;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}

.category-sc-nav::-webkit-scrollbar { display: none; }


/* ==========================================
   17. MOBILE MENU POPUP – FADE-IN / FADE-OUT
   (Popup 39921 · Blur-Layer f0c30b7 · Logo e48ae9b)
   Fade-Out benötigt das zugehörige JS-Snippet (.bb-closing).
   ========================================== */

/* Elementors interne Einblend-Animation abschalten */
#elementor-popup-modal-39921 .dialog-widget-content.animated {
  animation: none !important;
}
#elementor-popup-modal-39921.dialog-widget {
  opacity: 1;
}

/* FADE-IN: Blur-Layer konstant auf eigenem GPU-Layer, nur opacity faden */
#elementor-popup-modal-39921 .elementor-element-f0c30b7 {
  -webkit-backdrop-filter: blur(8px) !important;
  backdrop-filter: blur(8px) !important;
  isolation: isolate;
  transform: translateZ(0);
  transition: opacity .4s cubic-bezier(0, 0, .2, 1) !important;
  opacity: 1;
}
@starting-style {
  #elementor-popup-modal-39921 .elementor-element-f0c30b7 {
    opacity: 0;
  }
}

/* Logo synchron mit einfaden (verhindert hartes Aufblitzen) */
#elementor-popup-modal-39921 .elementor-element-e48ae9b {
  transition: opacity .4s cubic-bezier(0, 0, .2, 1) !important;
  opacity: 1;
}
@starting-style {
  #elementor-popup-modal-39921 .elementor-element-e48ae9b {
    opacity: 0;
  }
}

/* FADE-OUT: gesamten Inhalt inkl. box-shadow ausfaden */
#elementor-popup-modal-39921.bb-closing .dialog-widget-content {
  opacity: 0 !important;
  transition: opacity .3s linear !important;
}

/* Blur-Radius mit runter + Isolation aufheben (verschwindet als Einheit) */
#elementor-popup-modal-39921.bb-closing .elementor-element-f0c30b7 {
  -webkit-backdrop-filter: blur(0px) !important;
  backdrop-filter: blur(0px) !important;
  isolation: auto !important;
  transform: none !important;
  transition:
    -webkit-backdrop-filter .4s linear,
    backdrop-filter .4s linear !important;
}

@media (prefers-reduced-motion: reduce) {
  #elementor-popup-modal-39921 .elementor-element-f0c30b7,
  #elementor-popup-modal-39921 .elementor-element-e48ae9b,
  #elementor-popup-modal-39921.bb-closing .dialog-widget-content {
    transition-duration: .01ms !important;
  }
}


/* ==========================================
   18. OUTOFSTOCK-FORMULAR
   ========================================== */

#outofstock .elementor-field-subgroup,
#outofstock .elementor-field-option {
  align-items: flex-start;
  display: flex;
  gap: 0.5em;
}

#outofstock input[type="checkbox"] {
  flex-shrink: 0;
  margin: 0;
}

#outofstock label {
  display: block;
  font-size: var(--fs-button-s);
  line-height: 1.4em;
  text-align: left;
}


/* ==========================================
   19. DIVERSES / HILFKLASSEN
   ========================================== */

.attachment-woocommerce_thumbnail {
  margin-right: 8px;
  min-width: 64px !important;
}

#content { overflow: hidden; }
.e-loop-item { z-index: 0 !important; }
.shop_table.cart .actions .button { line-height: var(--lh-button); width: inherit; }

.woocommerce-product-gallery .flex-control-thumbs:before {
  position: relative;
}

#woo-products .woocommerce { padding-top: 0; }
.archive .nm-page-wrap-inner > .nm-page-full { display: none; }
.woocommerce-review-link { display: none; }

/* Variation Spezialbereich */
.variation-WhlenSieIhrBioTrioaus p {
  font-size: var(--fs-small);
  line-height: 1.36rem;
}


/* ==========================================
   20. PAGE- / POST-SPEZIFISCH
   ========================================== */

/* Seite 17127: single_variation sichtbar */
body:not(.postid-17127) .product .single_variation {
  display: none !important;
}

/* Produkte ohne Menge */
.postid-16960 .quantity,
.postid-19279 .quantity,
.postid-16960 .wdm-discount,
.postid-19279 .wdm-discount {
  display: none !important;
}

.postid-16960 .single_add_to_cart_button,
.postid-19279 .single_add_to_cart_button {
	margin-left: 0!important;
}

#product-16960 button[type="submit"],
#product-19279 button[type="submit"] {
  float: none;
  width: 100%;
}

#product-16960 table.variations tbody {
  display: grid;
  gap: 12px;
  grid-template-columns: 2fr 1fr;
}

#product-16960 table.variations tr {
  display: flex;
  flex-direction: column;
}

.product .single_variation .wgm-info.shipping_de {
  display: none !important;
}

.postid-16960 .shipping_de { display: none; }

.postid-19279 .price,
.postid-19279 .shipping_de,
.postid-19279 .wprevpro_badge { display: none; }

.postid-19279 .product_title { margin-bottom: 24px; }
.postid-19279 .woocommerce-product-details__short-description { padding-bottom: 0; }

/* Seite 16052 */
.page-id-16052 .anner-text-inner h1,
.page-id-16052 .banner-text-inner h2 { color: #fff !important; }


/* ==========================================
   21. MEDIA QUERY: max-width 1133px
   ========================================== */

@media (max-width: 1133px) {

  html {
    hyphens: auto;
    -webkit-hyphens: auto;
    overflow-wrap: break-word;
  }

  .genuss-slider { mask-image: none; }
	
	.ctacopytext {
		color: var(--color-body);
	}
	
	.ctabutton {
		background-color: var(--color-body);
		fill: none;
		border-radius: 60px;
	}
	.ctabutton span {
		color: white;
	}

  /* Popup-Navigation */
  #elementor-popup-modal-39921 .elementor-nav-menu .elementor-item {
    display: inline-block;
    width: auto;
  }

  #elementor-popup-modal-39921 .elementor-nav-menu .current-menu-item > a,
  #elementor-popup-modal-39921 .elementor-nav-menu .current_page_item > a {
    border-bottom: 3px solid var(--color-yellow);
  }

  #elementor-popup-modal-39921 .elementor-nav-menu--main.e--pointer-underline .elementor-item.elementor-item-active::after,
  #elementor-popup-modal-39921 .elementor-nav-menu--main.e--pointer-underline .current-menu-item > a::after,
  #elementor-popup-modal-39921 .elementor-nav-menu--main.e--pointer-underline .current_page_item > a::after {
    display: none !important;
  }

  .woocommerce-cart .product-subtotal {
    margin-right: 0.4em;
  }

  tr.woocommerce-cart-form__cart-item.cart_item > td {
    padding-bottom: 1em !important;
    padding-top: 0 !important;
  }

  .shop_table.cart tr td { padding: 0; }

  .shop_table.cart .product-quantity .nm-quantity-wrap .quantity {
    margin: 0;
  }

  /* German Market */
  #tab-gm_fic_allergens {
    max-width: 100%;
    padding: 0 16px;
  }

  .bm-percentual-discount { width: 64px; }

  /* Produkt */
  .woocommerce-loop-product__title { padding-right: 0; }

  .product.thumbnails-vertical .summary {
    margin-top: -0.8em;
    padding-left: 0;
    padding-top: 1em;
  }

  .thumbnails-vertical .woocommerce-product-gallery .flex-control-thumbs { display: none; }
  .thumbnails-vertical .woocommerce-product-gallery__wrapper { margin-bottom: 0; }

  td.product-subremove .product-subtotal {
    font-weight: bold;
    margin-top: 0;
  }

  /* Diverse */
  .bestellung-absenden .col-xs-12 .nm-shop-notice:first-child {
    margin-top: 20px !important;
    padding: 20px !important;
  }

  .shop_table.cart .nm-product-details .variation,
  .shop_table.cart .nm-product-details > * {
    max-width: 70%;
    padding: 0.2em 0;
  }

  .cross-sells { padding-top: 35px; }

  .marketpress-salesman-fsn {
    font-size: var(--fs-button-s);
    padding: 0;
  }

  .marketpress-salesman-fsn p,
  .marketpress-salesman-fsn p:first-child {
    padding-bottom: 0;
  }

  .woocommerce-cart .woocommerce-cart-form { width: inherit; }

  .widget form > button,
  input[type=submit],
  .button { margin-top: 0.2em; }

}


/* ==========================================
   22. MEDIA QUERY: max-width 768px
   ========================================== */

@media (max-width: 768px) {

  /* Checkout */
  #customer_details {
    float: none;
    margin: 0 0 40px !important;
    padding: 0;
    width: 100%;
  }
	input:not([type=checkbox]):not([type=radio]):not([type=range]),
  select,
  textarea {
    font-size: 16px !important;
  }

  #order_review,
  .cart-collaterals {
    box-shadow: 0 0 30px -12px rgba(0, 0, 0, 0.24);
    float: none;
    margin: 0;
    overflow: auto;
    padding: 10px;
    width: 100%;
  }

  #order_review,
  .cart-collaterals {
    margin-bottom: 24px !important;
  }

  /* Warenkorb */
  .woocommerce {
    overflow: inherit;
    padding: 0 0 20px !important;
  }

  .woocommerce-cart .woocommerce > form {
    float: none;
    width: 100%;
  }

  /* Tabs */
  .tabs.wc-tabs {
    margin: 0 0 8px;
    mask-image: linear-gradient(to left, transparent 0, #000 16px);
    -webkit-mask-image: linear-gradient(to left, transparent 0, #000 16px);
  }

  .tabs-layout-default .nm-tabs-panel-inner { padding: 0 !important; }
  .tabs-layout-default .woocommerce-tabs .panel { padding: 0; }

  /* Galerie */
  .woocommerce-product-gallery .flex-direction-nav .flex-next {
    margin-right: 0;
    right: 12px;
  }

  /* Bewertungen */
  .star-rating { height: 24px !important; }

  .commentlist > li .comment-text .meta:has(.verified) .woocommerce-review__author::after {
    vertical-align: -0.1em;
  }

  .wppro_badge1_DIV_stars.b4s2 { display: block; }

  /* Zahlung */
  #payment .payment_methods > li .payment_box {
    font-size: var(--fs-small);
    padding-bottom: 0 !important;
    padding-left: 2.4rem;
    padding-top: 0.5rem !important;
  }

  .qr-payment + br { display: none; }

  p.qr-payment-text {
    display: block;
    float: inherit;
    margin: 1em 0;
    width: 100%;
  }

  /* Mein Konto */
  .woocommerce-customer-details .woocommerce-column__title,
  .woocommerce-edit-address .woocommerce-MyAccount-content .addresses h2 {
    margin-top: 0 !important;
    padding: 0;
  }

  .woocommerce-order-received h2 { margin-top: 0 !important; }

  .woocommerce-edit-address .woocommerce-Message { margin-bottom: 20px; }

  .woocommerce-MyAccount-navigation ul li a { padding-bottom: 4px; }
  .woocommerce-Addresses div { margin-bottom: 20px !important; }

  #save_billing_vat_form { margin: 0; }

  /* Produktdetails */
  .woocommerce-table__product-name.product-name { width: 64%; }

  #order_review .shop_table tbody .product-name .variation {
    font-size: var(--fs-small);
  }

  .german-market-product-image img {
    margin-bottom: 8px;
  }

  label.checkbox { align-items: flex-start; }

  /* Bulk */
  .bm-percentual-discount { width: 55px; }

  /* Checkout-Button */
  .elementor-button-text { font-weight: normal !important; }

  form.woocommerce-checkout {
    margin-top: 0;
    padding-bottom: 12px;
  }

  .shop_table.cart tr:last-child td { padding-left: 0; }

  /* Featured Box */
  .featured-box { margin-top: 48px; }
	#bb-store-hint {
		width: 80vw;
		border-radius: 24px!important;
		background-color: rgba(255,255,255,.64)!important;
	}

}