/* General typography */
.site-header { text-align: center; }

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font_industrial);
}

body {
    font-family: var(--font_transitional);
}

@font-face {
	font-display: swap;
}

.reduced {
	color: var(--text) !important;
	text-decoration: none !important;
}

a.conversation-on-mb, a.read-more, a.reply-by-email, a.reply-on-mastodon, nav a, nav a:hover, nav a:visited, button.tinylytics_kudos {
	padding: 5px 0px 4px 0px;
	border-radius: 5px;
}

button.tinylytics_kudos, a.read-more, a.reply-by-email, a.reply-on-mastodon {
	font-family: var(--font_transitional);
    line-height: 1em;
	border-radius: 5px;
    border: 0px solid var(--link);
	text-decoration: underline 0.08em;
	font-size: 1em;
	padding: 5px 0px 4px 0px;
}

button.tinylytics_kudos:hover, a.read-more:hover, a.reply-by-email:hover, a.reply-on-mastodon:hover {
	text-decoration: none;
	padding: 5px 0px 4px 0px;
}

ul.post-tags li a {
    display: inline;
    font-size: 1em;
    border-radius: 5px;
    border: 1px solid var(--link);
    text-decoration: none;
    padding: 5px 2px 5px 2px;
}

ul.post-tags li a:hover {
    background: var(--link);
    color: var(--button-text);
	text-decoration: none;
}
nav ul li, ul.reply-buttons li {
	margin-right: 5px;
}

/* Light Mode */
:root {
	--text: #000000;
	--link: #107896;
	--link_visited: #107896;
	--accent1: #333333;
	--accent2: #666666;
	--background: #ffffff;
	--code: #e3e3e3;
	--button-text: #ffffff;
	--blockquote: #f7edd9;
	--note: #FFFF00;
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
	:root {
		--text: #f8f8f2;
		--link: #bd8201;
		--link_visited: #bd8201;
		--accent1: #f8f8f2;
		--accent2: #f8f8f2;
		--background: #282a36;
		--code: #44475a;
		--button-text: #282a36;
		--blockquote: #44475a;
		--note: #44475a;
	}
}