Having an issue with checkbox v-model only returning the first keyword in array

I have several tracks in an array and have a search and checkboxes to filter the tracks. However, the checkboxes only return the first identified string in each filter. So if I click the checkbox for pop - in the example below - it will only show tracks containing only the pop genre. Tracks containing rock, pop genre won't appear. This is in composition API in Vue.

Here is the script:

const searchTerm = ref('')

const genreFilter = ref([])
const moodsFilter = ref([])
const tempoFilter = ref([])
const themeFilter = ref([])

const filteredTracks = computed(() => {
let filtered = useSong.tracks;

if (searchTerm.value) {
const term = searchTerm.value.toLowerCase();
filtered = filtered.filter(track =>
  track.description.toLowerCase().includes(term) || 
  track.genre.toLowerCase().includes(term) ||
  track.keywords.toLowerCase().includes(term) ||
  track.moods.toLowerCase().includes(term)
);
}

if (genreFilter.value.length > 0) {
filtered = filtered.filter(track => genreFilter.value.includes(track.genre))
}

if (moodsFilter.value.length > 0) {
filtered = filtered.filter(track => moodsFilter.value.includes(track.moods))
}

if (tempoFilter.value.length > 0) {
filtered = filtered.filter(track => tempoFilter.value.includes(track.tempo))
}

if (themeFilter.value.length > 0) {
filtered = filtered.filter(track => themeFilter.value.includes(track.theme))
}

return filtered;
});

Here is the html:

<div class="genres w-1/4"><h1 class="font-bold text-[#aeaeae]">Genres</h1><br>
        <input class="css-checkbox" type="checkbox" id="Rock" key="genre" value="Rock" v- 
 model="genreFilter">
        <label class="css-label pl-2 text-s font-light text-[#aeaeae]" for="Rock">Rock</label> 

        <input class="css-checkbox" type="checkbox" id="Pop" key="genre" value="Pop" v- 
 model="genreFilter">
        <label class="css-label pl-2 text-s font-light text-[#aeaeae]" for="Pop">Pop</label> 

How can I modify this so that I can check multiple boxes of genres and have them all show, removing only the unchecked boxes. Any help will be greatly appreciated. Also, you'll notice in the filters I have one for moods, tempo and theme. Whenever I click any of those checkboxes, nothing appears at all in the array despite the array having matching moods, tempo, and theme. Thanks.