/* lc-geo.css — shared "Near:" chip + directory section headers. Theme-neutral. */
.lc-geo-chip { position: relative; display: inline-block; font-size: 14px; }
.lc-geo-chip__btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px; border: 1px solid rgba(0,0,0,.18); border-radius: 999px;
  background: #fff; color: #16324a; cursor: pointer; line-height: 1;
}
.lc-geo-chip__btn:hover { border-color: rgba(0,0,0,.35); }
.lc-geo-chip__pin { color: #2f6f57; }
.lc-geo-chip__menu {
  position: absolute; z-index: 1200; top: calc(100% + 6px); left: 0;
  min-width: 210px; background: #fff; border: 1px solid rgba(0,0,0,.15);
  border-radius: 10px; box-shadow: 0 8px 28px rgba(0,0,0,.16); padding: 6px;
}
.lc-geo-chip__opt {
  display: block; width: 100%; text-align: left; padding: 8px 10px;
  border: 0; background: transparent; border-radius: 6px; cursor: pointer; color: #16324a;
}
.lc-geo-chip__opt:hover { background: #f0f4f2; }

.lc-geo-sec {
  grid-column: 1 / -1; margin: 18px 2px 8px;
  font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  color: #5c6b73; border-bottom: 1px solid rgba(0,0,0,.08); padding-bottom: 6px;
}
.lc-geo-sec:first-child { margin-top: 4px; }

/* The row a chip is mounted into.
   The chip is appended by JS into a header that was sized for the children it already had,
   so at narrow widths it is the one child with no room left. Measured at 414: the
   restaurants results header overflowed its 399px content box by 39px under an ancestor
   with overflow-x hidden, cutting the chip off the right edge entirely; the listings
   toolbar wrapped it onto a line that fell behind the fixed bottom bar. Both surfaces read
   as the chip simply not being there.
   Set on the host rather than in eight per-vertical stylesheets, since every one of them
   would otherwise learn the same lesson separately. flex-wrap is inert on a host that is
   not a flex container, so this is safe on every mount point.
   Scoped to the width it was measured at. Unscoped, the same rule also wrapped the row on
   restaurants, health and schools at 1440 — none of those content rows overflow a desktop
   results column, so the wrap was pure regression there: a row that fit on one line now
   sits on two. 700px matches the breakpoint the health vertical had already picked for
   this identical problem before this rule existed. */
@media (max-width: 700px) {
  .lc-geo-host { flex-wrap: wrap; }
  .lc-geo-host > .lc-geo-chip { flex: 0 0 auto; }
}
