Edit

Editing: _financial.scss

.charge-account-radio {

.disabled-payment-channel {
        border-radius: 10px;
        filter: grayscale(100%);
    }

label {
        cursor: pointer;
        border: solid 3px transparent;
        box-shadow: 0px 12px 23px 0px rgb(62 73 84 / 7%);
        transition: all 0.3s ease;

&:hover {
            border: 3px solid var(--primary);
            transition: all 0.3s ease;
            box-shadow: 0 10px 30px 0 rgba(67, 212, 119, 0.3);
        }
    }

input[type=radio] {
        visibility: hidden;
        display: none;

&:checked {
            & + label {
                box-shadow: 0 10px 30px 0 rgba(67, 212, 119, 0.3);
                border: solid 3px var(--primary);
                background-color: #ffffff;
                transition: all 0.3s ease;
            }
        }
    }
}

.subscribe-plan {
    position: relative;
    border: 3px solid transparent;
    transition: all .4s ease;
    top: 0;

.badge-popular {
        position: absolute;
        top: 10px;
        left: 10px;
        border-radius: 10px 0 10px 0;
    }

&:hover {
        top: -15px;
        box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.15) !important;
    }

.plan-icon {
        width: 120px;
        height: 120px;
    }

.plan-feature {
        li {
            position: relative;
            color: $dark-blue;

&:after {
                content: '';
                position: absolute;
                left: -20px;
                top: 3px;
                width: 10px;
                height: 10px;
                border-radius: 50%;
                background-color: var(--secondary);

.rtl & {
                    left: auto;
                    right: -20px;
                }
            }
        }
    }
}

.registration-package-statistics {

.registration-package-statistics-icon {
        width: 48px;
        height: 48px;

img {
            width: 100%;
            height: 100%;
        }
    }
}

Back