.wcfvb-box {
    padding: 15px !important;
}
/* Preis links, Sterne rechts – eine einheitliche Definition */
.wcfvb-price-rating-wrap {
    display: flex;
    align-items: baseline; /* bündig auf Textlinie */
    justify-content: space-between;
    gap: 12px;
    flex-wrap: nowrap; /* Desktop: keine Umbrüche */
}

/* Title and rating alignment for out-of-stock products.  Aligns the rating to the right of the
   product title, similar to the price-rating wrap used for available variations. */
.wcfvb-title-rating-wrap {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}
.wcfvb-title-rating-wrap .wcfvb-rating {
    flex: 0 0 auto;
    display: flex;
    align-items: baseline;
}
/* Normalize the star rating inside the title-rating wrap */
.wcfvb-title-rating-wrap .wcfvb-rating .star-rating {
    float: none;
    margin: 0;
    line-height: 1;
    white-space: nowrap;
}

.wcfvb-price-rating-wrap .wcfvb-price-range {
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
    flex: 1 1 auto;
    min-width: 0;
}

.wcfvb-price-rating-wrap .wcfvb-rating {
    flex: 0 0 auto;
    display: flex;
    align-items: baseline; /* gleicht Höhe an Preis an */
}

.wcfvb-price-rating-wrap .wcfvb-rating .star-rating {
    float: none;
    margin: 0;
    line-height: 1;
    white-space: nowrap;
}

/* Mobile Breakpoints */
@media (max-width: 420px) {
    .wcfvb-price-rating-wrap {
        flex-wrap: nowrap; /* auch auf kleinen Screens in einer Zeile */
        gap: 6px;
    }
    .wcfvb-price-rating-wrap .wcfvb-price-range {
        font-size: 13px;
    }
    .wcfvb-price-rating-wrap .wcfvb-rating .star-rating {
        font-size: 12px;
    }
}

/*
 * Verhindert doppelte Ausgaben aus der Produktzusammenfassung
 *
 * In älteren Versionen wurde durch folgende Regel sichergestellt, dass WooCommerce
 * nach unserer Box keine Elemente wie Preis, Steuerhinweise oder Bewertungen
 * mehr ausgibt. Dies verhindert, dass sich Preise doppeln oder Informationen
 * außerhalb der Box erscheinen – ein häufiges Problem bei unterschiedlichen
 * Themes und Plugins (z. B. WooCommerce Germanized). Obwohl die neuere
 * Version versucht, einzelne Price-Elemente gezielt auszublenden, blieb die
 * generelle Regel für manche Themes unverzichtbar. Daher reaktivieren wir sie
 * hier wieder. Sie sorgt dafür, dass alle direkten Geschwister der
 * `.wcfvb-box` innerhalb der Produktzusammenfassung ausgeblendet werden.
 *
 * Hinweis: Die Sternebewertung und Preisinformationen werden innerhalb der
 * Box separat ausgegeben. Externe Ratings und Preise verschwinden damit
 * vollständig, sodass keine doppelten Inhalte mehr sichtbar sind. Andere
 * Elemente wie Social-Sharing-Icons müssen bei Bedarf serverseitig oder per
 * zusätzlichem CSS wieder eingebunden werden.
 */
.summary.entry-summary .wcfvb-box ~ * {
    display: none !important;
}


/* Standardize the font-size inside the price range */
.wcfvb-price-range .woocommerce-Price-amount {
    font-size: inherit !important;
}
.wcfvb-price-range .woocommerce-Price-currencySymbol {
    font-size: inherit !important;
}
/* Ensure the text “Ab” has the same size as the price */
.wcfvb-price-range,
.wcfvb-price-range * {
    font-size: inherit !important;
}

/* Styles for the variations form inside the box */
.wcfvb-box .variations {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin-top: 10px;
    border: none;
}
.wcfvb-box .variations tr {
    margin-bottom: 10px;
    display: block;
    border: none;
}
.wcfvb-box .variations td {
    display: block !important;
    width: 100% !important;
    padding: 0;
    border: none;
}

/* Responsive layout: show two variation options side by side on larger screens */
@media (min-width: 768px) {
    .wcfvb-box .variations,
    .wcfvb-box .variations tbody {
        display: flex !important;
        flex-wrap: wrap;
        width: 100% !important;
    }
    .wcfvb-box .variations tr {
        display: flex !important;
        flex-direction: column;
        flex: 0 0 50% !important;
        max-width: 50% !important;
        box-sizing: border-box;
        padding-right: 15px;
        margin-bottom: 10px;
    }
    .wcfvb-box .variations tr:nth-child(2n) {
        padding-right: 0;
    }
}
@media (max-width: 767px) {
    .wcfvb-box .variations,
    .wcfvb-box .variations tbody {
        display: block !important;
    }
    .wcfvb-box .variations tr {
        display: block !important;
        flex-basis: 100% !important;
        max-width: 100% !important;
        padding-right: 0;
        margin-bottom: 10px;
    }
}
.wcfvb-box .variations td.label {
    font-weight: 600;
    margin-bottom: 4px;
    font-size: 14px;
    color: #000;
}

/* Normalize line-height for labels */
.wcfvb-box .variations td.label {
    line-height: 25px;
}
.wcfvb-box .variations td.value select {
    width: 100% !important;
    max-width: 100% !important;
    display: block;
    box-sizing: border-box;
    padding: 8px 12px;
    font-size: 14px;
    border: 1px solid #c5dbaa;
    border-radius: 3px;
    background-color: #fff;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 6"><path fill="%2397b664" d="M0 0l5 6 5-6z"/></svg>');
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 10px 6px;
}

/* Ensure the value cell stretches full width */
.wcfvb-box .variations td.value {
    width: 100%;
    display: block;
}

/* Override theme-specific constraints for select wrappers */
.wcfvb-box .variations td.value > * {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
}

/* Prevent line break between price and currency symbol in the first variation box */
.wcfvb-date-price .woocommerce-Price-amount,
.wcfvb-date-price .woocommerce-Price-currencySymbol {
    white-space: nowrap;
}

/* --- FIX: Preis bleibt rechts, bekommt aber Mindestabstand --- */
.wcfvb-date-price {
    /* die Box selbst bekommt (zusätzlich zum Inline-Style) einen Mindestabstand
       zwischen den Kindern und wrap bleibt aus -> Preis bleibt rechts */
    gap: 6px !important;
    flex-wrap: nowrap !important;
}
.wcfvb-date-price > span:first-child {
    /* Textseite darf wachsen/mehrzeilig sein und schrumpfen */
    flex: 1 1 auto;
    min-width: 0;
}
.wcfvb-date-price > span:last-child {
    /* Preis behält seine Breite und bekommt zur Sicherheit noch etwas Abstand */
    flex: 0 0 auto;
    margin-left: 8px;
}

/* Style strikethrough (old price) slightly smaller */
.wcfvb-box del .woocommerce-Price-amount,
.wcfvb-box del .woocommerce-Price-currencySymbol {
    font-size: 13px !important;
}

/* Style for the “Jetzt Platz sichern” button inside the variations form */
.wcfvb-box .wcfvb-show-more {
    background: #3B6C33 !important;
}
.wcfvb-box .wcfvb-buttons .button {
    white-space: normal !important;   /* Text darf in die nächste Zeile */
    word-break: break-word !important; /* Notfall-Umbruch mitten im Wort */
    flex: 1 1 0% !important;           /* beide Buttons passen in eine Zeile */
    min-width: 0 !important;           /* verhindert Überbreite in Flex */
}

/* Extra Sicherung für sehr kleine Screens */
@media (max-width: 480px) {
    .wcfvb-box .wcfvb-buttons {
        flex-wrap: wrap !important; /* Buttons dürfen untereinander gehen */
    }
    .wcfvb-box .wcfvb-buttons .button {
        flex: 1 1 100% !important;  /* voller Block pro Zeile */
    }
}
.wcfvb-box .single_add_to_cart_button:hover {
    background: #5a8810;
}

/* Verhindert doppelte Preisanzeige: Blendet die Standardausgabe von WooCommerce (Preis,
   inkl. MwSt.-Hinweise etc.) aus, die nach der wcfvb-Box erscheinen würde.  Wir
   beschränken diese Regel auf direkte Geschwister der Box innerhalb der
   Produktzusammenfassung, sodass nur Elemente außerhalb der Box betroffen sind. */
.summary.entry-summary .wcfvb-box ~ .price,
.summary.entry-summary .wcfvb-box ~ p.price,
.summary.entry-summary .wcfvb-box ~ .woocommerce-Price-amount,
.summary.entry-summary .wcfvb-box ~ .woocommerce-variation-price,
.summary.entry-summary .wcfvb-box ~ .woocommerce-gzd-price-html,
.summary.entry-summary .wcfvb-box ~ .tax_label,
.summary.entry-summary .wcfvb-box ~ .woocommerce-gzd-taxes,
.summary.entry-summary .wcfvb-box ~ .gzd-product-info,
.summary.entry-summary .wcfvb-box ~ .price-wrapper {
    display: none !important;
}

/* Verhindert, dass die Standard-Sternebewertung außerhalb der wcfvb-Box erscheint.  Die
   Bewertung wird innerhalb der Box neben der Überschrift dargestellt. */

/* Fange weitere Preis- und Steuer-Ausgaben ab, die manche Themes/Plugins direkt
   als p- oder div-Elemente in der Produktzusammenfassung einfügen.  Diese
   Selektoren greifen auf direkte Nachbarn der wcfvb-Box sowie auf direkte
   Kinder der Zusammenfassung zu, um Inhalte außerhalb der Box auszublenden. */
.summary.entry-summary > p.price,
.summary.entry-summary > div.price,
.summary.entry-summary > span.price,
.summary.entry-summary > p[class*="price"],
.summary.entry-summary > div[class*="price"],
.summary.entry-summary .wcfvb-box ~ p[class*="price"],
.summary.entry-summary .wcfvb-box ~ div[class*="price"],
.summary.entry-summary .wcfvb-box ~ span[class*="price"],
.summary.entry-summary > p.tax,
.summary.entry-summary > span.tax,
.summary.entry-summary .wcfvb-box ~ p.tax,
.summary.entry-summary .wcfvb-box ~ span.tax {
    display: none !important;
}

/* Fange einzelne Price-Elemente ab, die als span.woocommerce-Price-amount.amount ausgegeben werden */
.summary.entry-summary > span.woocommerce-Price-amount.amount,
.summary.entry-summary .wcfvb-box ~ span.woocommerce-Price-amount.amount {
    display: none !important;
}

/*
 * Blende den Hinweis sowie den „Weitere Termine & Optionen“-Button aus,
 * wenn per data-Attribut signalisiert wird, dass nur eine Variation
 * verfügbar ist. Auf diese Weise wird verhindert, dass Benutzer
 * irrtümlich auf einen Button klicken, der keine weiteren Optionen
 * anzeigt. Sollte das Markup die Elemente dennoch enthalten, sorgt
 * diese Regel dafür, dass sie versteckt bleiben.
 */
.wcfvb-box[data-show-more-button="false"] .wcfvb-hint,
.wcfvb-box[data-show-more-button="false"] .wcfvb-show-more {
    display: none !important;
}

/* Quantity field within the variations form */
.wcfvb-box .variations_form .quantity {
    margin-top: 0;
    margin-bottom: 0;
    display: flex;
    flex-shrink: 0;
}
.wcfvb-box .variations_form .quantity input.qty,
.wcfvb-box .variations_form .quantity .minus,
.wcfvb-box .variations_form .quantity .plus {
    border-top: 1px solid #c5dbaa;
    border-bottom: 1px solid #c5dbaa;
    box-sizing: border-box;
    height: 100%;
    line-height: normal;
    padding: 0;
}
.wcfvb-box .variations_form .quantity input.qty {
    width: 60px;
    text-align: center;
    border-left: none;
    border-right: none;
}
.wcfvb-box .variations_form .quantity .minus,
.wcfvb-box .variations_form .quantity .plus {
    width: 40px;
    text-align: center;
    border-left: 1px solid #c5dbaa;
    border-right: 1px solid #c5dbaa;
    background: #f5f5f5;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Layout quantity and add-to-cart button side by side */
.wcfvb-box .variations_form .variations_button {
    display: flex;
    align-items: stretch;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 15px;
}
@media (max-width: 767px) {
    .wcfvb-box .variations_form .variations_button {
        flex-direction: row;
        align-items: stretch;
    }
    .wcfvb-box .single_add_to_cart_button {
        width: auto;
        margin-top: 0;
    }
}

/* Hinweistext unterhalb der Verfügbarkeitsanzeige */
.wcfvb-hint {
    font-size: 0.85em;
    margin-top: 10px;
}

/* Hide the hint when the variations form is expanded */
/* When the box is expanded (i.e. the variations form is shown), hide the
   first variation row, availability indicator, hint and initial book button.
   Also ensure the variations form itself is visible. */
.wcfvb-box.wcfvb-expanded .wcfvb-date-price,
.wcfvb-box.wcfvb-expanded .wcfvb-availability,
.wcfvb-box.wcfvb-expanded .wcfvb-hint,
.wcfvb-box.wcfvb-expanded .wcfvb-book-first {
    display: none !important;
}
.wcfvb-box.wcfvb-expanded .wcfvb-variations {
    display: block !important;
}
/* When not expanded, hide the variations form to show the first variation
   instead. This rule ensures that any inline styles set by other scripts
   are overridden. */
.wcfvb-box:not(.wcfvb-expanded) .wcfvb-variations {
    display: none !important;
}

/* Fokus-Stile zur Verbesserung der Barrierefreiheit.  Diese Umrandungen
   werden angezeigt, wenn ein Benutzer per Tastatur navigiert (focus-visible).
   Sie erleichtern die Orientierung, ohne das bestehende Design wesentlich zu verändern. */
.wcfvb-box select:focus-visible,
.wcfvb-box button:focus-visible,
.wcfvb-box a.button:focus-visible {
    outline: 2px solid #6C9E13;
    outline-offset: 2px;
}