.popup {
position: fixed;
inset: 0;
z-index: 9999;
display: flex;
align-items: center;
justify-content: center;
padding: 1.5rem;
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity 500ms ease, visibility 500ms ease;
}

.popup.is-active {
opacity: 1;
visibility: visible;
pointer-events: auto;
}

.popup[closed] {
display: none;
}

	.popup__overlay {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(var(--overlay-rgb, 0,0,0), 0.8);
	}

	.popup__dialog {
	position: relative;
	z-index: 1;	
	width: min(100%, 1000px);
	max-height: calc(100vh - 3rem);
	overflow-y: auto;
	background: #fff;
	color: #1f2937;
	box-shadow: 0 24px 64px rgba(0, 0, 0, 0.3);
	transform: translateY(-16px);
	transition: transform 0.2s ease;
	}	

	.popup.is-active .popup__dialog {
	transform: translateY(0);
	}	

		.popup__button.button--close {
		position: fixed;
		top: 8px;
		right: 8px;
		background: transparent;
		color: inherit;
		cursor: pointer;
		z-index: 2;
		border:none;
		}

			.popup__button.button--close:before{
			content:"\2715";
			}

		.button--close.light{
		}

			.popup__button-label{
			display: none;
			}

		.popup__content {
		width: 100%;
		}

@media (max-width: 640px) {
	.popup {
	}

	.popup__dialog {
	max-height: calc(100vh - 2rem);
	}
}
