/* Общие стили полей форм  */

.lavrus-auth__field {
  position: relative;
  margin-bottom: 22px;
}

.lavrus-auth__input {
  display: block;
  width: 100%;
  min-height: 58px;
  padding: 15px 60px 15px 18px;
  border: 1px solid var(--lavrus-tretyakov-ru-alto);
  border-radius: 5px;
  outline: none;
  font: inherit;
  font-size: 18px;
  color: var(--lavrus-tretyakov-ru-mine-shaft);
  background-color: var(--lavrus-tretyakov-ru-white);
}

.lavrus-auth__input:focus {
  border-color: var(--lavrus-tretyakov-ru-dove-gray);
}

.lavrus-auth__field-label {
  position: absolute;
  top: 50%;
  left: 18px;
  margin-top: -8px;
  pointer-events: none;
  font-size: 16px;
  line-height: 16px;
  color: var(--lavrus-tretyakov-ru-dove-gray);
  background-color: var(--lavrus-tretyakov-ru-white);
  transition: all 0.3s ease;
}

.lavrus-auth__input:focus + .lavrus-auth__field-label,
.lavrus-auth__input:not(:placeholder-shown) + .lavrus-auth__field-label {
  top: 3px;
  padding: 0 4px;
  font-size: 14px;
}

.lavrus-auth__show-password {
  position: absolute;
  top: 50%;
  right: 18px;
  margin-top: -6px;
  padding: 0;
  border: 0;
  color: var(--lavrus-tretyakov-ru-dusty-gray);
  background: transparent;
  cursor: pointer;
}

.lavrus-auth__eye {
  display: block;
  width: 19px;
  height: 11px;
  background-color: currentColor;
  mask: url("../assets/icons/eye.svg") center / contain no-repeat;
  -webkit-mask: url("../assets/icons/eye.svg") center / contain no-repeat;
}

.lavrus-auth__show-password--active {
  color: var(--lavrus-tretyakov-ru-black);
}

.lavrus-auth__input.is-valid {
  border-color: var(--lavrus-tretyakov-ru-aqua-forest);
}

.lavrus-auth__input.is-invalid {
  border-color: var(--lavrus-tretyakov-ru-red);
}

.lavrus-auth__input.is-valid:focus {
  border-color: var(--lavrus-tretyakov-ru-aqua-forest);
}

.lavrus-auth__input.is-invalid:focus {
  border-color: var(--lavrus-tretyakov-ru-red);
}

.lavrus-auth__field-errors,
.lavrus-auth__field > .lavrus-auth__field-error {
  margin-top: 10px;
}

.lavrus-auth__field-errors[hidden],
.lavrus-auth__field-error[hidden] {
  display: none;
}

.lavrus-auth__field-error {
  margin: 0;
  font-size: 13px;
  line-height: 1.35;
  color: var(--lavrus-tretyakov-ru-red);
}

.lavrus-auth__field-errors .lavrus-auth__field-error + .lavrus-auth__field-error {
  margin-top: 4px;
}
