/*
 * Harita modülü — sadece bu modüle özel EK stiller. Temel tasarım sistemi
 * (renkler/kartlar/butonlar) `frontend/core/realty-theme.css`'ten gelir
 * (rl-* sınıfları) — burada TEKRAR TANIMLANMAZ, sadece uzatılır.
 */

.rmap-filters {
  padding: 16px;
}
.rmap-filter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
}
.rmap-filter-grid .rl-field {
  margin-bottom: 0;
}
.rmap-filter-checks {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--rl-border);
  font-size: 13px;
  color: var(--rl-text-muted);
}
.rmap-filter-checks label {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}

.rmap-counts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.rmap-count-chip {
  border: 1px solid var(--rl-border);
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 12px;
  background: var(--rl-bg-elevated);
  color: var(--rl-text);
}

.rmap-container {
  width: 100%;
  height: 520px;
  border-radius: var(--rl-radius-lg);
  overflow: hidden;
  border: 1px solid var(--rl-border);
  box-shadow: var(--rl-shadow-sm);
}
@media (max-width: 900px) {
  .rmap-container { height: 380px; }
}

/* ---- Leaflet marker/cluster ikonları (divIcon) ---- */
.rmap-pin-wrap { background: transparent; border: none; }
.rmap-pin {
  width: 18px; height: 18px; border-radius: 50%;
  border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,0.35);
}
.rmap-cluster-wrap { background: transparent; border: none; }
.rmap-cluster {
  background: var(--rl-primary);
  color: #fff;
  border: 2px solid #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 13px;
  box-shadow: var(--rl-shadow-md);
}

/* ---- Popup içeriği (Leaflet popup, temel tasarım sistemine uyarlanmış) ---- */
.rmap-popup { font-family: var(--rl-font); min-width: 200px; }
.rmap-popup-cover {
  font-size: 28px; text-align: center; background: var(--rl-bg-muted);
  border-radius: var(--rl-radius-sm); padding: 10px 0; margin-bottom: 8px;
}
.rmap-popup-tag {
  display: inline-block; color: #fff; font-size: 10px; font-weight: 700;
  padding: 2px 8px; border-radius: 999px; margin-bottom: 6px;
}
.rmap-popup-title { font-weight: 700; font-size: 13px; margin-bottom: 2px; }
.rmap-popup-price { font-weight: 700; color: var(--rl-primary-dark); font-size: 14px; margin-bottom: 4px; }
.rmap-popup-meta { font-size: 12px; color: var(--rl-text-muted); margin-bottom: 2px; }
.rmap-popup-status { font-size: 12px; font-weight: 600; margin: 4px 0 8px; }
.rmap-popup-actions { display: flex; flex-direction: column; gap: 6px; }
.rmap-popup-actions .rl-btn { padding: 6px 10px; font-size: 12px; justify-content: center; text-decoration: none; }

/* Leaflet'in kendi popup kabuğunu temel tasarım sistemine yaklaştır. */
.leaflet-popup-content-wrapper { border-radius: var(--rl-radius-md); }
.leaflet-popup-content { margin: 10px 12px; }

.rmap-missing-list { display: flex; flex-direction: column; gap: 8px; }
.rmap-missing-row {
  display: flex; align-items: center; gap: 8px; font-size: 13px;
  padding: 8px 10px; border: 1px solid var(--rl-border); border-radius: var(--rl-radius-sm);
}