:root {
	--content-width: 70rem;
	--in-page-navbar-width: 25%;
	--navbar-font-size: 1.2rem;
	--para-margin-top: 1em;
}

/* page layout */

html {
	height: 100%;
}

body {
	height: 100%;
	display: flex;
	justify-content: center;
}

#body-wrapper {
	height: 100%;
	display: flex;
	flex-flow: row nowrap;
}

nav.ltx_page_navbar {
	width: 25%;
	font-size: var(--navbar-font-size);
	padding: 1rem 2rem;
	display: flex;
	flex-flow: column nowrap;
	overflow-y: scroll;
	align-items: start;
}

nav.ltx_page_navbar nav {
	width: 100%;
	margin-top: 2rem;
	position: relative;
}

nav.ltx_page_navbar li {
	margin: 1rem 0;
}

nav.ltx_page_navbar nav::before {
	content: "";
	position: absolute;
	background: var(--colour-fg);
	width: 100%;
	height: 2px;
	top: -1rem;
}

main {
	flex: 1 0 0;
	overflow-y: scroll;
	scroll-behavior: smooth;
	display: flex;
	flex-flow: row nowrap;
}

.ltx_page_main {
	width: calc(100% - var(--in-page-navbar-width));
	padding: 1rem 2rem;
	font-size: 1.3rem;
	max-width: var(--content-width);
}

.ltx_page_main h1, .ltx_page_main h2 {
	margin: 1rem 0;
	position: relative;
}

.ltx_page_main h1::after, .ltx_page_main h2::after {
	content: "";
	position: absolute;
	background: var(--colour-fg);
	opacity: 20%;
	width: 100%;
	height: 1px;
	left: 0;
	bottom: -0.5rem;
}

nav.ltx_in_page_navbar {
	width: var(--in-page-navbar-width);
	height: 100%;
	font-size: var(--navbar-font-size);
	padding: 1rem 2rem;
	display: flex;
	flex-flow: column nowrap;
	position: sticky;
	top: 0;
}

nav.ltx_in_page_navbar .ltx_ref_title:has(h2) {
	position: relative;
}

nav.ltx_in_page_navbar .ltx_ref_title:has(h2)::after {
	content: "";
	position: absolute;
	background: var(--colour-fg);
	width: 100%;
	height: 2px;
	bottom: -1rem;
}

nav.ltx_in_page_navbar nav {
	overflow-y: scroll;
	overflow-x: hidden;
	margin: 1.5rem 0;
}

nav.ltx_in_page_navbar li {
	margin: 1rem 0;
}

nav.ltx_in_page_navbar footer {
	margin-top: auto;
	font-size: 1rem;
	position: relative;
}

nav.ltx_in_page_navbar:has(.ltx_tocentry) footer::before {
	content: "";
	position: absolute;
	background: var(--colour-fg);
	width: 100%;
	height: 2px;
	top: -1rem;
}

@media screen and (max-width: 1050px) {
	nav.ltx_in_page_navbar {
		display: none;
	}
}

@media screen and (max-width: 800px) {
	nav.ltx_page_navbar {
		display: none;
	}
}

.page-nav-focus {
	font-weight: 900;
	text-decoration: underline;
}

.section-anchor {
	display: grid;
	grid-template-columns: min-content auto;
	position: relative;
}

.section-anchor a {
	grid-row-start: 1;
	align-self: start;
	line-height: 1;
	transform: translateX(-50%) translateY(100%);
	opacity: 0.5;
}

.section-anchor a:hover {
	text-decoration: underline;
	text-underline-offset: 0.25em;
	opacity: 1;
}

.section-anchor a:focus {
	outline: 2px solid currentColor;
	outline-offset: 2px;
	opacity: 1;
}

.section-anchor-hidden {
	width: 0;
	height: 0;
	overflow: hidden;
	position: absolute;
}

li a:hover,  li a:focus {
	text-decoration: underline;
	transform: translateX(0.5rem);
}

@media screen and (prefers-reduced-motion: no-preference) {
	li a {
		transition: transform 500ms var(--transition-exp);
	}
}

.ltx_tocentry .ltx_toclist, .ltx_tocentry + .ltx_toclist_subsection {
	margin-left: 1em;
}

.ltx_ref_self > span {
	text-decoration: underline;
}

/* LaTeXML output */

.ltx_appendix, .ltx_part, .ltx_chapter, .ltx_section, .ltx_subsection { margin-top: 1.5em; }
.ltx_para                                                             { margin-top: var(--para-margin-top); width: 100%;}

.ltx_title_part, .ltx_title_appendix, .ltx_title_bibliography, .ltx_title_chapter { font-size: 250%; font-weight: bold; margin-bottom: 1em; }
.ltx_title_section                                                                { font-size: 140%; font-weight: bold; margin-bottom: 1em; }
.ltx_title_subsection                                                             { font-size: 120%; font-weight: bold; margin-bottom: 1em; }

.ltx_figure, .ltx_table { text-align: center; margin: 0.5em; display: flex; flex-direction: column; align-items: center; }
.ltx_figure .ltx_caption, .ltx_table .ltx_caption { text-align: justify; }

/* first p in para gets indented */
.ltx_para > .ltx_p:first-child, section.ltx_pruned_first > .ltx_title + .ltx_para > .ltx_p, section.ltx_indent_first > .ltx_title + .ltx_para > .ltx_p { text-indent:1em; }
/* except the initial in a section */
section > .ltx_title +.ltx_para > .ltx_p, section > .ltx_title +.ltx_date +.ltx_para > .ltx_p { text-indent: 0em; }

/* theorem environment styles */
.ltx_theorem { margin: 1em 0; padding: 0.5em 1em; background: var(--colour-light-bg); }
.ltx_theorem .ltx_title { color: var(--colour-accent); } /* TODO: this probably won't stay forever, as we would like to have different colour schemes for each set of notes */
.ltx_theorem .ltx_title, .ltx_proof .ltx_title { font-size: 110%; margin-bottom: 0.5em; font-weight: bold; }

.ltx_theorem_theorem, .ltx_theorem_corollary, .ltx_theorem_lemma {
	border-left: 3px var(--colour-accent) solid;
	margin-bottom: 0;
}

.ltx_theorem_definition {
	border: 3px var(--colour-accent) solid;
}

.ltx_proof {
	border-left: 3px var(--colour-accent) solid;
	padding: 0.5em 1em;
}

/* set a light background for diagrams, this is a temporary fix */
/* TODO: implement a proper dark mode colour scheme for diagrams */
svg.ltx_picture {
	box-sizing: content-box;
	border: 1em var(--colour-fg) solid;
	background: var(--colour-fg);
	color: var(--colour-bg);
}

.ltx_page_footer { font-size: 0.8em; border-top: 1px solid; margin-top: 1em; }
.ltx_page_footer *[rel~="prev"] { float: left; }
.ltx_page_footer *[rel~="next"] { float: right; }

.ltx_page_logo     { font-size: 90%; margin-top: 5px; clear: both; float: right; }
.ltx_page_logo img { vertical-align: -3px; display: inline; }
.ltx_page_logo .ltx_LaTeXML_logo { font-size: 110%; }

.ltx_runin { display: inline; }
.ltx_runin:after { content: " "; }
.ltx_runin + .ltx_para, .ltx_runin + .ltx_para p:first-child, .ltx_runin + p:first-child { display: inline; }

.ltx_align_left     { text-align: left; }
.ltx_align_right    { text-align: right; }
.ltx_align_center   { text-align: center; }
.ltx_align_justify  { text-align: justify; }
.ltx_align_top      { vertical-align: top; }
.ltx_align_bottom   { vertical-align: bottom; }
.ltx_align_middle   { vertical-align: middle; }
.ltx_align_baseline { vertical-align: baseline; }

.ltx_equation_wrapper { overflow-x: scroll; }
.ltx_equation, .ltx_equationgroup { margin: 1em 0; }
.ltx_eqn_table { display: table; width: 100%; border-collapse: collapse; }

.ltx_eqn_center_padleft, .ltx_eqn_center_padright { width: 50%; min-width: 2em; }
.ltx_eqn_left_padleft, .ltx_eqn_right_padright { width: 100%; min-width: 2em; }

.ltx_itemize, .ltx_enumerate { margin-left: 1em; padding-left: 0; }
.ltx_itemize .ltx_item, .ltx_enumerate .ltx_item { 
	display: grid;
	grid-template-columns: max-content 1fr;
}

.ltx_item .ltx_para { 
	overflow: hidden; /* to counter the width: 100% that is applied to all other .ltx_para elements */
	grid-column-start: 2; 
}

.ltx_item .ltx_theorem, .ltx_item .ltx_proof {
	 grid-column: 1 / 3;
}

.ltx_item > .ltx_tag { flex-shrink: 0; margin-top: var(--para-margin-top); margin-right: 0.5em; } /* TODO: would like to use align-content: center; here but it only works when the item the tag is referring to is only one line */
.ltx_item > .ltx_para > .ltx_p:first-child { text-indent: 0em; }

/* references */
a.ltx_ref:has(> .ltx_ref_tag):hover, a.ltx_ref:has(> .ltx_ref_tag):focus {
	transform: none;
	text-decoration: underline;
}

.ltx_tabular .ltx_tr td:first-child::after,
.ltx_tabular .ltx_tr th:first-child::after {
   content: "";
   display: inline-block;
   vertical-align: top;
   min-height: 1em;
}

.ltx_note_content {
	display: none;
	max-width: 70%;
	font-size: 90%;
	left: 15%;
	text-align: left;
	background-color: var(--colour-fg);
	color: var(--colour-bg);
	padding: 0.5em 1em 0.5em 1.5em;
}
.ltx_note_mark { color: var(--colour-accent); }
.ltx_note_type { font-weight: bold; }
.ltx_note { display: inline-block; text-indent: 0; }
.ltx_note_content .ltx_note_mark { position: absolute; left: 0.2em; top: -0.1em; }
.ltx_note:hover .ltx_note_content, .ltx_note .ltx_note_content:hover { display: block; position: absolute; z-index: 10; }

cite { font-style: normal; }

.ltx_font_serif           { font-family: serif; }
.ltx_font_sansserif       { font-family: sans-serif; }
.ltx_font_typewriter      { font-family: monospace; }
.ltx_font_bold            { font-weight: bold; }
.ltx_font_medium          { font-weight: normal; }
.ltx_font_italic          { font-style: italic; font-variant:normal; }
.ltx_font_upright         { font-style: normal; font-variant:normal; }
.ltx_font_slanted         { font-style: oblique; font-variant:normal; }
.ltx_font_smallcaps       { font-variant: small-caps; font-style:normal; }
.ltx_font_oldstyle        { font-variant-numeric: oldstyle-nums; }
.ltx_font_mathcaligraphic { font-family: "Lucida Calligraphy", "Zapf Chancery","URW Chancery L"; }

.ltx_mathvariant_italic                 { font-style: italic; }
.ltx_mathvariant_bold                   { font-weight: bold; }
.ltx_mathvariant_bold-italic            { font-weight: bold; font-style: italic; }
.ltx_mathvariant_sans-serif             { font-family: sans-serif; }
.ltx_mathvariant-bold-sans-serif        { font-family: sans-serif; font-weight: bold; }
.ltx_mathvariant-sans-serif-italic      { font-family: sans-serif; font-style: italic; }
.ltx_mathvariant-bold-sans-serif-italic { font-family: sans-serif; font-style: italic; font-weight: bold; }
.ltx_mathvariant_monospace              { font-family: monospace; }
.ltx_mathvariant_double-struck          { font-weight: bold; }
.ltx_mathvariant_script                 { font-family: "Lucida Calligraphy", "Zapf Chancery", "URW Chancery L", cursive; }
.ltx_mathvariant_bold-script            { font-family: "Lucida Calligraphy", "Zapf Chancery", "URW Chancery L", cursive; font-weight: bold; }
.ltx_mathvariant_bold-fraktur           { font-weight: bold; }