/* Modal topbar */
.modlay-modal-topbar {
	z-index: 2; /* Above modal content */
	top: 0;
	right: 0;
	left: 0;
	display: flex;
	align-items: center;
}
@media ( max-width: 575.98px ) {
	.modlay-modal-topbar .navbar-brand {
		padding-top: 0;
		padding-bottom: 0;
		height: auto;
	}
}
@media ( min-width: 576px ) {
	.modlay-modal-topbar {
		position: fixed;
		height: var( --topbars-height );
	}
}

/* Modal content */
.modlay-modal .modal-dialog {
	z-index: 1; /* Below modal topbar */
}

/* Fullscreen */
@media ( min-width: 576px ) {
	.modlay-modal .modal-fullscreen {
		padding-top: var( --topbars-height );
	}
}

/* Non-fullscreen */
/* Replace block with flex for vertical centering with a variable topbar */
@media ( max-width: 575.98px ) {
	.modlay-modal {
		display: flex !important;
		flex-direction: column;
	}
	.modlay-modal:not( .show ) {
		display: none !important; /* Overwrite flex */
	}
	.modlay-modal .modal-dialog-centered {
		flex-grow: 1;
		min-height: auto;
	}
}
@media ( min-width: 576px ) {
	.modlay-modal .modal-dialog-centered:not( .modal-fullscreen ) {
		/* Bootstrap defaults for this breakpoint: 3.5rem, 1.75rem */
		min-height: calc( 100% - 3.5rem - var( --topbars-height ) );
		margin-top: calc( var( --topbars-height ) + 1.75rem );
	}
}

/* App introduction wizard */
/* Nav buttons */
.owcb-block--saas-app-introduction-block .-hidden {
	display: none;
}
.owcb-block--saas-app-introduction-block [data-bs-slide="next"].-hidden ~ [data-bs-slide="prev"] {
	display: none !important;
}
.owcb-block--saas-app-introduction-block [data-bs-slide="next"].-hidden ~ .-restart,
.owcb-block--saas-app-introduction-block [data-bs-slide="next"].-hidden ~ .-finalize {
	display: block !important;
}