/* hitler.rip
 * stylesheet for my website
 * © 2025 hitler.rip <git@hitler.rip>
 * licensed under AGPLv3-or-later; see licenses/code.md for more information
 */

body {
	background-color: #1e1e2e;
	color: #cdd6f4;
	accent-color: #f38ba8;
	font-family: Inter, "Liberation Sans", Arial, Helvetica, sans-serif;
	font-variant-numeric: slashed-zero;
	font-weight: 400;
}

header nav {
	background-color: #f38ba8;
	color: #1e1e2e;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding: 10px 15px 10px 15px;
	border: 1px solid #f38ba8;
	border-radius: 16px;
	align-items: center;
	@media (width < 48rem) {
		flex-direction: column;
	}
}
header .left a {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: start;
	color: #1e1e2e;
	text-decoration: none;
}
header .left img {
	display: block;
	height: 52px;
	width: 52px;
	margin: 0 10px;
	@media (width < 48rem) {
		margin-left: 0;
	}
}
header .left h1 {
	display: block;
	color: #1e1e2e;
}
header .right {
	color: #1e1e2e;
	margin: 0 10px;
	text-align: center;
}
header .right a {
	color: #1e1e2e;
}

footer {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	color: #6c7086;
	margin: 15px 0 15px 0;
	@media (width < 48rem) {
		margin: 15px 25px 15px 25px;
	}
}
footer hr {
	color: #6c7086;
	width: 50%;
	max-width: 50%;
	@media (width < 48rem) {
		width: 90%;
		max-width: 90%;
	}
	margin-bottom: 15px;
}
footer a {
	color: #6c7086;
}

main {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	overflow-wrap: anywhere;
}
main > div {
	width: 100%;
	margin: 0 25px 0 25px;
	@media (width >= 48rem) {
		max-width: 700px;
	}
}

h1, h1 > a,
h2, h2 > a,
h3, h3 > a,
h4, h4 > a,
h5, h5 > a,
h6, h6 > a,
hr {
	color: #f38ba8;
	font-weight: bold;
}

p {
	text-align: justify;
}

a {
	color: #f38ba8;
}

i, em {
	color: #a6adc8;
}
del, s {
	color: #f38ba8;
	text-decoration-color: #f38ba8;
	text-decoration-thickness: 3px;
}
code {
	font-family: monospace;
	background-color: #45475a;
	border-radius: 2px;
	padding: 0.5px 1px 0.5px 1px;
}

blockquote {
	text-align: left;
	background: linear-gradient(90deg, #313244, #1e1e2e);
	border-radius: 2px;
	padding: 5px 5px 5px 10px;
	margin: 1px 0 5px 0;
	border-left: 4px solid #89b4fa;
}
pre {
	font-family: monospace;
	text-align: left;
	overflow: scroll;
	background-color: #45475a;
	border-radius: 2px;
	padding: 5px 5px 5px 10px;
	margin: 1px 0 5px 0;
	border-left: 4px solid #fab387;
	/* syntax highlighting */
}

ul,ol {
	list-style-position: inside;
	text-align: left;
}
ul {
	list-style-type: disc;
}
ol {
	list-style-type: decimal;
}
ul > ul {
	margin-left: 5px;
	list-style-type: circle;
}
ul > ol {
	margin-left: 5px;
	list-style-type: upper-roman;
}
ol > ol {
	margin-left: 5px;
	list-style-type: lower-alpha;
}
ol > ul {
	margin-left: 5px;
	list-style-type: square;
}

table {
	table-layout: auto;
	width: 100%;
	border-collapse: collapse;
	border: 1px solid #f38ba8;
	margin-bottom: 5px;
}
thead {
	color: #f38ba8;
}
td, th {
	padding: 3px;
	border: 1px solid #f38ba8;
	white-space: wrap;
}
td:first-child, th:first-child {
	width: fit-content;
	white-space: nowrap;
}
tfoot td, tfoot th {
	font-size: small;
	color: #f2cdcd;
}

img {
	max-width: 45%;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

article {
	border: 2px solid #45475a;
	padding: 10px;
	margin-bottom: 10px;
}
article p {
	text-align: center;
}