.wccf-city-filter { width: 100%; max-width: 440px; margin: 0; }
.wccf-city-filter > label { display: block; margin-bottom: 6px; font-weight: 600; }
.wccf-city-filter > .wccf-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.wccf-city-filter__controls { display: flex; align-items: stretch; gap: 8px; }
.wccf-city-filter__select { position: relative; display: flex; flex: 1; min-width: 0; color: #17365a; }
.wccf-city-filter__pin, .wccf-city-filter__chevron { position: absolute; top: 50%; transform: translateY(-50%); pointer-events: none; }
.wccf-city-filter__pin { left: 7px; color: #bd8b2c; }
.wccf-city-filter__chevron { right: 10px; }
.wccf-city-filter__controls select { appearance: none; -webkit-appearance: none; flex: 1; min-width: 0; width: 100%; height: auto; min-height: 42px; padding: 8px 32px 8px 36px; border: 0; border-radius: 4px; background: transparent; color: #17365a; font: inherit; cursor: pointer; }
.wccf-city-filter__controls select option { background: #fff; color: #17365a; }
.wccf-city-filter__controls button { flex-shrink: 0; padding: 8px 16px; border-radius: 4px; cursor: pointer; font: inherit; }
.wccf-city-filter__controls select:focus-visible,
.wccf-city-filter__controls button:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
