/* ==================================================
   ORIGINAL PRODUCT BUY BUTTON
   ================================================== */

.block-product-buy-button {
    white-space: normal !important;
}

.block-product-buy-button-wrapper {
    padding: var(--button-border-thickness, 1px);
}


/* ==================================================
   CUSTOM ADD TO CART BUTTON
   ================================================== */

.custom-product-buy-buttons .custom-main-add-button {
    width: 100% !important;
    min-height: 48px !important;

    background-color: #ffffff !important;
    color: #000000 !important;

    border: 1px solid #000000 !important;
    border-radius: 0 !important;

    font-weight: 600 !important;

    cursor: pointer !important;

    transition:
        background-color 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease !important;
}


/* Add to cart 里面所有文字继承按钮颜色 */

.custom-product-buy-buttons .custom-main-add-button span {
    color: inherit !important;
}


/* 默认：白底黑字 */

.custom-product-buy-buttons .custom-main-add-button:not(:hover) {
    background-color: #ffffff !important;
    color: #000000 !important;
    border-color: #000000 !important;
}


/* 鼠标碰到：黑底白字 */

.custom-product-buy-buttons .custom-main-add-button:hover:not(:disabled) {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #000000 !important;
}

.custom-product-buy-buttons .custom-main-add-button:hover:not(:disabled) span {
    color: #ffffff !important;
}


/* 键盘 Focus */

.custom-product-buy-buttons .custom-main-add-button:focus-visible {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #000000 !important;

    outline: none !important;
}


/* 售罄 */

.custom-product-buy-buttons .custom-main-add-button:disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}


/* ==================================================
   PAYMENT AREA
   ================================================== */

.custom-payment-area {
    width: 100% !important;
}


/* 同时兼容之前使用过的 class */

.custom-express-payment-layout {
    width: 100% !important;
}


/* ==================================================
   BUY NOW
   ================================================== */

.custom-payment-area .shopline-payment-button,
.custom-express-payment-layout .shopline-payment-button {
    width: 100% !important;
}


/* ==================================================
   PAYPAL + PAY LATER CONTAINER
   强制横向排列
   ================================================== */

.custom-payment-area .shopline-payment-button__button-container,
.custom-payment-area .shopline-payment-button__more-options,
.custom-payment-area .shopline-payment-button__express-checkout,
.custom-payment-area .shopline-payment-button-wrapper,

.custom-express-payment-layout .shopline-payment-button__button-container,
.custom-express-payment-layout .shopline-payment-button__more-options,
.custom-express-payment-layout .shopline-payment-button__express-checkout,
.custom-express-payment-layout .shopline-payment-button-wrapper {
    display: flex !important;

    flex-direction: row !important;
    flex-wrap: nowrap !important;

    align-items: stretch !important;

    width: 100% !important;

    gap: 8px !important;
}


/* ==================================================
   PAYPAL + PAY LATER
   各占 50%
   ================================================== */

.custom-payment-area .shopline-payment-button__button-container>*,
.custom-payment-area .shopline-payment-button__more-options>*,
.custom-payment-area .shopline-payment-button__express-checkout>*,
.custom-payment-area .shopline-payment-button-wrapper>*,

.custom-express-payment-layout .shopline-payment-button__button-container>*,
.custom-express-payment-layout .shopline-payment-button__more-options>*,
.custom-express-payment-layout .shopline-payment-button__express-checkout>*,
.custom-express-payment-layout .shopline-payment-button-wrapper>* {
    flex: 1 1 0 !important;

    width: 50% !important;
    max-width: none !important;
    min-width: 0 !important;

    margin-left: 0 !important;
    margin-right: 0 !important;
}


/* 支付按钮内部撑满 */

.custom-payment-area iframe,
.custom-payment-area button,
.custom-express-payment-layout iframe,
.custom-express-payment-layout button {
    width: 100% !important;
    max-width: 100% !important;
}


/* ==================================================
   MOBILE
   手机也保持 PayPal / Pay Later 左右排列
   ================================================== */

@media screen and (max-width: 749px) {

    .custom-payment-area .shopline-payment-button__button-container,
    .custom-payment-area .shopline-payment-button__more-options,
    .custom-payment-area .shopline-payment-button__express-checkout,
    .custom-payment-area .shopline-payment-button-wrapper,

    .custom-express-payment-layout .shopline-payment-button__button-container,
    .custom-express-payment-layout .shopline-payment-button__more-options,
    .custom-express-payment-layout .shopline-payment-button__express-checkout,
    .custom-express-payment-layout .shopline-payment-button-wrapper {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
    }


    .custom-payment-area .shopline-payment-button__button-container>*,
    .custom-payment-area .shopline-payment-button__more-options>*,
    .custom-payment-area .shopline-payment-button__express-checkout>*,
    .custom-payment-area .shopline-payment-button-wrapper>*,

    .custom-express-payment-layout .shopline-payment-button__button-container>*,
    .custom-express-payment-layout .shopline-payment-button__more-options>*,
    .custom-express-payment-layout .shopline-payment-button__express-checkout>*,
    .custom-express-payment-layout .shopline-payment-button-wrapper>* {
        flex: 1 1 0 !important;

        width: 50% !important;
        max-width: none !important;
        min-width: 0 !important;
    }

}