/* apps/wp-plugin/cartaveo-maps/cartaveo-maps.css
 *
 * The plugin's only stylesheet. It exists because without it the entry list
 * inherits the host theme's list bullets, indent, margins and line height, so
 * the same collection looks different on every site that embeds it.
 *
 * Deliberately minimal and colourless: this markup sits inside someone else's
 * post, so it keeps their font and their text colour and only takes control of
 * the things a theme has no opinion worth honouring about — list decoration and
 * spacing. Rules are derived from `currentColor`, so the list follows the
 * theme into dark mode without a media query of its own.
 */

.cartaveo-maps-embed {
  margin-bottom: 1.5rem;
}

/* Only the map gets a frame — the entry list below stays borderless, like
   every other row list on the main site (no card, no ring, no divider).
   --cartaveo-radius is set inline on .cartaveo-maps-embed (the corner
   radius setting); it reaches this iframe by inheritance even though
   embed.js mounts it into the __map placeholder after the fact, since
   custom properties resolve through the DOM tree rather than at insertion
   time. */
.cartaveo-maps-embed__map > iframe {
  overflow: hidden;
  border-radius: var(--cartaveo-radius, 0.5rem);
  /* embed.js sets border:0 inline on the iframe it creates; inline style
     beats an external stylesheet at any specificity short of !important. */
  border: 1px solid color-mix(in srgb, currentColor 14%, transparent) !important;
}

.cartaveo-maps-list {
  margin-top: 1rem;
  font-size: 0.9375rem;
  line-height: 1.5;
}

.cartaveo-maps-list__heading {
  margin: 0 0 0.5rem;
  font-size: 1rem;
  font-weight: 600;
}

.cartaveo-maps-entries {
  margin: 0;
  padding: 0;
  list-style: none;
}

.cartaveo-maps-entry {
  padding: 0.5rem 0;
  border-top: 1px solid color-mix(in srgb, currentColor 14%, transparent);
}

.cartaveo-maps-entry:first-child {
  border-top: 0;
}

.cartaveo-maps-entry__name {
  font-weight: 600;
}

.cartaveo-maps-entry__category {
  margin-left: 0.5rem;
  font-size: 0.8125rem;
  opacity: 0.6;
}

.cartaveo-maps-entry__description {
  margin: 0.25rem 0 0;
  opacity: 0.75;
}

.cartaveo-maps-more > summary {
  padding: 0.5rem 0;
  font-size: 0.875rem;
  cursor: pointer;
}

.cartaveo-maps-list-toggle > summary {
  margin-top: 1rem;
  font-size: 0.9375rem;
  font-weight: 600;
  cursor: pointer;
}

/* The editor's preview frame: the map is a real embed, but a click there must
   select the block rather than pan the map. */
.cartaveo-maps-editor-preview {
  position: relative;
}

.cartaveo-maps-editor-preview > iframe {
  display: block;
  width: 100%;
  overflow: hidden;
  border-radius: var(--cartaveo-radius, 0.5rem);
  border: 1px solid color-mix(in srgb, currentColor 14%, transparent);
}

/* Only while the block isn't yet selected — once it is, appearance controls
   (accent, theme) need the author to actually click a pin to preview their
   only visible effect, so the overlay has to step aside. */
.cartaveo-maps-editor-preview:not(.cartaveo-maps-editor-preview--selected)::after {
  content: "";
  position: absolute;
  inset: 0;
}

.cartaveo-maps-editor-status {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  margin: 0 0 0.5rem;
  font-size: 0.8125rem;
  opacity: 0.7;
}
