:root {
	--highlight-colour: #1F9094;
}

html {
	color-scheme: light dark;
}

body {
	color: CanvasText;
	background: Canvas;
	font-size: medium;
	text-indent: 0%;
	padding-left: 1em;
	padding-right: 1em;
}

h1 {
	color: light-dark(gray, darkgray);
	font-variant: normal;
	text-align: center;
}

h2 {
	margin-top: 1.5em;
	border-bottom: 1px solid grey;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--highlight-colour)
}

h3 {
	border-bottom: 1px solid grey;
	text-transform: uppercase;
}

p {
	margin: 0 0 0 1.2em;
	color: light-dark(gray, lightgray);
}

p#updated {
	font-size: small;
	float: right;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	color: grey;
}

sup {
	font-size: xx-small;
}

.header {
	margin: 0;
}

.header span {
	float: right;
}

button {
  background-color: light-dark(white, black);
  color: var(--highlight-colour);
  font-size: 1.0em;
  padding: 0.2em 0.5em;
  border: 1px solid var(--highlight-colour);
  border-radius: 0.4em;
}

button.selected {
	background-color: var(--highlight-colour);
	color: white;
}

div#contents {
	text-align: center;
	margin-left: 0;
	font-size: small;
}

p.badge::after {
	margin-left: 0.6em;
	position: relative;
	top: -0.3em;
	text-align: center;
	text-transform: uppercase;
	border-radius: 5px;
	font-size: xx-small;
	font-weight: bold;
	padding: 0.3em 0.5em 0.2em 0.5em;
	color: white;
	background-color: red;
	white-space: nowrap;
}

p.new::after {
	content: "New";
}

p.pending::after {
	content: "Pending";
	background-color: orange;
}

p.preprint::after {
	content: "Preprint";
	background-color: darkgoldenrod;
}

p.mine::after {
	content: "Co-Author";
	background-color:dodgerblue;
}

ul {
	margin-top: 0.2em;
    padding-left: 1.5em;
	color: gray;
	font-size: small;
}

ul li {
	display: inline;
}

/* Matches li adjacent to another li, but only if valid href */
/* https://www.w3.org/TR/selectors-4/#has-pseudo */

li+li:not(:has(a[href=""]))::before {
	content: "| ";
}

li.closed::after {
	content: "🔒";
	margin-left: 0.2em;
}

a:link {
	text-decoration: none;
	font-weight: bolder;
	color: var(--highlight-colour);
}

a:visited {
	color: var(--highlight-colour);
}

a[href=""] {
	display: none;
}

summary {
	display: inline;
	list-style: none;
	margin-left: 1.5em;
	cursor: pointer;
	background-color: grey;
	color: beige;
	border-radius: 0.5em;
	padding: 0.3em 0.6em 0.2em 0.6em;
	font-size: small;
}

summary::-webkit-details-marker {
	display: none;
}

details[open] p {
	margin-top: 0.5em;
}

div:not(.contents) details[open] summary::after {
	content: "Less";
}

div:not(.contents) details:not([open]) summary::after {
	content: "More (" attr(count) ")";
}

@media only screen and (max-width: 1000px) {
	button {
		font-size: 1.2em;
	}
}