/*
 * Beloknet — формы Contact Form 7 в разметке старого сайта (BN-F4-05).
 *
 * Основное оформление полей и кнопок — перенесённый CSS секций и окон
 * (.form-v2, .formBlock, .modalCallBack, .form-review). Здесь — только то,
 * что добавляет CF7: обёртки полей, текст согласия, сообщения, ловушка для ботов.
 * Подключается, только когда формы включены (inc/forms.php).
 */

/* Ловушка для ботов — невидима для людей и экранных дикторов. */
.bn-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Обёртки полей CF7 не должны ломать строки старой разметки. */
.bn-form .wpcf7-form-control-wrap {
	display: block;
	flex: 1 1 0;
	min-width: 0;
}

.bn-form .wpcf7-form-control-wrap input,
.bn-form .wpcf7-form-control-wrap textarea,
/* старое правило окна отзыва давало полю 50% — теперь 50% у обёртки CF7 */
.form-review.bn-form .inputs .text-section .wpcf7-form-control-wrap input,
#form-block .form-wrap .right-side .formBlock.bn-form .inputs .text-section .wpcf7-form-control-wrap input {
	width: 100%;
	box-sizing: border-box;
}

.bn-form .text-section {
	display: flex;
	gap: 10px;
}

.bn-form .text-section + .text-section {
	margin-top: 10px;
}

/* Кнопка CF7 — <input type="submit">, у старых форм был <button>. */
.bn-form input.wpcf7-submit.btn {
	border: 0;
	cursor: pointer;
	font: inherit;
}

.bn-form .wpcf7-spinner {
	margin: 0 0 0 8px;
}

/* Согласие на обработку персональных данных. */
.bn-form .bn-consent {
	margin-top: 12px;
	font-size: 12px;
	line-height: 135%;
	color: var(--txtColor2);
}

.bn-form .bn-consent .wpcf7-list-item {
	margin: 0;
}

.bn-form .bn-consent label {
	display: flex;
	gap: 8px;
	align-items: flex-start;
	cursor: pointer;
}

.bn-form .bn-consent input[type="checkbox"] {
	width: auto;
	margin-top: 2px;
	accent-color: var(--primary);
}

.bn-form .bn-consent a {
	color: var(--primary);
}

/* Ошибки у полей и итог отправки. */
.bn-form .wpcf7-not-valid-tip {
	margin-top: 4px;
	font-size: 12px;
	color: #c0392b;
}

.bn-form .wpcf7-response-output {
	margin: 12px 0 0 !important;
	padding: 8px 12px !important;
	border-radius: 10px;
	font-size: 14px;
}

/* Успех и ошибку показывают окна «Спасибо!» / «Ошибка!» — строку CF7 не дублируем. */
.bn-form.sent .wpcf7-response-output,
.bn-form.failed .wpcf7-response-output,
.bn-form.spam .wpcf7-response-output {
	display: none;
}

/* Мини-форма «Как мы можем помочь»: телефон и кнопка в строку, согласие ниже. */
.bn-form--mini {
	flex-wrap: wrap;
	gap: 10px;
}

.bn-form--mini .bn-consent,
.bn-form--mini .wpcf7-response-output {
	flex: 0 0 100%;
}

.bn-form--mini input.wpcf7-submit.btn {
	width: 25%;
	min-width: 140px;
}

/* «Прикрепить файл» в окне отзыва. */
.bn-form .input-file {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 12px;
	cursor: pointer;
}

.bn-form .input-file .wpcf7-form-control-wrap {
	flex: 0 0 auto;
	width: 0;
	overflow: hidden;
}

.bn-form .input-file-btn {
	padding: 10px 16px;
	border-radius: 10px;
	background: var(--f5);
	color: var(--txtColor);
}

.bn-form .input-file-text {
	font-size: 14px;
	color: var(--txtColor2);
}

@media (max-width: 600px) {
	.bn-form .text-section {
		flex-direction: column;
	}

	.bn-form--mini input.wpcf7-submit.btn {
		width: 100%;
	}
}

/* Согласие: обёртка CF7 вокруг галочки не растягивается. */
.bn-form .bn-consent .wpcf7-form-control-wrap {
	display: inline;
	flex: none;
}

/*
 * Мини-форма: старое правило «.form-post .form input» (поле телефона) задевало
 * и кнопку CF7 <input type="submit"> — возвращаем ей вид кнопки .btn.
 */
#help-block .help-taxonomy .help-post .post-wrap .tab-item .post-helps .right-side .form-post .form input.wpcf7-submit {
	width: 25%;
	min-width: 140px;
	padding: 15px 30px;
	background: var(--primary);
	color: var(--wh);
	border: 0;
	border-radius: 10px;
	cursor: pointer;
}

#help-block .help-taxonomy .help-post .post-wrap .tab-item .post-helps .right-side .form-post .form input.wpcf7-submit:disabled {
	opacity: .6;
	cursor: not-allowed;
}

@media (max-width: 600px) {
	#help-block .help-taxonomy .help-post .post-wrap .tab-item .post-helps .right-side .form-post .form input.wpcf7-submit {
		width: 100%;
	}
}

/* То же старое правило давало ширину 70% и галочке согласия. */
#help-block .help-taxonomy .help-post .post-wrap .tab-item .post-helps .right-side .form-post .form .bn-consent input[type="checkbox"] {
	width: auto;
	padding: 0;
}

/* Мини-форма на телефоне: поле и кнопка друг под другом (места для строки нет). */
@media (max-width: 600px) {
	#help-block .help-taxonomy .help-post .post-wrap .tab-item .post-helps .right-side .form-post .form.bn-form--mini {
		flex-direction: column;
		align-items: stretch;
	}

	#help-block .help-taxonomy .help-post .post-wrap .tab-item .post-helps .right-side .form-post .form.bn-form--mini input[type="tel"],
	#help-block .help-taxonomy .help-post .post-wrap .tab-item .post-helps .right-side .form-post .form.bn-form--mini input.wpcf7-submit {
		width: 100%;
		max-width: none;
	}
}

/*
 * Текст согласия старого сайта под кнопкой отправки (решение владельца 18.10.2026,
 * без галочек): «*Нажимая на кнопку, Вы соглашаетесь на обработку персональных
 * данных», ссылка — на политику. Небольшой, аккуратный, читаемый.
 */
.bn-form .lover-input {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}

#form-block .form-wrap .right-side .formBlock.bn-form .lover-input {
	flex-direction: column;
	align-items: flex-end;
	gap: 10px;
}

.bn-form .privacy {
	font-size: 12px;
	line-height: 135%;
	color: var(--txtColor2);
	text-align: center;
}

#form-block .form-wrap .right-side .formBlock.bn-form .lover-input .privacy {
	text-align: right;
}

.bn-form .privacy span {
	font-size: inherit;
	font-weight: 400;
	color: inherit;
}

.bn-form .privacy a {
	color: var(--primary);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.bn-form--mini .privacy {
	flex: 0 0 100%;
	text-align: left;
}

@media (max-width: 600px) {
	#form-block .form-wrap .right-side .formBlock.bn-form .lover-input {
		align-items: stretch;
	}

	#form-block .form-wrap .right-side .formBlock.bn-form .lover-input .privacy {
		text-align: center;
	}
}
/* ---------- BN-F7-04 ---------- */

/* Окно заявки: выбранный тариф («Вы выбрали: Категория · Тариф · Цена»). */
.theme-modal .bn-selected {
	margin: -6px 0 16px;
	padding: 10px 12px;
	border-left: 3px solid var(--secondary);
	background: var(--f5);
	border-radius: 6px;
	font-size: 15px;
	line-height: 140%;
	color: var(--txtColor);
	text-align: left;
}

.theme-modal .bn-selected__label {
	color: var(--txtColor2);
}

.theme-modal .bn-selected__value {
	font-weight: 600;
}

/* Кнопка во время отправки. */
.bn-form input.wpcf7-submit.btn:disabled {
	opacity: .65;
	cursor: wait;
}

/* Окно «Спасибо» в режиме проверки (только предпросмотр): одно сообщение
   вместо «Спасибо! Ваша заявка отправлена», чтобы не было противоречия. */
#modal-success.bn-dry .title,
#modal-success.bn-dry .bn-ok-body {
	display: none;
}

#modal-success .bn-dry-note,
#modal-success .bn-saved-note {
	margin-top: 0;
	font-size: 18px;
	line-height: 140%;
	color: var(--txtColor);
}

/*
 * Ошибки у полей видны. Перенесённый CSS старого сайта (modals.css, «MODAL»)
 * скрывает .wpcf7-not-valid-tip — без этого правила посетитель не узнал бы,
 * что номер неполный или поле не заполнено.
 */
.wpcf7 .bn-form .wpcf7-not-valid-tip {
	display: block;
	/* Текст ошибки переносится по ширине поля и не раздвигает его. */
	width: 0;
	min-width: 100%;
	margin-top: 4px;
	font-size: 13px;
	line-height: 130%;
	color: #c0392b;
	text-align: left;
}

.bn-form .wpcf7-not-valid {
	border-color: #c0392b !important;
}

/*
 * Постоянные подписи полей «Имя» и «Телефон *» (решение владельца 20.10.2026):
 * подпись над полем не исчезает при вводе, в самом поле телефона — образец маски.
 * Разметка — в формах CF7: <label class="bn-field"><span class="bn-label">…</span>[поле]</label>.
 */
.bn-form .bn-field {
	display: flex;
	flex-direction: column;
	gap: 4px;
	flex: 1 1 0;
	min-width: 0;
	text-align: left;
}

.bn-form .bn-label {
	font-size: 13px;
	line-height: 16px;
	color: var(--txtColor2);
}

.bn-form .bn-field .wpcf7-form-control-wrap {
	flex: 0 0 auto;
}

.bn-form .bn-field input {
	width: 100% !important;
	box-sizing: border-box;
}

/* Окна: поля прежней ширины 225 px, по центру. */
.form.modalCallBack.bn-form .text-section .bn-field {
	width: 100%;
	max-width: 225px;
	flex: 0 0 auto;
}

.form.modalCallBack.bn-form .text-section .bn-field input {
	max-width: none;
}

/* Мини-форма «Как мы можем помочь»: кнопка — на уровне поля, а не подписи. */
.bn-form--mini {
	align-items: flex-start;
}

.bn-form--mini input.wpcf7-submit.btn {
	margin-top: 20px;
}

/* =====================================================================
 * F7-FORMS-UI (22.10.2026) — единый вид всех окон с формами:
 * «Заказать звонок», «Получить консультацию», «Оставить заявку», «Оставить отзыв»,
 * а также окна «Спасибо» / «Ошибка». Только оформление: разметка CF7, поля,
 * проверки и логика окон не меняются. Правила ниже перекрывают перенесённые
 * со старого сайта (modals.css) и ранние правки этого файла.
 * ===================================================================== */

.theme-modal {
	--bn-f-border: #cfdada;
	--bn-f-border-hover: #9fb8b8;
	--bn-f-ring: rgba(65, 121, 121, .2);
	--bn-f-error: #c0392b;
	--bn-f-placeholder: #97a3a3;
	--bn-f-primary-dark: #356464;
}

/* ---------- Окно ---------- */
.theme-modal.cback,
.theme-modal.review,
#modal-success,
#modal-error {
	display: flex;
	flex-direction: column;
	width: 500px;
	max-width: calc(100vw - 32px);
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px);
	overflow: hidden;
	border-radius: 16px;
	box-shadow: 0 24px 64px rgba(20, 40, 40, .22), 0 2px 8px rgba(20, 40, 40, .08);
}

.theme-modal.review {
	width: 520px;
}

/* Прокручивается содержимое, крестик остаётся на месте. */
.theme-modal .form__holder {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	padding: 32px;
}

/* ---------- Крестик ---------- */
.theme-modal .close-modal {
	top: 12px;
	right: 12px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #fff;
	font-size: 30px;
	font-weight: 400;
	line-height: 1;
	color: var(--txtColor2);
	transition: background-color .2s, color .2s;
}

.theme-modal .close-modal:hover {
	background: var(--f5);
	color: var(--primary);
}

.theme-modal .close-modal:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: 2px;
}

/* ---------- Заголовок ---------- */
.theme-modal .form .title,
#modal-success .title,
#modal-error .title {
	margin: 0 0 20px;
	padding: 0 36px;
	font-size: 22px;
	font-weight: 700;
	line-height: 125%;
	letter-spacing: .01em;
	text-align: center;
	text-wrap: balance;
	color: var(--txtColor);
}

/* «Вы выбрали: …» — между заголовком и полями. */
.theme-modal .bn-selected {
	margin: 0 0 20px;
}

/* ---------- Поля ---------- */
.theme-modal .form .bn-form .text-section,
.theme-modal .form .bn-form .inputs .text-section {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 16px;
}

.theme-modal .form .bn-form .text-section + .text-section {
	margin-top: 16px;
}

.theme-modal .form .bn-form .text-section .bn-field {
	width: 100%;
	max-width: none;
	flex: 0 0 auto;
	gap: 6px;
}

.theme-modal .form .bn-form .bn-label {
	font-size: 14px;
	line-height: 18px;
	font-weight: 500;
	color: var(--txtColor);
}

.theme-modal .form .bn-form .wpcf7-form-control-wrap {
	display: block;
	width: 100%;
}

.theme-modal .form .bn-form .bn-field input,
.theme-modal .form .bn-form .inputs .bn-field input,
.theme-modal .form .bn-form textarea.wpcf7-textarea {
	display: block;
	width: 100% !important;
	max-width: none;
	box-sizing: border-box;
	margin: 0;
	border: 1px solid var(--bn-f-border);
	border-radius: 10px;
	background: #fff;
	font: inherit;
	font-size: 16px; /* 16 px — телефон не увеличивает страницу при вводе */
	line-height: 22px;
	color: var(--txtColor);
	transition: border-color .2s, box-shadow .2s;
}

.theme-modal .form .bn-form .bn-field input,
.theme-modal .form .bn-form .inputs .bn-field input {
	height: 50px;
	padding: 0 16px;
}

.theme-modal .form .bn-form textarea.wpcf7-textarea {
	height: 120px;
	min-height: 96px;
	max-height: 240px;
	padding: 13px 16px;
	resize: vertical;
}

/* Отзыв: поле текста отделено от имени и телефона так же, как поля друг от друга. */
.theme-modal .form .bn-form .inputs > .wpcf7-form-control-wrap {
	margin-top: 16px;
}

.theme-modal .form .bn-form .bn-field input::placeholder,
.theme-modal .form .bn-form textarea.wpcf7-textarea::placeholder {
	color: var(--bn-f-placeholder);
	opacity: 1;
}

.theme-modal .form .bn-form .bn-field input:hover,
.theme-modal .form .bn-form textarea.wpcf7-textarea:hover {
	border-color: var(--bn-f-border-hover);
}

.theme-modal .form .bn-form .bn-field input:focus,
.theme-modal .form .bn-form .inputs .bn-field input:focus,
.theme-modal .form .bn-form textarea.wpcf7-textarea:focus {
	outline: none;
	border: 1px solid var(--primary);
	box-shadow: 0 0 0 3px var(--bn-f-ring);
}

.theme-modal .form .bn-form .wpcf7-not-valid,
.theme-modal .form .bn-form .wpcf7-not-valid:hover {
	border-color: var(--bn-f-error) !important;
}

.theme-modal .form .bn-form .wpcf7-not-valid:focus {
	box-shadow: 0 0 0 3px rgba(192, 57, 43, .18);
}

.theme-modal .form .bn-form .wpcf7-not-valid-tip {
	margin-top: 6px;
	font-size: 13px;
	line-height: 130%;
}

/* ---------- Кнопка и согласие ---------- */
.theme-modal .form .bn-form .lover-input {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 12px;
	margin-top: 24px;
}

.theme-modal .form .bn-form .lover-input input.wpcf7-submit.btn {
	width: 100%;
	max-width: none;
	height: 52px;
	padding: 0 20px;
	border: 0;
	border-radius: 10px;
	background: var(--primary);
	color: #fff;
	font: inherit;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: .01em;
	cursor: pointer;
	transition: background-color .2s, box-shadow .2s, opacity .2s;
}

.theme-modal .form .bn-form .lover-input input.wpcf7-submit.btn:hover {
	background: var(--bn-f-primary-dark);
	color: #fff;
}

.theme-modal .form .bn-form .lover-input input.wpcf7-submit.btn:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--primary);
}

/* Во время отправки и при блокировке. */
.theme-modal .form .bn-form .lover-input input.wpcf7-submit.btn:disabled,
.theme-modal .form .wpcf7-form.submitting .lover-input input.wpcf7-submit.btn {
	background: var(--primary);
	opacity: .6;
	cursor: wait;
}

.theme-modal .form .bn-form .lover-input .wpcf7-spinner {
	display: none;
}

.theme-modal .form .bn-form .lover-input .privacy {
	margin: 0;
	font-size: 12.5px;
	line-height: 140%;
	text-align: center;
	color: var(--txtColor2);
}

.theme-modal .form .bn-form .lover-input .privacy span {
	font-size: inherit;
	font-weight: 400;
	line-height: inherit;
	color: inherit;
}

.theme-modal .form .bn-form .lover-input .privacy a {
	color: var(--primary);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.theme-modal .form .bn-form .wpcf7-response-output {
	margin: 16px 0 0 !important;
}

/* ---------- «Спасибо» / «Ошибка» ---------- */
#modal-success,
#modal-error {
	padding: 40px 32px 36px;
}

#modal-success .subtitle,
#modal-error .subtitle {
	margin-top: 0;
	font-size: 17px;
	line-height: 145%;
	color: var(--txtColor);
}

/* ---------- Телефон ---------- */
@media (max-width: 480px) {
	.theme-modal .form__holder {
		padding: 24px 20px;
	}

	.theme-modal .form .title,
	#modal-success .title,
	#modal-error .title {
		margin-bottom: 16px;
		font-size: 20px;
	}

	#modal-success,
	#modal-error {
		padding: 36px 20px 28px;
	}
}

/* Текст окна «Спасибо» / «Ошибка» не заходит под крестик. */
#modal-success .subtitle,
#modal-error .subtitle {
	padding: 0 36px;
	text-wrap: balance;
}

@media (max-width: 480px) {
	#modal-success,
	#modal-error {
		padding-top: 52px;
	}

	#modal-success .subtitle,
	#modal-error .subtitle {
		padding: 0 4px;
	}
}