How to get different values for different b-select in vuejs

I am facing an issue where I have a form and in the form it got two b-select and the form is repeated for n number of times. When I am selecting one b-select, all the others gets filled up with the same values where as I wanted to have different values for different select options.

Here is the HTML code for it:

  <div v-for="i in num_items" :key="i">
    <b-form-select v-model="selected" :options="options"></b-form-select>
    <b-form-select
      v-model="selected"
      :options="options"
      size="sm"
      class="mt-3"
    ></b-form-select>
    <div class="mt-3">
      Selected: <strong>{{ selected }}</strong>
    </div>
  </div>

and the script:

 data() {
    return {
      num_items: 5,
      selected: null,
      options: [
        { value: null, text: "Please select an option" },
        { value: "a", text: "This is First option" },
        { value: "b", text: "Selected Option" },
      ],
    };
  },

Here is the sample working demo

Please advise.