/* ============================================================
   Vías Verdes Murcia v7 — Editor de georreferenciación (.ge-*)
   Solo se aplica cuando el editor está montado (?editor=1).
   ============================================================ */

#geoEditorRoot { font-family: var(--vvb-font, 'Manrope', system-ui, sans-serif); }

/* ---------- Barra superior ---------- */
.ge-bar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1200;
  display: flex; align-items: center; gap: 10px;
  padding: 8px 14px;
  background: #1A4A18; color: #fff;
  box-shadow: 0 2px 12px rgba(0,0,0,0.28);
}
.ge-bar-title { font-weight: 800; font-size: 14px; }
.ge-bar-counter { font-size: 12px; opacity: .85; margin-right: auto; }
.ge-bar-btn {
  border: 1px solid rgba(255,255,255,0.45); background: rgba(255,255,255,0.12);
  color: #fff; font-weight: 700; font-size: 12.5px; border-radius: 999px;
  padding: 6px 12px; cursor: pointer; white-space: nowrap;
  transition: background .15s ease, transform .1s ease;
}
.ge-bar-btn:hover { background: rgba(255,255,255,0.22); }
.ge-bar-btn:active { transform: scale(.97); }
.ge-bar-btn--primary { background: #4A8C3F; border-color: #4A8C3F; }
.ge-bar-btn--primary:hover { background: #57a049; }

/* ---------- Panel lateral ---------- */
.ge-side {
  position: fixed; top: 46px; left: 0; bottom: 0; z-index: 1190;
  width: 340px; max-width: 86vw;
  background: #fff; border-right: 1px solid #e4e8df;
  display: flex; flex-direction: column;
  box-shadow: 4px 0 24px rgba(0,0,0,0.12);
}
.ge-side-head { padding: 12px; border-bottom: 1px solid #eef1ea; display: flex; flex-direction: column; gap: 8px; }
.ge-search {
  width: 100%; box-sizing: border-box; padding: 9px 12px;
  border: 1px solid #d9ddd2; border-radius: 10px; font-size: 13.5px;
  background: #fff; color: #1c2418;
}
.ge-search:focus { outline: 2px solid #4A8C3F; outline-offset: 1px; }
.ge-only { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #1c2418; cursor: pointer; }
.ge-only input { width: 16px; height: 16px; accent-color: #4A8C3F; }
.ge-list-info { font-size: 11.5px; color: #6b7280; }

.ge-list { flex: 1; overflow-y: auto; padding: 6px; }
.ge-row {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 10px; border-radius: 10px; cursor: pointer;
  border: 1px solid transparent;
}
.ge-row:hover { background: #f4f7f1; }
.ge-row.is-sel { background: #EAF1E7; border-color: #4A8C3F; }
.ge-row-ic { width: 26px; height: 26px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: #4A8C3F; }
.ge-row-ic svg { width: 20px; height: 20px; }
.ge-row-info { flex: 1; min-width: 0; }
.ge-row-title { font-size: 13.5px; font-weight: 700; color: #1c2418; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ge-row-meta { font-size: 11px; color: #6b7280; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 1px; }
.ge-tag { font-size: 10px; font-weight: 700; border-radius: 999px; padding: 1px 7px; }
.ge-tag--suspect { background: #fdecec; color: #c0392b; }
.ge-tag--mod { background: #fff4e0; color: #b8730a; }
.ge-tag--new { background: #e7f3e6; color: #2f7a2a; }

/* ---------- Formulario añadir ---------- */
.ge-addform {
  position: fixed; top: 54px; right: 14px; z-index: 1200;
  width: 280px; background: #fff; border: 1px solid #e4e8df; border-radius: 14px;
  box-shadow: 0 12px 40px rgba(15,30,12,0.25); padding: 14px; display: flex; flex-direction: column; gap: 9px;
}
.ge-addform.hidden { display: none; }
.ge-addform-title { font-weight: 800; font-size: 14px; color: #1c2418; }
.ge-addform-type, .ge-addform-title-input {
  width: 100%; box-sizing: border-box; padding: 8px 10px;
  border: 1px solid #d9ddd2; border-radius: 9px; font-size: 13px; background: #fff; color: #1c2418;
}
.ge-addform-hint { font-size: 11px; color: #6b7280; }
/* Aviso: la capa de este tipo está apagada → el visitante no verá el punto en el mapa
   público hasta activarla (el editor SÍ pinta sus propios markers siempre). */
.ge-layer-hint {
  font-size: 11px; line-height: 1.35; color: #92400e;
  background: #fef3c7; border: 1px solid #fcd34d; border-radius: 8px; padding: 6px 8px;
}
.ge-layer-hint.hidden { display: none; }

/* En modo editor ocultamos los marcadores normales de la app (km, POIs, pueblos,
   360, transporte…) para dejar una base limpia y que NO intercepten el puntero
   sobre los marcadores arrastrables del editor. MapLibre añade 'maplibregl-marker'
   a nuestro elemento .ge-marker, así que lo excluimos del :not(). */
body.ge-active .maplibregl-marker:not(.ge-marker) { display: none !important; }

/* ---------- Marcadores arrastrables (raíz SIN transform/transition) ---------- */
.ge-marker { cursor: grab; z-index: 5; }
.ge-marker:active { cursor: grabbing; }
.ge-marker-inner {
  width: 30px; height: 30px; border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  background: #4A8C3F; border: 2px solid #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,0.4);
  display: flex; align-items: center; justify-content: center;
}
.ge-marker-inner > * { transform: rotate(45deg); }
.ge-marker-inner svg { width: 15px; height: 15px; stroke: #fff; color: #fff; }
.ge-marker--suspect .ge-marker-inner { background: #c0392b; }
.ge-marker--mod .ge-marker-inner { background: #e08a17; }
.ge-marker--new .ge-marker-inner { background: #2f7a2a; }
.ge-marker--sel .ge-marker-inner { outline: 3px solid #1A4A18; outline-offset: 2px; }

/* El editor empuja el mapa para no tapar bajo la barra (deja el panel encima). */
body.ge-active #map { top: 46px; }

/* ---------- Filtro por categoría + descripción del "añadir" ---------- */
.ge-cat-filter, .ge-addform-desc {
  width: 100%; box-sizing: border-box; padding: 8px 10px; font-family: inherit;
  border: 1px solid #d9ddd2; border-radius: 9px; font-size: 13px; background: #fff; color: #1c2418;
}
.ge-addform-desc { resize: vertical; }

/* ---------- Formulario de edición del punto seleccionado ---------- */
.ge-edit {
  position: fixed; right: 14px; bottom: 14px; z-index: 1201;
  width: 300px; max-width: 86vw; background: #fff; border: 1px solid #e4e8df; border-radius: 14px;
  box-shadow: 0 12px 40px rgba(15,30,12,0.28); padding: 14px;
  display: flex; flex-direction: column; gap: 8px;
}
.ge-edit.hidden { display: none; }
.ge-edit-head { font-weight: 800; font-size: 14px; color: #1c2418; }
.ge-edit-title, .ge-edit-desc, .ge-edit-type, .ge-edit-lon, .ge-edit-lat {
  width: 100%; box-sizing: border-box; padding: 8px 10px; font-family: inherit;
  border: 1px solid #d9ddd2; border-radius: 9px; font-size: 13px; background: #fff; color: #1c2418;
}
.ge-edit-desc { resize: vertical; }
.ge-edit-coords { display: flex; gap: 8px; }
.ge-edit-actions { display: flex; gap: 8px; }
.ge-edit-actions .ge-bar-btn { flex: 1; text-align: center; background: #eef1ea; color: #1c2418; border-color: #d9ddd2; }
.ge-edit-actions .ge-bar-btn:hover { background: #e4e9df; }
.ge-edit-note { font-size: 10.5px; color: #6b7280; }
.ge-marker--hidden .ge-marker-inner { opacity: .35; filter: grayscale(1); }

/* ---------- Panel "Cambios de esta sesión" (lista enumerada de mejoras) ---------- */
.ge-changes {
  position: fixed; top: 54px; left: 352px; z-index: 1199;
  width: 360px; max-width: calc(100vw - 372px); max-height: calc(100vh - 80px);
  background: #fff; border: 1px solid #e4e8df; border-radius: 14px;
  box-shadow: 0 12px 40px rgba(15,30,12,0.22);
  display: flex; flex-direction: column; overflow: hidden;
}
.ge-changes.hidden { display: none; }
.ge-changes-head { font-weight: 800; font-size: 14px; color: #1c2418; padding: 12px 14px; border-bottom: 1px solid #eef1ea; }
.ge-changes-list { overflow-y: auto; padding: 8px; }
.ge-changes-empty { font-size: 12px; color: #6b7280; padding: 10px; line-height: 1.45; }
.ge-change-row { display: flex; gap: 10px; align-items: flex-start; padding: 8px 10px; border-radius: 9px; cursor: pointer; border: 1px solid transparent; }
.ge-change-row:hover { background: #f4f7f1; }
.ge-change-n {
  flex-shrink: 0; min-width: 22px; height: 22px; padding: 0 5px; border-radius: 999px;
  background: #1A4A18; color: #fff; font-size: 11.5px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
}
.ge-change-row--new .ge-change-n { background: #2f7a2a; }
.ge-change-row--mod .ge-change-n { background: #e08a17; }
.ge-change-body { min-width: 0; }
.ge-change-title { font-size: 13px; font-weight: 700; color: #1c2418; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ge-change-text { font-size: 12px; color: #4b5563; line-height: 1.35; margin-top: 1px; }

@media (max-width: 768px) {
  .ge-side { top: 44px; width: 100%; max-width: 100%; bottom: auto; height: 42vh; border-right: none; border-bottom: 1px solid #e4e8df; }
  body.ge-active #map { top: calc(44px + 42vh); }
  .ge-addform { top: auto; bottom: 12px; right: 12px; left: 12px; width: auto; }
  .ge-edit { right: 8px; left: 8px; bottom: 8px; width: auto; }
  .ge-changes { left: 8px; right: 8px; width: auto; max-width: none; top: calc(44px + 42vh); bottom: 8px; max-height: none; }
}