/* Map state switcher (map-state-switch.js). S2: navy #1F2A44, copper #B87333 */
:root {
  --mss-w: 105px;
  --zoom-w: 62px;
}
.mss[hidden]{display:none!important}
.mss-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.mss select{min-height:34px;max-width:150px;border-radius:8px;border:1px solid #B87333;background:#2b3a5c;color:#fff;font:600 13px system-ui,sans-serif;padding:0 6px;cursor:pointer}
.mss.in-ps{flex:none;display:flex;align-items:center;margin-left:4px}
.mss.chip{position:absolute;z-index:9;top:10px;left:10px}

/* Phone / Mobile layout: state dropdown on its own row under search bar, matching zoom chip height and style */
body.ga-mobile .mss.chip {
  top: 58px;
  left: 10px;
  z-index: 8;
  display: inline-flex;
  align-items: center;
}
body.ga-mobile .mss select {
  min-height: 26px;
  height: 26px;
  line-height: 24px;
  max-width: 125px;
  min-width: 78px;
  border-radius: 6px;
  border: 1px solid #4c6577;
  background: #1F2A44f5;
  color: #fff;
  font: 600 12px/1.2 Inter, system-ui, sans-serif;
  padding: 0 8px;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
  box-sizing: border-box;
  outline: none;
}
body.ga-mobile .mss select:focus-visible {
  border-color: #B87333;
  outline: 2px solid #e7b98a;
  outline-offset: 1px;
}

/* Position Zoom chip right after the state dropdown in the same row */
body.ga-mobile.has-mss #map .map-zoom-badge {
  left: calc(10px + var(--mss-w, 105px) + 6px) !important;
  top: 58px !important;
  min-height: 26px;
  height: 26px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
}

/* Position Attribution (i) info icon right after the Zoom chip */
body.ga-mobile.has-mss #gaMobileMapHost .maplibregl-ctrl-bottom-right,
body.ga-mobile.ga-explore.has-mss #gaMobileMapHost .maplibregl-ctrl-bottom-right {
  left: calc(10px + var(--mss-w, 105px) + 6px + var(--zoom-w, 62px) + 6px) !important;
  top: 57px !important;
}

/* Ensure parcel line hint sits cleanly below the chip row */
body.ga-mobile.has-place-search .stl-zoom-hint {
  top: 98px;
  left: 10px;
  transform: none;
  max-width: calc(100% - 84px);
}