Customize dropdown chevron

Change, hide, or replace the dropdown chevron with Custom CSS.

The Geolocation Popup chevron is not a separate HTML element. It is an SVG used as the dropdown button's CSS background-image.

This is generic Orbe CSS, not theme-specific. Paste it in Orbe Geolocation under Custom code

Override both the closed and open states, and keep !important.

#md-app-embed__modal .md-form__select {
    background-image: url("YOUR_CSS_SVG_HERE") !important;
}

#md-app-embed__modal .md-form__select[aria-expanded="true"] {
    background-image: url("YOUR_CSS_SVG_HERE") !important;
}

Do not paste a raw SVG into CSS. Edit the SVG, convert it with the free SVG to CSS tool, then paste the resulting value into background-image.

You can use this override to:

• Change the chevron color, thickness, or shape with a converted SVG.

• Hide it with background-image: none !important;.

• Use an icon file with background-image: url("https://example.com/icon.svg") !important;.

The default position is background-position: right 6px center;.

For the Country Selector app block or the Market Selector app embed using the dropdown type, keep the same background-image override, open state, !important, and SVG conversion. Only change the parent wrapper to .md-orbe-selector__content for the Country Selector or .md-footer-selector__content for the Market Selector.