@import url("/assets/fonts/IosevkaAile.css");
@import url("/assets/fonts/IosevkaFixed.css");

:root {
	color-scheme: light dark;

	--col_bg0: #1b1a19;
	--col_bg1: #262523;
	--col_fg0: #ebdbb2;

	@media (prefers-color-scheme: light) {
		--col_bg0: #fbf1c7;
		--col_bg1: #ebdbb2;
		--col_fg0: #3c3836; 
	}

	--col_red: #cc241d;
	--col_bri_red: #fb4934;
	--col_green: #98971a;
	--col_yellow: #d79921;
	--col_blue: #458588;
	--col_bri_blue: #83a598;
	--col_purple: #b16286;
}

body {
	margin: auto;
	max-width: 640px;
	padding: 24px 10px;
	font-family: 'Iosevka Aile Web', 'sans-serif';
	background-color: var(--col_bg0);
	color: var(--col_fg0);
}

a {
	color: var(--col_bri_blue);
}

ul {
	list-style-type: '* ';
	/* workaround padding surrounding text since outside is used */
}

img {
	max-width: 100%;
	height: auto;
}

pre {
	/* ensure codeblock wraps */
	white-space: pre-wrap;
	background-color: var(--col_bg1);
	padding: 10px;
	font-family: 'Iosevka Fixed', 'monospace';
} 

/* navigation header */
nav {
	padding: 0.6ex 0;
}
nav a {
	color: var(--col_fg0);
	/* text-decoration: none; */
	padding: 0.6ex 1ex;
}
nav .visiting {
	background-color: var(--col_bri_red);
}
nav .blog-post {
	background-color: var(--col_red);
}

/* page-specific */
.blog-posts a {
	font-style: italic;
}

.photos {
	column-count: 3;
	column-gap: 5px;
}

.projects #wayland a { color: var(--col_yellow); }
.projects #tools a { color: var(--col_green); }
.projects #libs a { color: var(--col_red); }

/* 88x31 badges */
/*
footer {
	display: grid;
	grid-template-columns: repeat(auto-fill, 88px);
	gap: 4px;
}

.badge {
	float: left;
	padding: unset;
	margin: unset;
	border: unset;
}
*/