/* Styles personnalisés en complément de Tailwind CDN */

/* Marker vedette */
.featured-marker {
  background: #f97316; border: 3px solid white; border-radius: 50%;
  width: 32px !important; height: 32px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  display: flex !important; align-items: center; justify-content: center;
  color: white; font-weight: bold; font-size: 14px;
}
.regular-marker {
  background: #3b82f6; border: 3px solid white; border-radius: 50%;
  width: 26px !important; height: 26px !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.25);
  display: flex !important; align-items: center; justify-content: center;
  color: white; font-weight: bold; font-size: 12px;
}

/* Popup Leaflet */
.leaflet-popup-content-wrapper { border-radius: 12px; padding: 0; }
.leaflet-popup-content { margin: 0; width: 240px !important; }
.popup-card { padding: 12px; }
.popup-card .badge-featured {
  background: #fef3c7; color: #92400e; font-size: 10px;
  padding: 2px 6px; border-radius: 4px; font-weight: 600;
  display: inline-block; margin-bottom: 6px;
}

/* Chips catégories */
.cat-chip {
  cursor: pointer; padding: 6px 12px; border-radius: 999px;
  border: 1px solid #d1d5db; font-size: 13px; background: white;
  transition: all 0.15s; user-select: none;
}
.cat-chip:hover { border-color: #9ca3af; }
.cat-chip.selected { background: #1f2937; border-color: #1f2937; color: white; }

/* Card animation */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.card-anim { animation: fadeUp 0.25s ease-out; }

/* Toggle vue actif */
.view-toggle-active { background: white; box-shadow: 0 1px 2px rgba(0,0,0,0.08); }

/* Hauteur carte — compte le hero band (~60px) en plus du header+filtres */
.map-full { height: calc(100vh - 192px); }
@media (max-width: 640px) {
  .map-full { height: calc(100vh - 240px); }
}

/* Admin nav */
.nav-btn.active  { background: rgba(245,158,11,0.15); color: #fbbf24; }
.nav-btn:not(.active) { color: #9ca3af; }
.nav-btn:not(.active):hover { background: #1f2937; color: white; }
.mobile-tab.active { border-bottom: 2px solid #f59e0b; color: #92400e; background: white; }
.mobile-tab:not(.active) { color: #6b7280; border-bottom: 2px solid transparent; }