/*
Theme Name: WP Code Site Base
Theme URI: https://example.com/wp-code-site
Author: Site Owner
Description: Minimal companion theme for WP Code Site. It deliberately adds almost no frontend styling.
Version: 0.2.0
Requires at least: 6.4
Requires PHP: 8.0
License: GPLv2 or later
Text Domain: wp-code-site-base
*/

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; }
img, video, canvas, svg { max-width: 100%; height: auto; }

.wpcs-single-shell {
	width: min(100% - 32px, 860px);
	margin-inline: auto;
	padding-block: clamp(40px, 7vw, 96px);
}

.wpcs-single-post__header { margin-bottom: clamp(28px, 5vw, 52px); }
.wpcs-single-post__thumbnail { margin: 0 0 32px; }
.wpcs-single-post__thumbnail img { display: block; width: 100%; }
.wpcs-single-post__title { margin: 0; font-size: clamp(2rem, 6vw, 4rem); line-height: 1.08; overflow-wrap: anywhere; }
.wpcs-single-post__meta { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 8px; color: #646970; font-size: .9375rem; }
.wpcs-single-post__content { font-size: clamp(1rem, 1.5vw, 1.125rem); line-height: 1.75; overflow-wrap: anywhere; }
.wpcs-single-post__content > :first-child { margin-top: 0; }
.wpcs-single-post__content > :last-child { margin-bottom: 0; }
.wpcs-single-post__content pre { max-width: 100%; padding: 16px; overflow: auto; }
.wpcs-single-post__content table { width: 100%; border-collapse: collapse; }
.wpcs-single-post__content iframe { max-width: 100%; }
.wpcs-single-post__content .alignwide { width: min(1100px, calc(100vw - 32px)); max-width: none; margin-left: 50%; transform: translateX(-50%); }
.wpcs-single-post__content .alignfull { width: 100vw; max-width: none; margin-left: 50%; transform: translateX(-50%); }
.wpcs-single-post__footer { margin-top: 48px; padding-top: 20px; border-top: 1px solid #dcdcde; color: #50575e; font-size: .9375rem; }
.wpcs-single-post__terms + .wpcs-single-post__terms { margin-top: 8px; }
.wpcs-single-shell .post-navigation { width: 100%; margin-top: clamp(40px, 7vw, 72px); padding-top: 24px; border-top: 1px solid #dcdcde; }
.post-navigation .nav-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.post-navigation .nav-next { text-align: right; }
.post-navigation a { display: block; overflow-wrap: anywhere; }
.post-navigation .nav-subtitle { display: block; margin-bottom: 5px; color: #646970; font-size: .8125rem; }
.post-navigation .nav-title { font-weight: 600; }

@media (max-width: 600px) {
	.post-navigation .nav-links { grid-template-columns: 1fr; }
	.post-navigation .nav-next { text-align: left; }
}