/**
 * Long-form content inside Post Content (articles and pages).
 */

.wp-block-post-content > :is(h2, h3, h4) {
	margin-block-start: var(--wp--preset--spacing--60);
}

.wp-block-post-content > :is(h2, h3, h4) + * {
	margin-block-start: var(--wp--preset--spacing--30);
}

/*
 * Lists and images written in the content only — not block-generated lists
 * (post/term templates) or component images (hero, cards) on pages like the
 * homepage, which also live inside Post Content.
 */
.wp-block-post-content :is(ul.wp-block-list, ol.wp-block-list, ul:not([class]), ol:not([class])) {
	padding-inline-start: 1.5em; /* Relative to the text, so markers align at any size. */
}

.wp-block-post-content :is(.wp-block-list, ul:not([class]), ol:not([class])) > li + li {
	margin-block-start: 0.4em;
}

.wp-block-post-content :is(.wp-block-image, .wp-block-gallery) img {
	height: auto;
	border-radius: var(--wp--custom--radius--small);
}

/* Tables: scroll horizontally inside their figure instead of the page. */
.wp-block-post-content .wp-block-table {
	overflow-x: auto;
}

.wp-block-post-content .wp-block-table table {
	width: auto;
	min-width: 100%;
	border-collapse: collapse;
	table-layout: auto;
}

.wp-block-post-content .wp-block-table :is(th, td) {
	padding: var(--wp--custom--space--2) var(--wp--custom--space--3);
	border: 1px solid var(--wp--custom--color--border-subtle);
	min-width: 7em;
	overflow-wrap: normal;
	text-align: start;
	vertical-align: top;
}

.wp-block-post-content .wp-block-table thead {
	border-bottom: 2px solid var(--wp--preset--color--contrast);
}

.wp-block-post-content .wp-block-table th {
	background-color: var(--wp--preset--color--surface);
	font-weight: 600;
}

.wp-block-post-content :is(pre, code) {
	overflow-wrap: anywhere;
}

.wp-block-post-content pre {
	overflow-x: auto;
	white-space: pre-wrap;
}

.wp-block-post-content :is(iframe, video, embed, object) {
	max-width: 100%;
}

.wp-block-post-content .wp-block-footnotes {
	padding-block-start: var(--wp--preset--spacing--40);
	border-block-start: 1px solid var(--wp--custom--color--border-subtle);
}

.wp-block-post-content .wp-block-pullquote {
	text-align: center;
}

.wp-block-post-content .wp-block-pullquote cite {
	color: var(--wp--preset--color--contrast-secondary);
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--small);
}

/* "Further reading" pattern: a quiet, bordered aside inside articles. */
.wp-block-post-content .ttf-further-reading {
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	border-inline-start: 4px solid var(--wp--preset--color--accent);
	border-radius: var(--wp--custom--radius--small);
	background-color: var(--wp--preset--color--surface);
}

.wp-block-post-content .ttf-further-reading > .ttf-further-reading__heading {
	margin-block-start: 0;
	font-size: var(--wp--preset--font-size--large);
}

/*
 * Classic-editor content (articles migrated from the old site, Phase 5B).
 * These selectors match markup that blocks never produce — images inside
 * paragraphs, [caption] and [gallery] shortcode output, and alignment
 * classes nested below the content's direct children — so block content and
 * the homepage components are unaffected.
 */
.wp-block-post-content :is(p, .wp-caption, .gallery-item) img {
	max-width: 100%;
	height: auto;
}

.wp-block-post-content .wp-caption {
	max-width: 100%; /* Overrides the shortcode's inline width on small screens. */
}

.wp-block-post-content .wp-caption-text {
	margin-block-start: var(--wp--custom--space--2);
	color: var(--wp--preset--color--contrast-secondary);
	font-size: var(--wp--preset--font-size--small);
}

.wp-block-post-content :is(p, a) > .aligncenter,
.wp-block-post-content .wp-caption.aligncenter {
	display: block;
	margin-inline: auto;
}

@media (min-width: 600px) {

	.wp-block-post-content :is(p, a) > .alignright,
	.wp-block-post-content .wp-caption.alignright {
		float: right;
		margin-block-end: var(--wp--custom--space--3);
		margin-inline-start: var(--wp--preset--spacing--40);
	}

	.wp-block-post-content :is(p, a) > .alignleft,
	.wp-block-post-content .wp-caption.alignleft {
		float: left;
		margin-block-end: var(--wp--custom--space--3);
		margin-inline-end: var(--wp--preset--spacing--40);
	}
}

/* A floated classic image never runs past the end of the article. */
.wp-block-post-content::after {
	display: table;
	clear: both;
	content: "";
}

/* [gallery columns="N"]: a grid, at most two columns on phones. */
.wp-block-post-content .gallery {
	display: grid;
	grid-template-columns: repeat(min(var(--ttf-gallery-columns, 3), 2), minmax(0, 1fr));
	gap: var(--wp--custom--space--3);
}

@media (min-width: 600px) {

	.wp-block-post-content .gallery {
		grid-template-columns: repeat(var(--ttf-gallery-columns, 3), minmax(0, 1fr));
	}
}

.wp-block-post-content .gallery-columns-1 {
	--ttf-gallery-columns: 1;
}

.wp-block-post-content .gallery-columns-2 {
	--ttf-gallery-columns: 2;
}

.wp-block-post-content .gallery-columns-3 {
	--ttf-gallery-columns: 3;
}

.wp-block-post-content .gallery-columns-4 {
	--ttf-gallery-columns: 4;
}

.wp-block-post-content .gallery-columns-5 {
	--ttf-gallery-columns: 5;
}

.wp-block-post-content .gallery-columns-6 {
	--ttf-gallery-columns: 6;
}

.wp-block-post-content .gallery-item {
	margin: 0;
}

.wp-block-post-content .gallery-item img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--small);
}

/* Classic tables (no Table block wrapper). */
.wp-block-post-content > table {
	border-collapse: collapse;
}

.wp-block-post-content > table :is(th, td) {
	padding: var(--wp--custom--space--2) var(--wp--custom--space--3);
	border: 1px solid var(--wp--custom--color--border-subtle);
	text-align: start;
	vertical-align: top;
}

/*
 * Classic <blockquote> (no Quote block class): the same look as the Quote
 * block (theme.json core/quote). Direct children only: the Pullquote block's
 * inner <blockquote> has no class either.
 */
.wp-block-post-content > blockquote:not([class]) {
	margin-inline: 0;
	padding-inline-start: var(--wp--preset--spacing--40);
	border-inline-start: 4px solid var(--wp--preset--color--accent);
	font-family: var(--wp--preset--font-family--serif);
	font-size: var(--wp--preset--font-size--large);
	line-height: var(--wp--custom--line-height--snug);
}

.wp-block-post-content > blockquote:not([class]) cite {
	font-size: var(--wp--preset--font-size--small);
}
