/* ============================================================
   Consola territorial NQN Capital — TEMA CLARO
   Paleta: papel de meseta + río Limay + barranca (barda)
   ============================================================ */
:root {
  --papel:#F5F3EE;      --papel-2:#FFFFFF;    --papel-3:#ECE8E0;
  --tinta:#22282B;      --tinta-dim:#5A646B;  --tinta-faint:#8A939A;
  --borde:#DAD5CB;      --borde-2:#C9C3B6;
  --limay:#1E7C88;      --limay-bright:#2A9DAC; --limay-deep:#155C66;
  --limay-wash:#E4F1F2;
  --barda:#B45E2E;      --barda-soft:#C77B4A;  --barda-wash:#F6E7DC;
  --violeta:#6D53A6;    --violeta-wash:#ECE6F5;
  --ok:#1E7C88;         --warn:#B45E2E;

  --f-display:"Archivo",system-ui,sans-serif;
  --f-body:"Inter",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,monospace;

  --r-sm:4px; --r-md:7px; --r-lg:11px;
  --line:1px solid var(--borde);
}

* { box-sizing:border-box; }
html,body { height:100%; margin:0; }
body {
  font-family:var(--f-body);
  background:var(--papel);
  color:var(--tinta);
  font-size:14px;
  -webkit-font-smoothing:antialiased;
}

/* Rótulos catastrales: condensada, tracking amplio, versalita */
.eyebrow {
  font-family:var(--f-display);
  font-weight:600;
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--tinta-dim);
}
.mono { font-family:var(--f-mono); font-variant-numeric:tabular-nums; }



/* --- Botones / enlaces de acción --- */
.btn {
  font-family:var(--f-display);
  font-weight:600;
  letter-spacing:.04em;
  font-size:13px;
  border:1px solid var(--limay);
  background:var(--limay);
  color:#fff;
  padding:.5rem .9rem;
  border-radius:var(--r-md);
  cursor:pointer;
  transition:background .15s, border-color .15s, color .15s;
  text-decoration:none;
  display:inline-block;
}
.btn:hover { background:var(--limay-deep); border-color:var(--limay-deep); }
.btn:focus-visible { outline:2px solid var(--limay-bright); outline-offset:2px; }
.btn.ghost { background:transparent; border-color:var(--borde-2); color:var(--tinta-dim); }
.btn.ghost:hover { border-color:var(--limay); color:var(--limay-deep); background:var(--limay-wash); }

a { color:var(--limay-deep); }

input, select {
  font-family:var(--f-body);
  font-size:13px;
  background:var(--papel-2);
  color:var(--tinta);
  border:1px solid var(--borde-2);
  border-radius:var(--r-md);
  padding:.5rem .6rem;
  width:100%;
}
input:focus, select:focus { outline:none; border-color:var(--limay); box-shadow:0 0 0 3px rgba(30,124,136,.14); }
::placeholder { color:var(--tinta-faint); }

/* --- Sección de reubicación en el popup --- */
.ff-locate {
  padding:.6rem .75rem;
  background:var(--papel-3);
  border-top:var(--line);
  border-bottom:var(--line);
  display:flex;
  flex-direction:column;
  gap:.4rem;
}
.ff-locate-head {
  font-size:11px;
  font-family:var(--f-display);
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--tinta-dim);
  display:flex;
  align-items:center;
  gap:.4rem;
}
.ff-locate-btns { display:flex; gap:.4rem; }
.ff-locate-btns .btn { font-size:12px; padding:.35rem .7rem; flex:1; text-align:center; }
.ff-msg.loc { font-size:12px; color:var(--tinta-dim); min-height:1.2em; }
.ff-msg.loc.err { color:var(--barda); }
.ff-locate--ok { flex-direction:row; align-items:center; justify-content:space-between; padding:.45rem .75rem; }
.ff-locate-estado { font-size:11px; font-family:var(--f-display); font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--tinta-faint); display:flex; align-items:center; gap:.4rem; }
.ff-corregir-btn { font-size:11px !important; padding:.2rem .55rem !important; }
.ff-corregir-panel { padding:.6rem .75rem; background:var(--limay-wash); border-top:2px solid var(--limay); border-bottom:var(--line); display:flex; flex-direction:column; gap:.4rem; }
.ff-autocomplete-wrap { position:relative; }
.ff-autocomplete-wrap input { width:100%; box-sizing:border-box; }
.ff-sugerencias { position:absolute; top:100%; left:0; right:0; background:#fff; border:1px solid var(--limay); border-top:none; border-radius:0 0 var(--r-md) var(--r-md); list-style:none; margin:0; padding:0; z-index:9999; box-shadow:0 4px 12px rgba(0,0,0,.12); max-height:140px; overflow-y:auto; }
.ff-sugerencias.oculto { display:none; }
.ff-sugerencias li { padding:.5rem .75rem; font-size:12px; cursor:pointer; border-bottom:1px solid var(--papel-3); }
.ff-sugerencias li:last-child { border-bottom:none; }
.ff-sugerencias li:hover { background:var(--limay-wash); }
.ff-drag-hint-corr { font-size:11px; color:var(--tinta-dim); font-style:italic; }
.ff-corregir-btns { display:flex; gap:.4rem; }
.ff-corregir-btns .btn { flex:1; font-size:12px; padding:.35rem .7rem; text-align:center; }

/* --- Banner "modo ubicar con clic" --- */
.locate-banner {
  display:none;
  position:absolute;
  top:12px; left:50%; transform:translateX(-50%);
  z-index:9999;
  background:var(--tinta);
  color:#fff;
  padding:.5rem 1rem;
  border-radius:var(--r-lg);
  font-size:13px;
  gap:.8rem;
  align-items:center;
  box-shadow:0 2px 12px rgba(0,0,0,.35);
  white-space:nowrap;
}
.locate-banner.on { display:flex; }
.locate-banner button { background:transparent; border:1px solid rgba(255,255,255,.4); color:#fff; border-radius:var(--r-sm); padding:.2rem .6rem; cursor:pointer; font-size:12px; }
.locate-banner button:hover { background:rgba(255,255,255,.15); }

/* Cursor crosshair cuando el usuario está en modo "clic en mapa" */
.mapwrap.ubicando .leaflet-container { cursor:crosshair !important; }

/* Toast de confirmación de ubicación guardada */
.locate-toast {
  display:none;
  position:absolute;
  bottom:32px; left:50%; transform:translateX(-50%);
  z-index:9999;
  background:var(--tinta);
  color:#fff;
  padding:.45rem 1.1rem;
  border-radius:var(--r-lg);
  font-size:13px;
  font-weight:600;
  box-shadow:0 2px 12px rgba(0,0,0,.35);
  white-space:nowrap;
  pointer-events:none;
  animation:toast-in .15s ease;
}
.locate-toast.on { display:block; }
@keyframes toast-in { from { opacity:0; transform:translateX(-50%) translateY(6px); } to { opacity:1; transform:translateX(-50%) translateY(0); } }

@media (prefers-reduced-motion: reduce) {
  * { transition:none !important; animation:none !important; }
}