/*
 * Global OpenES modal alignment.
 * Keeps Bootstrap modal widths, but centers every dialog in the viewport.
 */

body .modal.show {
	padding-left: 0 !important;
	padding-right: 0 !important;
	z-index: 20000 !important;
}

body .modal-backdrop {
	z-index: 19990 !important;
}

body .modal.show .modal-dialog {
	display: flex !important;
	align-items: center !important;
	min-height: calc(100vh - 2rem);
	margin: 1rem auto !important;
	width: calc(100vw - 2rem) !important;
	width: min(100%, calc(100vw - 2rem)) !important;
}

body .modal.show .modal-dialog > .modal-content {
	width: 100%;
	max-height: calc(100vh - 2rem);
}

body .modal.show .modal-dialog > .modal-content > .card {
	display: flex;
	flex-direction: column;
	min-height: 0;
}

body .modal.show .modal-dialog > .modal-content .modal-body {
	min-height: 0;
	overflow-y: auto;
}

@supports (height: 100dvh) {
	body .modal.show .modal-dialog {
		min-height: calc(100dvh - 2rem);
	}

	body .modal.show .modal-dialog > .modal-content {
		max-height: calc(100dvh - 2rem);
	}
}

@media (max-width: 575.98px) {
	body .modal.show .modal-dialog {
		min-height: calc(100vh - 1rem);
		margin: .5rem auto !important;
		width: calc(100vw - 1rem) !important;
		width: min(100%, calc(100vw - 1rem)) !important;
	}

	body .modal.show .modal-dialog > .modal-content {
		max-height: calc(100vh - 1rem);
	}

	@supports (height: 100dvh) {
		body .modal.show .modal-dialog {
			min-height: calc(100dvh - 1rem);
		}

		body .modal.show .modal-dialog > .modal-content {
			max-height: calc(100dvh - 1rem);
		}
	}
}
