Multiselect drop down background is inconsistent

[sfc-gh-dmatthews]

Checklist

• I have searched the existing issues for similar issues.
• I added a very descriptive title to this issue.
• I have provided sufficient information below to help reproduce this issue.

Summary

If I use a theme with backgroundColor and secondaryBackgroundColor set for both the main body of the app and the sidebar, the color of the multiselect dropdown is inconsistent.

• In the main body of the app, the dropdown background comes from theme.backgroundColor and the hover effect is a 15% alpha layer derived from theme.secondaryBackgroundColor.
• In the sidebar, the dropdown background comes from theme.sidebar.secondaryBackgroundColor and the hover effect is a 15% alpha layer derived from theme.secondaryBackgroundColor.

Reproducible Code Example

import streamlit as st

st.multiselect("Widgets", ["A", "B", "C"])
with st.sidebar:
    st.multiselect("Gizmos", ["A", "B", "C"])

Steps To Reproduce

[theme]
base="dark"
backgroundColor="#0e1117"
secondaryBackgroundColor="indigo"
codeBackgroundColor="darkslategrey"

[theme.sidebar]
backgroundColor="#262730"
secondaryBackgroundColor="darkgoldenrod"

Expected Behavior

With both the main body and sidebar having their own background color and secondary background color, I'd expect consistent application within those regions.

Note: There is currently an inversion between primary and secondary background color in the sidebar if they are not set separately and only inherited from the main body. I'm not commenting on that; I only mean to say if I do set values in [theme.sidebar] that I expect to them to apply in the sidebar like they do to the main body if set in [theme]

Current Behavior

No response

Is this a regression?

• Yes, this used to work in a previous version.

Debug info

• Streamlit version: 1.45.1
• Python version: 3.13
• Operating System: Mac
• Browser: Prisma

Additional Information

No response

[github-actions]

If this issue affects you, please react with a 👍 (thumbs up emoji) to the initial post.

Your feedback helps us prioritize which bugs to investigate and address first.

[sfc-gh-dmatthews]

I'm told there's work being tracked elsewhere to deal with a border around the multiselect dropdown so it doesn't appear merged into the background in the main body. I'm not sure where that is to link to, but I'll drop here, relatedly, that the 15% alpha wash derived from the secondary background color looks good as the drop down background, which would then stack with the hover effect.

[ItsThareesh]

Maybe checkout the contents in the file frontend/lib/src/components/shared/Dropdown/styled-components.ts. I'm guessing that the background property may be relevant to this issue.