/* BioBalkan – Checkout v5 */

/* Tokens – an globale :root-Variablen gebunden */
.bb-checkout-page {
  /* Farben – global */
  --bb-text:     var(--color-body);
  --bb-white:    var(--color-white);
  --bb-field-bg: var(--color-grey);
  --bb-green:    var(--color-green);
  --bb-red:      var(--color-red);
  --bb-badge:    var(--color-body);   /* Nummern-Badge (war #444) */
  /* Neutrale – checkout-lokal */
  --bb-border: #eee;
  --bb-radio:  #ccc;
  --bb-muted:  #777;                  /* Sekundaertext (war #555 & #777) */
  --bb-shadow: 0 0 20px -10px rgba(0, 0, 0, .3);
  /* Schrift & Zeilenhoehe – global */
  --bb-fs:        var(--fs-p);
  --bb-fs-h4:     var(--fs-h4);
  --bb-fs-small:  var(--fs-small);
  --bb-fs-button: var(--fs-button);
  --bb-lh:        var(--lh-p);
  --bb-lh-h4:     var(--lh-h4);
  --bb-lh-button: var(--lh-button);
}

/* Overrides: Theme-Float + globale Checkout-Styles neutralisieren */
.bb-checkout-page #customer_details,
.bb-checkout-page #order_review {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* #order_review erbt sonst globale Box-Optik (Rahmen/Shadow) → zweite Box in der Box */
.bb-checkout-page #order_review,
.bb-checkout-page .woocommerce-checkout-review-order,
.bb-checkout-page .bb-order-review,
.bb-checkout-page .bb-order-review__products,
.bb-checkout-page .bb-order-review__totals {
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  overflow: visible !important;
}
/* Trennlinie Produkte/Summen beibehalten */
.bb-checkout-page .bb-order-review__products {
  border-bottom: 1px solid var(--bb-border) !important;
}

.bb-checkout-page .payment_methods li {
  border: none !important;
  padding: 0 !important;
}

/* Layout 70/30 */
.bb-checkout-page .bb-checkout-layout {
  display: grid !important;
  grid-template-columns: 70fr 30fr !important;
  gap: 32px !important;
  align-items: start !important;
}

/* #content { overflow: hidden } (global) bricht position:sticky.
   overflow-x: clip verhindert horizontales Überlaufen, OHNE die
   Y-Achse implizit auf auto zu setzen → Sticky bleibt funktionsfähig. */
.bb-checkout-page #content {
  overflow: visible !important;
  overflow-x: clip !important;
}

.bb-checkout-sidebar {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 220px !important;
  align-self: start !important;
}

@media (max-width: 1024px) {
  .bb-checkout-page .bb-checkout-layout {
    grid-template-columns: 1fr 1fr !important;
    gap: 24px !important;
  }
  .bb-checkout-sidebar { position: static !important; }
}

@media (max-width: 768px) {
  .bb-checkout-page .bb-checkout-layout {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .bb-checkout-main    { order: 1 !important; }
  .bb-checkout-sidebar { order: 2 !important; }
  .bb-checkout-section { scroll-margin-top: 60px; } /* Mobile: kleinerer Sticky-Header */
}

/* Section Box */
.bb-checkout-section {
  background: var(--bb-white);
  border: 2px solid transparent !important;   /* Platz dauerhaft reserviert -> kein Layout-Sprung */
  border-radius: 24px !important;
  box-shadow: var(--bb-shadow);
  margin-bottom: 16px;
  overflow: hidden;
  scroll-margin-top: 220px; /* Desktop: Abstand beim Anker-Scroll (Sticky-Header) */
}
.bb-checkout-section:last-child { margin-bottom: 0; }

/* Hover nur bei zugeklappten Boxen: nur die Rahmenfarbe wechselt */
.bb-checkout-section:has(.bb-section-toggle[aria-expanded="false"]):hover {
  border-color: var(--color-yellow) !important;
}

/* Geöffnete Box: dauerhaft gelber Rahmen */
.bb-checkout-section:has(.bb-section-toggle[aria-expanded="true"]) {
  border-color: var(--color-yellow) !important;
}

/* Section Body */
.bb-section-body {
  padding: 24px;
}

/* Hinweis: Das Zuklappen wird vollständig per JS animiert (closeBody) und setzt
   am Ende visibility:hidden via transitionend. Keine CSS-Regel an
   [aria-expanded="false"] hängen, die sofort greift – das würde die Animation
   abschneiden und den Inhalt vorzeitig verschwinden lassen. */

/* Section Toggle */
.bb-section-toggle {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  padding: 20px 24px !important;
  background: none !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  cursor: pointer !important;
  text-align: left !important;
  color: var(--bb-text) !important;
  font-family: inherit !important;
  gap: 12px !important;
}

.bb-section-title {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-size: var(--bb-fs-h4) !important;
  font-weight: normal !important;
  line-height: var(--bb-lh-h4) !important;
  color: var(--bb-text) !important;
}

.bb-section-number {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: var(--bb-badge) !important;
  color: var(--bb-white) !important;
  font-size: var(--bb-fs-h4) !important;
  font-weight: normal !important;
  flex-shrink: 0 !important;
}

.bb-section-arrow {
  flex-shrink: 0;
  transition: transform .28s ease;
  opacity: .4;
  filter: none !important;
}
.bb-section-toggle[aria-expanded="false"] .bb-section-arrow {
  transform: rotate(-90deg);
}

.bb-section-toggle[aria-expanded="true"] {
  border-bottom: 1px solid var(--bb-border) !important;
}

.bb-order-review-section .bb-section-number { display: none; }

.bb-section-header {
  display: flex;
  align-items: center;
  padding: 20px 24px;
  border-bottom: 1px solid var(--bb-border);
}

.bb-section-header .bb-section-title {
  font-size: var(--bb-fs-h4) !important;
  font-weight: normal !important;
  color: var(--bb-text) !important;
}

/* Login / Gastbestellung */
.bb-login-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 32px !important;
}
.bb-login-heading {
  font-size: var(--bb-fs-h4) !important;
  font-weight: 700 !important;
  margin: 0 0 8px !important;
  color: var(--bb-text) !important;
}
.bb-login-subtitle {
  font-size: var(--bb-fs) !important;
  color: var(--bb-text) !important;
  margin: 0 0 16px !important;
}
.bb-login-col .form-row { margin: 0 0 12px !important; padding: 0 !important; }
.bb-login-remember {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: var(--bb-fs) !important;
  margin: 4px 0 0 !important;
  cursor: pointer !important;
  color: var(--bb-text) !important;
}
.bb-login-btn,
.bb-guest-continue {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  background: var(--bb-text) !important;
  color: var(--bb-white) !important;
  border: 2px solid var(--bb-text) !important;
  border-radius: 60px !important;
  font-size: var(--bb-fs-button) !important;
  font-family: inherit !important;
  font-weight: 400 !important;
  padding: clamp(14px, 3vw, 18px) clamp(20px, 3vw, 24px) !important;
  cursor: pointer !important;
  text-align: center !important;
  transition: opacity .2s ease !important;
  line-height: var(--bb-lh-button) !important;
}
/* "Als Gast fortsetzen" als Outline-Button */
.bb-guest-continue {
  background: var(--bb-white) !important;
  color: var(--bb-text) !important;
  border: 2px solid var(--bb-text) !important;
}
.bb-login-btn:hover,
.bb-guest-continue:hover { opacity: .85 !important; }
.bb-login-btn[disabled] { opacity: .6 !important; cursor: default !important; }
.bb-login-lost { margin: 8px 0 12px !important; font-size: var(--bb-fs) !important; }
.bb-login-lost a { color: var(--color-green) !important; text-decoration: none !important; }
.bb-login-error { margin: 10px 0 0 !important; color: var(--bb-red) !important; font-size: var(--bb-fs-small) !important; }
.bb-login-col--guest p { font-size: var(--bb-fs) !important; margin: 0 0 16px !important; color: var(--bb-text) !important; }

/* Buttons unten in der Box, gleiche 50/50-Aufteilung */
.bb-login-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 32px !important;
  margin-top: 20px !important;
}

@media (max-width: 768px) {
  .bb-login-grid { grid-template-columns: 1fr !important; gap: 24px !important; }
  .bb-login-actions { grid-template-columns: 1fr !important; gap: 12px !important; }
}

/* Adressfelder */
#customer_details .col-1,
#customer_details .col-2 {
  float: none !important;
  width: 100% !important;
}

.bb-checkout-form .woocommerce-billing-fields > h3 {
  display: none !important;
}

.bb-checkout-form .form-row label,
.bb-checkout-form label {
  font-size: var(--bb-fs) !important;
  font-weight: 400 !important;
  margin-bottom: 0 !important;
  color: var(--bb-text) !important;
  display: block !important;
}

.bb-checkout-form .form-row input.input-text {
  background: var(--bb-field-bg) !important;
  border: none !important;
  border-radius: 60px !important;
  font-size: var(--bb-fs) !important;
  font-family: inherit !important;
  padding: clamp(12px, 3vw, 16px) clamp(20px, 3vw, 24px) !important;
  width: 100% !important;
  box-sizing: border-box !important;
  transition: box-shadow .2s ease !important;
  height: auto !important;
}

.bb-checkout-form .form-row textarea,
#order_comments {
  background: var(--bb-field-bg) !important;
  border: none !important;
  border-radius: 24px !important;
  font-size: var(--bb-fs) !important;
  font-family: inherit !important;
  padding: clamp(12px, 3vw, 16px) clamp(20px, 3vw, 24px) !important;
  width: 100% !important;
  box-sizing: border-box !important;
  min-height: 200px !important;
  resize: vertical !important;
  line-height: var(--bb-lh) !important;
}

.bb-checkout-form .form-row input.input-text:focus,
.bb-checkout-form .form-row textarea:focus {
  outline: none !important;
  box-shadow: 0 0 0 2px var(--bb-text) !important;
}

/* Land/Region: select2-Auswahlfeld – gleicher Fokus-Effekt wie die Inputs.
   select2 setzt beim Fokussieren --focus bzw. beim Öffnen --open auf den Container. */
.bb-checkout-form .form-row .select2-container .select2-selection {
  transition: box-shadow .2s ease !important;
}
.bb-checkout-form .form-row .select2-container--focus .select2-selection,
.bb-checkout-form .form-row .select2-container--open .select2-selection,
.bb-checkout-form .form-row .select2-container .select2-selection:focus,
.bb-checkout-form .form-row .select2-container--focus .select2-selection--single,
.bb-checkout-form .form-row .select2-container--open .select2-selection--single {
  outline: none !important;
  box-shadow: 0 0 0 2px var(--bb-text) !important;
}
/* Fallback: natives <select>, falls select2 nicht aktiv ist */
.bb-checkout-form .form-row select:focus {
  outline: none !important;
  box-shadow: 0 0 0 2px var(--bb-text) !important;
}

#order_comments_field > label {
  font-size: var(--bb-fs) !important;
  font-weight: 700 !important;
  margin-bottom: 8px !important;
}

#ship-to-different-address {
  margin-bottom: 24px !important; /* Abstand unterhalb der Checkbox */
}
/* Höhere Spezifität, um die kasse.css-Regel (#ship-to-different-address {margin-top:0}) zu schlagen */
.bb-checkout-form #customer_details .col-2 h3#ship-to-different-address {
  margin-top: 24px !important;    /* Abstand oberhalb der Checkbox */
  padding-top: 0 !important;
  margin-bottom: 24px !important; /* Abstand unterhalb der Checkbox */
}

/* Versandmethoden */
#bb-section-shipping-body .woocommerce-shipping-methods {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

#bb-section-shipping-body .woocommerce-shipping-methods li {
  border: 2px solid var(--bb-border) !important;
  border-radius: 16px !important;
  background: var(--bb-white) !important;
  transition: border-color .2s ease !important;
}

#bb-section-shipping-body .woocommerce-shipping-methods li:has(input:checked) {
  border-color: var(--bb-text) !important;
}

#bb-section-shipping-body .woocommerce-shipping-methods li label {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 14px 18px !important;
  cursor: pointer !important;
  width: 100% !important;
  margin: 0 !important;
  font-size: var(--bb-fs) !important;
}

#bb-section-shipping-body .woocommerce-shipping-methods .woocommerce-Price-amount {
  font-weight: 700 !important;
  margin-left: auto !important;
}

#bb-section-shipping-body .wgm-tax.product-tax {
  display: none !important;
}

/* Gutschein */
.bb-coupon-wrapper {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
}

.bb-coupon-wrapper form.bb-coupon-form,
#bb-checkout-form-coupon,
.bb-coupon-wrapper .bb-coupon-form {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: 1 1 100% !important;
}

.bb-coupon-wrapper .form-row-first {
  flex: 0 0 60% !important;
  max-width: 60% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.bb-coupon-wrapper .form-row-last {
  flex: 0 0 calc(40% - 10px) !important;
  max-width: calc(40% - 10px) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.bb-coupon-wrapper input#coupon_code {
  background: var(--bb-field-bg) !important;
  border: none !important;
  border-radius: 60px !important;
  font-size: var(--bb-fs) !important;
  font-family: inherit !important;
  padding: clamp(12px,3vw,16px) clamp(20px,3vw,24px) !important;
  width: 100% !important;
  box-sizing: border-box !important;
  height: auto !important;
}

.bb-coupon-submit {
  background: var(--bb-text) !important;
  color: var(--bb-white) !important;
  border: 1px solid var(--bb-text) !important;
  border-radius: 60px !important;
  font-size: var(--bb-fs) !important;
  font-family: inherit !important;
  padding: clamp(12px,3vw,16px) clamp(12px,3vw,16px) !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  width: 100% !important;
  transition: opacity .2s ease !important;
  line-height: var(--bb-lh-button) !important;
}
.bb-coupon-submit:hover { opacity: .85 !important; }

.woocommerce-remove-coupon {
  font-size: var(--bb-fs-small) !important;
  color: var(--bb-red) !important;
  text-decoration: none !important;
  margin-left: 8px !important;
}

/* Zahlungsmethode */
#bb-section-payment-body #payment {
  background: none !important;
  border: none !important;
  padding: 0 !important;
}

#bb-section-payment-body .add_gift_card_form,
#bb-section-payment-body .wc-gift-cards,
#bb-section-payment-body .woocommerce-gift-card-fields {
  display: none !important;
}

#bb-section-payment-body .wc_payment_methods {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  border: none !important;
}

.bb-payment-fully-paid {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
  color: var(--bb-muted) !important;
  font-size: var(--bb-fs) !important;
}

#bb-section-payment-body .wc_payment_method {
  border: 2px solid var(--bb-border) !important;
  border-radius: 16px !important;
  background: var(--bb-white) !important;
  transition: border-color .2s ease !important;
  padding: 0 !important;
  overflow: hidden !important;
}

#bb-section-payment-body .wc_payment_method:has(input:checked) {
  border-color: var(--bb-text) !important;
}

#bb-section-payment-body .wc_payment_method input[type="radio"] {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

#bb-section-payment-body .wc_payment_method > label {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  padding: 14px 18px !important;
  cursor: pointer !important;
  width: 100% !important;
  margin: 0 !important;
  font-size: var(--bb-fs) !important;
  border: none !important;
  background: none !important;
  box-sizing: border-box !important;
}

#bb-section-payment-body #payment .form-row {
  border-top: none !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}

#bb-section-payment-body .wc_payment_method > label img:first-of-type {
  margin-left: auto !important;
}

#bb-section-payment-body .wc_payment_method > label::before {
  content: '' !important;
  display: inline-flex !important;
  flex-shrink: 0 !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
  border: 2px solid var(--bb-radio) !important;
  background: var(--bb-white) !important;
  box-sizing: border-box !important;
  margin-right: 12px !important;
  transition: border-color .2s ease, background .2s ease !important;
}

#bb-section-payment-body .wc_payment_method:has(input:checked) > label::before {
  border-color: var(--bb-text) !important;
  background: var(--bb-text) !important;
  box-shadow: inset 0 0 0 4px var(--bb-white) !important;
}

#bb-section-payment-body .wc_payment_method > label img {
  margin-left: 0 !important;
  max-height: 22px !important;
  width: auto !important;
  border-radius: 0 !important;
}

#bb-section-payment-body .payment_box {
  padding: 0 18px 14px !important;
  font-size: var(--bb-fs-small) !important;
  color: var(--bb-muted) !important;
  border: none !important;
  background: none !important;
}

/* Mollie Components (Kreditkarten-Felder) */

#bb-section-payment-body .payment_box::before {
  display: none !important;
}

#bb-section-payment-body .mollie-component-label {
  display: block !important;
  font-size: var(--bb-fs) !important;
  font-weight: 400 !important;
  margin-bottom: 6px !important;
  color: var(--bb-text) !important;
}

#bb-section-payment-body #cardHolder,
#bb-section-payment-body #cardNumber,
#bb-section-payment-body #expiryDate,
#bb-section-payment-body #verificationCode {
  margin-bottom: 14px !important;
}

#bb-section-payment-body .mollie-component {
  background: var(--bb-white) !important;
  border: 2px solid var(--bb-text) !important;
  border-radius: 60px !important;
  padding: clamp(12px, 3vw, 16px) clamp(20px, 3vw, 24px) !important;
  box-sizing: border-box !important;
  transition: box-shadow .2s ease !important;
}

#bb-section-payment-body .mollie-component iframe {
  display: block !important;
  width: 100% !important;
}

#bb-section-payment-body .mollie-component.is-focused {
  box-shadow: 0 0 0 2px var(--bb-text) !important;
}
#bb-section-payment-body .mollie-component.is-invalid {
  box-shadow: 0 0 0 2px var(--bb-red) !important;
}

#bb-section-payment-body .place-order,
#bb-section-payment-body #place_order,
#bb-section-payment-body .bb-place-order-btn {
  display: none !important;
}

#bb-section-payment-body .woocommerce-terms-and-conditions-wrapper {
  font-size: var(--bb-fs-small) !important;
  margin-top: 12px !important;
}

/* Rechte Spalte */
.bb-order-review__products {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
  margin-bottom: 20px !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid var(--bb-border) !important;
}

.bb-order-review__item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px !important;
}

.bb-order-review__item-image {
  flex-shrink: 0 !important;
  width: 64px !important;
  height: 64px !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: var(--bb-field-bg) !important;
}
.bb-order-review__item-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: 12px !important;
}

.bb-order-review__item-details {
  flex: 1 !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
}

.bb-order-review__item-qty {
  font-size: calc(var(--bb-fs-small) * 1.2) !important;
  line-height: 1.3;
  color: var(--bb-muted) !important;
  font-weight: 700 !important;
}

.bb-order-review__item-name {
  font-size: var(--bb-fs) !important;
  font-weight: 700 !important;
  color: var(--bb-text) !important;
  line-height: 1.3 !important;
  display: block !important;
  margin-bottom: .2em !important;
}

.bb-order-review__item-meta {
  font-size: calc(var(--bb-fs-small) * 1.2) !important;
  line-height: 1.3;
  color: var(--bb-muted) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  margin-bottom: .64em;
}

.bb-order-review__item-bulk {
  color: var(--bb-green) !important;
  font-weight: 600 !important;
}

.bb-order-review__item-price {
  font-size: var(--bb-fs) !important;
  font-weight: 700 !important;
  color: var(--bb-text) !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  text-align: right !important;
  line-height: 1.3 !important;
}

.bb-order-review__item-price .wgm-tax {
  display: none !important;
}

.bb-order-review__totals {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

.bb-order-review__row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: baseline !important;
  gap: 8px !important;
  font-size: var(--bb-fs) !important;
}

.bb-order-review__label { color: var(--bb-text) !important; }

/* Labels dieser Zeilen fett (nur linker Text) */
.bb-order-review__subtotal > .bb-order-review__label,
.bb-order-review__shipping > .bb-order-review__label,
.bb-order-review__discount > .bb-order-review__label,
.bb-order-review__giftcard-line > .bb-order-review__label {
  font-weight: 700 !important;
}
.bb-order-review__value { font-weight: 500 !important; color: var(--bb-text) !important; text-align: right !important; }
.bb-order-review__value--discount { color: var(--bb-green) !important; font-weight: 700 !important; }
.bb-order-review__value--giftcard { color: var(--bb-green) !important; font-weight: 700 !important; }

/* Aufeinanderfolgende Rabatt-/Guthaben-Zeilen enger gruppieren: gap der Totals
   ist 14px, hier auf ~4px reduziert (margin-top -10px), damit Mengenrabatte,
   Rabattcode und Guthaben als zusammengehöriger Block wirken. */
.bb-order-review__discount + .bb-order-review__discount,
.bb-order-review__discount + .bb-order-review__giftcard-line,
.bb-order-review__giftcard-line + .bb-order-review__discount,
.bb-order-review__giftcard-line + .bb-order-review__giftcard-line {
  margin-top: -10px !important;
}

/* "Versand durch …" – einzeilig, linksbündig, direkt unter "Versand" (0px Abstand) */
.bb-order-review__shipping-label--inline {
  justify-content: flex-start !important;
  margin-top: -14px !important; /* kompensiert gap 14px vollständig -> Unterzeile schließt direkt an */
}
.bb-order-review__shipping-by {
  color: var(--bb-text) !important;
  text-align: left !important;
}

.bb-free-shipping    { color: var(--bb-green) !important; font-weight: 700 !important; }
.bb-shipping-pending { color: var(--bb-muted) !important; font-style: italic !important; }

.bb-order-review__total {
  margin-top: 0 !important;
}
.bb-order-review__total .bb-order-review__label {
  font-size: var(--bb-fs-h4) !important;
  font-weight: 700 !important;
}
.bb-order-review__total .bb-order-review__value {
  font-size: var(--bb-fs-h4) !important;
  font-weight: 700 !important;
}

.bb-order-review__tax-line {
  font-size: var(--bb-fs-small) !important;
  color: var(--bb-muted) !important;
  margin-top: -14px !important; /* direkt unter "Gesamt" (0px Abstand) */
}

.bb-order-review__totals label[for="use_gift_card_balance"],
.bb-order-review__totals #use_gift_card_balance {
  display: none !important;
}

/* Guthaben-Karte (Optik wie Versand-/Zahlungsmethode) */
#bb-section-coupon-body .bb-giftcard-card {
  flex: 0 0 100% !important;
  width: 100% !important;
  border: 2px solid var(--bb-border) !important;
  border-radius: 16px !important;
  background: var(--bb-white) !important;
  transition: border-color .2s ease !important;
  margin-top: 4px !important;
  overflow: hidden !important;
}
#bb-section-coupon-body .bb-giftcard-card:has(input[type="checkbox"]:checked) {
  border-color: var(--bb-text) !important;
}
#bb-section-coupon-body .bb-giftcard-card__label {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 14px 18px !important;
  margin: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  font-size: var(--bb-fs) !important;
}

#bb-section-coupon-body .bb-giftcard-card__text {
  color: var(--bb-text) !important;
}

#bb-section-coupon-body .bb-giftcard-card__amount {
  margin-left: auto !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
#bb-section-coupon-body .bb-giftcard-card__amount .woocommerce-Price-amount {
  font-weight: 700 !important;
}
/* Guthaben inaktiv → grün (verfügbar zum Verwenden) */
#bb-section-coupon-body .bb-giftcard-card__amount--available,
#bb-section-coupon-body .bb-giftcard-card__amount--available .woocommerce-Price-amount {
  color: var(--bb-green) !important;
}
/* Guthaben aktiv → ebenfalls grün (wird mit Minus davor verwendet) */
#bb-section-coupon-body .bb-giftcard-card__amount--active,
#bb-section-coupon-body .bb-giftcard-card__amount--active .woocommerce-Price-amount {
  color: var(--bb-green) !important;
}

#bb-section-coupon-body .bb-giftcard-notice {
  margin: 12px 0 0 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  color: var(--bb-text) !important;
}

.bb-order-review__cta {
  margin-top: 20px !important;
}

.bb-order-review__sep {
  border: 0 !important;
  border-top: 1px solid var(--bb-border, #e5e5e5) !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  background: none !important;
  width: 100% !important;
}

.bb-order-review__cta-btn {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  background: var(--bb-text) !important;
  color: var(--bb-white) !important;
  border: none !important;
  border-radius: 60px !important;
  font-size: var(--bb-fs-button) !important;
  font-family: inherit !important;
  font-weight: 400 !important;
  padding: clamp(14px,3vw,18px) clamp(20px,3vw,24px) !important;
  cursor: pointer !important;
  text-align: center !important;
  text-decoration: none !important;
  transition: opacity .2s ease !important;
  line-height: var(--bb-lh-button) !important;
}
.bb-order-review__cta-btn:hover { opacity: .85 !important; }

/* Responsive */
@media (max-width: 600px) {
  /* Padding nur für GEÖFFNETE Bodies – geschlossene bleiben bei 0 (kein Leerraum) */
  .bb-section-toggle[aria-expanded="true"] + .bb-section-body { padding: 18px !important; }
  .bb-section-toggle { padding: 16px 18px !important; }
  .bb-coupon-wrapper { flex-wrap: wrap !important; }
  .bb-coupon-wrapper .form-row-first  { flex: 0 0 60% !important; max-width: 60% !important; }
  .bb-coupon-wrapper .form-row-last   { flex: 0 0 calc(40% - 10px) !important; max-width: calc(40% - 10px) !important; }
  .bb-coupon-submit { width: 100% !important; }
}
/* ==========================================================================
   Geschenkkarten-Hinweise + Gast-Session-Karte (Gutschein-Box)
   ========================================================================== */

/* Statushinweise (hinzugefügt / entfernt / Fehler) */
#bb-section-coupon-body .bb-gc-notice {
  width: 100%;
  margin: 12px 1em 0;
  box-sizing: border-box;
}
#bb-section-coupon-body .bb-coupon-success.bb-gc-notice { color: #2e7d32; }
#bb-section-coupon-body .bb-coupon-error.bb-gc-notice   { color: var(--bb-red); }

/* "Restguthaben"-Zusatz: immer in eigener Zeile (Umbruch via <br> im Markup) */
#bb-section-coupon-body .bb-gc-rest { white-space: nowrap; }

/* Gast-Session-Karte: "Aktives Guthaben … Entfernen" */
#bb-section-coupon-body .bb-gc-session-list {
  width: 100%;
  margin-top: 12px;
}
#bb-section-coupon-body .bb-gc-session-item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 8px 0;
  margin: 0 1em;
  border-top: 1px solid #eee;
}
#bb-section-coupon-body .bb-gc-session-info {
  display: flex;
  flex-direction: column;
}
#bb-section-coupon-body .bb-gc-session-code {
  color: #777;
  font-size: .9em;
}
#bb-section-coupon-body .bb-gc-remove {
  background: none;
  border: none;
  color: #c0392b;
  cursor: pointer;
  text-decoration: underline;
  padding: 0;
  font-size: inherit;
  white-space: nowrap;
  flex: 0 0 auto;
}

@media (max-width: 600px) {
  /* Gast-Session-Karte: alles linksbündig untereinander */
  #bb-section-coupon-body .bb-gc-session-info {
    width: 100%;
    align-items: flex-start;
    text-align: left;
  }
  #bb-section-coupon-body .bb-gc-session-amount,
  #bb-section-coupon-body .bb-gc-session-code {
    text-align: left;
  }
}

/* Session-Karte auf Mobil/Tablet linksbündig stapeln (gleicher Breakpoint wie übriger mobiler Checkout) */
@media (max-width: 768px) {
  #bb-section-coupon-body .bb-gc-session-item {
    flex-direction: column !important;
    align-items: flex-start !important;
    text-align: left !important;
  }
  #bb-section-coupon-body .bb-gc-remove {
    margin-top: 0.6em;
    margin-left: 0;
    text-align: left !important;
  }
}