
/* =========================================================
   LIMA ENGENHARIA
   LOCALIZAR POR COORDENADA
   ========================================================= */

#lima-coord-panel{
  position:fixed;

  top:170px;
  left:50%;

  transform:translateX(-50%);

  z-index:10500;

  width:min(430px,calc(100vw - 24px));

  display:none;

  box-sizing:border-box;

  background:#fff;

  border:1px solid rgba(0,0,0,.12);

  border-radius:15px;

  box-shadow:
    0 12px 38px rgba(0,0,0,.27);

  font-family:
    Arial,
    Helvetica,
    sans-serif;

  color:#263129;
}


#lima-coord-panel.ativo{
  display:block;
}


/* =========================================================
   CABECALHO
   ========================================================= */

.lima-coord-topo{
  display:flex;

  align-items:center;

  justify-content:space-between;

  gap:10px;

  padding:14px 15px 12px;

  border-bottom:1px solid #e5ebe7;
}


.lima-coord-titulo{
  display:flex;

  align-items:center;

  gap:9px;

  color:#176c3a;

  font-size:15px;

  font-weight:800;
}


.lima-coord-alvo{
  width:30px;
  height:30px;

  display:flex;

  align-items:center;

  justify-content:center;

  flex:0 0 30px;

  border-radius:9px;

  background:#eef7f1;

  border:1px solid rgba(23,108,58,.12);
}


.lima-coord-alvo svg{
  width:18px;
  height:18px;

  fill:none;

  stroke:#176c3a;

  stroke-width:2;

  stroke-linecap:round;

  stroke-linejoin:round;
}


#lima-coord-fechar{
  width:34px;
  height:34px;

  padding:0;

  border:0;

  border-radius:50%;

  background:#f2f5f3;

  color:#435048;

  cursor:pointer;

  font-size:22px;

  line-height:1;
}


/* =========================================================
   CORPO
   ========================================================= */

.lima-coord-corpo{
  padding:13px 15px 15px;
}


/* =========================================================
   MODOS
   ========================================================= */

.lima-coord-modos{
  display:grid;

  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:5px;

  padding:4px;

  margin-bottom:13px;

  background:#f1f4f2;

  border-radius:10px;
}


.lima-coord-modo{
  min-height:38px;

  border:0;

  border-radius:8px;

  background:transparent;

  color:#4c5951;

  font-size:12px;

  font-weight:700;

  cursor:pointer;
}


.lima-coord-modo.ativo{
  background:#fff;

  color:#176c3a;

  box-shadow:
    0 1px 4px rgba(0,0,0,.13);
}


/* =========================================================
   CAMPOS
   ========================================================= */

.lima-coord-form{
  display:none;
}


.lima-coord-form.ativo{
  display:block;
}


.lima-coord-grid{
  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    minmax(0,1fr);

  gap:9px;
}


.lima-coord-campo{
  min-width:0;
}


.lima-coord-campo-full{
  grid-column:1 / -1;
}


.lima-coord-campo label{
  display:block;

  margin:0 0 5px 2px;

  color:#59645d;

  font-size:11px;

  font-weight:700;
}


.lima-coord-campo input,
.lima-coord-campo select{
  width:100%;

  height:44px;

  padding:0 10px;

  box-sizing:border-box;

  border:1px solid #cbd5ce;

  border-radius:9px;

  outline:none;

  background:#fff;

  color:#263129;

  font-size:14px;
}


.lima-coord-campo input:focus,
.lima-coord-campo select:focus{
  border-color:#176c3a;

  box-shadow:
    0 0 0 3px rgba(23,108,58,.10);
}


.lima-coord-exemplo{
  margin-top:5px;

  padding-left:2px;

  color:#849087;

  font-size:10px;

  line-height:1.35;
}


/* =========================================================
   UTM
   ========================================================= */

.lima-coord-utm-menor{
  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    minmax(0,1fr);

  gap:9px;

  margin-top:9px;
}


/* =========================================================
   ACAO
   ========================================================= */

#lima-coord-localizar{
  width:100%;

  min-height:44px;

  display:flex;

  align-items:center;

  justify-content:center;

  gap:8px;

  margin-top:13px;

  border:1px solid #176c3a;

  border-radius:10px;

  background:
    linear-gradient(
      180deg,
      #258347 0%,
      #176c3a 100%
    );

  color:#fff;

  font-size:13px;

  font-weight:800;

  cursor:pointer;
}


#lima-coord-localizar svg{
  width:18px;
  height:18px;

  fill:none;

  stroke:currentColor;

  stroke-width:2;

  stroke-linecap:round;

  stroke-linejoin:round;
}


#lima-coord-localizar:disabled{
  opacity:.65;

  cursor:wait;
}


/* =========================================================
   STATUS
   ========================================================= */

#lima-coord-status{
  display:none;

  margin-top:10px;

  padding:9px 10px;

  border-radius:9px;

  font-size:12px;

  line-height:1.4;
}


#lima-coord-status.ativo{
  display:block;
}


#lima-coord-status.info{
  background:#eef6f1;

  color:#31533e;
}


#lima-coord-status.sucesso{
  background:#e6f5eb;

  color:#176c3a;
}


#lima-coord-status.aviso{
  background:#fff7dd;

  color:#765c00;
}


#lima-coord-status.erro{
  background:#fff0ee;

  color:#9d2a21;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:700px){

  #lima-coord-panel{
    top:auto;

    left:10px;
    right:10px;

    bottom:10px;

    transform:none;

    width:auto;

    max-height:72vh;

    overflow-y:auto;

    border-radius:16px;
  }


  .lima-coord-topo{
    padding:11px 13px 10px;
  }


  .lima-coord-corpo{
    padding:11px 13px 13px;
  }


  .lima-coord-titulo{
    font-size:14px;
  }


  .lima-coord-campo input,
  .lima-coord-campo select{
    height:46px;

    font-size:16px;
  }


  .lima-coord-modo{
    min-height:40px;

    font-size:12px;
  }


  #lima-coord-localizar{
    min-height:46px;

    font-size:14px;
  }

}


/* =========================================================
   CELULARES MUITO ESTREITOS
   ========================================================= */

@media(max-width:360px){

  .lima-coord-grid{
    grid-template-columns:1fr;
  }


  .lima-coord-campo-full{
    grid-column:auto;
  }

}



/* =========================================================
   COORDENADAS MOBILE V2
   abre logo abaixo da barra principal
   ========================================================= */

@media(max-width:700px){

  #lima-coord-panel{
    bottom:auto !important;

    left:10px !important;
    right:10px !important;

    width:auto !important;

    transform:none !important;

    max-height:none !important;

    border-radius:15px !important;

    overflow-y:auto !important;
  }

}
