/* Upgrade pop-up for locked events (Phase 3, 2026-09-21) -- js/upgrade-prompt.js. Loaded by the map, the calendar and the admin preview,
   so every colour has a fallback (the admin page doesn't define the map's theme variables). */
#cehub-upgrade-overlay {
  position: fixed; inset: 0; z-index: 5700;
  background: rgba(0,0,0,0.62);
  display: flex; align-items: center; justify-content: center;
  padding: 18px; box-sizing: border-box;
  opacity: 0; transition: opacity 0.2s ease;
}
#cehub-upgrade-overlay.hidden { display: none; }
#cehub-upgrade-overlay.cehub-upgrade-visible { opacity: 1; }
#cehub-upgrade-modal {
  position: relative; box-sizing: border-box; width: min(420px, 100%); max-height: 88vh; overflow-y: auto;
  background: var(--bg-dark, #1a1a2e); color: var(--text-light, #eee8f0);
  border: 1px solid var(--border, #33334f); border-top: 3px solid var(--accent, #f1ae29);
  border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,0.55);
  padding: 26px 22px 22px; text-align: center; font-family: inherit;
  transform: scale(0.94) translateY(8px); transition: transform 0.2s ease;
}
#cehub-upgrade-overlay.cehub-upgrade-visible #cehub-upgrade-modal { transform: scale(1) translateY(0); }
#cehub-upgrade-close {
  position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; border-radius: 50%;
  border: 1px solid var(--border, #33334f); background: var(--bg-dark-2, #22223a); color: var(--text-light, #eee8f0);
  cursor: pointer; font-size: 15px; line-height: 1; padding: 0;
}
#cehub-upgrade-close:hover { border-color: var(--accent, #f1ae29); color: var(--accent, #f1ae29); }
#cehub-upgrade-modal img.cehub-upgrade-image {
  display: block; width: 100%; height: auto; max-height: min(30vh, 240px); object-fit: contain;
  background: var(--bg-dark-2, #22223a); border-radius: 10px; margin: 0 0 14px;
}
#cehub-upgrade-modal img.cehub-upgrade-image.hidden { display: none; }
.cehub-upgrade-lock { font-size: 28px; line-height: 1; margin-bottom: 6px; }
.cehub-upgrade-headline { margin: 0 0 8px; padding: 0 18px; font-size: 21px; line-height: 1.25; color: var(--accent, #f1ae29); }
.cehub-upgrade-eventname { font-size: 12.5px; color: #a9a5bd; margin-bottom: 12px; }
.cehub-upgrade-eventname:empty { display: none; }
.cehub-upgrade-message { font-size: 14.5px; line-height: 1.55; margin-bottom: 18px; white-space: pre-line; }
.cehub-upgrade-actions { display: flex; flex-direction: column; gap: 10px; }
.cehub-upgrade-buy, .cehub-upgrade-continue {
  display: block; box-sizing: border-box; width: 100%; padding: 12px 16px; border-radius: 10px;
  font-size: 15px; font-weight: 700; text-align: center; text-decoration: none; cursor: pointer; font-family: inherit;
}
.cehub-upgrade-buy { background: var(--accent, #f1ae29); color: #1a1a2e; border: 1px solid var(--accent, #f1ae29); }
.cehub-upgrade-buy:hover { filter: brightness(1.08); }
.cehub-upgrade-continue { background: transparent; color: var(--text-light, #eee8f0); border: 1px solid var(--border, #33334f); font-weight: 600; }
.cehub-upgrade-continue:hover { border-color: var(--accent, #f1ae29); color: var(--accent, #f1ae29); }
.cehub-upgrade-buy:focus-visible, .cehub-upgrade-continue:focus-visible, #cehub-upgrade-close:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }