:root {
	--popup-transition: .3s;
	--popup-transition-delay: .2s;
	--popup-top-offset: calc(var(--header-height) + 20px);
	--popup-bottom-offset: 20px;
	--popup-side-width: 360px;
}

.popup {
	position: fixed;
	z-index: 60;
	pointer-events: none;
	visibility: hidden;
}
.popup.active {
	pointer-events: all;
	visibility: visible;
}

.popup-sidebar {
	width: var(--popup-side-width);
	top: 0px;
	bottom: 0px;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: var(--popup-transition) ease 0s;
	transition-property: opacity, visibility, transform, left, right, top;
	transform: scale(1, 1);
}
.popup-sidebar.active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: scale(1, 1);
	transition-delay: var(--popup-transition-delay);
}
.popup-sidebar .popup__body {
	display: grid;
	grid-template-rows: -webkit-min-content 1fr -webkit-min-content;
	grid-template-rows: min-content 1fr min-content;
	width: 100%;
	height: 100%;
	background: var(--white);
	overflow-x: hidden;
	overflow-y: auto;
}
.popup-sidebar .popup__header {
	display: grid;
	grid-auto-flow: column;
	align-items: center;
	height: 54px;
	padding: 0 20px;
	position: relative;
}
.popup-sidebar .popup__title {
	margin: 0;
	color: var(--blue);
}
.popup-sidebar .popup__close {
	display: grid;
	align-items: center;
	justify-content: flex-end;
	width: 45px;
	height: 45px;
	padding: 0 20px 0 0;
	margin: 0;
	background: transparent;
	border: 0;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translate(0, -50%);
}
.popup-sidebar .popup__close svg {
	fill: var(--blue);
}
.popup-sidebar .popup__footer {
	display: grid;
	justify-content: center;
	text-align: center;
	margin: 30px 0 0;
	padding: 0 20px 20px;
	position: relative;
}

.popup-modal {
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	top: 0;
	bottom: 0;
}
.popup-modal .popup__dialog {
	display: grid;
	align-items: center;
	max-width: 845px;
	min-height: calc(100% - var(--popup-top-offset) - var(--popup-bottom-offset));
	margin: var(--popup-top-offset) auto var(--popup-bottom-offset);
}
.popup-modal .popup__dialog.medium {
	max-width: 730px;
}
.popup-modal .popup__dialog.small {
	max-width: 530px;
}
.popup-modal .popup__body {
	padding: 50px 20px;
	margin: 0 20px;
	background: linear-gradient(94.03deg, #3c27d7 8.44%, #3b8eff 69.43%);
	border-radius: 15px;
	position: relative;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: var(--popup-transition) ease 0s;
	transition-property: opacity, visibility, transform, left, right, top;
	transform: scale(0.9, 0.9);
}
[dir='rtl'] .popup-modal .popup__body {
	background: linear-gradient(94.03deg, #3b8eff 8.44%, #3c27d7 69.43%);
}
.popup-modal.active .popup__body {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: scale(1, 1);
	transition-delay: var(--popup-transition-delay);
}
.popup-modal .popup__title {
	font-size: 32px;
	font-weight: 500;
	line-height: 1.16;
	text-align: center;
	color: var(--white);
	margin: 0 0 5px;
}
.popup-modal .popup__subtitle {
	font-size: 18px;
	font-weight: 400;
	line-height: 1.16;
	text-align: center;
	color: var(--white);
	margin: 0 0 15px;
}
.popup-modal .popup__close {
	display: grid;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	padding: 0;
	margin: 0;
	background: var(--white);
	border: 0;
	border-radius: 50%;
	position: absolute;
	top: 20px;
	left: 20px;
}
.popup-modal .popup__close {
	left: unset;
	right: 20px;
}
.popup-modal .popup__close svg {
	width: 20px;
	height: 20px;
	fill: var(--blue);
}
.popup-modal .popup__form {
	max-width: 360px;
	margin: 0 auto;
}

.popup-animation--left {
	left: calc(-1 * var(--popup-side-width));
}
.popup-animation--left.active {
	left: 0;
}
[dir='rtl'] .popup-animation--left {
	left: unset;
	right: calc(-1 * var(--popup-side-width));
}
[dir='rtl'] .popup-animation--left.active {
	left: unset;
	right: 0;
}
.popup-animation--right {
	right: calc(-1 * var(--popup-side-width));
}
.popup-animation--right.active {
	right: 0;
}
[dir='rtl'] .popup-animation--right {
	right: unset;
	left: calc(-1 * var(--popup-side-width));
}
[dir='rtl'] .popup-animation--right.active {
	right: unset;
	left: 0;
}
.popup-animation--fade {
	left: 0;
	right: 0;
}

.popup-opened:not([data-simplebar]) {
	overflow: hidden;
}

.popup-overlay {
	background: rgba(0, 0, 0, 0.3);
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 55;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: var(--popup-transition) ease 0s;
	transition-property: opacity, visibility, transform, left, right, top;
	transform: scale(0.9, 0.9);
	transform: scale(1, 1);
}
.popup-opened .popup-overlay {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: scale(1, 1);
	transition-delay: var(--popup-transition-delay);
}