/* -------------------------------------------------------
   My Buy Now — Button Styles
   Edit the values below to match your theme.
------------------------------------------------------- */

/* Wrapper forces the button onto its own line even if the
   theme lays out the cart form with flexbox or inline-block. */
.my-buy-now-wrap {
    display: block;
    width: 100%;
    flex-basis: 100%;   /* wins inside flex containers */
    clear: both;
    margin-top: 10px;
}

form.cart .my-buy-now-wrap .my-buy-now-btn,
.my-buy-now-btn {
    display: block;
    width: 100%;

    background-color: #222222;  /* button background */
    color: #ffffff !important;   /* button text color */
    border: none;

    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;

    border-radius: 4px;
    padding: 12px 24px;

    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}

form.cart .my-buy-now-wrap .my-buy-now-btn:hover,
form.cart .my-buy-now-wrap .my-buy-now-btn:focus {
    background-color: black !important;
    color: white !important;
}

/* Pulsing text is now driven by JavaScript (see plugin footer script).
   This transition just smooths out the scale changes JS applies. */
.my-buy-now-text {
    display: inline-block;
    transition: transform 0.5s linear;
}

/* Disabled / loading state while the AJAX request is in flight */
.my-buy-now-btn:disabled,
.my-buy-now-btn.is-loading {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Optional: tighter spacing on mobile */
@media (max-width: 480px) {
    .my-buy-now-wrap {
        margin-top: 8px;
    }
    .my-buy-now-btn {
        padding: 14px 20px;
    }
}