/* Ширина всплывающих окон (модалок) — neftopt.ru, 2026-08-15.
   Проблема: fancybox задаёт своему контейнеру .fancybox-content { width: 100%; padding: 44px },
   и это правило перебивает теминое .modal__x { max-width: 480px } (fancybox подключается позже).
   В итоге любое окно с формой растягивалось во всю ширину экрана.
   Здесь возвращаем нормальную ширину, не трогая внутреннюю вёрстку окон. */

.fancybox-content.modal__x,
.fancybox-content.modal__x2,
.fancybox-slide > .modal__x,
.fancybox-slide > .modal__x2 {
	width: 100% !important;
	max-width: 540px;
	padding: 0 !important;
	margin: 0 auto;
	border-radius: 6px;
	overflow: hidden;
}

/* окна с картинкой сбоку (две колонки) — чуть шире */
.fancybox-content.modal__x2,
.fancybox-slide > .modal__x2 {
	max-width: 760px;
}

/* выбор города — список городов в несколько колонок */
.fancybox-content#js_modal_city,
.fancybox-slide > #js_modal_city {
	max-width: 680px;
}

/* окна «спасибо» — компактные */
.fancybox-content.modal__x__success,
.fancybox-slide > .modal__x__success {
	max-width: 460px;
}

/* окно расчёта стоимости — таблица внутри, нужно больше места */
.fancybox-content#js_modal_cost,
.fancybox-slide > #js_modal_cost {
	max-width: 820px;
}

/* планшет */
@media (max-width: 991px) {
	.fancybox-content.modal__x,
	.fancybox-content.modal__x2,
	.fancybox-slide > .modal__x,
	.fancybox-slide > .modal__x2 {
		max-width: 560px;
	}

	.fancybox-content#js_modal_cost,
	.fancybox-slide > #js_modal_cost {
		max-width: 640px;
	}
}

/* телефон: почти во всю ширину, но с полями по краям */
@media (max-width: 575px) {
	.fancybox-content.modal__x,
	.fancybox-content.modal__x2,
	.fancybox-content.modal__x__success,
	.fancybox-slide > .modal__x,
	.fancybox-slide > .modal__x2,
	.fancybox-slide > .modal__x__success {
		max-width: 100%;
		width: 100% !important;
	}

	.fancybox-slide { padding: 8px !important; }
}
