/* Generated from site/src/styles/components/map.css by wordpress/tools/sync-theme-assets.mjs – edit the source, not this copy. */
/*
 * Click-to-load map placeholder (MapEmbed): a quiet panel with a button; the
 * iframe replaces it after the click.
 * WordPress: enqueued with templates that have a map.
 */
.map-embed {
  position: relative;
  display: grid;
  height: 450px;
  background: #ece6dc;
}
.map-placeholder {
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 12px;
  padding: 20px;
  text-align: center;
}
.map-label {
  margin: 0;
  color: var(--maroon);
  font-family: var(--display);
  font-size: var(--h-date);
  /* Anton has one weight; an inherited bold would be faked (smudged). */
  font-weight: 400;
  line-height: 1.05;
}
.map-load { font-size: 24px; }
.map-note { margin: 0; font-size: 15px; font-weight: 600; }
.map-embed iframe {
  width: 100%;
  height: 100%;
  border: 0;
}

/* With the static map picture (OpenStreetMap, served from this site): the
   picture fills the box, the pin in its middle; the label and button sit on
   a light card at the foot so the pin stays in view. */
.map-embed.has-picture { overflow: hidden; }
.map-static { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.has-picture .map-placeholder {
  position: relative;
  align-self: end;
  justify-self: center;
  margin: 0 16px 20px;
  padding: 16px 24px;
  background: rgb(255 255 255 / 0.92);
  box-shadow: 0 4px 24px rgb(0 0 0 / 0.18);
}
.has-picture .map-label { font-size: calc(var(--h-date) * 0.8); }
.map-credit {
  position: absolute;
  right: 0;
  bottom: 0;
  margin: 0;
  padding: 2px 6px;
  background: rgb(255 255 255 / 0.85);
  color: #333;
  font-size: 12px;
}
.map-credit a { color: inherit; text-decoration: underline; }
@media (max-width: 560px) {
  .has-picture .map-placeholder { padding: 12px 16px; gap: 8px; }
  .has-picture .map-load { font-size: 20px; }
}
