/* ===== Caret / line-measurement stability =====
   EasyMDE's stylesheet sets `.CodeMirror { font: inherit }`, which lets the
   host page's responsive / web-font line-height leak into CodeMirror's line
   measurement. When that desyncs, the caret is drawn the full height of a
   wrapped paragraph and the editor scrolls past it (the caret disappears
   while lines keep moving). Pinning an explicit, unitless line-height makes
   every line — wrapped or not — measure identically. */
.EasyMDEContainer .CodeMirror,
.EasyMDEContainer .CodeMirror pre.CodeMirror-line,
.EasyMDEContainer .CodeMirror pre.CodeMirror-line-like {
    line-height: 1.6;
}

/* Heading lines use `calc(rem + vw)` font sizes that balloon on wide
   viewports (and with a large host root font-size), producing an oversized
   caret on `#` / `##` / `###` lines. Cap them to viewport-independent sizes
   relative to the editor's own font. */
.EasyMDEContainer .cm-s-easymde .cm-header-1 { font-size: 1.6em; }
.EasyMDEContainer .cm-s-easymde .cm-header-2 { font-size: 1.4em; }
.EasyMDEContainer .cm-s-easymde .cm-header-3 { font-size: 1.25em; }
.EasyMDEContainer .cm-s-easymde .cm-header-4 { font-size: 1.1em; }

/* ===== Caret height on wrapped lines =====
   CodeMirror wraps every line's text in <span>s and calls getClientRects()
   on them to detect where wrapped rows break — it relies on an inline span
   returning one rect per visual row. A host page that ships a global
   `span { display: inline-block }` rule (e.g. Bootstrap-based news/blog
   themes) breaks that: an inline-block span returns a single merged box, so
   CodeMirror measures every wrapped line as one tall row. The caret is then
   drawn the full height of the wrapped paragraph and the internal scroll
   math desyncs (the caret slides out of view while lines keep scrolling).
   Pinning the line spans back to `display: inline` restores correct per-row
   measurement. The selector is specific enough to win over a bare
   `span { ... }` host rule without !important. */
.EasyMDEContainer .CodeMirror pre.CodeMirror-line span,
.EasyMDEContainer .CodeMirror pre.CodeMirror-line-like span {
    display: inline;
}

/* ===== Bootstrap Icons in EasyMDE toolbar ===== */
.editor-toolbar button.bi::before {
	font-family: "bootstrap-icons" !important;
	font-style: normal;
	font-weight: normal;
	font-size: 1rem;
	line-height: 1;
	vertical-align: middle;
}

.me-code.me-alert {
	white-space: break-spaces;
}

.me-code.note {
	white-space: break-spaces;
}

code.tip {
	white-space: break-spaces;
}

.me-code.warn {
	white-space: break-spaces;
}

.me-alert {
	display: block;
	position: relative;
	word-wrap: break-word;
	word-break: break-word;
	padding: .75rem 1.25rem !important;
	margin-bottom: 1rem !important;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 1rem;
}

	.me-alert > * {
		max-width: 100%
	}

	.me-alert > :first-child {
		margin-top: 0
	}

	.me-alert > :last-child {
		margin-bottom: 0
	}

	.me-alert:before {
		content: unset !important
	}

	.me-alert + .me-alert {
		margin-top: -.25rem !important
	}

	.me-alert p {
		margin-top: .5rem;
		margin-bottom: .5rem
	}

	.me-alert .title {
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		font-weight: 600;
		margin: 0
	}

.me-icon {
	display: inline-block;
	width: 16px;
	height: 16px;
	background-repeat: no-repeat;
	margin-right: .5rem
}

.me-alert.callout {
	border: 1px solid #eee;
	border-left-width: .25rem;
	border-radius: .25rem;
	background: var(--background)
}

	.me-alert.callout.note {
		border-left-color: #17a2b8 !important;
		white-space: pre-wrap;
		;
	}

		.me-alert.callout.note .title {
			color: #17a2b8
		}

		.me-alert.callout.note .icon-note {
			background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' fill='%2317a2b8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M8 16A8 8 0 108 0a8 8 0 000 16zm.93-9.412l-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM8 5.5a1 1 0 100-2 1 1 0 000 2z'/%3E%3C/svg%3E")
		}

	.me-alert.callout.tip {
		border-left-color: #28a745 !important;
		white-space: pre-wrap;
	}

		.me-alert.callout.tip .title {
			color: #28a745
		}

		.me-alert.callout.tip .icon-tip {
			background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 352 512' fill='%2328a745' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M96.06 454.35c.01 6.29 1.87 12.45 5.36 17.69l17.09 25.69a31.99 31.99 0 0026.64 14.28h61.71a31.99 31.99 0 0026.64-14.28l17.09-25.69a31.989 31.989 0 005.36-17.69l.04-38.35H96.01l.05 38.35zM0 176c0 44.37 16.45 84.85 43.56 115.78 16.52 18.85 42.36 58.23 52.21 91.45.04.26.07.52.11.78h160.24c.04-.26.07-.51.11-.78 9.85-33.22 35.69-72.6 52.21-91.45C335.55 260.85 352 220.37 352 176 352 78.61 272.91-.3 175.45 0 73.44.31 0 82.97 0 176zm176-80c-44.11 0-80 35.89-80 80 0 8.84-7.16 16-16 16s-16-7.16-16-16c0-61.76 50.24-112 112-112 8.84 0 16 7.16 16 16s-7.16 16-16 16z'/%3E%3C/svg%3E")
		}

	.me-alert.callout.warning {
		border-left-color: #f0ad4e !important;
		white-space: pre-wrap;
	}

		.me-alert.callout.warning .title {
			color: #f0ad4e
		}

		.me-alert.callout.warning .icon-warning {
			background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 17 16' fill='%23f0ad4e' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M8.982 1.566a1.13 1.13 0 00-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5a.905.905 0 00-.9.995l.35 3.507a.552.552 0 001.1 0l.35-3.507A.905.905 0 008 5zm.002 6a1 1 0 100 2 1 1 0 000-2z'/%3E%3C/svg%3E")
		}

	.me-alert.callout.attention {
		border-left-color: #dc3545 !important;
		white-space: pre-wrap;
	}

		.me-alert.callout.attention .title {
			color: #dc3545
		}

		.me-alert.callout.attention .icon-attention {
			background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' fill='%23dc3545' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M8 15A7 7 0 108 1a7 7 0 000 14zm0 1A8 8 0 108 0a8 8 0 000 16z'/%3E%3Cpath fill-rule='evenodd' d='M11.354 4.646a.5.5 0 010 .708l-6 6a.5.5 0 01-.708-.708l6-6a.5.5 0 01.708 0z'/%3E%3C/svg%3E")
		}

.me-alert.flat {
	border-radius: .125rem;
	color: #383d41;
	background-color: #e2e3e5;
	border: 1px solid #d6d8db
}

	.me-alert.flat.note {
		color: #02587f;
		background-color: #cdeefd;
		border-color: #b4e6fc
	}

		.me-alert.flat.note .title {
			color: #01354d
		}

		.me-alert.flat.note .icon-note {
			background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' fill='%2301354d' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M8 16A8 8 0 108 0a8 8 0 000 16zm.93-9.412l-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM8 5.5a1 1 0 100-2 1 1 0 000 2z'/%3E%3C/svg%3E")
		}

	.me-alert.flat.tip {
		color: #285b2a;
		background-color: #dbefdc;
		border-color: #c9e7cb
	}

		.me-alert.flat.tip .title {
			color: #18381a
		}

		.me-alert.flat.tip .icon-tip {
			background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 352 512' fill='%2318381a' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M96.06 454.35c.01 6.29 1.87 12.45 5.36 17.69l17.09 25.69a31.99 31.99 0 0026.64 14.28h61.71a31.99 31.99 0 0026.64-14.28l17.09-25.69a31.989 31.989 0 005.36-17.69l.04-38.35H96.01l.05 38.35zM0 176c0 44.37 16.45 84.85 43.56 115.78 16.52 18.85 42.36 58.23 52.21 91.45.04.26.07.52.11.78h160.24c.04-.26.07-.51.11-.78 9.85-33.22 35.69-72.6 52.21-91.45C335.55 260.85 352 220.37 352 176 352 78.61 272.91-.3 175.45 0 73.44.31 0 82.97 0 176zm176-80c-44.11 0-80 35.89-80 80 0 8.84-7.16 16-16 16s-16-7.16-16-16c0-61.76 50.24-112 112-112 8.84 0 16 7.16 16 16s-7.16 16-16 16z'/%3E%3C/svg%3E")
		}

	.me-alert.flat.warning {
		color: #852d12;
		background-color: #ffddd3;
		border-color: #ffc9ba
	}

		.me-alert.flat.warning .title {
			color: #581e0c
		}

		.me-alert.flat.warning .icon-warning {
			background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 17 16' fill='%23581e0c' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M8.982 1.566a1.13 1.13 0 00-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5a.905.905 0 00-.9.995l.35 3.507a.552.552 0 001.1 0l.35-3.507A.905.905 0 008 5zm.002 6a1 1 0 100 2 1 1 0 000-2z'/%3E%3C/svg%3E")
		}

	.me-alert.flat.attention {
		color: #7f231c;
		background-color: #fdd9d7;
		border-color: #fcc2bf
	}

		.me-alert.flat.attention .title {
			color: #551713
		}

		.me-alert.flat.attention .icon-attention {
			background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' fill='%23551713' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M8 15A7 7 0 108 1a7 7 0 000 14zm0 1A8 8 0 108 0a8 8 0 000 16z'/%3E%3Cpath fill-rule='evenodd' d='M11.354 4.646a.5.5 0 010 .708l-6 6a.5.5 0 01-.708-.708l6-6a.5.5 0 01.708 0z'/%3E%3C/svg%3E")
		}

.video-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
}

	.video-container iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	.video-container video {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}