/* ===========================
   FIX RADIO BUTTON LAYOUT FOR ANREDE
   Field ID: gfield_5_54
   =========================== */

#gfield_5_54 .gfield_radio li {
    display: inline-flex !important;
    align-items: center;
    margin-right: 25px !important;
    margin-bottom: 0 !important;
}

#gfield_5_54 .gfield_radio {
    display: flex !important;
    flex-direction: row !important;
}

/* ===========================
   FIX WIDTH FOR Vorname + Nachname
   Field IDs: gfield_5_8 and gfield_5_9
   =========================== */

/* REAL WIDTH FIX */
#field_5_8.gfield--width-third,
#field_5_9.gfield--width-third,
#field_5_61,
#field_5_62,
#field_5_73,
#field_5_72,
#field_15_61,
#field_15_62{
    width: 100% !important;               /* Override GF “width-third” */
    max-width: 100% !important;
    flex: 1 1 100% !important;            /* Override GF flex rules */
    grid-column: span 6 !important;
}
@media only screen and (max-width: 639px){
    #field_5_8.gfield--width-third,
    #field_5_9.gfield--width-third,
    #field_5_61,
    #field_5_62,
    #field_5_73,
    #field_5_72,
    #field_15_61,
    #field_15_62{ 
        grid-column: span 12 !important;
    }
}

#field_5_8 .ginput_container input,
#field_5_9 .ginput_container input {
    width: 100% !important;               /* Make the input fill the field */
    max-width: 100% !important;
    box-sizing: border-box;
}

/* ===========================
   Style Adjustments 2026-01-14
   [URL]/buchungsformular/
   =========================== */

body {
    overflow-x: hidden!important;
}
#gform_wrapper_5 {
    background-color: #ffffff;
    padding: 80px;
    box-shadow: 0 0 24px rgba(62, 87, 69, .15);
    margin-top: 140px;
    border-radius: 32px;
}
@media only screen and (max-width: 767px){
    #gform_wrapper_5 {
        padding: 40px 24px;
    }
}
.gform_fields {
    row-gap: 30px!important;
}
#gform_wrapper_5 h2.gform_title {
    margin-top: 0;
}
.gform-theme--foundation .gfield input.medium {
    inline-size: 100%!important;
}
span.selection > span,
input[type="number"],
input[type="email"],
input#input_5_8,
input#input_5_9,
input#input_5_61,
input#input_5_62,
input#input_5_73,
input#input_5_72,
input#field_15_61,
input#field_15_62{
    border: 1px solid #3e5745!important;
    border-radius: 8px!important;
    color: #202020!important;
    font-family: inherit;
    font-size: inherit;
    height: 0;
    width: 100%!important;
    max-width: 100%;
    min-height: 50px!important;
    padding: 10px 15px!important;
}
span.selection > span:focus,
input[type="number"]:focus-visible,
input[type="email"]:focus-visible,
input#input_5_8:focus,
input#input_5_9:focus,
input#input_5_61:focus,
input#input_5_62:focus,
input#input_5_73:focus,
input#input_5_72:focus,
input#input_15_61:focus,
input#input_15_62:focus{
    border-color: #b2b015!important;
    outline: none!important;
}
.gf-custom-btn {
    background-color: transparent!important;
    color: #b2b015!important;
    text-decoration: underline!important;
    border: none;
    box-shadow: none!important;
    margin-top: 32px!important;
}
.gf-custom-btn:hover {
    color: #3e5745!important;
    text-decoration: none!important;
}
button:focus,
input[type="button"] {
    outline: none!important;
}
input.gform_next_button,
input[type="submit"],
.product-btn {
    background-color: #b2b015!important;
    border: 2px solid #b2b015;
    border-radius: 32px!important;
    font-size: 18px!important;
    font-weight: 400!important;
    line-height: 24px!important;
    min-height: 36px!important;
    min-width: 36px!important;
    padding: 16px 22px!important;
    transition: background-color var(--transition-duration) ease, border-color var(--transition-duration) ease, color var(--transition-duration) ease!important;
}
input.gform_previous_button {
    background-color: #fff!important;
    color: #b2b015!important;
    border: 2px solid #b2b015!important;
    border-radius: 32px!important;
    font-size: 18px!important;
    font-weight: 400!important;
    line-height: 20px!important;
    min-height: 36px!important;
    min-width: 36px!important;
    padding: 16px 22px!important;
    transition: background-color var(--transition-duration) ease, border-color var(--transition-duration) ease, color var(--transition-duration) ease!important;
}
.gform-page-footer {
    justify-content: center!important;
}
.gform-theme--foundation .gform_page_footer {
    margin-block-start: 40px!important;
}
input.gform_next_button:hover,
input[type="submit"]:hover,
.product-btn:hover,
button.ui-button {
    background-color: #3e5745!important;
    border-color: #3e5745!important;
    color: #fffbf8!important;
}
input.gform_previous_button:hover {
    background-color: #b2b015!important;
    border-color: #b2b015!important;
    color: #fff!important;
}
body .select2-container .select2-selection--single {
    padding: 0 10px 0 10px!important;
}
.select2-selection__clear {
    background-color: #b2b015!important;
    font-size: 24px!important;
    aspect-ratio: 1 / 1!important;
    padding: 10px 0!important;
}
.select2-selection__clear:hover {
    background-color: #3e5745!important;
    color: #fffbf8!important;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: #b2b015!important;
}
.ui-dialog {
    border-radius: 32px;
}
@media only screen and (max-width: 450px){
    .ui-dialog {
        width: 100%!important;
    }
}
.ui-dialog .ui-dialog-titlebar {
    margin: 16px 20px;
    border: none;
}
.ui-dialog-content {
    padding: 0 36px!important;
}
.ui-button.ui-dialog-titlebar-close {
    top: 12px!important;
    right: 12px!important;
    border-radius: 32px!important;
    background-color: #b2b015!important;
    color: #fff!important;
}
.ui-button.ui-dialog-titlebar-close:hover {
    background-color: #3e5745!important;
}
button.ui-button {
    display: flex;
}
fieldset#field_5_54,
fieldset#field_5_60 {
    grid-column: span 7!important;
}
.gchoice label {
    margin: 0!important;
}
.gfield--type-html p {
    margin: 0 0 4px!important;
}
.ui-dialog-buttonpane {
    border-top: none!important;
    padding: 16px 36px!important;
    display: flex;
    justify-content: center;
}
.ui-dialog-buttonpane button {
    border-radius: 32px!important;
    padding: 12px 22px!important;
    height: auto!important;
    background-color: #b2b015!important;
    margin-left: 0!important;
    border: none!important;
    box-shadow: none!important;
}
.ui-dialog-buttonpane button:hover {
    background-color: #3e5745!important;
}
.gform_validation_errors {
    border-radius: 0!important;
    outline: none!important;
    padding: 0!important;
    background: none!important;
    border: none!important;
    box-shadow: none!important;
    display: none!important;
}
.gform_validation_errors ol {
    padding-inline: 0!important;
    list-style-type: none!important;
}
#field_5_51 > div {
    background: #fcfcfc!important;
    border-radius: 8px;
}
.gform-theme--framework .gform-loader {
    border-block-end-color: #b2b015!important;
    border-inline-start-color: #b2b015!important;
}
.infobox {
    border: 2px solid;
    padding: 12px;
    margin: 12px 0;
    border-radius: 20px;
}

/* Hide title & description for form ID 3 */
#gform_wrapper_5 .gform_title,#gform_wrapper_5 .gform_description {
    display: none !important;
}

/* Hide specific Gravity Forms instructions unless they are validation messages */
#gfield_instruction_5_4:not(.gfield_validation_message),
#gfield_instruction_5_3:not(.gfield_validation_message),
#gfield_instruction_5_25:not(.gfield_validation_message) {
    display: none !important;
}

/* ===============================
   SELECT2 – iOS / Mobile FIX
   =============================== */

@media (max-width: 768px) {

    /* Ensure Select2 container matches the input */
    .select2-container {       
        width: calc(100vw - 88px)!important; 
        max-width: 100% !important;
    }

    /* Anchor dropdown sizing to container, not viewport */
    .select2-container--open {
        width: calc(100vw - 88px)!important; 
        position: relative;
    }

    .select2-container--open .select2-dropdown {
        width: auto !important;              /* 🔑 critical */
        min-width: 100% !important;          /* match input */
        max-width: 100% !important;          /* prevent overflow */
        left: 0 !important;
        right: auto !important;
        box-sizing: border-box;
    }

    /* Scroll behavior */
    .select2-results__options {
        max-height: 40vh;
        -webkit-overflow-scrolling: touch;
    }
}

/* iOS Safari background fix */
.select2-dropdown,
.select2-results__option {
    background-color: #ffffff !important;
}

.select2-results__option--highlighted {
    background-color: #b4b600 !important;
    color: #ffffff !important;
}

@media (max-width: 768px) {

    /* Constrain search input — THIS fixes width overflow */
    .select2-search--dropdown .select2-search__field {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Prevent internal padding from expanding dropdown */
    .select2-search--dropdown {
        padding: 6px !important;
        box-sizing: border-box !important;
    }

    /* Safety clamp for dropdown itself */
    .select2-dropdown {
        max-width: 100% !important;
        overflow-x: hidden !important;
    }
}


/*debug*/
/*
.select2-dropdown.select2-dropdown--above {
    width: 600px;
    border: 4px solid red !important;
    position: relative !important;
    z-index: 9999 !important;
}
*/

/* fix select2 border on mobile */
.select2-container--open .select2-dropdown--above {
  border-bottom: 1px solid #aaa !important;
  border-bottom-left-radius: 4px !important;
  border-bottom-right-radius: 4px !important;
}

.select2-container--open .select2-dropdown--below {
  border-top: 1px solid #aaa !important;
  border-top-left-radius: 4px !important;
  border-top-right-radius: 4px !important;
}



/* ===========================
   Style Adjustments 2026-07-10
   [URL]/kasse/
   [URL]/kasse/order-received/
   [URL]/produkt/onlinekurs-darmfrieden-reizdarm-entgegenwirken/
   [URL]/produkt/onlinekurs-darmfrieden-reizdarm-entgegenwirken/
   [URL]/produkt/onlinekurs-darmfrieden-reizdarm-entgegenwirken/
   =========================== */

/* /kasse/order-received/ */   
html.woocommerce-checkout .checkout-page {
    max-width: 1216px;
    padding: 80px;
    border-radius: 32px;
}
html.woocommerce-checkout .mainContent>:last-child {
    padding-bottom: 80px;
}
@media (max-width: 1279px){
    html.woocommerce-checkout .checkout-page {
        padding: 60px 24px;
    }
    html.woocommerce-checkout .mainContent>:last-child {
        padding-bottom: 60px;
    }
}
@media (max-width: 767px){
    html.woocommerce-checkout .checkout-page {
        padding: 60px 16px;
    }
}
html.woocommerce-checkout .woocommerce ul.order_details {
    padding-left: 0;
}
html.woocommerce-checkout .woocommerce-message {
    padding: 32px 60px;
    border-radius: 32px;
    border-top-color: transparent;
}
html.woocommerce-checkout .woocommerce-message::before {
    font-size: 32px;
    top: 40px;
    left: 16px;
}
@media (max-width: 550px){
    html.woocommerce-checkout .woocommerce-message {
        padding: 60px 20px 20px;
        border-radius: 32px;
        border-top-color: transparent;
    }
    html.woocommerce-checkout .woocommerce-message::before {
        font-size: 20px;
        top: 20px;
        left: 20px;
    }
}
html.woocommerce-checkout .woocommerce-message h3 {
    margin-top: 0;
}
html.woocommerce-checkout .woocommerce-message p:last-child {
    margin: 0;
}
html.woocommerce-checkout .woocommerce-table--order-details,
html.woocommerce-checkout .woocommerce-checkout-review-order-table {
    border: none!important;
}
a.woocommerce-button,
.woocommerce-form-coupon button,
button.single_add_to_cart_button,
.insurance-box button,
.add_to_cart_button,
button[name="woocommerce_checkout_place_order"]{
    align-items: center;
    -webkit-appearance: none !important;
    -moz-appearance: none;
    appearance: none !important;
    border: 2px solid #b2b015 !important;
    border-radius: 32px !important;
    box-sizing: border-box;
    cursor: pointer !important;
    display: inline-flex !important;
    font-family: inherit;
    font-size: 18px !important;
    font-weight: 400 !important;
    justify-content: center;
    line-height: 20px !important;
    min-height: 36px;
    min-width: 36px;
    padding: 16px 22px !important;
    text-align: center;
    text-decoration: none !important;
    text-transform: none;
    transition: background-color var(--transition-duration) ease, border-color var(--transition-duration) ease, color var(--transition-duration) ease;
    -webkit-user-select: none !important;
    -moz-user-select: none;
    user-select: none !important;
}
@media (max-width: 550px){
    a.woocommerce-button,
    .woocommerce-form-coupon button,
    button.single_add_to_cart_button,
    .insurance-box button,
    .add_to_cart_button,
    button[name="woocommerce_checkout_place_order"]{
        width: 100%;
    }
}
a.woocommerce-button:hover,
.woocommerce-form-coupon button:hover,
button.single_add_to_cart_button:hover,
.insurance-box button:hover,
.add_to_cart_button:hover,
button[name="woocommerce_checkout_place_order"]:hover{
    border-color: #3e5745!important;
}
html.woocommerce-checkout .woocommerce-customer-details address {
    border: none;
    padding: 0;
}
html.woocommerce-checkout .woocommerce-order-details {
    margin-bottom: 60px;
}
html.woocommerce-checkout .woocommerce-customer-details {
    margin-bottom: 0;
}

/* /kasse/ */
html.woocommerce-checkout .checkout-page > h1 {
    margin-top: 0;
}
html.woocommerce-checkout .woocommerce-form-coupon {
    border: none!important;
    padding: 0!important;
}
@media (max-width: 550px){
    html.woocommerce-checkout .woocommerce-form-coupon {
        display: flex !important;
        gap: 0;
        flex-direction: column;
    }
    html.woocommerce-checkout .woocommerce-form-coupon .form-row-first,
    html.woocommerce-checkout .woocommerce-form-coupon .form-row-last {
        display: flex;
        flex: 0 0 100%;
        max-width: 100%;
        width: 100%;
        padding: 0;
    }
    html.woocommerce-checkout .woocommerce-form-coupon .form-row-last button {
        width: 100%;
    }
}
.woocommerce-input-wrapper input {
    -webkit-appearance: none !important;
    -moz-appearance: none;
    appearance: none !important;
    background-color: #fff !important;
    border: 1px solid #3e5745 !important;
    border-radius: 8px !important;
    color: #202020 !important;
    font-family: inherit !important;
    font-size: inherit !important;
    height: 0 !important;
    margin: 0 !important;
    max-width: 100%;
    min-height: 50px;
    padding: 10px 15px !important;
    transition: background-color var(--transition-duration) ease, border-color var(--transition-duration) ease, color var(--transition-duration) ease;
}
.woocommerce-input-wrapper textarea {
    -webkit-appearance: none !important;
    -moz-appearance: none;
    appearance: none !important;
    background-color: #fff !important;
    border: 1px solid #3e5745 !important;
    border-radius: 8px !important;
    color: #202020 !important;
    font-family: inherit !important;
    font-size: inherit !important;
    padding: 10px 15px !important;
    transition: background-color var(--transition-duration) ease, border-color var(--transition-duration) ease, color var(--transition-duration) ease;
}
.woocommerce form .form-row .input-text:hover,
.woocommerce-input-wrapper input:hover,
.woocommerce-input-wrapper textarea:hover {
    border-color: #b2b015;
}
:where(.woocommerce) .select2-container .select2-selection--single .select2-selection__rendered {
    padding: 13.5px .5em!important;
}
@media (max-width: 768px){
    .select2-container {
        width: 100%!important;
    }
}

/* /produkt/... */
.single-product div.flex-viewport {
    border-radius: 32px;
    margin-bottom: 12px;
}
ol.flex-control-thumbs img {
    border-radius: 32px;
    padding-right: 4px;
}
.single-product p.price,
.single-product span.amount {
    font-size: 20px;
    font-weight: 900;
}
.single-product .insurance-box {
    margin-bottom: 40px;
}
.single-product #selfpayer_btn {
    margin-top: 0
}
.single-product #selfpayer_btn {
    font-weight: 600 !important;
    color: #b2b015 !important;
    padding: 0 !important;
    background: transparent;
    border: none !important;
    text-decoration: underline !important;
}
.single-product .woocommerce-product-details__short-description > p:first-child > strong,
.single-product h2.woocommerce-loop-product__title {
    font-size: 32px;
    line-height: 1.25;
    font-family: 'DMSerif';
    color: #3e5745;
}
.single-product h2.woocommerce-loop-product__title {
    font-size: 24px!important;
}
.single-product .woocommerce div.product .woocommerce-tabs ul.tabs li {
    border-radius: 32px 32px 0 0;
    padding: .5em 2em;
    background: transparent!important;
}
.single-product .woocommerce ul.products li.product a img {
    border-radius: 32px;
}
.single-product .booking-effective-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 32px;
}

/* /price calculation/ */

.booking-price-calculation{
    margin:20px 0;
}

.booking-course-price-line,
.booking-reimbursement-row,
.booking-cashback-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin:10px 0;
}

.booking-effective-row{
    margin-top:20px;
    padding-top:18px;
    border-top:1px solid #ddd;
    text-align:center;
}

.booking-effective-label{
    display:block;
    font-weight:700;
    margin-bottom:0;
}

.booking-effective-price{
    display:block;
    font-size:18px;
    font-weight:700;
    color:#7b1d14; /* replace with your CD variable if available */
}

/* ------------------------------------------------------------
 * Task 3: Effektivpreis highlight.
 * The row shows whenever Zuschuss or Cashback exist. While visible
 * the price is ALWAYS green (customer request 2026-08-01: a small
 * remaining amount is still a benefit and must read as positive -
 * the previous dark-red base color made it look like a warning).
 * At 0 EUR the "kostenlos" badge appears additionally (toggled by
 * the shortcode PHP + updatePricingCalculation() in booking.php).
 * ------------------------------------------------------------ */
.booking-effective-row--benefit .booking-effective-price,
.booking-effective-row--free .booking-effective-price{
    color:#1e7e34;
}

.booking-effective-free-badge{
    display:inline-block;
    margin-top:2px;
    color:#1e7e34;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.03em;
    font-size:13px;
}

/* ------------------------------------------------------------
 * Corner-ornament carrier around the product gallery's main image.
 * Mirrors the Ratgeber reference: wrapper exactly on the image,
 * overflow visible so the curls hang OUTSIDE the corners. The
 * z-index lifts the ornaments above FlexSlider's transformed
 * slides, which otherwise paint over pseudo-elements.
 * ------------------------------------------------------------ */
.knorke-corner-wrap{
    position:relative;
    overflow:visible;
}
.knorke-corner-wrap.decorative-corner::before,
.knorke-corner-wrap.decorative-corner::after{
    z-index:2;
}