/* Page title below the logo */
.page-title {
  margin-top: 16px;
  text-align: center;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--accent);
}

/* Map canvas — standalone card on the page */
.map-canvas {
  width: 100%;
  height: 60vh;
  min-height: 360px;
  background: var(--bg-card);
  border: 1px solid var(--bg-card-border);
  border-radius: var(--radius);
  overflow: hidden;
}

/* Leaflet attribution: tone down for the dark theme */
.leaflet-container {
  background: #0d0d14;
  font-family: inherit;
}
.leaflet-control-attribution {
  background: rgba(10, 10, 15, 0.85) !important;
  color: var(--text-dim) !important;
  font-size: 0.65rem !important;
}
.leaflet-control-attribution a {
  color: var(--accent) !important;
}
.leaflet-bar a,
.leaflet-bar a:hover {
  background-color: var(--bg-card) !important;
  color: var(--text) !important;
  border-bottom-color: var(--bg-card-border) !important;
}

/* "About Police Activity BETA" expanding card */
.about-section {
  width: 100%;
  padding: 0;
}
.about-section details {
  margin-bottom: 0;
}

/* Pulsing marker (Leaflet DivIcon) */
.pulse-marker {
  position: relative;
  width: 20px;
  height: 20px;
  pointer-events: none;
}

.pulse-dot {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -6px;
  background: var(--accent);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--accent-glow), 0 0 2px rgba(255, 255, 255, 0.6) inset;
  animation: pulse-dot 2s ease-in-out infinite;
}

/* Continuous low-key breathing so the marker always looks "live." */
@keyframes pulse-dot {
  0%, 100% { transform: scale(1);    opacity: 1;   }
  50%      { transform: scale(1.25); opacity: 0.8; }
}

.pulse-ring {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -6px;
  border-radius: 50%;
  border: 2px solid var(--accent);
  opacity: 0;
  animation: pulse-ring 60s ease-out infinite;
  transform-origin: center;
}

/* One expand+fade per 60-second cycle. Pulse occupies the first ~2.4s;
   ring sits invisible for the remaining ~57.6s. */
@keyframes pulse-ring {
  0%   { transform: scale(1);   opacity: 0.9; }
  4%   { transform: scale(6);   opacity: 0;   }
  100% { transform: scale(6);   opacity: 0;   }
}
