Bootstrap styling not properly applying to all elements within an application

This question is oddly annoying, yet I cannot seem to discover any valid reason as to why this is occurring.

I have a super simple Vue app that I am working on in which I am using Vue Bootstrap. It seems that some elements do not have the proper Bootstrap CSS values being appropriated to them.

I have several radio buttons which have a generic radio within them when I am expecting them to appear as they are shown within the bootstrap documentation. odd buttons.

Expected: expected_results

The code for this item is just the generic template code that is within the documentation and I have used this many times before with the expected results.

I am not linking/embedding any external style sheets, all other style tags are scoped within all other components. I am not sure how/why these buttons are appearing in such a fashion.

Code Snippet:

<template>
  <div>
  <b-form-group
      label="Button style radios with outline-primary variant and size lg"
      v-slot="{ ariaDescribedby }"
    >
      <b-form-radio-group
        id="btn-radios-2"
        v-model="selected"
        :options="options"
        :aria-describedby="ariaDescribedby"
        button-variant="outline-primary"
        size="lg"
        name="radio-btn-outline"
        buttons
      ></b-form-radio-group>
    </b-form-group>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        selected: '',
        options: [
          { text: '1 minute', value: '60' },
          { text: '5 minutes', value: '300' },
          { text: '10 minutes', value: '600' }
        ]
      }
    }
  }
</script>

Importing the boostrap is done as one generally would within the main.js file. Now oddly enough all styling works except for when creating toast messages with $bvToast, but that will be a separate issue.

Import of boostrap:

import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'
import router from './router'
import store from './store'

Vue.use(BootstrapVue)
Vue.use(IconsPlugin)
Vue.use(VueAxios, axios)

Any ideas are most welcome!