.wadi_paypal_checkout_radio_skin_style1 {

    .wadi_paypal_checkout_container {
    
        .wadi_radio_buttons  {
            // display: grid;
            // grid-template-columns: repeat(7,1fr);
            grid-gap: 7px;
            gap: 7px;
            margin-top: 5px;
            margin-bottom: 12px;
            
            label {
                height: 38px;
                border-radius: 4px;
                text-align: center;
                border: 1px solid #ccc;
                cursor: pointer;
                flex-grow: 1;
                display: flex;
                align-items: center;
                justify-content: center;
                z-index: 90;
    
                &:has(input[type='radio']:checked) {
                    background-color: rgb(0, 0, 0);
                    color: white;
                }
                background: #b0b0b0;
    
                input {
                    &[type='radio'] {
                        display: none;
                        z-index: 100;
    
                        &:checked {
                            background: #e2e2e2;
                            border: 1px solid;
                        }
                    }
                }
            }
        }
    }
}
.wadi_paypal_checkout_radio_skin_style2 {

    .wadi_paypal_checkout_container {
    
        .wadi_radio_buttons  {
            display: grid;
            grid-template-columns: repeat(7,1fr);
            grid-gap: 7px;
            gap: 7px;
            margin-top: 5px;
            margin-bottom: 12px;

            label {
                display: block;
                position: relative;
                padding-left: 35px;
                margin-bottom: 12px;
                cursor: pointer;
                font-size: 22px;
                -webkit-user-select: none;
                -moz-user-select: none;
                -ms-user-select: none;
                user-select: none;

                // height: 38px;
                // border-radius: 4px;
                // text-align: center;
                // border: 1px solid #ccc;
                // cursor: pointer;
                // flex-grow: 1;
                // display: flex;
                // align-items: center;
                // justify-content: center;
                // z-index: 90;
    
                // &:has(input[type='radio']:checked) {
                //     background-color: rgb(0, 0, 0);
                //     color: white;
                // }
                // background: #b0b0b0;
    
                input {
                    position: absolute;
                    opacity: 0;
                    cursor: pointer;
                    height: 0;
                    width: 0;
                    // &[type='radio'] {
                    //     display: none;
                    //     z-index: 100;
    
                    //     &:checked {
                    //         background: #e2e2e2;
                    //         border: 1px solid;
                    //     }
                    // }
                }

                .checkmark {
                    position: absolute;
                    top: 5px;
                    left: 0;
                    height: 25px;
                    width: 25px;
                    background-color: #eee;
                    border-radius: 50%;

                    &:after {
                        content: "";
                        position: absolute;
                        display: none;
                        left: 10px;
                        top: 7px;
                        width: 5px;
                        height: 10px;
                        border: solid white;
                        border-width: 0 3px 3px 0;
                        -webkit-transform: rotate(45deg);
                        -ms-transform: rotate(45deg);
                        transform: rotate(45deg);
                      }
                }

                &:hover {
                    input ~ .checkmark {
                        background-color: #ccc;
                    }
                }

                input[type='radio']:checked ~ .checkmark {
                    background-color: #2196F3;
                }

                input[type='radio']:checked ~ .checkmark:after {
                    display: block;
                }

            }
        }
    }
}

.wadi_payment_success {
    display: block;
    padding: 12px;
    border: 2px solid #000;
    background-color: #ddd;

    &.hidden {
        display: none;
    }
}
