.city-map-shell{display:grid;grid-template-columns:350px minmax(0,1fr);background:#f5f7f4;min-height:760px}
.city-map-sidebar{padding:1.75rem;background:white;max-height:900px;overflow:auto}
.city-map-main{position:relative;min-width:0}
.city-map-canvas{height:100%;min-height:760px;z-index:0}
.city-map-toolbar{position:absolute;z-index:500;top:16px;left:60px;right:16px;display:flex;gap:.5rem;flex-wrap:wrap;pointer-events:none}
.city-map-toolbar button{pointer-events:auto;box-shadow:0 2px 10px #0002;font-size:.85rem}
.city-map-message{position:absolute;z-index:500;bottom:30px;left:16px;right:16px;background:#fff8df;padding:.8rem 1rem;border-radius:.6rem;box-shadow:0 2px 8px #0002}
.city-map-results{display:grid;gap:.65rem;max-height:380px;overflow:auto}
.city-map-result{text-align:left;border:1px solid #dce6e1;background:#fff;border-radius:.7rem;padding:.85rem;display:grid;gap:.25rem;width:100%}
.city-map-result:hover,.city-map-result:focus-visible{border-color:#087f68;background:#f0faf5}
.city-map-result small{color:#52645b}.city-map-result strong{color:#0e392f}
.city-map-pin{background:transparent;border:none}.city-map-pin span{display:grid;place-items:center;width:30px;height:30px;border:3px solid white;border-radius:50%;color:white;background:var(--pin-color,#087f68);font-size:11px;font-weight:bold;box-shadow:0 2px 7px #0005}
.city-map-popup h3{font-size:1rem;margin:0 0 .6rem}.city-map-popup p{margin:.35rem 0}.city-map-popup a{display:block;margin-top:.6rem}
.location-picker-canvas{height:300px;border:1px solid #dce6e1;border-radius:.65rem;z-index:0}
@media(max-width:991px){.city-map-shell{grid-template-columns:300px minmax(0,1fr)}.city-map-sidebar{padding:1.1rem}.city-map-toolbar{left:55px}}
@media(max-width:700px){.city-map-shell{display:flex;flex-direction:column}.city-map-main{order:-1;height:440px}.city-map-canvas{min-height:440px}.city-map-sidebar{max-height:none}.city-map-results{max-height:300px}.city-map-toolbar button{padding:.4rem .5rem;font-size:.75rem}}
@media(max-width:700px){.vendor-app-nav .container{flex-wrap:wrap;gap:.75rem}.vendor-app-nav .container>div{width:100%;flex-wrap:wrap}.vendor-app-nav .mg-vendor-brand{max-width:100%}}
