/* WooCommerce: product lists, product details and checkout controls. */

/* Show the cart and checkout task immediately below the site navigation. */
body:is(.woocommerce-cart, .woocommerce-checkout) #pageheader {
    display: none;
}

/* WooCommerce and Divi float widths leave the desktop third column empty. */
@media (min-width: 981px) {
    body.woocommerce-page ul.products[class*="columns-"] {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 40px 28px;
        padding: 0;
    }

    body.woocommerce-page ul.products.columns-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.woocommerce-page ul.products.columns-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    body.woocommerce-page ul.products[class*="columns-"]::before,
    body.woocommerce-page ul.products[class*="columns-"]::after {
        content: none;
        display: none;
    }

    body.et_pb_gutters3.woocommerce-page #main-content ul.products[class*="columns-"] li.product:nth-child(n) {
        float: none;
        clear: none;
        width: auto;
        min-width: 0;
        margin: 0;
    }
}

body.woocommerce-page ul.products li.product .woocommerce-loop-product__title {
    font-size: 20px;
    line-height: 1.25;
    hyphens: none;
}

body.woocommerce-page ul.products li.product .price {
    display: block;
    color: #2c4b2e;
    font-size: 18px;
    font-weight: 700;
    margin: 7px 0 0;
}

body.woocommerce-page ul.products li.product .price-unit {
    color: #596159;
    font-size: 14px;
    font-weight: 400;
    margin: 2px 0 0;
}

body.woocommerce-page ul.products li.product .tax-info,
body.woocommerce-page ul.products li.product .shipping-costs-info {
    font-size: 13px;
    line-height: 1.4;
    margin: 5px 0 0;
}

/* Product details and quantity controls. */
body.single-product.woocommerce-page div.product .summary h1.product_title {
    margin-bottom: 20px;
}

body.single-product.woocommerce-page div.product .summary p.price-unit {
    color: #596159;
    font-size: 16px;
    margin-top: -8px;
}

body.single-product.woocommerce-page div.product .product_meta .sku_wrapper,
body.single-product.woocommerce-page div.product .product_meta .posted_in {
    display: block;
}

body.woocommerce-page .quantity .qty {
    box-sizing: border-box;
    width: 68px;
    min-height: 48px;
    padding: 10px;
    border: 1px solid #aebdae;
    border-radius: 2px;
    background: #fff;
    color: #1d1d1b;
    text-align: center;
}

/* Keep every classic WooCommerce action in the site's green button style. */
body.woocommerce-page :is(a, button, input).button,
body.woocommerce-page :is(a, button, input).button.alt {
    box-sizing: border-box;
    max-width: 100%;
    min-height: 48px;
    padding: 11px 18px;
    border: 2px solid #2c4b2e;
    border-radius: 2px;
    background: #fff;
    color: #2c4b2e;
    font-family: 'Nunito', sans-serif;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease;
}

body.woocommerce-page #page-container :is(a, button, input).button::after {
    content: none;
    display: none;
}

body.woocommerce-page #page-container :is(a, button, input).button:not(:disabled):not(.disabled):hover {
    padding: 11px 18px;
    border-color: #2c4b2e;
    background: #e8f1e8;
    color: #2c4b2e;
}

body.woocommerce-page :is(a, button, input).button:focus-visible {
    outline: 2px solid #2c4b2e;
    outline-offset: 3px;
}

body.woocommerce-page #page-container :is(a, button, input).button:is(:disabled, .disabled),
body.woocommerce-page #page-container :is(a, button, input).button:is(:disabled, .disabled):hover {
    padding: 11px 18px;
    border-color: #aebdae;
    background: #f1f3f1;
    color: #596159;
    font-size: 17px;
    font-weight: 600;
    opacity: 1;
    cursor: not-allowed;
    transition: none;
}

body.woocommerce-page .checkout-button.button {
    display: block;
    width: 100%;
}

/* Checkout fields should remain distinct from their background. */
body.woocommerce-page form.checkout input.input-text,
body.woocommerce-page form.checkout select,
body.woocommerce-page form.checkout textarea {
    box-sizing: border-box;
    border: 1px solid #aebdae;
    border-radius: 2px;
    background: #fff;
    color: #1d1d1b;
}

body.woocommerce-page form.checkout input.input-text:focus,
body.woocommerce-page form.checkout select:focus,
body.woocommerce-page form.checkout textarea:focus {
    border-color: #2c4b2e;
    outline: 2px solid #c2d7c3;
    outline-offset: 1px;
}

#wein_info,
#wein_info_allergene,
#wein_info_versand {
    text-align: center;
    font-size: .9em;
    margin-bottom: 12px;
}

#wein_info_versand {
    font-size: 1.1em;
}

@media (min-width: 768px) and (max-width: 980px) {
    body.woocommerce-page ul.products[class*="columns-"] {
        display: flex;
        flex-wrap: wrap;
    }

    body.woocommerce-page ul.products[class*="columns-"]::before,
    body.woocommerce-page ul.products[class*="columns-"]::after {
        content: none;
        display: none;
    }

    body.woocommerce-page ul.products[class*="columns-"] li.product {
        flex: 0 0 42.5%;
        min-width: 0;
    }

    body.woocommerce-page ul.products.columns-3 li.product.last {
        box-sizing: content-box;
        padding-right: 7.5%;
    }
}

@media (max-width: 767px) {
    body.single-product.woocommerce-page div.product .summary {
        margin-top: 40px;
    }

    body.single-product.woocommerce-page div.product form.cart {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
        gap: 10px;
    }

    body.single-product.woocommerce-page div.product form.cart .quantity {
        margin: 0;
    }
}