/* Styles specific to the blog (post content + listing). Keeps the site's
   dark, retro palette but makes long-form text comfortable to read. */

div.text.post {
	padding: 10px;
	line-height: 1.6;
}

div.text.post h3 {
	color: #ddd;
	font-family: "Roboto Slab";
	margin: 24px 0 8px 0;
}

div.text.post p {
	margin: 12px 0;
}

div.text.post ul,
div.text.post ol {
	margin: 12px 0;
	padding-left: 24px;
}

div.text.post li {
	margin: 6px 0;
}

div.text.post img {
	max-width: 100%;
	height: auto;
	border-radius: var(--border-radius);
}

div.text.post pre {
	background: #000;
	color: #ccc;
	padding: 12px;
	border-radius: var(--border-radius);
	overflow-x: auto;
}

div.text.post code {
	background: #000;
	color: #f73;
	padding: 1px 4px;
	border-radius: 4px;
}

div.text.post pre code {
	color: #ccc;
	padding: 0;
}

div.text.post blockquote {
	margin: 12px 0;
	padding: 4px 14px;
	border-left: 4px solid #d70;
	color: #bbb;
}

p.post-meta {
	color: #999;
	font-size: 0.85em;
	margin-top: 0;
}

.post-tags {
	margin: 20px 0;
}

.tag {
	display: inline-block;
	padding: 1px 8px;
	margin-right: 6px;
	border: 1px solid #d70;
	border-radius: var(--border-radius);
	color: #d70;
	font-size: 0.8em;
}

/* Blog index listing */
ul.post-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

li.post-list-item {
	padding: 12px 0;
	border-bottom: 1px solid #333;
}

a.post-list-title {
	font-family: "Roboto Slab";
	font-size: 1.15em;
}

span.post-list-date {
	color: #999;
	font-size: 0.85em;
	margin-left: 10px;
}

p.post-list-desc {
	color: #bbb;
	margin: 6px 0 0 0;
}