How do you change the background color of Android popup menu?

I am trying to change the background color of a popup menu I have attached to my options menu.
What I have tried so far (and had an okay? result with) is setting “android:itemBackground” to the preferred color. This almost gave me what I wanted but there is still a white border at the top and bottom of the menu that I cannot figure out how to get rid of.

I am looking for either a way to change the whole background color of the menu and not just of the items, or for a way to get rid of the bars at the top and bottom of the menu that remain white.

Here is my menu.xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <item android:id="@+id/filter_btn"
        android:title="filter"
        android:icon="@drawable/ic_filter"
        app:showAsAction="ifRoom">

        <menu>

            <item
                android:id="@+id/home_btn"
                android:title="Home"
                app:showAsAction="never" />

            <item
                android:id="@+id/lifestyle_btn"
                android:title="Lifestyle"
                app:showAsAction="never" />

            <item android:id="@+id/relationships_btn"
                android:title="Relationships"
                app:showAsAction="never"/>

            <item android:id="@+id/primp_btn"
                android:title="Primp"
                app:showAsAction="never"/>

            <item
                android:id="@+id/news_btn"
                android:title="News"
                app:showAsAction="never" />

            <item android:id="@+id/bonappetit_btn"
                android:title="Bon Appetit"
                app:showAsAction="never"/>

            <item android:id="@+id/goodies_btn"
                android:title="Goodies"
                app:showAsAction="never"/>

            <item android:id="@+id/videos_btn"
                android:title="Videos"
                app:showAsAction="never"/>

            <item android:id="@+id/dudes_btn"
                android:title="Dudes"
                app:showAsAction="never"/>

            <item
                android:id="@+id/liketoknowit_btn"
                android:title="LIKEtoKNOW.it"
                app:showAsAction="never"/>

        </menu>

    </item>

</menu>

Here is my themes.xml

<?xml version="1.0" encoding="utf-8"?>

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.ChitChat" parent="Theme.MaterialComponents.DayNight.NoActionBar">
        <!-- Primary brand color. -->
        <item name="colorPrimary">@color/brunch</item>
        <item name="colorPrimaryVariant">@color/dark_brunch</item>
        <item name="colorOnPrimary">@color/white</item>
        <!-- Secondary brand color. -->
        <item name="colorSecondary">@color/teal_200</item>
        <item name="colorSecondaryVariant">@color/teal_700</item>
        <item name="colorOnSecondary">@color/black</item>
        <!-- Status bar color. -->
        <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
        <item name="android:itemBackground">@color/brunch</item>
    </style>

    <style name="ToolbarTitleText" parent="TextAppearance.AppCompat.Widget.ActionBar.Title">
        <item name="android:textSize">34sp</item>
        <item name="fontFamily">@font/billy_ohio</item>
    </style>

    <style name="ToolbarSubtitleText" parent="TextAppearance.AppCompat.Widget.ActionBar.Subtitle">
        <item name="fontFamily">@font/montserrat</item>
        <item name="android:textSize">14sp</item>
    </style>
    
</resources>

Here is what the menu currently looks like. It’s sort of hard to see the white bars that I am talking about but if you look closely you will see them at the top and bottom of the menu:
picture of menu