/* Global radio button styling */
.ssp-radio {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    user-select: none;
}

input[type="radio"] {
    -webkit-appearance: none;
    appearance: none;
    display: block;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: hsla(0,0%,100%,.15) 0 1px 1px, inset hsla(0,0%,0%,.5) 0 0 0 1px;
    background-color: hsla(0,0%,0%,.2);
    background-image: radial-gradient(hsla(172,100%,90%,1) 0%, hsla(172,100%,70%,1) 15%, hsla(172,100%,60%,.3) 28%, hsla(172,100%,30%,0) 70%);
    background-repeat: no-repeat;
    transition: background-position .15s cubic-bezier(.8,0,1,1), transform .25s cubic-bezier(.8,0,1,1);
    outline: none;
    margin: 0;
}

input[type="radio"]:checked {
    transition: background-position .2s .15s cubic-bezier(0,0,.2,1), transform .25s cubic-bezier(0,0,.2,1);
    background-position: 0 0;
}

input[type="radio"]:active {
    transform: scale(1.5);
    transition: transform .1s cubic-bezier(0,0,.2,1);
}

input[type="radio"],
input[type="radio"]:active {
    background-position: 0 24px;
}
