.spf-field-group.spf-number.spf-field-cc {
    width: 100%;
    height: 58px;
}
.input-group.form-floating {
    display: flex;
    flex-wrap: nowrap;
}
#spreedly-number-test,
#spreedly-cvv-test {
    width: 100%;
    height: 48px;
    border-radius: .25rem;
    overflow: hidden;
    border: 1.5px solid #bbb !important;
}
.form-floating > .input-outline-none:focus ~ label.id_number,
.form-floating > .input-outline-none:focus-within ~ label.id_number {
    opacity: 0.65;
    -webkit-transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
}
#spreedly-number-test:focus ~ label.id_number,
#spreedly-number-test:focus-within ~ label.id_number {
    opacity: 0.65;
    -webkit-transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
}
.form-floating:focus-within > label.id_number {
     opacity: 0.65;
    -webkit-transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
}

.card_num {
    background-color: #fff;
    border: 1.5px solid #bbb !important;
}
#spreedly-number-test.card_num.has-error {
    border: 1px solid orange !important;
}
#spreedly-number-test.card_num.no-error {
    border: 1px solid green !important;
}
#spreedly-number-test.card_num.has-error::after {
    content: "";
    width: 18px;
    height: 16px;
    background: url(../images/error-input.png) 93.5% 50% no-repeat #fff;
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
}
#spreedly-number-test.card_num.no-error::after {
    content: "";
    width: 18px;
    height: 16px;
    background: url(../images/tick-input.png) 93.5% 50% no-repeat #fff !important;
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
}