.product-field-type-C .controls label.radio{
    padding: 10px 8px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    display: inline-block;
}
.product-field-type-C .controls label.active{
    border-color: orange;
    border-width: 2px;
}
.product-field-type-C .controls label input[type="radio"]{
    position: absolute;
    left: -9999px;
}
.product-field-type-C .custom_field_C_container {
    display: none;
}​

В шаблон карточки товара внутрь блока с классом productdetails-view добавим

<script>
    jQuery(function($) {
        // скрытие опции Выберите 
         $('.product-field-type-C input[type="radio"]').filter(function() {
            return !this.value;
        }).each(function() {
            $(this).parent().hide();
        });
 
        // выделение активной опции
        $('.product-field-type-C input:checked').each(function() {
            $(this).parent().addClass('active');
        });
 
        // скрытие блока без параметров
        $('.custom_field_C_container').each(function() {
            var inputValue = $(this).find('input[type="radio"]').filter(function() {
                return this.value;
            });
            if (inputValue.length) {
                $(this).show();
            }
        });    
    });
</script>

Скрипт нужно добавлять именно в шаблон карточки товара, чтобы он отрабатывал после каждого ajax обновления после выбора опции.

В итоге опции станут выглядеть так

При выборе опции она будет выделена.

Сделать активным первый элемент вставить в конец страницы карточки

<script>
    jQuery('.product-fields .controls > label:first-child input').attr('checked',true);
</script>