/* Модалки сайта.
   Вендорский плагин (public/vendor/granit/app.js) открывает окно, но ставит
   inline opacity: 0 и не анимирует — окно остаётся прозрачным, а вендорский CSS
   не задаёт вертикальное положение (только left/right + margin: auto), из-за
   чего модалка прилипала к низу. Вид и открытие делает наш код (public/js/modal.js):
   класс is-open у .modal и у .modal-overlay, блокировка скролла у body. */

.modal {
	position: fixed;
	top: 50%;
	left: 50%;
	right: auto;
	display: none;
	width: min(560px, calc(100vw - 32px));
	max-height: min(90vh, 760px);
	margin: 0;
	padding: 32px 20px 24px;
	overflow-y: auto;
	background: #fafafa;
	border-radius: 4px;
	box-shadow: 0 24px 64px rgba(74, 74, 74, 0.28);
	transform: translate(-50%, -50%);
	z-index: 1003;

	&.is-open {
		display: block;
	}

	/* Крестик: в архиве он абсолютный внутри модалки, у нас окно скроллится —
	   держим его на виду при прокрутке длинной формы. */
	.close {
		position: sticky;
		float: right;
		top: -20px;
		margin: -12px -8px 0 0;
		z-index: 1;
	}
}

.modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	height: auto;
	display: none;
	background: rgba(0, 0, 0, 0.45);
	z-index: 1002;

	&.is-open {
		display: block;
	}
}

/* Пока открыта модалка, страница под ней не скроллится. */
body.modal-open {
	overflow: hidden;
}