/* The map component (inc/maps.php): the OpenStreetMap preview with the button, the note and the credit over it; a click swaps in the Google iframe. */
.lk-map { position: relative; margin: 0; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--radius-panel); border: 1px solid var(--line); box-shadow: var(--shadow-card); background: var(--surface); }
.lk-map-img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.lk-map iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; }
.lk-map-credit { position: absolute; top: 8px; right: 8px; margin: 0; padding: 4px 8px; border-radius: var(--radius-pill); background: rgba(255, 255, 255, .88); color: #333; font-size: 12px; line-height: 1.2; }
.lk-map-credit a { color: inherit; text-decoration: underline; }
/* The button needs the inline handler: it shows only where scripting is on, so without JavaScript the preview and the directions link remain. */
.lk-map-ui { display: none; position: absolute; left: 10px; right: 10px; bottom: 10px; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 16px; padding: 12px;
	border-radius: var(--radius-card); background: color-mix(in srgb, var(--bg) 92%, transparent); border: 1px solid var(--line-2); text-align: center; }
.lk-map-ui p { margin: 0; max-width: 40ch; font-size: 13px; line-height: 1.4; color: var(--muted); }
@media (scripting: enabled) { .lk-map-ui { display: flex; } }
/* Without a generated preview (a tile fetch failed) the plain box shows only where the button works. */
@media (scripting: none) { .lk-map-plain { display: none; } }
.lk-map-plain .lk-map-ui { position: static; border: 0; background: none; height: 100%; flex-direction: column; justify-content: center; }
.locations-grid .lk-map { aspect-ratio: auto; height: 260px; }
.lk-city-directions-cols .lk-map { aspect-ratio: 358 / 260; }
@media (min-width: 782px) {
  .locations-grid .lk-map { height: 100%; min-height: 420px; }
  .lk-city-directions-cols .lk-map { aspect-ratio: 680 / 660; }
}
