/* ==========================================================================
   ZUKE Green Kongress – WooCommerce Erweiterungen (v1.16.0)
   Ergänzt style.css um Germanized-Details, Mein-Konto-Feinheiten,
   Bestellübersicht, Loading-Overlays und Avada-Template-Overrides.
   Wird nur geladen wenn WooCommerce aktiv ist.

   v1.16.0 – WooCommerce-Templates-Brand-Alignment:
   - Heading-Fonts (Oswald) auf ALLEN Ebenen (h1–h4) der WC-Routen
     zwangsweise – inkl. Cart-Block, Checkout-Block & Avada-Wrapper.
   - Step-Nav (Rechnungsdaten / Lieferadresse / Prüfen & Bezahlen) im
     ZUKE-Pill-Style mit Lime-Active-State.
   - Promo-Code-Box (Gutschein-Code einlösen) als Card statt Header.
   - Top-User-Container ausgeblendet (Avada-Demo-Müll).
   - Catalog-Ordering-Dropdowns lesbar gemacht.
   - Responsive ab 480px: alles fließt 1-spaltig, Tap-Targets ≥ 44px.
   ========================================================================== */

/* ── Heading-Konsistenz auf ALLEN WooCommerce-Routen ──────────────────── */
.woocommerce h1,
.woocommerce h2,
.woocommerce h3,
.woocommerce h4,
.woocommerce-page h1,
.woocommerce-page h2,
.woocommerce-page h3,
.woocommerce-page h4,
.woocommerce-cart h1,
.woocommerce-cart h2,
.woocommerce-cart h3,
.woocommerce-checkout h1,
.woocommerce-checkout h2,
.woocommerce-checkout h3,
.woocommerce-account h1,
.woocommerce-account h2,
.woocommerce-account h3,
.woocommerce-account h4,
.woocommerce div.product .product_title,
.woocommerce div.product h1.product_title,
.woocommerce h1.entry-title,
.woocommerce-page h1.entry-title,
.woocommerce-cart h1.entry-title,
.woocommerce-checkout h1.entry-title,
.woocommerce h2#order_review_heading,
.woocommerce h3#order_review_heading,
.woocommerce .promo-code-heading,
.woocommerce-cart-form h2,
.woocommerce-shipping-fields h3,
.woocommerce-billing-fields h3,
.woocommerce-additional-fields h3,
.fusion-page-title-bar h1 {
    font-family: 'Oswald', 'Roboto Condensed', 'Arial Narrow', Impact, sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: 0.005em !important;
    color: var(--zk-primary-900, #0f2b0f) !important;
    line-height: 1.15 !important;
}

/* Spezifische Größen: Sektion-Heading (h3 wie "Rechnungsdaten") */
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3,
.woocommerce h3#order_review_heading,
.woocommerce-checkout h3,
.woocommerce-cart h2,
.cart-collaterals .cart_totals h2,
.woocommerce .coupon h2,
.promo-code-heading {
    font-size: clamp(1.4rem, 2.5vw, 1.8rem) !important;
    margin: 0 0 20px 0 !important;
}

/* Body-Konsistenz auf WC */
.woocommerce,
.woocommerce-page,
.woocommerce-cart,
.woocommerce-checkout,
.woocommerce-account {
    font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif !important;
}

/* ── Top-User-Container (Avada-Demo) hart entfernen ─────────────────── */
/* Falls Avada den Block doch noch irgendwo aktiviert: visuell ausblenden. */
.avada-myaccount-user,
.fusion-woocommerce-message,
.woocommerce-content-box.user-container,
.avada-shop-info-container {
    display: none !important;
}

/* ── Produkt-Meta: Kategorie & Tags ausblenden ───────────────────────── */
/* "Kategorie: Uncategorized" auf Single-Product ist für Ticket-Shop irrelevant. */
.woocommerce div.product .product_meta .posted_in,
.woocommerce div.product .product_meta .tagged_as {
    display: none !important;
}


/* ── Shop-Loop: Germanized-Infos ────────────────────────────────────── */

.woocommerce ul.products li.product .wc-gzd-additional-info {
    font-size: 0.82rem;
    color: var(--zk-text-muted);
    margin-top: 4px;
}

.woocommerce ul.products li.product .button.add_to_cart_button {
    margin-top: 16px;
    width: 100%;
    text-align: center;
    justify-content: center;
}

/* ── Warenkorb: Varianten-Details ───────────────────────────────────── */

.woocommerce-cart .product-name dl.variation {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 12px;
    margin: 6px 0 0 0;
    padding: 0;
}

.woocommerce-cart .product-name dl.variation dt {
    font-family: var(--zk-font-body);
    font-weight: 600;
    color: var(--zk-text-muted);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.woocommerce-cart .product-name dl.variation dd {
    margin: 0;
    font-family: var(--zk-font-body);
    font-size: 0.9rem;
    color: var(--zk-text-secondary);
}

.woocommerce-cart .product-name dl.variation dd p { margin: 0; }

/* ── Checkout: Bestell-Tabelle Feinheiten ───────────────────────────── */

.woocommerce-checkout-review-order-table .product-name {
    font-family: var(--zk-font-heading);
    font-weight: 700;
    color: var(--zk-primary-900);
}

.woocommerce-checkout-review-order-table .product-name .product-quantity {
    color: var(--zk-text-muted);
    font-family: var(--zk-font-body);
    font-weight: 400;
}

.woocommerce-checkout-review-order-table .variation {
    display: block;
    font-size: 0.82rem;
    color: var(--zk-text-muted);
    font-family: var(--zk-font-body);
    font-weight: 400;
    margin-top: 2px;
}

/* ── PayPal / Banküberweisung Boxen ─────────────────────────────────── */

.payment_method_ppcp-gateway .payment_box,
.payment_method_ppcp-card-button-gateway .payment_box {
    padding: 20px !important;
}

#ppcp-hosted-fields,
.ppcp-button-container {
    margin-top: 8px;
}

.payment_method_bacs .payment_box,
.payment_method_invoice .payment_box {
    font-family: var(--zk-font-body);
    font-size: 0.92rem;
    line-height: 1.7;
}

/* ── Germanized: Steuern & Pflichtinfos ─────────────────────────────── */

.woocommerce-checkout .wc-gzd-order-total-tax-notice {
    font-size: 0.82rem;
    color: var(--zk-text-muted);
}

.tax-rate {
    font-size: 0.85rem;
    color: var(--zk-text-secondary);
}

.woocommerce div.product .wc-gzd-product-tax-notice,
.woocommerce div.product .shipping-costs-info,
.woocommerce div.product .wc-gzd-additional-info {
    font-family: var(--zk-font-body);
    font-size: 0.85rem;
    color: var(--zk-text-muted);
    margin-top: 6px;
}

.woocommerce div.product .wc-gzd-additional-info a {
    color: var(--zk-primary-700);
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* ── Mein Konto: Bestelldetail ──────────────────────────────────────── */

.woocommerce-account .woocommerce-order-details .shop_table {
    border-radius: var(--zk-radius) !important;
    overflow: hidden;
}

.woocommerce-account .woocommerce-order-details .shop_table .order-again .button {
    font-size: 0.85rem !important;
    padding: 10px 20px !important;
}

.woocommerce-account .woocommerce-orders-table__cell-order-actions a.button {
    font-size: 0.85rem !important;
    padding: 10px 20px !important;
    margin: 2px 4px;
}

/* ── Bestätigungsseite: Übersichts-Grid ─────────────────────────────── */

.woocommerce-order-received .woocommerce-order-overview {
    background: var(--zk-bg-card);
    border-radius: var(--zk-radius-lg);
    padding: 28px;
    box-shadow: var(--zk-shadow-sm);
    border: 1px solid var(--zk-border-light);
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 16px;
    list-style: none !important;
    margin: 0 0 32px 0 !important;
}

.woocommerce-order-received .woocommerce-order-overview li {
    text-align: center;
    padding: 12px;
    border-right: 1px solid var(--zk-border-light);
    color: var(--zk-text-muted);
    font-family: var(--zk-font-body);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
}

.woocommerce-order-received .woocommerce-order-overview li:last-child { border-right: none; }

.woocommerce-order-received .woocommerce-order-overview li strong {
    display: block;
    font-family: var(--zk-font-display);
    font-size: 1.4rem;
    color: var(--zk-primary-900);
    margin-top: 6px;
    font-weight: 700;
    text-transform: none;
    letter-spacing: -0.01em;
}

/* ── Loading-Overlay ────────────────────────────────────────────────── */

.woocommerce .blockUI.blockOverlay {
    background: rgba(255, 255, 255, 0.75) !important;
}

.woocommerce .loader::before,
.woocommerce .blockUI.blockOverlay::before {
    border-color: var(--zk-primary-100) !important;
    border-top-color: var(--zk-primary-700) !important;
}

/* ── Cross-Sells / Verwandte ────────────────────────────────────────── */

.woocommerce .cross-sells,
.woocommerce .related.products,
.woocommerce .up-sells {
    margin-top: 64px;
}

/* ── Print ──────────────────────────────────────────────────────────── */

@media print {
    .woocommerce-order-received .woocommerce-thankyou-order-received {
        background: none;
        border: 2px solid #000;
        color: #000;
    }
}

/* ==========================================================================
   Checkout-Step-Nav (Avada Side-Nav) – ZUKE-Pill-Style
   ========================================================================== */

.woocommerce-checkout .woocommerce-side-nav,
.woocommerce-checkout ul.woocommerce-checkout-nav {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 32px 0 !important;
    display: flex;
    flex-direction: column;
    gap: 8px;
    background: var(--zk-bg-card, #fff);
    border: 1px solid var(--zk-border-light, #e5e7eb);
    border-radius: var(--zk-radius-lg, 14px);
    padding: 14px !important;
    box-shadow: var(--zk-shadow-sm, 0 1px 2px rgba(0,0,0,.04));
}

.woocommerce-checkout .woocommerce-checkout-nav li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    background: none !important;
    border: none !important;
}

.woocommerce-checkout .woocommerce-checkout-nav li::before,
.woocommerce-checkout .woocommerce-checkout-nav li::after {
    display: none !important;
}

.woocommerce-checkout .woocommerce-checkout-nav li a {
    display: block;
    padding: 12px 18px;
    border-radius: var(--zk-radius, 10px);
    color: var(--zk-text-secondary, #4b5563);
    font-family: 'Roboto', sans-serif !important;
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none !important;
    transition: background-color 150ms ease, color 150ms ease, transform 150ms ease;
    text-shadow: none !important;
}

.woocommerce-checkout .woocommerce-checkout-nav li a:hover {
    background: var(--zk-primary-50, #E8F5E9);
    color: var(--zk-primary-900, #0f2b0f);
}

.woocommerce-checkout .woocommerce-checkout-nav li.is-active a,
.woocommerce-checkout .woocommerce-checkout-nav li.current a {
    background: var(--zk-primary, #1a4d1a);
    color: #fff !important;
}

/* ==========================================================================
   Promo-Code-Box (Checkout & Cart) – Card statt Banner
   ========================================================================== */

.woocommerce form.checkout_coupon,
.woocommerce-cart .shipping-coupon .coupon {
    background: var(--zk-bg-card, #fff) !important;
    border: 1px solid var(--zk-border-light, #e5e7eb) !important;
    border-radius: var(--zk-radius-lg, 14px) !important;
    box-shadow: var(--zk-shadow-sm, 0 1px 2px rgba(0,0,0,.04)) !important;
    padding: 24px 28px !important;
    margin: 0 0 32px 0 !important;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
}

.woocommerce form.checkout_coupon::before,
.woocommerce-cart .shipping-coupon .coupon::before {
    content: "🎟";
    display: inline-block;
    font-size: 1.6rem;
    line-height: 1;
    flex: 0 0 auto;
}

.woocommerce form.checkout_coupon .promo-code-heading,
.woocommerce-cart .shipping-coupon .coupon h2 {
    font-size: clamp(1.05rem, 1.8vw, 1.25rem) !important;
    margin: 0 !important;
    flex: 1 1 auto;
    min-width: 200px;
}

.woocommerce form.checkout_coupon .coupon-contents,
.woocommerce-cart .shipping-coupon .coupon .avada-coupon-fields {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: stretch;
    flex: 0 1 auto;
}

.woocommerce form.checkout_coupon .coupon-input,
.woocommerce-cart .shipping-coupon .coupon .avada-coupon-fields label {
    margin: 0 !important;
    padding: 0 !important;
}

.woocommerce form.checkout_coupon input.input-text,
.woocommerce-cart .shipping-coupon .coupon input.input-text {
    border: 1.5px solid var(--zk-border, #d1d5db) !important;
    border-radius: var(--zk-radius, 10px) !important;
    padding: 12px 16px !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: 0.95rem !important;
    background: #fff !important;
    min-width: 200px;
}

.woocommerce form.checkout_coupon input.input-text:focus,
.woocommerce-cart .shipping-coupon .coupon input.input-text:focus {
    border-color: var(--zk-primary-500, #4CAF50) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(76, 175, 80, .15) !important;
}

.woocommerce-cart .shipping-coupon .coupon label {
    display: none !important;
}

/* ==========================================================================
   Catalog-Ordering (Sortier-Dropdown auf Shop)
   ========================================================================== */

.woocommerce .catalog-ordering {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    margin-bottom: 32px;
    font-family: 'Roboto', sans-serif !important;
}

.woocommerce .catalog-ordering ul.order-dropdown {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: var(--zk-bg-card, #fff);
    border: 1.5px solid var(--zk-border, #d1d5db);
    border-radius: var(--zk-radius-pill, 999px);
    padding: 0 !important;
    position: relative;
}

.woocommerce .catalog-ordering ul.order-dropdown > li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.woocommerce .catalog-ordering ul.order-dropdown > li > .current-li {
    display: inline-block;
    padding: 10px 22px;
    font-family: 'Roboto', sans-serif;
    font-size: 0.9rem;
    color: var(--zk-text, #1a2e1a);
    cursor: pointer;
}

.woocommerce .catalog-ordering ul.order-dropdown > li > .current-li strong {
    color: var(--zk-primary-700, #236b23);
    font-weight: 700;
}

.woocommerce .catalog-ordering ul.order-dropdown a,
.woocommerce .catalog-ordering ul.order-dropdown a:visited {
    color: inherit;
    text-decoration: none;
}

.woocommerce .catalog-ordering ul.order {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.woocommerce .catalog-ordering ul.order a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1.5px solid var(--zk-border, #d1d5db);
    border-radius: var(--zk-radius, 10px);
    color: var(--zk-text-secondary, #4b5563);
    text-decoration: none;
}

.woocommerce .catalog-ordering ul.order a:hover {
    border-color: var(--zk-primary-500, #4CAF50);
    color: var(--zk-primary-700, #236b23);
}

.woocommerce .catalog-ordering ul.fusion-grid-list-view {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 0 auto !important;
    display: flex;
    gap: 6px;
}

.woocommerce .catalog-ordering ul.fusion-grid-list-view a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1.5px solid var(--zk-border, #d1d5db);
    border-radius: var(--zk-radius, 10px);
    color: var(--zk-text-secondary, #4b5563);
    text-decoration: none;
}

.woocommerce .catalog-ordering ul.fusion-grid-list-view .active-view a {
    border-color: var(--zk-primary, #1a4d1a);
    background: var(--zk-primary, #1a4d1a);
    color: #fff;
}

/* Dropdown-Caret: Avada hängt einen awb-icons-::after an das <li> mit
   position:absolute; right:0; top:0 – der klebte oben rechts AUSSERHALB der
   Pill (zerschossen). Wir entfernen ihn und zeichnen einen eigenen, sauber
   in der Pill zentrierten CSS-Caret auf der sichtbaren .current-li. */
.woocommerce .catalog-ordering .order-dropdown > li::after {
    content: none !important;
    display: none !important;
}

.woocommerce .catalog-ordering .order-dropdown > li > .current-li {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    padding: 11px 38px 11px 20px !important;
}

.woocommerce .catalog-ordering .order-dropdown > li > .current-li::after {
    content: "" !important;
    position: absolute !important;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid var(--zk-primary-700, #236b23);
    pointer-events: none;
}

/* asc/desc-Button und Grid-/List-Toggle auf gleiche Pill-Höhe wie die Dropdowns */
.woocommerce .catalog-ordering ul.order a,
.woocommerce .catalog-ordering ul.fusion-grid-list-view a {
    width: 44px !important;
    height: 44px !important;
    border-radius: var(--zk-radius, 10px) !important;
}

/* ==========================================================================
   Print
   ========================================================================== */

@media print {
    .woocommerce-order-received .woocommerce-thankyou-order-received-fallback {
        background: none;
    }
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 992px) {
    /* Cart-Tabelle scrollt horizontal */
    .woocommerce-cart .woocommerce-cart-form,
    .woocommerce-cart .cart-collaterals {
        width: 100% !important;
    }
}

@media (max-width: 768px) {
    .woocommerce-order-received .woocommerce-order-overview {
        grid-template-columns: 1fr 1fr;
    }

    .woocommerce-order-received .woocommerce-order-overview li {
        border-right: none;
        border-bottom: 1px solid var(--zk-border-light);
    }

    /* Promo-Code-Box stapelt */
    .woocommerce form.checkout_coupon,
    .woocommerce-cart .shipping-coupon .coupon {
        flex-direction: column;
        align-items: stretch;
        padding: 20px !important;
    }

    .woocommerce form.checkout_coupon .coupon-contents,
    .woocommerce-cart .shipping-coupon .coupon .avada-coupon-fields {
        flex-direction: column;
        align-items: stretch;
    }

    .woocommerce form.checkout_coupon input.input-text,
    .woocommerce-cart .shipping-coupon .coupon input.input-text {
        width: 100% !important;
    }

    .woocommerce form.checkout_coupon button,
    .woocommerce-cart .shipping-coupon .coupon button {
        width: 100% !important;
    }

    /* Catalog-Ordering: vertikal */
    .woocommerce .catalog-ordering {
        gap: 8px;
    }

    .woocommerce .catalog-ordering ul.fusion-grid-list-view {
        margin: 0 !important;
    }

    /* Cart-Tabelle: stacked rows */
    .woocommerce-cart table.shop_table thead {
        display: none;
    }

    .woocommerce-cart table.shop_table,
    .woocommerce-cart table.shop_table tbody,
    .woocommerce-cart table.shop_table tr,
    .woocommerce-cart table.shop_table td {
        display: block;
        width: 100% !important;
    }

    .woocommerce-cart table.shop_table tr {
        border: 1px solid var(--zk-border-light, #e5e7eb) !important;
        border-radius: var(--zk-radius-lg, 14px) !important;
        margin-bottom: 16px;
        padding: 16px;
        background: var(--zk-bg-card, #fff);
    }

    .woocommerce-cart table.shop_table td {
        padding: 8px 0 !important;
        border: none !important;
        text-align: left !important;
    }

    .woocommerce-cart table.shop_table td.product-remove {
        position: absolute;
        right: 24px;
    }

    .woocommerce-cart table.shop_table td.product-thumbnail img {
        max-width: 100px;
    }

    /* Step-Nav: horizontal scroll */
    .woocommerce-checkout .woocommerce-checkout-nav {
        flex-direction: row;
        overflow-x: auto;
        gap: 6px;
    }

    .woocommerce-checkout .woocommerce-checkout-nav li {
        flex: 0 0 auto;
    }

    .woocommerce-checkout .woocommerce-checkout-nav li a {
        white-space: nowrap;
        padding: 10px 14px;
        font-size: 0.88rem;
    }
}

@media (max-width: 480px) {
    .woocommerce-order-received .woocommerce-order-overview {
        grid-template-columns: 1fr;
    }

    /* Shop-Loop volle Breite */
    .woocommerce ul.products {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .woocommerce ul.products li.product {
        padding: 20px !important;
    }
}


/* ==========================================================================
   Batch-Fixes v1.23.0 (2026-06-21) — Shop / PDP / Warenkorb / Kasse / Success
   Behebt 14 gemeldete UI-Probleme. Jede Regel wurde per CSS-Injection gegen
   das echte Staging-DOM verifiziert. Zuordnung Issue→Regel siehe Blockkommentare.
   ========================================================================== */

/* ===== [shop-grid-align] ===== */
.woocommerce ul.products:before,.woocommerce ul.products:after,.woocommerce-page ul.products:before,.woocommerce-page ul.products:after{content:none!important;display:none!important}.woocommerce ul.products{margin:0!important}@media(min-width:481px){.woocommerce ul.products{grid-template-columns:repeat(2,1fr)!important}}@media(min-width:769px){.woocommerce ul.products{grid-template-columns:repeat(3,1fr)!important}}

/* ===== [shop-addtocart-confirm] ===== */
/* ── Add-to-Cart Bestätigung im Shop-Loop ───────────────────────────────
   Avada (parent style.min.css) versteckt WooCommerces "View cart"-Link global
   per `added_to_cart{display:none}`. Dadurch fehlt nach dem AJAX-Hinzufügen
   jede klare Bestätigung. Hier wird der angehängte Link im Loop wieder
   sichtbar gemacht und als branded Outline-Pill "Im Warenkorb ansehen"
   gestylt; zusätzlich ein kurzer Erfolgs-Flash auf dem Button (.added). */

/* 1) "Im Warenkorb ansehen"-Link sichtbar + als Full-Width Outline-Pill */
.woocommerce ul.products li.product .product-buttons-container a.button.added_to_cart,
.woocommerce ul.products li.product .product-buttons-container a.added_to_cart.wc-forward {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    margin: 10px 0 0 0 !important;
    padding: 11px 22px !important;
    text-align: center !important;
    text-decoration: none !important;
    font-family: var(--zk-font-heading) !important;
    font-weight: 600 !important;
    font-size: 0.95rem !important;
    line-height: 1.2 !important;
    letter-spacing: 0.01em;
    color: var(--zk-btn-2, #18294A) !important;
    background: transparent !important;
    border: 1.5px solid var(--zk-btn-2, #18294A) !important;
    border-radius: var(--zk-radius-pill) !important;
    box-shadow: none !important;
    transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}

/* Checkmark vor dem Link-Text */
.woocommerce ul.products li.product .product-buttons-container a.button.added_to_cart::before,
.woocommerce ul.products li.product .product-buttons-container a.added_to_cart.wc-forward::before {
    content: "\2713\00a0\00a0";
    font-weight: 700;
    color: var(--zk-btn-2, #18294A);
}

.woocommerce ul.products li.product .product-buttons-container a.button.added_to_cart:hover,
.woocommerce ul.products li.product .product-buttons-container a.added_to_cart.wc-forward:hover {
    background: var(--zk-btn-2, #18294A) !important;
    border-color: var(--zk-btn-2, #18294A) !important;
    color: #fff !important;
    transform: translateY(-1px);
}
.woocommerce ul.products li.product .product-buttons-container a.button.added_to_cart:hover::before,
.woocommerce ul.products li.product .product-buttons-container a.added_to_cart.wc-forward:hover::before {
    color: #fff;
}

/* 2) Erfolgs-Flash auf dem "Ticket wählen"-Button direkt nach dem Hinzufügen.
   JS (siehe functions.php) setzt für ~1.8s die Klasse .zk-added-flash; .added
   bleibt danach von WooCommerce gesetzt, soll den Button aber NICHT dauerhaft
   umfärben (Nutzer kann weitere Tickets hinzufügen). */
.woocommerce ul.products li.product .product-buttons-container a.add_to_cart_button.zk-added-flash {
    background: var(--zk-btn, #95C23C) !important;
    color: #fff !important;
    box-shadow: var(--zk-shadow-glow) !important;
    transform: none !important;
}
.woocommerce ul.products li.product .product-buttons-container a.add_to_cart_button.zk-added-flash:hover {
    background: var(--zk-btn-hover, #18294A) !important;
    color: #fff !important;
}

/* ===== [shop-details-icon-gap] ===== */

/* shop-details-icon-gap: Der "Details ansehen"-Button trägt sein Listen-Icon als
   ::before-Glyph (font-family:awb-icons, content "\e623"), das im aktuellen
   display:block-Layout direkt am Label klebte. Button auf inline-flex umstellen,
   damit der ::before-Glyph und der Text zu Flex-Items werden – mittig zentriert
   mit echtem Gap dazwischen. Schlägt die style.css-Loop-Regel (display:block) per
   höherer Spezifität (.product-buttons davor) + !important. Bleibt full-width:
   width:100% kommt weiterhin aus der Basis-Regel in style.css, inline-flex bricht
   das nicht. */
.woocommerce ul.products li.product .product-buttons .show_details_button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

/* Avada-Defaults am Icon-Glyph neutralisieren, damit der Gap die einzige
   Spacing-Quelle ist und das Icon vertikal sauber zentriert sitzt. */
.woocommerce ul.products li.product .product-buttons .show_details_button::before {
  position: static !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1;
}


/* ===== [shop-toolbar-activestate] ===== */
/* ==========================================================================
   Shop-Toolbar: aktiver View-Toggle auf Brand-Grün #95C23C (v1.25.0,
   konsistent mit Header-"Tickets"-Button + Haupt-CTAs). Inaktive bleiben Outline.
   Aktives <li> = .fusion-grid-view-li.active-view (rendert die aktuelle Ansicht).
   Überschreibt das alte Dunkelgrün (--zk-primary) aus Block oben.
   ========================================================================== */
.woocommerce .catalog-ordering ul.fusion-grid-list-view .active-view a {
    border-color: var(--zk-btn, #95C23C) !important;
    background: var(--zk-btn, #95C23C) !important;
    color: #fff !important;
}

/* Avada-Default `.active-view a i{color:rgba(51,51,51,.45)}` dimmt das Icon –
   explizit auf dunkel setzen, damit das Glyph sauber auf der Lime-Fläche liegt. */
.woocommerce .catalog-ordering ul.fusion-grid-list-view .active-view a i {
    color: #fff !important;
}

/* Hover des AKTIVEN Buttons: dunkleres Grün (analog Haupt-CTA-Hover), nicht
   in den neutralen Outline-Hover zurückfallen. */
.woocommerce .catalog-ordering ul.fusion-grid-list-view .active-view a:hover,
.woocommerce .catalog-ordering ul.fusion-grid-list-view .active-view a:hover i {
    background: var(--zk-btn-hover, #18294A) !important;
    border-color: var(--zk-btn-hover, #18294A) !important;
    color: #fff !important;
}

/* INAKTIVER View-Button: sauberer Outline-Hover (Grün-Akzent),
   konsistent mit dem asc/desc-Button-Hover. */
.woocommerce .catalog-ordering ul.fusion-grid-list-view li:not(.active-view) a:hover {
    border-color: var(--zk-btn, #95C23C) !important;
    color: var(--zk-btn, #95C23C) !important;
    background: transparent !important;
}
.woocommerce .catalog-ordering ul.fusion-grid-list-view li:not(.active-view) a:hover i {
    color: var(--zk-btn, #95C23C) !important;
}

/* ===== [pdp-desc-double] ===== */

/* ── PDP: Beschreibungs-Tab – Abstand nach Entfernen der doppelten
   "Beschreibung"-Überschrift straffen.
   Die <h3 class="fusion-woocommerce-tab-title"> wird per
   woocommerce_product_description_heading-Filter entfernt (functions.php).
   Das erste Panel-Element startet damit direkt unter der Tab-Navigation;
   falls Avada doch eine Tab-Überschrift rendert, deren Abstand neutralisieren. */
.woocommerce div.product .woocommerce-tabs .panel > .post-content {
  margin-top: 0 !important;
}
.woocommerce div.product .woocommerce-tabs .panel .post-content > :first-child {
  margin-top: 0 !important;
}
.single-product .woocommerce-tabs .fusion-woocommerce-tab-title {
  margin: 0 0 12px 0 !important;
  line-height: 1.3 !important;
}

/* ===== [pdp-social-remove] ===== */
/* pdp-social-remove (CSS fallback): hide Avada single-product social share box.
   Primary fix is the PHP filter on woocommerce_social_links (suppresses markup entirely).
   This is a safety net in case the option is read from a cached/DB value. */
.single-product ul.social-share,
.woocommerce.single-product ul.social-share {
	display: none !important;
}

/* ===== [cart-qty-hidden] ===== */
/* cart-qty-hidden: make the cart quantity value visible & centered
   (overrides generic form rule at style.css:3490 which sets width:100% + 14px 18px padding
   with no text-align, clipping the digit inside Avada's flex -/+ wrapper) */
.woocommerce .quantity input.qty,
.woocommerce-cart table.cart .product-quantity .quantity input.qty,
.woocommerce-page .quantity input.qty {
  width: 56px !important;
  min-width: 56px !important;
  max-width: 56px !important;
  padding: 12px 4px !important;
  text-align: center !important;
  color: var(--zk-text) !important;
  -webkit-text-fill-color: var(--zk-text) !important;
  opacity: 1 !important;
  background: var(--zk-bg-card) !important;
  font-family: var(--zk-font-body) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  -webkit-appearance: none !important;
  -moz-appearance: textfield !important;
}

/* ===== [checkout-form-width] ===== */

/* ==========================================================================
   Checkout: Rechnungsdaten-Spalte volle Breite nutzen (Desktop)
   Fix: .col2-set ist ein 2-Spalten-Grid (style.css:4311). Im Billing-Step
   blendet Avada .col-2 + #order_review aus, der zweite Grid-Track bleibt aber
   reserviert -> Formular nur ~50% breit, rechts leer. Da die Steps sich
   gegenseitig ausschliessen, darf die jeweils sichtbare Spalte die volle
   Breite einnehmen; zusaetzlich Felder 2-spaltig -> kuerzeres Formular.
   ========================================================================== */
@media (min-width: 993px) {

    /* Sichtbare Step-Spalte spannt die gesamte Grid-Breite (leerer 2. Track weg) */
    .woocommerce-checkout form.checkout .col2-set > .col-1,
    .woocommerce-checkout form.checkout .col2-set > .col-2 {
        grid-column: 1 / -1 !important;
    }

    /* Billing-Felder 2-spaltig anordnen -> weniger vertikales Scrollen */
    .woocommerce-checkout form.checkout .woocommerce-billing-fields__field-wrapper,
    .woocommerce-checkout form.checkout .woocommerce-shipping-fields__field-wrapper,
    .woocommerce-checkout form.checkout .woocommerce-additional-fields__field-wrapper {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0 28px;
        align-items: start;
    }

    /* Jede Form-Row im Grid: vorhandene float/width-Reste neutralisieren */
    .woocommerce-checkout form.checkout .woocommerce-billing-fields__field-wrapper > .form-row,
    .woocommerce-checkout form.checkout .woocommerce-shipping-fields__field-wrapper > .form-row,
    .woocommerce-checkout form.checkout .woocommerce-additional-fields__field-wrapper > .form-row {
        width: auto !important;
        float: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-right: 0 !important;
    }

    /* Paar-Felder: Vorname | Nachname (bereits gepaart) */
    .woocommerce-checkout form.checkout .woocommerce-billing-fields__field-wrapper > .form-row-first,
    .woocommerce-checkout form.checkout .woocommerce-shipping-fields__field-wrapper > .form-row-first {
        grid-column: 1 / 2;
    }
    .woocommerce-checkout form.checkout .woocommerce-billing-fields__field-wrapper > .form-row-last,
    .woocommerce-checkout form.checkout .woocommerce-shipping-fields__field-wrapper > .form-row-last {
        grid-column: 2 / 3;
    }

    /* Lange/wichtige Felder ueber die volle Breite */
    .woocommerce-checkout form.checkout #billing_company_field,
    .woocommerce-checkout form.checkout #billing_email_field,
    .woocommerce-checkout form.checkout #billing_vat_id_field,
    .woocommerce-checkout form.checkout #billing_address_1_field,
    .woocommerce-checkout form.checkout #billing_address_2_field,
    .woocommerce-checkout form.checkout #shipping_company_field,
    .woocommerce-checkout form.checkout #shipping_address_1_field,
    .woocommerce-checkout form.checkout #shipping_address_2_field,
    .woocommerce-checkout form.checkout .woocommerce-billing-fields__field-wrapper > .form-row[id*="attendee"],
    .woocommerce-checkout form.checkout .woocommerce-additional-fields__field-wrapper > .form-row {
        grid-column: 1 / -1;
    }

    /* Fallback fuer aeltere Browser ohne Grid-Subgrid: Felder behalten Abstand */
    .woocommerce-checkout form.checkout .woocommerce-billing-fields__field-wrapper > .form-row,
    .woocommerce-checkout form.checkout .woocommerce-shipping-fields__field-wrapper > .form-row,
    .woocommerce-checkout form.checkout .woocommerce-additional-fields__field-wrapper > .form-row {
        margin-bottom: 16px;
    }
}


/* ===== [checkout-agb-checkbox] ===== */

/* ──────────────────────────────────────────────────────────────────────
   Checkout: AGB/Widerruf-Checkbox (Germanized) — Custom-Branded
   Ersetzt den nativen accent-color-Look (oversized/odd) durch eine
   kompakte, markenkonforme Checkbox mit sauberem Häkchen.
   Scope: die Pflicht-Checkbox in p.legal (Germanized rendert sie hier als
   #legal, auf anderen Configs als #terms) — beide abgedeckt, andere Inputs
   bleiben unberührt. Überschreibt style.css:4451 (accent-color).
   ────────────────────────────────────────────────────────────────────── */
.woocommerce-checkout p.legal input[type="checkbox"],
.woocommerce-checkout input[type="checkbox"]#legal,
.woocommerce-checkout input[type="checkbox"]#terms {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    accent-color: auto !important;
    flex: 0 0 auto;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px;
    margin: 2px 10px 0 0 !important;
    padding: 0 !important;
    border: 1.5px solid var(--zk-border-light) !important;
    border-radius: 5px !important;
    background: var(--zk-bg-card) !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: 14px 14px !important;
    box-shadow: none !important;
    cursor: pointer;
    vertical-align: top;
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.woocommerce-checkout p.legal input[type="checkbox"]:hover,
.woocommerce-checkout input[type="checkbox"]#legal:hover,
.woocommerce-checkout input[type="checkbox"]#terms:hover {
    border-color: var(--zk-primary-300) !important;
}

.woocommerce-checkout p.legal input[type="checkbox"]:checked,
.woocommerce-checkout input[type="checkbox"]#legal:checked,
.woocommerce-checkout input[type="checkbox"]#terms:checked {
    background-color: var(--zk-primary) !important;
    border-color: var(--zk-primary) !important;
    /* crisp white checkmark */
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3.5 8.5l2.8 2.8 6.2-6.6' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

.woocommerce-checkout p.legal input[type="checkbox"]:focus,
.woocommerce-checkout p.legal input[type="checkbox"]:focus-visible,
.woocommerce-checkout input[type="checkbox"]#legal:focus,
.woocommerce-checkout input[type="checkbox"]#legal:focus-visible,
.woocommerce-checkout input[type="checkbox"]#terms:focus,
.woocommerce-checkout input[type="checkbox"]#terms:focus-visible {
    outline: none !important;
    border-color: var(--zk-primary) !important;
    box-shadow: 0 0 0 3px rgba(26, 77, 26, 0.18) !important;
}

/* Label-Ausrichtung: Checkbox + Text sauber nebeneinander (top-aligned),
   da der AGB-Text mehrzeilig sein kann. */
.woocommerce-checkout p.legal label,
.woocommerce-checkout .wc-gzd-checkbox-placeholder-terms label.checkbox,
.woocommerce-checkout p.checkbox-terms label.checkbox {
    display: flex;
    align-items: flex-start;
    gap: 0;
    cursor: pointer;
}


/* ===== [checkout-orderreview-double-img] ===== */
/* checkout-orderreview-double-img:
   Avada's review-order.php already renders a themed product thumbnail
   (.fusion-product-name-wrapper > .product-thumbnail). WooCommerce Germanized
   additionally injects its own thumbnail (.wc-gzd-product-name-left) into the
   same review-order line, producing two identical images. Hide the redundant
   Germanized thumbnail in the review-order table only; keep Avada's. */
/* Echte DOM-Struktur (live verifiziert): td.product-name enthält Avadas
   span.product-thumbnail > img UND Germanizeds .wc-gzd-cart-item-thumbnail > img
   → zwei identische Bilder. Germanized-Thumbnail in der Review-Tabelle ausblenden,
   Avadas Thumbnail bleibt. */
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name .wc-gzd-cart-item-thumbnail {
    display: none !important;
}

/* ===== [checkout-buy-btn-overflow] ===== */
/* ==========================================================================
   FIX checkout-buy-btn-overflow: "Jetzt kaufen" (#place_order) overflows
   the #order_review card on the checkout review step.
   Constrain the place-order button strictly within its card: force
   border-box, full width relative to the card, kill any horizontal
   margins / min-width / float that push it past the card padding.
   Scoped to the checkout payment block so nothing else is affected.
   ========================================================================== */
.woocommerce-checkout #order_review .woocommerce-checkout-payment .place-order,
.woocommerce-checkout #payment .place-order,
.woocommerce-checkout .woocommerce-checkout-payment .place-order {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: visible;
}

.woocommerce-checkout #order_review #place_order,
.woocommerce-checkout .woocommerce-checkout-payment #place_order,
.woocommerce-checkout #payment #place_order {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ===== [success-heading-size] ===== */

/* ==========================================================================
   Bestätigungsseite – Danke-Heading auf vernünftige Größe bringen
   Avada stylt diesen <p> via `.fusion-body .woocommerce-thankyou-order-received`
   als H2 (font-size: var(--h2_typography-font-size)) → riesig/mehrzeilig.
   WICHTIG: fusion-body UND woocommerce-order-received liegen BEIDE auf <body>,
   daher Compound-Selektor (body.woocommerce-order-received ...) statt Descendant
   — sonst matcht die Regel nie und Avadas H2-Größe (48px) bleibt aktiv.
   ========================================================================== */
body.woocommerce-order-received .woocommerce-thankyou-order-received,
body.fusion-body.woocommerce-order-received p.woocommerce-thankyou-order-received {
    font-size: clamp(1.2rem, 2.2vw, 1.55rem) !important;
    line-height: 1.45 !important;
    font-family: var(--zk-font-display) !important;
    font-weight: 600 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    text-align: center;
    max-width: 760px;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 32px 28px !important;
    border-bottom: none !important;
}


/* ===== [success-overview-overlap] ===== */

/* ── Bestätigungsseite: Übersichts-Grid – langer E-Mail-Wert darf nicht in
   die GESAMT-Spalte überlaufen. Grid-Items auf min-width:0 zwingen (Default
   min-width:auto sprengt sonst die 1fr-Spur) und den Wert umbrechen lassen. */
.woocommerce-order-received .woocommerce-order-overview li {
    min-width: 0 !important;
}

.woocommerce-order-received .woocommerce-order-overview li strong {
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: none;
}

/* E-Mail-Wert etwas kleiner, damit er umgebrochen sauber in der Spalte sitzt
   (Bestellnummer/Datum/Gesamt bleiben in der 1.4rem-Display-Größe). */
.woocommerce-order-received .woocommerce-order-overview li.woocommerce-order-overview__email strong {
    font-size: 1rem;
    line-height: 1.3;
    letter-spacing: 0;
}