.auth-box--password {
  max-width: 520px;
  gap: 1.2rem;
}

.auth-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 70px;
  margin: 0 auto 0.25rem;
  border: 2px solid color-mix(in srgb, var(--primary) 55%, transparent);
  border-radius: 50%;
  color: var(--primary);
  font-size: 2rem;
  background: color-mix(in srgb, var(--primary) 12%, transparent);
  box-shadow: 0 18px 40px color-mix(in srgb, var(--primary) 18%, transparent);
}

.auth-icon i {
  color: currentColor;
}

.auth-icon--danger {
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 55%, transparent);
  background: color-mix(in srgb, var(--danger) 12%, transparent);
  box-shadow: 0 18px 40px color-mix(in srgb, var(--danger) 18%, transparent);
}

.auth-btn--link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  text-decoration: none;
}

.auth-btn--link:hover {
  color: var(--modal-button-text, #fff);
}

.auth-info-block {
  margin: 0;
  padding: 0.85rem 1rem;
  border: 1px solid color-mix(in srgb, var(--primary) 35%, transparent);
  border-radius: 10px;
  color: var(--text-secondary);
  background: color-mix(in srgb, var(--primary) 10%, transparent);
  font-size: 0.92rem;
  line-height: 1.45;
  text-align: center;
}

@media (max-width: 575.98px) {
  .auth-box--password {
    max-width: min(100%, 420px);
  }
}
