/*
 * BH Stripe Express Checkout 1.3.0 - Stylesheet (vorher nur per JS injiziert).
 *
 * Wird im <head> ueber layout_head_stylesheet mit parent() geladen (views/storefront/layout/meta.html.twig). Fehlt der Block
 * unter einem Theme (Vorsorge, ThemeWare ersetzt base_head ohne parent()), setzt express-checkout.js dieselben Regeln als
 * <style> ein. Erkennung ueber die Markierung --bh-stripe-express-css auf :root (getComputedStyle).
 * Inhalt identisch zur JS-Fassung aus 1.1.0, damit sich die Optik unter keinem Theme aendert (Bereinigung: P6b).
 * 1.3.0: Regeln fuer den Platzhalter-Knopf (.bh-sec) ergaenzt - auch in der JS-Rueckfallfassung.
 */
:root {
    --bh-stripe-express-css: 1;
}

/* Produktseite: unter lg volle Breite fuer die SwagPayPal-Express-Knoepfe, ab lg col-8 wie "In den Warenkorb". */
@media (max-width: 991.98px) {
    [data-swag-paypal-express-button].col-8 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* Ecken des Kaufknopfs wie die PayPal-"rect"-Knoepfe (4 px). */
.btn-buy {
    border-radius: 4px !important;
}

[data-bh-stripe-express-checkout-pdp]:not(:empty),
[data-bh-stripe-express-checkout-cart]:not(:empty),
[data-bh-stripe-express-checkout-offcanvas]:not(:empty) {
    margin-top: .5rem;
}

/* 1.3.0: Platzhalter "Mit Apple Pay / Google Pay bezahlen" (Bootstrap btn-outline-primary = Umriss wie Kaufknopf).
   Stripe.js laedt erst nach Antippen; das Element wird verdeckt ueber dem Platzhalter montiert und ersetzt ihn bei "ready". */
.bh-sec {
    position: relative;
}

.bh-sec-trigger {
    min-height: 44px;
    border-radius: 4px;
    font-weight: 600;
    line-height: 1.2;
}

/* Schrift in Textfarbe statt Primaerfarbe: unter ThemeWare ist Orange auf Weiss zu kontrastarm (axe color-contrast,
   2,9:1). Umriss bleibt Primaerfarbe. Hover/Aktiv nur leicht getoent, Schrift bleibt lesbar (Bootstrap-5.3-Variablen). */
.bh-sec .btn.bh-sec-trigger {
    --bs-btn-color: var(--bs-body-color, #212529);
    --bs-btn-hover-color: var(--bs-body-color, #212529);
    --bs-btn-hover-bg: rgba(0, 0, 0, .04);
    --bs-btn-active-color: var(--bs-body-color, #212529);
    --bs-btn-active-bg: rgba(0, 0, 0, .08);
    color: var(--bs-body-color, #212529);
}

.bh-sec .btn.bh-sec-trigger:hover,
.bh-sec .btn.bh-sec-trigger:focus-visible {
    color: var(--bs-body-color, #212529);
    background-color: rgba(0, 0, 0, .04);
}

.bh-sec-trigger[aria-busy="true"] {
    cursor: progress;
    opacity: .7;
}

.bh-sec-logo {
    display: block;
    flex: 0 0 auto;
}

.bh-sec-hint {
    line-height: 1.35;
}

/* Link in Hinweisfarbe + unterstrichen (ThemeWare-Linkfarbe Orange waere zu kontrastarm). */
.bh-sec-hint a {
    color: inherit;
    text-decoration: underline;
}

.bh-sec-mount {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    visibility: hidden;
    pointer-events: none;
}

.bh-sec.is-bereit .bh-sec-mount {
    position: static;
    visibility: visible;
    pointer-events: auto;
}