/* MapStory Preview Styles (visible in Ghost editor) */

.mapstory-preview {
  border: 2px dashed #ccc;
  padding: 1.5rem;
  margin: 2rem 0;
  background: #f9f9f9;
  border-radius: 8px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.mapstory-preview-header {
  font-weight: bold;
  margin-bottom: 0.5rem;
  color: #333;
  font-size: 1rem;
}

.mapstory-preview-content {
  margin-bottom: 1rem;
}

.mapstory-preview-title {
  font-size: 1.2rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
  color: #222;
}

.mapstory-preview-description {
  font-size: 0.95rem;
  color: #555;
  margin-bottom: 0.75rem;
  line-height: 1.5;
}

.mapstory-preview-meta {
  font-size: 0.9rem;
  color: #666;
  margin-top: 0.5rem;
  font-family: 'Monaco', 'Menlo', 'Courier New', monospace;
}

.mapstory-preview-meta code {
  background: #e8e8e8;
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 0.85rem;
  color: #c7254e;
}

.mapstory-preview-note {
  font-size: 0.85rem;
  color: #999;
  font-style: italic;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #ddd;
}

/* Hide preview on published page (show map instead) */
.mapstory-chapter .mapstory-preview {
  display: none;
}

/* Hide chapter map containers - actual map is in shared #story-map container */
.mapstory-chapter .mapstory-chapter-map {
  display: none !important;
}

/* Ensure chapter elements have height for scroll detection but don't create visible gaps */
.mapstory-chapter {
  margin: 4rem 0; /* Spacing around chapter */
  padding: 0;
  min-height: 100vh; /* Height for scroll detection - map will overlay */
  position: relative;
  z-index: 1; /* Same as content - allows map (z-index: 0) to show through */
  /* Make chapter container transparent so map shows through */
  background: transparent !important;
  /* Chapter container itself is invisible for scroll detection, but content inside can be visible */
  opacity: 0; /* Invisible container for scroll detection */
  pointer-events: none; /* Don't block map interaction */
}

/* Content inside chapters (photos, text, etc.) should be visible */
.mapstory-chapter > *:not(.mapstory-preview):not(.mapstory-chapter-map) {
  opacity: 1 !important;
  pointer-events: auto;
  position: relative;
  z-index: 2; /* Above map and chapter container */
}

/* Hide bookmark cards that are being replaced by map chapters */
figure:has(.kg-bookmark-card) + .mapstory-chapter ~ .kg-bookmark-card,
.kg-bookmark-card:has(+ .mapstory-chapter) {
  display: none !important;
}