/* Поля форм заявок — все формы сайта (30.09.2026, вторая версия).
   Подпись всегда НАД полем, без анимаций: «плавающая» подпись внутри поля наезжала на текст
   (в многострочном поле текст прокручивался под ней). Поле — скруглённая рамка, при фокусе
   зелёная обводка. «Сообщение» растёт само по мере ввода (/js/site/forms.js), ручного
   растягивания нет. Телефон: флаг и код страны внутри рамки.
   Правила шаблона (в т.ч. с !important) перебиваются специфичностью. */

.callback-form .callback-form__item.form-item-title { display: flex; flex-direction: column; gap: 8px; }

/* подпись над полем (в разметке она после поля — ставим первой через order) */
.callback-form .callback-form__item.form-item-title .input-title {
  order: -1; position: static !important; top: auto !important; left: auto !important; margin: 0;
  /* !important: правило шаблона .callback-form__item:has(input[name=PHONE]:valid) перекрашивало подпись */
  font-size: 14px !important; font-weight: 600; line-height: 1.3; color: #272727 !important; white-space: normal;
  pointer-events: auto; transition: none;
}

/* поле */
.callback-form .callback-form__item.form-item-title input[type="text"]:not(.iti__search-input),
.callback-form .callback-form__item.form-item-title input[type="email"],
.callback-form .callback-form__item.form-item-title input[type="tel"],
.callback-form .callback-form__item.form-item-title textarea,
.callback-form .callback-form__item.form-item-title select {
  box-sizing: border-box; width: 100%; height: 52px; margin: 0; padding: 0 16px;
  border: 1.5px solid #d6d6d6; border-radius: 12px; background: #fff; box-shadow: none;
  font-family: inherit; font-size: 16px; line-height: 1.4; color: #272727;
  transition: border-color .2s, box-shadow .2s;
}
.callback-form .callback-form__item.form-item-title textarea {
  height: auto; min-height: 96px; max-height: 220px; padding: 13px 16px; resize: none; overflow-y: auto;
}
.callback-form .callback-form__item.form-item-title input:hover,
.callback-form .callback-form__item.form-item-title textarea:hover,
.callback-form .callback-form__item.form-item-title select:hover { border-color: #b5b5b5; }
.callback-form .callback-form__item.form-item-title input:focus,
.callback-form .callback-form__item.form-item-title textarea:focus,
.callback-form .callback-form__item.form-item-title select:focus {
  border-color: #62ba87; box-shadow: 0 0 0 4px rgba(98, 186, 135, .16); outline: 0;
}
.callback-form .callback-form__item.form-item-title input::placeholder,
.callback-form .callback-form__item.form-item-title textarea::placeholder { color: #8f8f8f; opacity: 1; }

/* выпадающий список (курсы): своя стрелка вместо стрелки шаблона */
.callback-form .callback-form__item.form-item-title.select:before { display: none; }
.callback-form .callback-form__item.form-item-title select {
  -webkit-appearance: none; appearance: none; padding-right: 44px; cursor: pointer;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23272727' stroke-width='1.6'/%3E%3C/svg%3E") right 16px center no-repeat;
}

/* телефон: флаг и код страны внутри рамки */
.callback-form .form-item-title-PHONE .iti { width: 100%; }
.callback-form .form-item-title-PHONE .iti__country-container { top: 0 !important; bottom: 0; padding: 0; }
.callback-form .form-item-title-PHONE .iti__selected-country { padding: 0 6px 0 14px; border-radius: 12px 0 0 12px; background: none; }
.callback-form .form-item-title-PHONE .iti__selected-country:hover { background: #f3f9f5; }
.callback-form .form-item-title-PHONE .iti__selected-dial-code { margin-left: 6px; font-size: 16px; color: #272727; }
.callback-form .form-item-title-PHONE .iti__tel-input::placeholder { opacity: 1 !important; color: #8f8f8f; }

/* интервалы между полями */
.callback-form .callback-form__item.form-item-title, .callback-form .callback-form__group { margin-bottom: 18px; }
.callback-form .callback-form__group .callback-form__item.form-item-title { margin-bottom: 0; }
@media (max-width: 767px) {
  .callback-form .callback-form__group .callback-form__item.form-item-title { margin: 0 0 18px; }
  .callback-form .callback-form__group .callback-form__item.form-item-title:last-child { margin-bottom: 0; }
}

/* Поиск в списке стран (окно выбора кода). На телефоне список открывается на весь экран и
   поиск сжимался до 5 px (стили полей шаблона + flex), на компьютере его задевали стили выше. */
.iti input.iti__search-input,
.iti--container input.iti__search-input {
  flex: none; box-sizing: border-box; width: 100%; height: 46px !important;
  margin: 0; padding: 0 14px !important; border: 0; border-bottom: 1px solid #e3e3e3; border-radius: 0;
  background: #fff; font-size: 16px; line-height: 46px; color: #272727; outline: 0;
}
.iti input.iti__search-input::placeholder,
.iti--container input.iti__search-input::placeholder { color: #8f8f8f; opacity: 1; }
.iti input.iti__search-input:focus,
.iti--container input.iti__search-input:focus { border-bottom-color: #62ba87; }

/* Ссылка «Политика конфиденциальности» под кнопкой: крупнее и с нормальной зоной нажатия
   (на телефоне была 11px и прижата к кнопке). */
.callback-form .callback-form__privace-policy { margin-top: 6px; }
.callback-form .callback-form__privace-policy a {
  display: inline-block; padding: 10px 4px; font-size: 14px; line-height: 1.3; color: #272727;
  text-decoration: underline; text-underline-offset: 3px;
}
.callback-form .callback-form__privace-policy a:hover { color: #e9423d; }

/* Окно политики — поверх окна заявки (remodal 10000) и окна видео (10050):
   раньше открывалось под окном заявки, и нажатие будто ничего не делало. */
.privace-popup, .privace-popup.opened { z-index: 10060; } /* шаблон: .privace-popup.opened { z-index: 999 } */

/* Телефон: шаблон ставит низ формы блоком, и ссылка на политику оказывалась над кнопкой,
   вплотную к ней. Кнопка — первой, ссылка — под ней с отступом. */
@media (max-width: 767px) {
  .callback-form .callback-form__button-wr { display: flex; flex-direction: column; align-items: stretch; gap: 6px; }
  .callback-form .callback-form__button { order: -1; flex: none; width: 100%; margin: 0; }
  .callback-form .callback-form__button .site-btn { width: 100%; }
  .callback-form .callback-form__privace-policy { margin: 0; text-align: center; }
}
