/* ============================================================
   PACK B3-B - Carte de France interactive
   ============================================================ */

.lt-carte-page {
  background: #fdfaf3 !important;
  min-height: calc(100vh - 80px) !important;
}

.lt-carte-hero {
  padding: 32px 24px 18px !important;
  text-align: center !important;
  max-width: 980px !important;
  margin: 0 auto !important;
}

.lt-carte-hero h1 {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #0a0a0a !important;
  margin: 0 0 10px !important;
  letter-spacing: -1px !important;
}

.lt-carte-hero h1 span {
  background: linear-gradient(135deg, #ff2e7e, #c4456c) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}

.lt-carte-hero p {
  color: #666 !important;
  font-size: 15px !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}

/* ========= LAYOUT PRINCIPAL ========= */
.lt-carte-wrap {
  display: flex !important;
  gap: 16px !important;
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 0 16px 32px !important;
  align-items: stretch !important;
}

.lt-carte-sidebar {
  flex: 0 0 260px !important;
  background: #fff !important;
  border: 1px solid rgba(10,10,10,0.08) !important;
  border-radius: 14px !important;
  padding: 18px !important;
  height: fit-content !important;
  position: sticky !important;
  top: 90px !important;
  max-height: calc(100vh - 110px) !important;
  overflow-y: auto !important;
}

.lt-carte-main {
  flex: 1 1 auto !important;
  background: #fff !important;
  border: 1px solid rgba(10,10,10,0.08) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  position: relative !important;
  min-height: 600px !important;
}

#lt-map {
  width: 100% !important;
  height: 700px !important;
  background: #e8e8e8 !important;
}

/* ========= SIDEBAR : FILTRES ========= */
.lt-sb-title {
  font-size: 13px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: #999 !important;
  margin: 0 0 12px !important;
}

.lt-sb-section {
  margin-bottom: 22px !important;
  padding-bottom: 18px !important;
  border-bottom: 1px solid rgba(10,10,10,0.06) !important;
}
.lt-sb-section:last-child { border-bottom: none !important; }

.lt-filter-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 7px 8px !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  font-size: 13px !important;
  color: #0a0a0a !important;
  transition: background 0.15s !important;
  user-select: none !important;
}
.lt-filter-item:hover {
  background: rgba(255,217,61,0.10) !important;
}

.lt-filter-item input[type="checkbox"] {
  margin: 0 !important;
  cursor: pointer !important;
  accent-color: #c4456c !important;
}

.lt-filter-color {
  display: inline-block !important;
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  border: 2px solid #fff !important;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.15) !important;
}

.lt-filter-label {
  flex: 1 !important;
  font-weight: 600 !important;
}
.lt-filter-count {
  color: #999 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

.lt-filter-input {
  width: 100% !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(10,10,10,0.15) !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-family: inherit !important;
  background: #fff !important;
  color: #0a0a0a !important;
  outline: none !important;
}
.lt-filter-input:focus {
  border-color: #c4456c !important;
  box-shadow: 0 0 0 3px rgba(196,69,108,0.10) !important;
}

.lt-filter-actions {
  display: flex !important;
  gap: 8px !important;
  margin-top: 16px !important;
}
.lt-btn-reset, .lt-btn-apply {
  flex: 1 !important;
  padding: 9px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  border: none !important;
  font-family: inherit !important;
  transition: all 0.15s !important;
}
.lt-btn-reset {
  background: #f0f0f0 !important;
  color: #555 !important;
}
.lt-btn-reset:hover { background: #e5e5e5 !important; }

.lt-btn-apply {
  background: #0a0a0a !important;
  color: #fff !important;
}
.lt-btn-apply:hover {
  background: #c4456c !important;
}

/* ========= STATS ========= */
.lt-carte-stats {
  background: linear-gradient(135deg, rgba(255,217,61,0.08), rgba(255,46,126,0.05)) !important;
  border: 1px solid rgba(255,217,61,0.30) !important;
  padding: 12px !important;
  border-radius: 10px !important;
  text-align: center !important;
  margin-bottom: 12px !important;
}
.lt-carte-stats strong {
  display: block !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  color: #0a0a0a !important;
  margin-bottom: 2px !important;
}
.lt-carte-stats span {
  font-size: 11px !important;
  color: #666 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  font-weight: 700 !important;
}

/* ========= POPUP LEAFLET (annonce) ========= */
.lt-popup {
  font-family: 'Inter', sans-serif !important;
  min-width: 220px !important;
  max-width: 260px !important;
}
.lt-popup-type {
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  padding: 3px 7px !important;
  border-radius: 4px !important;
  display: inline-block !important;
  margin-bottom: 8px !important;
  color: #fff !important;
}
.lt-popup-titre {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #0a0a0a !important;
  line-height: 1.3 !important;
  margin: 0 0 6px !important;
}
.lt-popup-loc {
  font-size: 12px !important;
  color: #666 !important;
  margin-bottom: 8px !important;
}
.lt-popup-prix {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #c4456c !important;
  margin-bottom: 10px !important;
}
.lt-popup-prix small {
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #999 !important;
}
.lt-popup-tags {
  display: flex !important;
  gap: 4px !important;
  flex-wrap: wrap !important;
  margin-bottom: 10px !important;
}
.lt-popup-tag {
  font-size: 9px !important;
  background: rgba(10,10,10,0.06) !important;
  color: #0a0a0a !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}
.lt-popup-cta {
  display: block !important;
  background: #0a0a0a !important;
  color: #fff !important;
  padding: 8px !important;
  border-radius: 6px !important;
  text-align: center !important;
  text-decoration: none !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  transition: background 0.15s !important;
}
.lt-popup-cta:hover {
  background: #c4456c !important;
  color: #fff !important;
}

/* ========= MARQUEURS PERSONNALISES ========= */
.lt-marker {
  width: 24px !important;
  height: 32px !important;
  border-radius: 50% 50% 50% 0 !important;
  transform: rotate(-45deg) !important;
  border: 2px solid #fff !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
  position: relative !important;
}
.lt-marker::after {
  content: '' !important;
  position: absolute !important;
  top: 6px !important;
  left: 6px !important;
  width: 8px !important;
  height: 8px !important;
  background: #fff !important;
  border-radius: 50% !important;
}

/* Couleurs par type */
.lt-marker-vente { background: #ff2e7e !important; }
.lt-marker-gerance { background: #ffd93d !important; }
.lt-marker-vente-leasing { background: #10b981 !important; }
.lt-marker-remplacement { background: #3b82f6 !important; }
.lt-marker-vehicule { background: #f97316 !important; }
.lt-marker-equipement { background: #6b7280 !important; }
.lt-marker-default { background: #c4456c !important; }

/* ========= LOADER ========= */
.lt-map-loader {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 1000 !important;
  background: rgba(255,255,255,0.95) !important;
  padding: 20px 30px !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.15) !important;
  text-align: center !important;
  font-weight: 700 !important;
  color: #0a0a0a !important;
}
.lt-map-loader-spinner {
  width: 32px !important;
  height: 32px !important;
  border: 3px solid #f0f0f0 !important;
  border-top-color: #c4456c !important;
  border-radius: 50% !important;
  animation: lt-spin 0.8s linear infinite !important;
  margin: 0 auto 10px !important;
}
@keyframes lt-spin {
  to { transform: rotate(360deg); }
}

.lt-map-error {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 1000 !important;
  background: #fff !important;
  padding: 24px !important;
  border-radius: 12px !important;
  border: 2px solid #c4456c !important;
  text-align: center !important;
  max-width: 360px !important;
}
.lt-map-error h3 {
  color: #c4456c !important;
  margin: 0 0 8px !important;
  font-size: 16px !important;
}
.lt-map-error p {
  color: #555 !important;
  font-size: 13px !important;
  margin: 0 !important;
}

/* ========= LEGENDE ========= */
.lt-carte-legende {
  background: #fff !important;
  border: 1px solid rgba(10,10,10,0.08) !important;
  border-radius: 10px !important;
  padding: 12px 14px !important;
  margin-top: 10px !important;
}
.lt-carte-legende-title {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: #999 !important;
  margin-bottom: 8px !important;
}
.lt-carte-legende-items {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  font-size: 11px !important;
}
.lt-carte-legende-item {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: #555 !important;
}
.lt-carte-legende-dot {
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
}

/* ========= MOBILE ========= */
@media (max-width: 880px) {
  .lt-carte-wrap {
    flex-direction: column !important;
    padding: 0 12px 32px !important;
  }
  .lt-carte-sidebar {
    flex: 1 1 100% !important;
    position: static !important;
    max-height: none !important;
    margin-bottom: 12px !important;
  }
  .lt-carte-main {
    min-height: 500px !important;
  }
  #lt-map {
    height: 500px !important;
  }
  .lt-carte-hero {
    padding: 20px 16px 12px !important;
  }
  .lt-carte-hero h1 {
    font-size: 26px !important;
  }
}

/* ========= CLUSTER LEAFLET PERSO ========= */
.lt-cluster {
  background: linear-gradient(135deg, rgba(196,69,108,0.95), rgba(255,46,126,0.95)) !important;
  color: #fff !important;
  border-radius: 50% !important;
  text-align: center !important;
  font-weight: 800 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 3px solid #fff !important;
  box-shadow: 0 4px 12px rgba(196,69,108,0.4) !important;
  font-family: 'Inter', sans-serif !important;
}
.lt-cluster-small { width: 36px !important; height: 36px !important; font-size: 12px !important; }
.lt-cluster-medium { width: 44px !important; height: 44px !important; font-size: 13px !important; }
.lt-cluster-large { width: 54px !important; height: 54px !important; font-size: 14px !important; }