/* ============ Поля формы заявки ============ */
/* Раньше вид полей, чекбокса и кнопки задавал только home-blocks.css,
   а он подключается на главной, услугах и страницах — но не на блоге,
   калькуляторе и пунктах выдачи. Окно заявки при этом есть везде, и на
   этих страницах оно открывалось без стилей: кнопка выглядела системной,
   а чекбокс согласия исчезал совсем (тема прячет все чекбоксы через
   display:none). Стили формы переехали сюда — lead.css грузится на каждой
   странице вместе с самим окном. */

.hb-form_trap{
	position: absolute;
	left: -5000px;
	height: 0;
	overflow: hidden;
}

.hb-form_field{ display: block; }
.hb-form_field input{
	width: 100%;
	height: 60px;
	padding: 0 16px;
	border: 1px solid #cad2dd;
	border-radius: 10px;
	background: #f9f9f9;
	font: inherit;
	font-size: 16px;
	font-weight: 400;
	color: #000;
}
.hb-form_field input::placeholder{ color: rgba(0, 0, 0, .5); }
.hb-form_field input:focus{ outline: none; border-color: var(--theme-color, #ed7c23); }

.hb-form_check{
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 20px 0;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.35;
	color: #000;
	text-align: left;
	cursor: pointer;
}
.hb-form_check a{ color: var(--theme-color, #ed7c23); text-decoration: underline; }

/* Тема прячет все чекбоксы (display:none) и рисует свои только в своих
   формах — здесь возвращаем настоящий квадратик. */
.hb-form_check input[type="checkbox"],
.sub-form_check input[type="checkbox"]{
	display: inline-block;
	flex: 0 0 18px;
	width: 18px;
	height: 18px;
	margin-top: 2px;
	position: static;
	opacity: 1;
	visibility: visible;
	-webkit-appearance: checkbox;
	        appearance: checkbox;
	accent-color: var(--theme-color, #ed7c23);
}

/* Значения повторяют home-blocks.css: на главной обе таблицы стилей
   попадают на страницу, и кнопка не должна менять вид от того, какая
   из них оказалась ниже. */
.hb-form_submit{
	width: 100%;
	height: 60px;
	border: 0;
	border-radius: 10px;
	background: var(--theme-color, #ed7c23);
	color: #fff;
	font: inherit;
	font-size: 22px;
	font-weight: 500;
	text-transform: uppercase;
	cursor: pointer;
	transition: .3s ease all;
}
.hb-form_submit:hover{ background: #282828; color: #fff; }

/* Окно с формой заявки */
.lead-modal{
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.lead-modal[hidden]{ display: none; }

.lead-modal_backdrop{
	position: absolute;
	inset: 0;
	background: rgba(43, 38, 32, .55);
}

/* Обёртка нужна, чтобы крестик стоял над карточкой, а не внутри неё. */
.lead-modal_wrap{
	position: relative;
	width: 100%;
	max-width: 460px;
	max-height: 90vh;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.lead-modal_box{
	position: relative;
	width: 100%;
	overflow-y: auto;
	padding: 30px;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 24px 60px rgba(0, 0, 0, .25);
}

.lead-modal_close{
	align-self: flex-end;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .9);
	font-size: 30px;
	line-height: 1;
	color: #2B2620;
	cursor: pointer;
	transition: background .2s;
}

.lead-modal_close:hover{ background: #fff; }

.lead-modal_title{
	margin: 0 0 10px;
	font-family: var(--heading-font);
	font-size: 24px;
	font-weight: 500;
	line-height: 1.25;
}

.lead-modal_note{
	margin: 0 0 20px;
	font-size: 15px;
	line-height: 1.45;
	color: #5A5148;
}

.lead-modal_form .hb-form_field + .hb-form_field{ margin-top: 12px; }

@media (max-width: 575px){
	.lead-modal_box{ padding: 30px 18px 22px; }
}

/* Окно «заявка отправлена» */
.lead-done{
	position: fixed;
	inset: 0;
	z-index: 100001;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.lead-done[hidden]{ display: none; }

.lead-done_box{ text-align: center; }

.lead-done_mark{
	display: block;
	width: 64px;
	height: 64px;
	margin: 0 auto 16px;
}

.lead-done_mark svg{ width: 100%; height: 100%; }
.lead-done_mark circle{ fill: var(--theme-color); }

.lead-done_box .lead-modal_note a{ color: var(--theme-color); white-space: nowrap; }
.lead-done_box .hb-form_submit{ margin-top: 6px; }
