Cacher is the code snippet organizer for pro developers

 1. Add `orc-collectionControls-item-input--checked` to checked element html
 2. Add new css selector class (replaces previous :checked + class)
 
 .orc-collectionControls-item-input--checked + .orc-collectionControls-item-label {
  border: 2px solid #d8e7f7;  
  -moz-box-shadow: 0 0 0 2px #d8e7f7;
  -webkit-box-shadow: 0 0 0 2px #d8e7f7;
  box-shadow: 0 0 0 2px #d8e7f7;
  -webkit-appearance: none;
}
 
 3. Change script to
 
        <script>
            (function(){
            function okeWidgetControlInit() {
                var snippetEl = document.querySelector('#orc-widget-snippet');
                var controlEl = document.querySelector('#orc-collection-control');
                var collectionRadioElements = Array.prototype.slice.call(document.querySelectorAll('.js-orc-collectionRadio'));
                controlEl.style.display = 'block';

                collectionRadioElements.forEach(function(radioElement) {
                    radioElement.addEventListener('change', function() {
                        snippetEl.okeReviews.setCollection(radioElement.value);
                      	
                        collectionRadioElements.forEach(function(element) {
							element.classList.remove('orc-collectionControls-item-input--checked');
                        });
                        radioElement.classList.add('orc-collectionControls-item-input--checked');
                    });
                });
            }

            window.okeReviewsWidgetOnInit = okeWidgetControlInit;
            })();
        </script>

<div>
    <div id="orc-collection-control" style="display: none;">
        <div id="orc-collection-controls-label" class="orc-collectionControlsLabel">Select a product range</div>
        <div class="orc-collectionControls" role="radiogroup" aria-labelledby="orc-collection-controls-label">
        <div class="orc-collectionControls-item">        
            <input id="orc-reviews-control-1" class="orc-collectionControls-item-input js-orc-collectionRadio" type="radio" checked value="<collection-id>" name="orc-reviews-collection-control" />
            <label for="orc-reviews-control-1" class="orc-collectionControls-item-label">
            <span class="orc-collectionControls-item-label-heading">
                Bracelets
            </span>
            <span class="orc-collectionControls-item-label-background" style="background-image: url('{{ 'okendo-reviews-collection-thumbnail-<collection-id>.jpg' | asset_img_url: '150x' }}')"></span>
            </label>
        </div>
        <div class="orc-collectionControls-item">        
            <input id="orc-reviews-control-2" class="orc-collectionControls-item-input js-orc-collectionRadio" type="radio" value="<collection-id>" name="orc-reviews-collection-control" />
            <label for="orc-reviews-control-2" class="orc-collectionControls-item-label">
            <span class="orc-collectionControls-item-label-heading">
                Earrings
            </span>
            <span class="orc-collectionControls-item-label-background" style="background-image: url('{{ 'okendo-reviews-collection-thumbnail-<collection-id>.jpg' | asset_img_url: '150x' }}')"></span>
            </label>
        </div>
        <div class="orc-collectionControls-item">        
            <input id="orc-reviews-control-3" class="orc-collectionControls-item-input js-orc-collectionRadio" type="radio" value="<collection-id>" name="orc-reviews-collection-control" />
            <label for="orc-reviews-control-3" class="orc-collectionControls-item-label">
            <span class="orc-collectionControls-item-label-heading">
                Necklaces
            </span>
            <span class="orc-collectionControls-item-label-background" style="background-image: url('{{ 'okendo-reviews-collection-thumbnail-<collection-id>.jpg' | asset_img_url: '150x' }}')"></span>
            </label>
        </div>
        <div class="orc-collectionControls-item">        
            <input id="orc-reviews-control-4" class="orc-collectionControls-item-input js-orc-collectionRadio" type="radio" value="<collection-id>" name="orc-reviews-collection-control" />
            <label for="orc-reviews-control-4" class="orc-collectionControls-item-label">
            <span class="orc-collectionControls-item-label-heading">
                Rings
            </span>
            <span class="orc-collectionControls-item-label-background" style="background-image: url('{{ 'okendo-reviews-collection-thumbnail-<collection-id>.jpg' | asset_img_url: '150x' }}')"></span>
            </label>
        </div>
        </div>
    </div>
    <div id="orc-widget-snippet" data-oke-reviews-widget="" data-oke-reviews-collection-id="<initial-collection-id>"></div>
    <script>
        (function(){
        function okeWidgetControlInit() {
            var snippetEl = document.querySelector('#orc-widget-snippet');
            var controlEl = document.querySelector('#orc-collection-control');
            var collectionRadioElements = Array.prototype.slice.call(document.querySelectorAll('.js-orc-collectionRadio'));
            controlEl.style.display = 'block';

            collectionRadioElements.forEach(function(radioElement) {
            radioElement.addEventListener('change', function() {
                snippetEl.okeReviews.setCollection(radioElement.value);
            });
            });
        }

        window.okeReviewsWidgetOnInit = okeWidgetControlInit;
        })();
    </script>
</div>

<div data-oke-reviews-widget=""></div>