

/* Start:/local/templates/hp/css/components/forms/style.css?17936359916143*/
/* Общие стили форм: поля, согласия, капча, чекбоксы */

.form { display: flex; flex-direction: column; gap: 1.875rem; align-items: flex-start; }
.form__fields { width: 100%; display: flex; flex-direction: column; gap: 1.25rem; }
.form__row { display: flex; gap: 1.25rem; }
.field { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .625rem; }
.field__label { font-size: 1.625rem; line-height: 1.875rem; font-weight: 300; color: var(--white); }
.field__input,
.filefield {
  display: flex;
  align-items: center;
  height: 3.125rem;
  padding: 0 .8125rem 0 1.875rem;   /* макет: pl 30, pr 13 */
  border: 1px solid var(--white);
  border-radius: .3125rem;
  background: transparent;
  color: var(--white);
  font-size: 1rem;
  outline: none;
  transition: border-color .2s ease;
}
.field__input::placeholder { color: var(--white); opacity: .7; }
.field__input:hover,
.filefield:hover { border-color: rgba(231, 124, 28, .55); }
.field__input:focus,
.filefield:focus-within { border-color: var(--orange); }
.field__input.is-invalid,
.filefield.is-invalid { border-color: var(--error); }
.filefield { justify-content: space-between; gap: 1.25rem; cursor: pointer; }
.filefield__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; opacity: .7; }
.filefield__text.is-filled { opacity: 1; }
.filefield__icon { flex: none; width: 1.219rem; height: 1.344rem; }
.field__error { font-size: 1rem; line-height: 1.2; color: var(--error); opacity: .7; }
.field__error[hidden] { display: none; }
.consent { display: flex; align-items: flex-start; gap: .625rem; cursor: pointer; }
.consent__box {
  flex: none;
  width: 1.5rem; height: 1.5rem;
  border: 1px solid var(--white);
  border-radius: .1875rem;
  background: no-repeat center / contain;
  transition: border-color .2s ease;
}
/* у отмеченного бокса рамка остаётся прозрачной: правило :checked ниже и побеждает */
.consent:hover .consent__box { border-color: var(--orange); }
.consent__input:checked + .consent__box {
  border-color: transparent;
  background-image: url('/local/templates/hp/css/components/forms/../../../img/icon-check.svg');
}
.consent__input:focus-visible + .consent__box { outline: 2px solid var(--orange); outline-offset: 3px; }
.consent__text { font-size: 1.25rem; line-height: 1.25rem; }
.consent__link { text-decoration: underline; text-underline-offset: .125rem; }
.consent__link:hover,
.consent__link:focus-visible { color: var(--orange); }
.form__success { font-size: 1.25rem; color: #8fd08a; }
.form__success[hidden] { display: none; }

@media (max-width: 1279px) {
  .form { gap: 1rem; }
  .form__row { flex-direction: row; gap: .75rem; }
  .field { gap: .375rem; }
  .field__label { font-size: .8125rem; line-height: 1.3; }
  .field__input,
  .filefield { height: 2.5rem; padding: 0 .75rem; font-size: .8125rem; }
  .field__error { font-size: .6875rem; }
  .consent { gap: .5rem; }
  .consent__box { width: 1.125rem; height: 1.125rem; }
  .consent__text { font-size: .75rem; line-height: 1.35; }
}

@media (max-width: 767px) {
  .form { display: none; gap: 20px; }
  .form.is-open { display: flex; }
  .form { gap: 20px; }
  .form__fields { gap: 20px; }
  .form__row { flex-direction: column; gap: 20px; }
  .field { gap: 10px; }
  .field__label { font-size: 14px; line-height: 20px; }
  .field__input,
  .filefield { height: 48px; padding: 0 20px; font-size: 14px; border-radius: 5px; }
  .field__error { font-size: 12px; line-height: 16px; }
  .consent__text { font-size: 12px; line-height: 16px; }
  .consent__box { width: 20px; height: 20px; }
}

/* Форма «Заказ космического снимка» */
.checks__list { display: flex; flex-wrap: wrap; align-items: center; gap: .625rem 1.875rem; min-height: 3.125rem; }
.checks.is-invalid .checks__box { border-color: var(--error); }
.field__select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 3.125rem;
  background: url('/local/templates/hp/css/components/forms/../../../img/icon-chevron-down-white.svg') no-repeat right 1.25rem center / 1rem .5625rem;
  font-family: inherit;
  cursor: pointer;
}
/* список вариантов рисует система на светлом фоне — текст тёмный */
.field__select option { color: #0a1226; background: #fff; }
.field__input[type="date"] { display: block; color-scheme: dark; font-family: inherit; }
.field__input[type="date"]::-webkit-calendar-picker-indicator { margin-left: auto; cursor: pointer; }
.field__hint { font-size: 1rem; line-height: 1.3; opacity: .7; }
/* Капча: картинка и поле ввода в одну строку одной высоты (50, как поле) */
.captcha { display: flex; align-items: center; gap: 1.25rem; }
.captcha__img { display: block; flex: none; width: 9.375rem; height: 3.125rem; border-radius: .3125rem; }
.captcha__field { flex: 1 1 auto; min-width: 0; }
.captcha__field .captcha__input { width: 100%; }
@media (max-width: 1279px) {
  /* на планшете поле ввода 40 в высоту — картинка той же высоты */
  .captcha__img { width: 7.5rem; height: 2.5rem; }
}
@media (max-width: 767px) {
  .checks__list { gap: 10px 20px; min-height: 0; }
  .field__hint { font-size: 12px; line-height: 16px; }
  /* в 280 картинка 150 и поле рядом не помещаются — поле под картинкой */
  .captcha { flex-wrap: wrap; gap: 10px; }
  .captcha__img { width: 150px; height: 50px; }
  .captcha__field { flex-basis: 100%; }
}

/* Страница «Реализуемое имущество» */
textarea.field__input.field__area {
  display: block;
  height: auto;
  min-height: 7.5rem;              /* 120 */
  padding: .9375rem 1.875rem;      /* 15 / 30 */
  line-height: 1.3;
  font-family: inherit;
  resize: vertical;
}

@media (min-width: 768px) and (max-width: 1279px) {
  .form .form__submit { height: 2.5rem; font-size: .8125rem; }
}

/* поля без рамки фокуса и при :focus-visible из шаблона */
.field__input:focus-visible,
.filefield:focus-visible { outline: none; }

/* End */
/* /local/templates/hp/css/components/forms/style.css?17936359916143 */
