title: How to remove border that shows after click in b-form-checkbox in BootstrapVue
body: <p>I am trying to remove border after clicking in option in select box.
  Here the vue part:</p>
  
  <pre><code>&lt;b-form-checkbox-group v-model="selected"&gt;
    &lt;b-form-checkbox v-for= "element in options" :key="element.text"&gt;
      &lt;div&gt;{{element.text}}&lt;/div&gt;
    &lt;/b-form-checkbox&gt;
  &lt;/b-form-checkbox-group&gt;
  </code></pre>
  
  <p>and data:</p>
  
  <pre><code>        selected: null,
          options: [{
              value: null,
              text: 'Please select an option'
            },
            {
              value: 'a',
              text: 'This is First option'
            },
            {
              value: 'b',
              text: 'Selected Option'
            },
            {
              value: {
                C: '3PO'
              },
              text: 'This is an option with object value'
            },
            {
              value: 'd',
              text: 'This one is disabled',
              disabled: true
            }
          ]
        }
  </code></pre>
  
  <p>I had the similar issue but solved it removing box-shadow. It this case I tried:</p>
  
  <pre><code>.custom-control-input, .custom-control-input::before, .custom-control-input:focus {
    border: 0 !important;
    box-shadow: none !important;
    outline: none !important;
  }
  </code></pre>
  
  <p>but nothing change. How can I remove border that shows after click?</p>