/*
Theme Name: Bleh
Author: Bleh
Description: A lean editorial WordPress theme for Bleh Shorts, Articles and Guides.
Version: 0.1.7
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bleh
Tags: blog, news, one-column, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

:root {
	--bleh-bg: #f5f5f2;
	--bleh-surface: #ffffff;
	--bleh-text: #141414;
	--bleh-muted: #666660;
	--bleh-line: #d9d9d4;
	--bleh-strong-line: #141414;
	--bleh-link: #141414;
	--bleh-bollocks: #8b2f2b;
	--bleh-bleh: #6f6f6a;
	--bleh-basic: #776448;
	--bleh-banging: #356653;
	--bleh-blinding: #7c6828;
	--bleh-shell: 780px;
	--bleh-short: 640px;
	--bleh-article: 720px;
	--bleh-guide: 760px;
	--bleh-content: 720px;
	--bleh-wide: 780px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--bleh-bg);
	color: var(--bleh-text);
	font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 17px;
	line-height: 1.65;
}
img { max-width: 100%; height: auto; }
a { color: var(--bleh-link); text-decoration-thickness: 1px; text-underline-offset: 0.16em; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
	outline: 3px solid currentColor;
	outline-offset: 3px;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.screen-reader-text:focus {
	position: fixed;
	top: 12px;
	left: 12px;
	z-index: 100000;
	width: auto;
	height: auto;
	clip: auto;
	padding: 10px 14px;
	background: #fff;
	color: #000;
}

.site-header {
	border-bottom: 2px solid var(--bleh-strong-line);
	background: var(--bleh-surface);
}
.site-header__inner,
.site-footer__inner,
.rating-nav__inner,
.site-main,
.archive-header {
	width: calc(100% - 32px);
	max-width: var(--bleh-shell);
	margin-inline: auto;
}
.site-header__inner {
	display: block;
	padding: 18px 0;
}
.site-branding { display: flex; align-items: center; gap: 14px; }
.custom-logo { display: block; max-height: 58px; width: auto; }
.site-title {
	margin: 0;
	font-size: clamp(2.2rem, 8vw, 5.5rem);
	font-weight: 950;
	line-height: 0.85;
	letter-spacing: -0.07em;
	text-transform: uppercase;
}
.site-title a { text-decoration: none; }
.site-description { max-width: 420px; margin: 8px 0 0; color: var(--bleh-muted); font-size: 0.9rem; }
.primary-nav ul,
.rating-nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.primary-nav { margin-top: 18px; }
.primary-nav a { font-weight: 700; text-decoration: none; }
.rating-nav { border-bottom: 1px solid var(--bleh-line); background: var(--bleh-surface); }
.rating-nav__inner { padding: 10px 0; }
.rating-nav a { font-size: 0.82rem; font-weight: 850; letter-spacing: 0.04em; text-decoration: none; text-transform: uppercase; }

.site-main { padding: 34px 0 72px; }
.home-header { margin: 0 0 34px; }
.home-header h1,
.archive-header h1,
.page-header h1 {
	margin: 0;
	font-size: clamp(2.2rem, 5vw, 4.6rem);
	line-height: 0.95;
	letter-spacing: -0.045em;
}
.home-header p,
.archive-description { max-width: var(--bleh-article); margin: 16px auto 0; color: var(--bleh-muted); }
.archive-header { padding: 46px 0 0; }
.archive-header + .site-main { padding-top: 30px; }
.archive-description--rating {
	font-size: 1.02rem;
}
.archive-description--rating p { margin: 0; }
.archive-description--rating p + p { margin-top: 8px; }
.archive-description__lead { color: var(--bleh-text); font-size: 1.08rem; }

.bleh-stream { display: grid; gap: 0; }
.bleh-card {
	border-top: 1px solid var(--bleh-line);
	padding: 28px 0 32px;
}
.bleh-card:first-child { border-top: 2px solid var(--bleh-strong-line); }
.bleh-card__inner { width: 100%; margin-inline: auto; }
.bleh-card--short .bleh-card__inner { max-width: var(--bleh-short); }
.bleh-card--article .bleh-card__inner { max-width: var(--bleh-article); }
.bleh-card--guide .bleh-card__inner { max-width: var(--bleh-guide); }
.bleh-card--guide {
	margin: 18px -10px;
	padding: 26px 20px;
	border: 2px solid var(--bleh-strong-line);
	background: var(--bleh-surface);
}
.bleh-card--guide + .bleh-card { border-top: 0; }
.bleh-card__eyebrow,
.entry-eyebrow {
	margin: 0 0 10px;
	font-size: 0.74rem;
	font-weight: 900;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
.bleh-card__title {
	margin: 0;
	font-size: clamp(1.55rem, 3.2vw, 2.6rem);
	line-height: 1.05;
	letter-spacing: -0.032em;
}
.bleh-card--short .bleh-card__title { font-size: clamp(1.4rem, 2.6vw, 2rem); }
.bleh-card__title a { text-decoration: none; }
.bleh-card__meta,
.entry-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	margin-top: 12px;
	color: var(--bleh-muted);
	font-size: 0.78rem;
}
.bleh-card__content,
.bleh-card__excerpt { margin-top: 18px; }
.bleh-card__content > :first-child,
.bleh-card__excerpt > :first-child { margin-top: 0; }
.bleh-card__content > :last-child,
.bleh-card__excerpt > :last-child { margin-bottom: 0; }
.bleh-card__image { margin: 20px 0 0; }
.bleh-card__image img { display: block; width: 100%; }
.bleh-card__more { display: inline-block; margin-top: 18px; font-weight: 800; }

.bleh-hashtags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 12px;
	margin-top: 18px;
	font-size: 0.86rem;
	font-weight: 750;
}
.bleh-hashtag {
	text-decoration: none;
}
.bleh-hashtag:hover {
	text-decoration: underline;
}

.rating-badge {
	display: inline-flex;
	align-items: center;
	min-height: 1.7rem;
	padding: 2px 8px;
	border: 1px solid currentColor;
	font-size: 0.7rem;
	font-weight: 900;
	letter-spacing: 0.08em;
	line-height: 1;
	text-decoration: none;
	text-transform: uppercase;
}
.rating-badge--bollocks { color: var(--bleh-bollocks); }
.rating-badge--bleh { color: var(--bleh-bleh); }
.rating-badge--basic { color: var(--bleh-basic); }
.rating-badge--banging { color: var(--bleh-banging); }
.rating-badge--blinding { color: var(--bleh-blinding); }

.single-wrap,
.page-wrap { width: 100%; margin-inline: auto; }
.single-wrap--short { max-width: var(--bleh-short); }
.single-wrap--article,
.page-wrap { max-width: var(--bleh-article); }
.single-wrap--guide { max-width: var(--bleh-guide); }
.entry-header { margin-bottom: 30px; }
.entry-title {
	margin: 0;
	font-size: clamp(2.2rem, 6vw, 5rem);
	line-height: 0.98;
	letter-spacing: -0.05em;
}
.bleh-type-short .entry-title { font-size: clamp(1.8rem, 5vw, 3.6rem); }
.entry-content { font-size: 1.03rem; }
.entry-content > :first-child { margin-top: 0; }
.entry-content h2,
.entry-content h3,
.entry-content h4 { line-height: 1.15; letter-spacing: -0.025em; }
.entry-content h2 { margin-top: 2em; font-size: 1.85rem; }
.entry-content h3 { margin-top: 1.7em; font-size: 1.35rem; }
.entry-content blockquote {
	margin: 1.8em 0;
	padding-left: 20px;
	border-left: 4px solid var(--bleh-strong-line);
	font-size: 1.08em;
}
.entry-content pre { overflow-x: auto; padding: 18px; background: #ecece8; }
.entry-content table { width: 100%; border-collapse: collapse; }
.entry-content th,
.entry-content td { padding: 10px; border: 1px solid var(--bleh-line); text-align: left; }
.entry-footer {
	margin-top: 42px;
	padding-top: 20px;
	border-top: 1px solid var(--bleh-line);
	color: var(--bleh-muted);
	font-size: 0.84rem;
}
.entry-footer a { color: inherit; }

.navigation.pagination,
.post-navigation { margin-top: 44px; padding-top: 22px; border-top: 1px solid var(--bleh-line); }
.single-post .post-navigation { margin-inline: auto; }
.bleh-type-short .post-navigation,
.bleh-type-short .comments-area { max-width: var(--bleh-short); }
.bleh-type-article .post-navigation,
.bleh-type-article .comments-area { max-width: var(--bleh-article); }
.bleh-type-guide .post-navigation,
.bleh-type-guide .comments-area { max-width: var(--bleh-guide); }
.nav-links { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; }
.page-numbers { display: inline-block; padding: 4px 8px; }
.current.page-numbers { border: 1px solid var(--bleh-strong-line); }

.comments-area { max-width: var(--bleh-article); margin: 54px auto 0; padding-top: 28px; border-top: 2px solid var(--bleh-strong-line); }
.comment-list { padding-left: 22px; }
.comment-body { margin-bottom: 28px; }
.comment-meta { font-size: 0.8rem; color: var(--bleh-muted); }
input[type="text"], input[type="email"], input[type="url"], input[type="search"], textarea {
	width: 100%;
	max-width: 680px;
	padding: 10px 12px;
	border: 1px solid var(--bleh-strong-line);
	background: var(--bleh-surface);
	color: var(--bleh-text);
	font: inherit;
}
button, input[type="submit"] {
	padding: 9px 14px;
	border: 2px solid var(--bleh-strong-line);
	background: var(--bleh-text);
	color: var(--bleh-surface);
	font: inherit;
	font-weight: 800;
	cursor: pointer;
}

.not-found { max-width: var(--bleh-article); margin-inline: auto; }
.not-found h1 { font-size: clamp(3rem, 10vw, 7rem); margin: 0 0 16px; line-height: 0.9; }

.site-footer { border-top: 2px solid var(--bleh-strong-line); background: var(--bleh-surface); }
.site-footer__inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 12px 28px;
	padding: 28px 0 40px;
	font-size: 0.78rem;
	color: var(--bleh-muted);
}
.footer-nav ul { display: flex; flex-wrap: wrap; gap: 8px 16px; list-style: none; padding: 0; margin: 0; }

.alignwide,
.alignfull {
	width: calc(100% - 32px);
	max-width: var(--bleh-shell);
	margin-left: auto;
	margin-right: auto;
	transform: none;
}

@media (min-width: 761px) {
	body { font-size: 18px; }
	.site-header__inner {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 28px;
		padding: 24px 0;
	}
	.primary-nav { margin-top: 0; }
	.site-main { padding-top: 48px; }
	.bleh-card { padding: 34px 0 38px; }
	.bleh-card--guide { margin: 22px 0; padding: 36px; }
	.site-description { max-width: none; }
}

/* Theme style presets. */
body.bleh-colour-red {
	--bleh-bg: #f7f2f1;
	--bleh-surface: #fffdfc;
	--bleh-text: #1b1211;
	--bleh-muted: #705d59;
	--bleh-line: #ddcfcc;
	--bleh-strong-line: #761f1a;
	--bleh-link: #761f1a;
}
body.bleh-colour-blue {
	--bleh-bg: #f1f4f7;
	--bleh-surface: #ffffff;
	--bleh-text: #101820;
	--bleh-muted: #5d6974;
	--bleh-line: #ccd6de;
	--bleh-strong-line: #244f73;
	--bleh-link: #244f73;
}
body.bleh-colour-green {
	--bleh-bg: #f2f5f1;
	--bleh-surface: #ffffff;
	--bleh-text: #111a14;
	--bleh-muted: #5e695f;
	--bleh-line: #d0d8d0;
	--bleh-strong-line: #315f43;
	--bleh-link: #315f43;
}
body.bleh-colour-plum {
	--bleh-bg: #f6f2f6;
	--bleh-surface: #ffffff;
	--bleh-text: #1a1219;
	--bleh-muted: #6d5d6a;
	--bleh-line: #d9ced7;
	--bleh-strong-line: #6b365f;
	--bleh-link: #6b365f;
}
body.bleh-colour-amber {
	--bleh-bg: #f7f4ec;
	--bleh-surface: #fffefa;
	--bleh-text: #1c1810;
	--bleh-muted: #6d6552;
	--bleh-line: #ddd5c1;
	--bleh-strong-line: #7a5a16;
	--bleh-link: #7a5a16;
}
body.bleh-colour-night {
	--bleh-bg: #151515;
	--bleh-surface: #1d1d1d;
	--bleh-text: #f2f2ef;
	--bleh-muted: #b1b1aa;
	--bleh-line: #3c3c39;
	--bleh-strong-line: #f2f2ef;
	--bleh-link: #f2f2ef;
	--bleh-bollocks: #ef746c;
	--bleh-bleh: #c2c2bd;
	--bleh-basic: #d1b17f;
	--bleh-banging: #79b996;
	--bleh-blinding: #e5c768;
	color-scheme: dark;
}
body.bleh-colour-night .entry-content pre { background: #252525; }
body.bleh-colour-night .screen-reader-text:focus { background: #fff; color: #000; }

body.bleh-style-bold {
	font-weight: 500;
}
body.bleh-style-bold .site-title,
body.bleh-style-bold .home-header h1,
body.bleh-style-bold .archive-header h1,
body.bleh-style-bold .page-header h1,
body.bleh-style-bold .entry-title,
body.bleh-style-bold .bleh-card__title {
	font-weight: 950;
	letter-spacing: -0.055em;
}
body.bleh-style-bold .primary-nav a,
body.bleh-style-bold .rating-nav a,
body.bleh-style-bold .bleh-card__eyebrow,
body.bleh-style-bold .entry-eyebrow,
body.bleh-style-bold .rating-badge,
body.bleh-style-bold .bleh-hashtags,
body.bleh-style-bold .bleh-card__more {
	font-weight: 900;
}
body.bleh-style-bold .bleh-card {
	border-top-width: 2px;
}
body.bleh-style-bold .bleh-card--guide {
	border-width: 3px;
}

body.bleh-style-thin {
	font-weight: 400;
}
body.bleh-style-thin .site-title,
body.bleh-style-thin .home-header h1,
body.bleh-style-thin .archive-header h1,
body.bleh-style-thin .page-header h1,
body.bleh-style-thin .entry-title,
body.bleh-style-thin .bleh-card__title {
	font-weight: 350;
	letter-spacing: -0.035em;
}
body.bleh-style-thin .primary-nav a,
body.bleh-style-thin .rating-nav a,
body.bleh-style-thin .bleh-card__eyebrow,
body.bleh-style-thin .entry-eyebrow,
body.bleh-style-thin .rating-badge,
body.bleh-style-thin .bleh-hashtags,
body.bleh-style-thin .bleh-card__more,
body.bleh-style-thin button,
body.bleh-style-thin input[type="submit"] {
	font-weight: 550;
}
body.bleh-style-thin .site-header,
body.bleh-style-thin .site-footer,
body.bleh-style-thin .comments-area,
body.bleh-style-thin .bleh-card:first-child {
	border-width: 1px;
}
body.bleh-style-thin .bleh-card--guide {
	border-width: 1px;
}
