/*   Open state of the dialog  */

dialog {
	height: auto;
	box-shadow: 0 3rem 1.5rem -1.2rem #000000aa;
	border: 2px solid black;
	border-radius: 5px;
	padding: 0;
	margin: auto;
	width: 90vw;
	max-width: 360px;

	@media (min-width: 900px) {
		width: 70vw;
		max-width: 440px;
	}
}

dialog[open] {
	opacity: 1;
	backdrop-filter: blur(41px);
}

::backdrop {
	background-image: linear-gradient(
		45deg,
		magenta,
		rebeccapurple,
		dodgerblue,
		green
	);
	opacity: 0.95;
}

.modal-close {
	position: absolute;
	right: 0;
	margin: 1rem;
	background: black;
	color: white;
	border: none;
	font-size: 1.3rem;
}

.modal-unsubscribe,
.modal-newsletter {
	max-height: 360px;
	overflow: hidden;
}

.modal-register,
.modal-tickets {
	overflow: hidden;
}

dialog#modal-dialog {
	overflow: hidden;
}

dialog.modal-register,
dialog.modal-venue,
dialog.modal-tickets {
	height: 90vh;
	max-height: unset;
}