.confluxapi-method-icons {
    align-items: center;
    display: inline-flex;
    flex-wrap: wrap;
    gap: 5px;
    justify-content: flex-end;
}

.confluxapi-method-icon {
    align-items: center;
    box-sizing: border-box;
    display: inline-flex;
    flex: 0 0 64px;
    height: 32px;
    justify-content: center;
    margin-left: 10px;
    overflow: hidden;
    vertical-align: middle;
    width: 64px;
}

.confluxapi-brand-icon {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.14);
    border-radius: 5px;
    color: #172033;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: -0.25px;
    line-height: 1;
    white-space: nowrap;
}

.confluxapi-method-icons .confluxapi-method-icon {
    margin-left: 0;
}

/* Credit-card brand badges. */
.confluxapi-card-icon--visa { background: #1a1f71; color: #fff; font-size: 15px; font-style: italic; }
.confluxapi-card-icon--mastercard { background: linear-gradient(90deg, #eb001b 0 44%, #ff5f00 44% 56%, #f79e1b 56%); color: #fff; font-size: 9px; text-shadow: 0 1px 2px rgba(0,0,0,.7); }
.confluxapi-card-icon--jcb { background: linear-gradient(90deg, #0b4ea2 0 33%, #d71920 33% 66%, #159447 66%); color: #fff; font-size: 15px; }
.confluxapi-card-icon--discover { background: linear-gradient(135deg, #fff 0 63%, #f58220 64%); color: #111; font-size: 9px; }
.confluxapi-card-icon--amex { background: #2e77bc; color: #fff; font-size: 13px; }
.confluxapi-card-icon--diners { background: #0079be; color: #fff; font-size: 11px; }

/* Wallet and alternative-payment brand badges. */
.confluxapi-wallet-icon--link { background: #635bff; color: #fff; font-size: 15px; }
.confluxapi-wallet-icon--cash_app { background: #00d64f; color: #071a0d; font-size: 22px; }
.confluxapi-wallet-icon--klarna { background: #ffb3c7; color: #17120f; font-size: 13px; }
.confluxapi-wallet-icon--ideal { background: #cc0066; color: #fff; font-size: 13px; }
.confluxapi-wallet-icon--bancontact { background: linear-gradient(150deg, #005498 0 54%, #ffd800 55%); color: #fff; font-size: 9px; text-shadow: 0 1px 2px rgba(0,0,0,.7); }
.confluxapi-wallet-icon--blik { background: #111; color: #fff; font-size: 14px; }
.confluxapi-wallet-icon--swish { background: #f35b74; color: #fff; font-size: 12px; }
.confluxapi-wallet-icon--twint { background: #262626; color: #fff; font-size: 11px; }
.confluxapi-wallet-icon--wero { background: #fdf59b; color: #171717; font-size: 14px; }
.confluxapi-wallet-icon--apple_pay { background: #000; color: #fff; font-size: 11px; }
.confluxapi-wallet-icon--google_pay { background: #fff; color: #4285f4; font-size: 13px; }
.confluxapi-wallet-icon--pse { background: #123b70; color: #fff; font-size: 14px; }
.confluxapi-wallet-icon--nequi { background: #200020; color: #fff; font-size: 12px; }
.confluxapi-wallet-icon--afterpay { background: #b2fce4; color: #111; font-size: 9px; }
.confluxapi-wallet-icon--affirm { background: #4a4af4; color: #fff; font-size: 12px; }
.confluxapi-wallet-icon--ach { background: #1565c0; color: #fff; font-size: 14px; }
.confluxapi-wallet-icon--qris { background: #fff; color: #111; font-size: 13px; }

.wc_payment_method > label > .confluxapi-method-icon,
.wc_payment_method > label > .confluxapi-method-icons {
    float: right;
    margin-top: -3px;
}

.wc-block-components-payment-method-label.confluxapi-payment-method-label {
    align-items: center;
    display: flex;
    gap: 8px;
    width: 100%;
}

.wc-block-components-payment-method-label.confluxapi-payment-method-label > .confluxapi-method-icon,
.wc-block-components-payment-method-label.confluxapi-payment-method-label > .confluxapi-method-icons {
    margin-left: auto;
}