/* =========================================================================
 * Express-Checkout-Buttons (Apple Pay / Google Pay) von WooPayments
 * ====================================================================== */

/* --- Warenkorb: Ladezustand der Express-Buttons (Google Pay / Apple Pay) ---
 * Stripe/WooPayments mountet die Wallet-Buttons asynchron und haelt
 * #wcpay-express-checkout-element bis dahin auf opacity:0 – der Platzhalter muss
 * deshalb am Wrapper haengen. Er verschwindet, sobald die Buttons bereit sind
 * (.is-ready) oder WooPayments den Container ausblendet (kein Wallet verfuegbar).
 * Masse entsprechen den WooPayments-Einstellungen: Groesse "medium" = 48px,
 * payment_request_button_border_radius = 19px.
 */
.wcpay-express-checkout-wrapper::before {
    content: '';
    display: block;
    width: 100%;
    height: 48px;
    border-radius: 19px;
    background-color: #e9edf7;
    background-image: linear-gradient(
        90deg,
        rgba(233, 237, 247, 0) 0%,
        rgba(122, 156, 253, 0.35) 50%,
        rgba(233, 237, 247, 0) 100%
    );
    background-repeat: no-repeat;
    background-size: 60% 100%;
    animation: lumenic-express-shimmer 1.3s ease-in-out infinite,
               lumenic-express-loader-timeout 0.3s linear 15s forwards;
}

.wcpay-express-checkout-wrapper:has(#wcpay-express-checkout-element.is-ready)::before,
.wcpay-express-checkout-wrapper:has(#wcpay-express-checkout-element[style*="display: none"])::before {
    content: none;
}

@keyframes lumenic-express-shimmer {
    0% {
        background-position: -60% 0;
    }
    100% {
        background-position: 160% 0;
    }
}

/* Notbremse: bleibt das Mounten aus (blockierte Stripe-Skripte, JS-Fehler),
 * verschwindet der Platzhalter nach 15 Sekunden, statt endlos zu laufen. */
@keyframes lumenic-express-loader-timeout {
    to {
        opacity: 0;
        height: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wcpay-express-checkout-wrapper::before {
        animation: lumenic-express-loader-timeout 0.3s linear 15s forwards;
        background-image: none;
    }
}

/* --- Kasse: eigener Block oberhalb von "1. Adresse" ---
 * Ausgabe ueber den Hook lumenic_checkout_express_buttons (siehe functions.php
 * und woocommerce/checkout/form-checkout.php). Der Abstand nach unten haelt den
 * "ODER"-Trenner von den schwebenden Labels der Adressfelder frei.
 */
.main-checkout__forms .checkout-express {
    margin-bottom: 40px;
}

.main-checkout__forms .checkout-express__header {
    margin-bottom: 16px;
}

.main-checkout__forms .checkout-express__header p {
    margin-top: 6px;
    font-family: Figtree, sans-serif;
    font-size: 14px;
    line-height: 20px;
    color: #667085;
}

.main-checkout__forms .checkout-express #wcpay-express-checkout-button-separator {
    margin: 22px 0 0 !important;
    font-family: Figtree, sans-serif;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    color: #667085;
}

/* =========================================================================
 * PayPal (WooCommerce PayPal Payments)
 * ====================================================================== */

/* --- Warenkorb: PayPal-Block unter den Wallet-Buttons ---
 * Ausgabe ueber den Hook lumenic_cart_express_paypal (siehe functions.php).
 * Gleicher Rhythmus wie "Zur Kasse" und die Wallet-Buttons darueber.
 */
.main-cart__summary .cart-express-paypal {
    margin-top: 14px;
}

.main-cart__summary .cart-express-paypal .ppcp-messages {
    margin-bottom: 10px;
    text-align: center;
}

/* PayPal rendert in einem iframe mit eigener Hoehe – der Wrapper darf keine
 * zusaetzlichen Abstaende aus dem Plugin-CSS mitbringen. */
.main-cart__summary .cart-express-paypal .ppc-button-wrapper {
    margin: 0;
    min-height: 0;
}

/* --- Kasse: PayPal-Button an der Stelle des Bestellbuttons ---
 * Er sitzt im Block .checkout-actions direkt hinter #place_order (siehe Filter
 * in functions.php, Styling in css/checkout.css). Bei ausgewaehltem PayPal
 * blendet das Plugin #place_order aus und setzt seinen Button an dieselbe
 * Stelle – der Button springt also nicht mehr durch die Seite.
 */
.main-checkout__forms .ppcp-messages {
    margin-bottom: 16px;
}

/* Leere Container der PayPal-Wallets (Apple/Google Pay laufen hier ueber
 * WooPayments) sollen keinen Platz einnehmen. */
#ppc-button-ppcp-applepay:empty,
#ppc-button-ppcp-googlepay:empty,
#ppc-button-ppcp-card-button-gateway:empty {
    display: none;
}
