:root {
    --wallet-button-width: 250px;
    --wallet-button-height: 40px;
    --wallet-button-width-mobile: 100%;
    --wallet-button-height-mobile: 45px;
    --frames-max-width: 400px;
}

/* This is the CSS needed to the the ApplePay Button -> */
.apple-pay-button {
    width: var(--wallet-button-width);
    height: var(--wallet-button-height);
    display: inline-block;
    -webkit-appearance: -apple-pay-button;
    cursor: pointer;
}
.apple-pay-button-with-text > * {
    display: none;
}
.apple-pay-button-black-with-text {
    -apple-pay-button-style: black;
}
.apple-pay-button-white-with-text {
    -apple-pay-button-style: white;
}
.apple-pay-button-white-with-line-with-text {
    -apple-pay-button-style: white-outline;
}
.apple-pay-button-text-book {
    -apple-pay-button-type: book;
}
.apple-pay-button-text-buy {
    -apple-pay-button-type: buy;
}
.apple-pay-button-text-check-out {
    -apple-pay-button-type: check-out;
}
.apple-pay-button-text-donate {
    -apple-pay-button-type: donate;
}

@media only screen and (max-width: 600px) {
    .apple-pay-button {
        width: var(--wallet-button-width-mobile) !important;
        height: var(--wallet-button-height-mobile) !important;
    }
}

img.logo_visa {
	height: 32px !important;
	width: 64px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: 0 0;
}
img.logo_visa.logo_off {
       background-position: 0 -32px;
}
img.logo_mastercard {
	height: 32px !important;
	width: 50px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: -65px 0;
}
img.logo_mastercard.logo_off {
	background-position: -65px -32px;
}
img.logo_amex {
	height: 32px !important;
	width: 55px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: -116px 0;
}
img.logo_amex.logo_off {
	background-position: -116px -32px;
}
img.logo_jcb {
	height: 32px !important;
	width: 51px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: -172px 0;
}
img.logo_jcb.logo_off {
	background-position: -172px -32px;
}
img.logo_masterpass {
	height: 32px !important;
	width: 145px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: -224px 0;
}
img.logo_masterpass.logo_off {
	background-position: -224px -32px;
}
img.logo_paypal {
	height: 32px !important;
	width: 56px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: -370px 0;
}
img.logo_paypal.logo_off {
	background-position: -370px -32px;
}
img.logo_sadad {
	height: 32px !important;
	width: 85px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: -427px 0;
}
img.logo_sadad.logo_off {
	background-position: -427px -32px;
}
img.logo_billdesk {
	height: 32px !important;
	width: 68px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: -513px 0;
}
img.logo_billdesk.logo_off {
	background-position: -513px -32px;
}
img.logo_finnet {
	height: 32px !important;
	width: 73px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: -582px 0;
}
img.logo_finnet.logo_off {
	background-position: -582px -32px;
}
img.logo_tcash {
	height: 32px !important;
	width: 96px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: -656px 0;
}
img.logo_tcash.logo_off {
	background-position: -656px -32px;
}
img.logo_rupay {
	height: 32px !important;
	width: 95px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: -753px 0;
}
img.logo_rupay.logo_off {
	background-position: -753px -32px;
}
img.logo_mada {
	height: 32px !important;
	width: 75px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: -851px 0;
}
img.logo_mada.logo_off {
	background-position: -851px -32px;
}
img.logo_stcpay {
	height: 32px !important;
	width: 90px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: -931px 0;
}
img.logo_stcpay.logo_off {
	background-position: -931px -32px;
}
img.logo_cup {
	height: 32px !important;
	width: 62px;
	background: url('../../assets/images/paymethods.png') 0 0;
	background-position: -1026px 0;
}
img.logo_cup.logo_off {
	background-position: -1026px -32px;
}
img.logo_applepay {
	height: 32px !important;
	width: 53px;
	background: url('../../assets/images/applepay_logo.png') 0 0;
}
img.logo_urpay {
	height: 32px !important;
	width: 74px;
	background: url('../../assets/images/urpay_logo.jpg') 0 0;
}
img.logo_tabby {
	height: 30px !important;
	width: 70px;
	background: url('../../assets/images/tabbysmall.png') 0 0;
}
img.logo_jeelpay {
	height: 30px !important;
	width: 108px;
	background: url('../../assets/images/jeelpay_logo.svg') 0 0;
}

/* CIRGM: keep Telr network logos orderly on classic WooCommerce checkout. */
.payment_box.payment_method_wctelr .telr-payment-description {
    width: 100%;
    margin: 0 0 12px;
    line-height: 1.55;
}

.payment_box.payment_method_wctelr .telr-supported-networks {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    width: 100%;
    direction: ltr;
}

.payment_box.payment_method_wctelr .telr-supported-networks img {
    display: block !important;
    flex: 0 0 auto;
    float: none !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    vertical-align: middle;
}

@media only screen and (max-width: 600px) {
    .payment_box.payment_method_wctelr {
        box-sizing: border-box;
        width: 100%;
        padding: 14px 12px !important;
        overflow: visible;
    }

    .payment_box.payment_method_wctelr .telr-payment-description {
        margin-bottom: 12px;
        text-align: center;
        direction: rtl;
        overflow-wrap: anywhere;
    }

    .payment_box.payment_method_wctelr .telr-supported-networks {
        justify-content: center;
        gap: 8px 10px;
    }
}