/* Legacy ambient styles. Moved to cascade layer so AntD our and components can override.
* Layer order is defined in Flow's "preflight" styles. 'reset' has a very low precedence, which is
* appropriate for these global tag selectors, but we should figure out how to get rid of them.
*/
@layer reset {
	body {
		background-position: top left;
		background-attachment: fixed;
		margin: 0;
		-webkit-overflow-scrolling: touch;
	}

	/* 
	* Legacy auto-spacing between controls. Doing this globally in a complex app is not ideal.
	* Removing it is also hard to do with confidence...
	*/
	button + a,
	button + button {
		margin-left: 6px;
	}

	html {
		font-family: 'PPMori', 'Helvetica Neue', 'Segoe UI', Arial, sans-serif;
		font-size: 14px;
		font-weight: 400;
		line-height: 1.25;
		color: #333;
	}

	input,
	textarea,
	keygen,
	select,
	button {
		font-family: inherit;
		font-weight: inherit;
	}

	h3 {
		color: #777;
		font-size: 14px;
		margin: 5px 0;
	}

	h3.section {
		color: #777 !important;
	}

	h4 {
		font-size: 14px;
		margin: 5px 0;
	}

	h5 {
		color: #5d5d5d;
		font-size: 14px;
		margin: 4px 0;
	}

	h5 a {
		color: #5d5d5d;
		text-decoration: none;
	}

	h5 a:hover {
		text-decoration: underline;
	}

	h3.title {
		margin: 0 !important;
		padding: 0 !important;
	}

	h3 a {
		text-decoration: none;
	}

	h3 a:hover {
		text-decoration: underline;
	}

	a strong {
		color: #6e6e71;
	}

	a.ui {
		color: #7a7a7a;
		font-size: 11px;
		text-decoration: none;
		display: inline-block;
	}

	a.ui:hover {
		text-decoration: underline;
	}

	p {
		margin: 10px 0;
	}

	pre {
		overflow-x: auto;
		padding: 10px;
		white-space: pre-wrap;
		word-wrap: break-word;
	}
}

/* 
Isolate the stacking context of the main application from elements portaled into body. 
This means z-index values within the app's root element won't conflict with z-index values
of elements outside it.
*/
#applicationHost {
	isolation: isolate;
}

@media print {
	h1 {
		display: none;
	}
	html {
		background: none !important;
		overflow: visible !important;
		position: static !important;
	}
	body {
		width: auto !important;
		overflow: visible !important;
		position: static !important;
		background: none !important;
	}
}
