.auth-block {
  background-color: #EBEBEB;
  min-height: calc(100vh - 96px - 100px);
}

.login-container {
  width: 692px;
  margin: 0 auto;
  padding: 51px 0 51px 0;
}

.auth-title {
  font-family: 'Jost';
  font-size: 32px;
  font-weight: bold;
  margin: 0 0 20px 0;
}

.auth-desc {
  font-weight: 400;
  font-size: 16px;
  margin: 0 0 50px 0;
  line-height: 138%;
}

.auth-credentials label p {
  font-size: 16px;
  margin: 0 0 10px 0;
}

.red {
  color: red;
}

.auth-credentials label {
  display: block;
}

.auth-credentials-input {
  width: 692px;
  height: 41px;
  border: none;
  border-radius: 5px;
  font-family: 'Montserrat';
  font-weight: 300;
  font-size: 16px;
  padding-left: 12px;
  box-sizing: border-box;
  line-height: 1.2;
  transition: box-shadow 0.4s ease, background 0.4s ease;
  background-color: #FFF;
  outline: none;
}

.auth-credentials-input:focus {
  box-shadow: 0 0 8px rgba(16, 6, 159, 0.4);
}

.auth-credentials-item {
  margin: 0 0 30px 0;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.auth-credentials-item:last-of-type {
  margin: 0 0 50px 0;
}

.message-info {
  display: flex;
  align-items: center;
  gap: 0.5em;
  padding: 12px 16px;
  margin-bottom: 20px;
  border-radius: 4px;
  font-size: 0.95rem;
  line-height: 1.4;
}

/* Ошибка */
.message-info.error {
  border: 1px solid #e74c3c;
  background-color: #fdecea;
  color: #c0392b;
}

.message-info.error::before {
  content: "❌";
  font-size: 1.2rem;
  line-height: 1;
}

/* Успех */
.message-info.success {
  border: 1px solid rgb(67, 148, 102);
  background-color: #eafaf1;
  color: rgb(67, 148, 102);
}

.message-info.success::before {
  content: "✔️";
  font-size: 1.2rem;
  line-height: 1;
}

.message-info ul,
.errorlist {
  /* включаем маркеры */
  list-style-type: disc;
  list-style-position: inside;
  /* отступ слева для маркера */
  padding-left: 1.2em;
  /* небольшой отступ сверху/снизу */
  margin: 0.5em 0 0 0;
}

.message-info ul li,
.errorlist li {
  margin-bottom: 0.3em;
}

/* опционально: цвет маркера */
.message-info li::marker,
.errorlist li::marker {
  color: #c0392b;
}

@media(max-width: 1000px) {
  .login-container {
    width: 75vw;
  }

  .auth-credentials-input {
    width: 75vw;
  }

  .auth-credentials button {
    width: 200px;
    justify-self: center;
  }
}