/**
 * @class Ext.field.Radio
 */

.x-field-radio .x-field-mask {
    height: 47px;

    &::before {
        @include border-radius(35px);
        width: 20px;
        height: 20px;
        top: 16px;
        right: 6px;
    }

    &::after {
        @include border-radius(35px);
        width: 16px;
        height: 16px;
        top: 18px;
        right: 8px;
    }
}

.x-input-radio:checked ~ .x-field-mask::after {
    @include background(linear-gradient(color-stops(#3498CB, #0974A8)));
    @include box-shadow(inset 0 1px 0 0 #55AAD5);
    font-family: Helvetica;
    font-size: 26px;
    line-height: 13px;
    content: '•';
}

.x-item-disabled.x-field-radio {
    .x-input-radio:checked ~ .x-field-mask:after {
        @include background(linear-gradient(color-stops(#bfd7e3, #85b3c9)));
        @include box-shadow(inset 0 1px 0 0 #aac5d3);
    }
}