/* app/static/css/login.css */

/* Reaproveita o padrão do cadastro (pe-field / ícones / botão olho) */
.pe-field{
  position: relative;
}

.pe-icon{
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--pe-teal-2);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.pe-icon svg{
  width: 18px;
  height: 18px;
  display: block;
}

/* input com espaço para ícone */
.pe-input{
  padding-left: 44px;
  height: 56px;
}

/* campo com olho */
.pe-field.has-eye .pe-input.has-eye{
  padding-right: 52px;
}

/* botão olho */
.pe-eye-btn{
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border: 0;
  background: transparent;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(11,31,58,.70);
  transition: background .16s ease, color .16s ease;
}

.pe-eye-btn:hover{
  background: rgba(31,183,173,.10);
  color: var(--pe-teal-2);
}

.pe-eye-btn svg{
  width: 18px;
  height: 18px;
  display: block;
}

/* feedback bootstrap mais alinhado */
.invalid-feedback{
  margin-top: 6px;
}