/* ==========================================================================
   1. БАЗОВЫЙ КЛАСС ДЛЯ ВСЕХ ПОЛЕЙ ВВОДА
   ========================================================================== */
.form-control {
  display: block;
  width: 100%;
  font-size: 14px;
  line-height: 1.42857143;
  color: #212121; /* Основной темный цвет текста */
  background-color: transparent;
  background-image: none;
  border: none;
  border-radius: 0;
  outline: none;
  box-shadow: none;
  cursor: text;
}

/* ==========================================================================
   2. КОНТЕНЕР И СПЕЦИФИЧЕСКИЕ НАСТРОЙКИ ДЛЯ ТЕКСТОВЫХ ПОЛЕЙ В ФОРМЕ
   ========================================================================== */
.textfield-item {
  display: block;
  position: relative;
}

/* Старая линия анимации больше не нужна, полностью её убираем */
.textfield-item-underline {
  display: none;
}

/* Настройки инпутов внутри контейнера формы */
.textfield-item input.form-control {
  height: auto;
  padding: 11px 0 10px;
  resize: none;
  color: inherit;
  
  /* Делаем базовую серую линию через box-shadow. */
  /* Это позволяет менять её толщину при фокусе, не меняя физический размер инпута */
  box-shadow: inset 0 -1px 0 0 #e0e0e0;
  
  /* Плавный переход цвета и толщины линии при клике */
  transition: box-shadow 0.2s ease-out;
}

/* МАГИЯ ФОКУСА: Линия становится черной и толщиной в 2px. Контент НЕ прыгает! */
.textfield-item input.form-control:focus {
  outline: none;
  box-shadow: inset 0 -1.5px 0 0 #000000;
}

/* ==========================================================================
   3. ГРУППА ИНТЕРФЕЙСА АВТОРИЗАЦИИ (LOGIN FORM)
   ========================================================================== */
.login_form_group {
  font-size: 16px;
  color: #212121;
  width: 270px;
  margin: 25px auto 15px;
}

/* Наследуем размер шрифта для инпутов в этой группе */
.login_form_group input.form-control {
  font-size: 16px;
  line-height: 1.33;
  font-weight: 400;
  font-family: inherit;
}

/* Кастомный плейсхолдер */
.login_form_group .textfield-item-placeholder {
  position: absolute;
  top: 10.5px;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -1;
  width: 100%;
  overflow: hidden;
  color: #ccc;
  white-space: nowrap;
  text-align: left;
  pointer-events: none;
  display: block;
}

/* Стандартный нативный плейсхолдер */
input::placeholder {
  color: #ccc;
}