/* Platz Ecoville — Mapa Interativo de Lotes
   Rausy Consultoria Imobiliária · CRECI 6397-J */

:root{
  --verde:#3DFF5A;
  --verde2:#2ECC71;
  --ambar:#F2B33D;
  --vermelho:#E5484D;
  --fundo:#0B161E;
  --painel:rgba(9,18,25,.92);
  --texto:#E8F1F5;
  --apagado:#8AA5B1;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:#0E1B24;
  color:var(--texto);
  font-family:'Manrope',ui-sans-serif,system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;
  overscroll-behavior:none;
}
a{color:var(--verde)}
a:hover{color:var(--verde2)}
button{font-family:inherit}

.app{display:flex;flex-direction:column;height:100dvh;min-height:100dvh;overflow:hidden;background:radial-gradient(120% 90% at 78% 0%,#20343F 0%,#152531 45%,#0B161E 100%)}

/* ---------- topo ---------- */
.topo{display:flex;flex-wrap:wrap;align-items:center;gap:18px;padding:16px 22px;border-bottom:1px solid rgba(61,255,90,.16);background:rgba(11,22,30,.72);backdrop-filter:blur(8px);position:sticky;top:0;z-index:30}
.marca{display:flex;flex-direction:column;gap:6px;min-width:0;text-decoration:none;align-items:flex-start}
.marca img{height:38px;width:auto;display:block}
.marca-sub{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#7E97A4}
.tituloWrap{display:flex;flex-direction:column;gap:6px;padding-left:20px;border-left:1px solid rgba(232,241,245,.14);min-width:0}
.tituloEmp{margin:0;line-height:0}
.tituloEmp img{height:52px;width:auto;display:block}
.kicker{font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:#8FB0A4}
.indicadores{display:flex;gap:10px;margin-left:auto;flex-wrap:wrap}
.ind{background:rgba(46,204,113,.09);border:1px solid rgba(46,204,113,.28);border-radius:11px;padding:8px 14px;min-width:96px}
.ind b{display:block;font-family:'Sora',sans-serif;font-size:16px;color:var(--verde);line-height:1.2}
.ind span{font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:#87A3AF}

/* ---------- corpo ---------- */
.corpo{display:flex;flex:1 1 auto;min-height:0;align-items:stretch;overflow:hidden}
.mapa{position:relative;flex:1 1 auto;min-width:0;min-height:0;overflow:hidden;background:var(--fundo)}

#mapa{position:absolute;inset:0;background:#0B161E}
.leaflet-container{background:#0B161E;font-family:'Manrope',sans-serif}
.plantaOverlay{pointer-events:none;image-rendering:auto}

/* pino do lote: bolinha branca pulsante */
.pino{position:absolute;width:20px;height:20px}
.pino .halo{position:absolute;left:50%;top:50%;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;background:#fff;opacity:.45;animation:pulsar 2.1s cubic-bezier(.22,.61,.36,1) infinite;pointer-events:none}
.pino .ponto{position:absolute;left:50%;top:50%;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;background:#fff;box-shadow:0 0 0 1.5px rgba(8,16,22,.65),0 1px 3px rgba(0,0,0,.5);cursor:pointer}
.pino.res .ponto{background:var(--ambar)}
.pino.ven .ponto{background:var(--vermelho)}
.pino.res .halo,.pino.ven .halo{animation:none;opacity:0}
.pino.sel .ponto{background:var(--verde);width:15px;height:15px;margin:-7.5px 0 0 -7.5px;box-shadow:0 0 0 2px #08131A,0 0 14px rgba(61,255,90,.9)}
.z-baixo .pino .ponto{width:7px;height:7px;margin:-3.5px 0 0 -3.5px}
.z-baixo .pino .halo{width:7px;height:7px;margin:-3.5px 0 0 -3.5px}
.z-baixo .pino.sel .ponto{width:11px;height:11px;margin:-5.5px 0 0 -5.5px}
.z-alto .pino .ponto{width:15px;height:15px;margin:-7.5px 0 0 -7.5px}
.z-alto .pino .halo{width:15px;height:15px;margin:-7.5px 0 0 -7.5px}
.z-alto .pino.sel .ponto{width:19px;height:19px;margin:-9.5px 0 0 -9.5px}
.pino.apagado{opacity:.2}
.pino.apagado .halo{animation:none;opacity:0}
@keyframes pulsar{0%{transform:scale(.7);opacity:.55}70%{transform:scale(2.6);opacity:0}100%{transform:scale(2.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.pino .halo{animation:none;opacity:.3}}

/* controles do Leaflet no tema da marca */
.leaflet-bar a,.leaflet-bar a:hover{background:rgba(11,22,30,.9);color:var(--texto);border-bottom-color:rgba(232,241,245,.14)}
.leaflet-bar a:hover{color:var(--verde)}
.leaflet-bar{border:1px solid rgba(61,255,90,.28);border-radius:11px;overflow:hidden;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.leaflet-control-attribution{background:rgba(8,16,22,.78)!important;color:#7E97A4!important;font-size:10px!important}
.leaflet-control-attribution a{color:#9FB6C0!important}
.leaflet-control-scale-line{background:rgba(8,16,22,.7);color:#9FB6C0;border-color:rgba(232,241,245,.3)}
.leaflet-tooltip{background:rgba(8,16,22,.92);border:1px solid rgba(61,255,90,.35);color:#E8F1F5;font:600 12px 'Manrope',sans-serif;box-shadow:0 4px 12px rgba(0,0,0,.45)}
.leaflet-tooltip-top:before{border-top-color:rgba(61,255,90,.35)}
.enquadrar{position:absolute;right:12px;bottom:92px;z-index:600;background:rgba(11,22,30,.9);border:1px solid rgba(61,255,90,.28);color:var(--texto);border-radius:11px;padding:0 13px;height:38px;font:600 10.5px 'Sora',sans-serif;letter-spacing:.09em;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.enquadrar:hover{border-color:var(--verde);color:var(--verde)}
.linhaBt{display:flex;gap:8px;flex-wrap:wrap}
.cel.largo{grid-column:1 / -1}
/* condições de pagamento */
.conds{display:flex;flex-direction:column;gap:8px}
.cond{background:rgba(232,241,245,.04);border:1px solid rgba(232,241,245,.11);border-radius:12px;padding:11px 13px;display:flex;flex-direction:column;gap:5px}
.cond.dest{border-color:rgba(61,255,90,.45);background:rgba(46,204,113,.08)}
.condTop{display:flex;align-items:center;justify-content:space-between;gap:8px}
.condTit{font:700 13px 'Sora',sans-serif;color:#fff}
.condDesc{font:700 11px 'Manrope',sans-serif;color:#08131A;background:var(--verde);border-radius:999px;padding:2px 8px}
.condVal{font:800 20px 'Sora',sans-serif;color:var(--verde)}
.condLinha{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;color:#9FB6C0}
.condLinha b{color:#fff;font:700 13px 'Sora',sans-serif}
.condLinha.tot{border-top:1px dashed rgba(232,241,245,.14);padding-top:5px;font-size:11.5px}
.condSub{font-size:11px;color:#7E97A4}
.condNota{font-size:10.5px;line-height:1.5;color:#65808D}

/* ---------- barra de controles (acima do mapa, nunca sobre ele) ---------- */
.barra{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;padding:11px 22px;border-bottom:1px solid rgba(232,241,245,.10);background:rgba(11,22,30,.55);flex:0 0 auto}
.busca{display:flex;align-items:center;gap:8px;background:rgba(6,14,20,.75);border:1px solid rgba(61,255,90,.26);border-radius:11px;padding:8px 12px;flex:0 1 288px;min-width:190px}
.busca input{background:transparent;border:0;outline:0;color:var(--texto);font:500 13.5px 'Manrope',sans-serif;width:100%;min-width:0}
.busca input::placeholder{color:#7E97A4}
.filtros{display:flex;flex-wrap:wrap;gap:6px}
.filtros button{display:flex;align-items:center;gap:6px;background:rgba(6,14,20,.65);border:1px solid rgba(232,241,245,.14);color:#9FB6C0;border-radius:999px;padding:7px 13px;font:600 11.5px 'Manrope',sans-serif;cursor:pointer;min-height:34px}
.filtros button:hover{border-color:rgba(61,255,90,.5);color:var(--texto)}
.filtros button[aria-pressed="true"]{border-color:var(--verde);color:#08131A;background:linear-gradient(135deg,var(--verde2),var(--verde))}
.filtros button i{font-style:normal;opacity:.75}
.legenda{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;font-size:11.5px;color:#93AEBA;margin-left:auto}
.linha{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.bolha{width:11px;height:11px;border-radius:50%;background:#fff;flex:0 0 auto}
.quad{width:11px;height:11px;border-radius:3px;flex:0 0 auto;background:rgba(46,204,113,.35);border:1px solid rgba(61,255,90,.7)}
.quad.a{background:rgba(242,179,61,.4);border-color:rgba(242,179,61,.8)}
.quad.v{background:rgba(229,72,77,.4);border-color:rgba(229,72,77,.8)}

.dica{flex-basis:100%;font-size:11px;color:#65808D;letter-spacing:.02em}

/* ---------- painel do lote ---------- */
.painel{flex:0 0 372px;max-width:372px;border-left:1px solid rgba(61,255,90,.16);background:var(--painel);padding:22px;display:flex;flex-direction:column;gap:16px;overflow-y:auto}
.vazio{display:flex;flex-direction:column;gap:12px;align-items:flex-start;color:var(--apagado);font-size:13.5px;line-height:1.6}
.vazio-icone{width:46px;height:46px;border-radius:50%;background:rgba(61,255,90,.12);border:1px solid rgba(61,255,90,.35);display:flex;align-items:center;justify-content:center}
.vazio h2{font-family:'Sora',sans-serif;font-weight:700;font-size:17px;color:#fff;margin:0}
.rua{font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--verde)}
.loteId{font-family:'Sora',sans-serif;font-weight:800;font-size:28px;color:#fff;line-height:1.1;margin:0}
.selo{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:6px 13px;font:700 11.5px 'Manrope',sans-serif;letter-spacing:.05em;text-transform:uppercase}
.selo:before{content:'';width:8px;height:8px;border-radius:50%;background:currentColor}
.selo.d{background:rgba(61,255,90,.14);border:1px solid rgba(61,255,90,.45);color:var(--verde)}
.selo.r{background:rgba(242,179,61,.14);border:1px solid rgba(242,179,61,.45);color:var(--ambar)}
.selo.v{background:rgba(229,72,77,.14);border:1px solid rgba(229,72,77,.45);color:#FF7A7E}
.areaBox{background:linear-gradient(135deg,rgba(46,204,113,.16),rgba(46,204,113,.04));border:1px solid rgba(61,255,90,.3);border-radius:14px;padding:14px 16px}
.rot{font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:#87A3AF;margin-bottom:5px}
.areaVal{font-family:'Sora',sans-serif;font-weight:700;font-size:26px;color:var(--verde);line-height:1}
.medidas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.cel{background:rgba(232,241,245,.045);border:1px solid rgba(232,241,245,.10);border-radius:11px;padding:11px 13px}
.celVal{font-family:'Sora',sans-serif;font-weight:600;font-size:16px;color:#fff}
.preco{border:1px solid rgba(61,255,90,.34);border-radius:14px;padding:16px;background:rgba(46,204,113,.07)}
.precoVal{font-family:'Sora',sans-serif;font-weight:800;font-size:27px;color:#fff;line-height:1.1;letter-spacing:-.01em}
.conta{font-size:12.5px;color:#9FB6C0;margin-top:6px}
.aviso{font-size:11.5px;line-height:1.55;color:#C8A96B;background:rgba(200,169,107,.09);border:1px solid rgba(200,169,107,.28);border-radius:10px;padding:10px 12px}
.cta{display:block;text-align:center;text-decoration:none;background:linear-gradient(135deg,var(--verde2),var(--verde));color:#08131A;font:700 14.5px 'Sora',sans-serif;padding:14px;border-radius:12px;min-height:48px;line-height:20px}
.cta:hover{filter:brightness(1.07);color:#08131A}
.limpar{align-self:flex-start;background:transparent;border:1px solid rgba(232,241,245,.18);color:#9FB6C0;border-radius:9px;padding:7px 13px;font:600 12px 'Manrope',sans-serif;cursor:pointer;min-height:36px}
.limpar:hover{border-color:var(--verde);color:var(--verde)}

/* ---------- área administrativa (?admin=1) ---------- */
.admin{border-top:1px dashed rgba(232,241,245,.18);padding-top:14px;display:flex;flex-direction:column;gap:10px}
.seg{display:flex;gap:6px}
.seg button{flex:1 1 0;min-height:42px;border-radius:10px;border:1px solid rgba(232,241,245,.14);background:rgba(232,241,245,.045);color:#9FB6C0;font:600 12px 'Manrope',sans-serif;cursor:pointer;padding:6px 4px}
.seg button:hover{color:var(--texto);border-color:rgba(232,241,245,.3)}
.seg button[aria-pressed="true"].d{border-color:var(--verde);background:rgba(61,255,90,.16);color:var(--verde)}
.seg button[aria-pressed="true"].r{border-color:var(--ambar);background:rgba(242,179,61,.16);color:var(--ambar)}
.seg button[aria-pressed="true"].v{border-color:var(--vermelho);background:rgba(229,72,77,.16);color:#FF7A7E}
.gerar{background:rgba(232,241,245,.06);border:1px solid rgba(232,241,245,.2);color:var(--texto);border-radius:10px;padding:11px;font:600 12.5px 'Manrope',sans-serif;cursor:pointer;min-height:44px}
.gerar:hover{border-color:var(--verde);color:var(--verde)}
.saida{width:100%;min-height:120px;background:#061016;border:1px solid rgba(232,241,245,.18);border-radius:10px;color:#BFE9CC;font:400 12px ui-monospace,'SFMono-Regular',Menlo,monospace;padding:10px;resize:vertical}
.tagAdmin{display:inline-block;background:rgba(242,179,61,.15);border:1px solid rgba(242,179,61,.5);color:var(--ambar);border-radius:6px;padding:3px 8px;font:700 10px 'Manrope',sans-serif;letter-spacing:.12em;text-transform:uppercase}

/* ---------- rodapé ---------- */
.rodape{padding:13px 22px;border-top:1px solid rgba(232,241,245,.10);font-size:11px;color:#718996;display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;background:rgba(8,16,22,.7)}

@media (max-width:900px){
  .app{height:auto;overflow:visible}
  .topo{gap:14px}
  .tituloWrap{padding-left:0;border-left:0}
  .tituloEmp img{height:40px}
  .indicadores{margin-left:0;width:100%}
  .ind{flex:1 1 0;min-width:0;padding:7px 10px}
  .barra{padding:11px 14px;gap:9px 14px}
  .busca{flex:1 1 100%}
  .legenda{margin-left:0;flex-basis:100%;gap:5px 14px}
  .dica{display:none}
  .corpo{flex-direction:column;overflow:visible}
  .mapa{flex:0 0 auto;min-height:0;height:62vh;min-height:340px}
  .painel{flex:1 1 auto;max-width:none;border-left:0;border-top:1px solid rgba(61,255,90,.2)}
  .enquadrar{bottom:88px}
}
@media (max-width:520px){
  .topo{padding:12px 14px;gap:12px}
  .marca img{height:32px}
  .tituloEmp img{height:34px}
  .painel{padding:16px}
  .rodape{padding:12px 14px}
}
.oculto{display:none !important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}