/*
 * Classic content (spec 7). Twenty-four years of posts arrive as raw HTML inside
 * the post-content block, so nothing here relies on block classes. Tokens only;
 * quiet and readable (spec 6.9): no decorative rules, no justified text, no
 * tinted boxes. Text keeps the 560px measure; media and tables may use the
 * whole main column and never more.
 */

/* Headings: the display face, tighter than the page's body leading. */
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	margin-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--20);
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	line-height: 1.25;
	color: var(--wp--preset--color--ink);
}
.entry-content h1 { font-size: var(--wp--preset--font-size--title); }
.entry-content h2 { font-size: var(--wp--preset--font-size--large); }
.entry-content h3 { font-size: var(--wp--preset--font-size--body); }
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--ink-soft);
}

/*
 * Quotation. The blog quotes court rulings and other writers at length, so a
 * quote must be visibly someone else's words: indented behind a structural bar
 * and set in the softer ink.
 */
.entry-content blockquote {
	margin-block: var(--wp--preset--spacing--40);
	margin-inline: 0;
	padding-block: 0;
	padding-inline-start: var(--wp--preset--spacing--40);
	border-inline-start: 3px solid var(--wp--preset--color--structure);
	color: var(--wp--preset--color--ink-soft);
}
.entry-content blockquote p {
	margin-block: 0 var(--wp--preset--spacing--30);
}
.entry-content blockquote > :last-child {
	margin-bottom: 0;
}
/* A quote inside a quote: lighter bar; the indent does stack, one step per level. */
.entry-content blockquote blockquote {
	border-inline-start-color: var(--wp--preset--color--rule);
}
.entry-content blockquote cite,
.entry-content cite {
	font-style: italic;
}

/* Lists */
.entry-content ul,
.entry-content ol {
	margin-block: var(--wp--preset--spacing--30);
	padding-inline-start: var(--wp--preset--spacing--40);
}
.entry-content li + li {
	margin-top: var(--wp--preset--spacing--20);
}
.entry-content li > ul,
.entry-content li > ol {
	margin-block: var(--wp--preset--spacing--20) 0;
}

/* Definition lists */
.entry-content dt {
	font-weight: 600;
}
.entry-content dd {
	margin-inline: var(--wp--preset--spacing--40) 0;
}

/* Horizontal rule: the one deliberate break, short and quiet. */
.entry-content hr {
	width: 4rem;
	margin: var(--wp--preset--spacing--50) auto;
	border: 0;
	border-top: 1px solid var(--wp--preset--color--rule);
}

/* Code */
.entry-content code,
.entry-content pre {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.9em;
}
.entry-content pre {
	margin-block: var(--wp--preset--spacing--30);
	padding: var(--wp--preset--spacing--30);
	box-sizing: border-box;
	max-width: var(--wp--style--global--content-size);
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
	white-space: pre-wrap;
	overflow-wrap: anywhere;
}
.entry-content code {
	padding: 0 0.25em;
	background: var(--wp--preset--color--surface);
}
.entry-content pre code {
	padding: 0;
	background: none;
}

/*
 * Tables are content-width: the author's width="70%"/"100%" attributes are not
 * honoured. display:block makes the cells lay out in an anonymous inner table that
 * shrinks to content, so a box wider than its rows would leave dead space and
 * short row rules; making the sections display:table instead misaligns thead and
 * tbody columns. Content-width keeps box, rows and columns in agreement.
 * display:block lets a wide table scroll inside itself instead of
 * widening the page; max-content keeps its columns at natural width.
 */
.entry-content table {
	display: block;
	width: max-content;
	max-width: 100%;
	overflow-x: auto;
	margin-block: var(--wp--preset--spacing--40);
	border-collapse: collapse;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.4;
}
.entry-content th,
.entry-content td {
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	border-bottom: 1px solid var(--wp--preset--color--rule);
	text-align: start;
	vertical-align: top;
}
.entry-content thead td,
.entry-content th {
	font-weight: 700;
	color: var(--wp--preset--color--ink);
	border-bottom-color: var(--wp--preset--color--ink-soft);
}

/*
 * Images and embeds scale down with the column, never overflow it. The ceiling
 * is the main column, not wideSize: the sidebar is persistent (spec 5.5).
 * Anchors that wrap an image (a.windy-lightbox) are left exactly as they are.
 */
.entry-content img,
.entry-content video {
	max-width: 100%;
	height: auto;
}
/* Embeds keep the height their markup gives them; only the width is capped. */
.entry-content iframe,
.entry-content embed {
	max-width: 100%;
}
.entry-content img[class*="align"],
.entry-content figure img {
	height: auto;
}

/*
 * The post-content block is itself a child of the constrained <main>, so core
 * caps it at the 560px measure. Lift that cap to the column; its own children
 * keep the measure through the layout rule, and only the media blocks below
 * opt out of it.
 */
.entry-content.entry-content {
	max-width: none;
}

/*
 * Break-out, decided per kind. OBJECTS break out of the 560px measure to the
 * column: images, figures and tables, and embeds (iframe/embed/video, which cap
 * at the column via their own max-width above). RUNNING TEXT does not: pre is
 * read line by line like prose, so it stays at the measure. Captions
 * (.wp-caption) are bounded by the column.
 */
.entry-content > figure,
.entry-content > .wp-block-image,
.entry-content > div:has(> figure:only-child),
.entry-content > p:has(> img:only-child),
.entry-content > p:has(> a:only-child > img:only-child),
.entry-content > table {
	max-width: 100%;
}
.entry-content .wp-caption {
	max-width: 100%;
}
.entry-content figure {
	margin-inline: auto;
	margin-block: var(--wp--preset--spacing--40);
	text-align: center;
}
.entry-content figcaption,
.entry-content .wp-caption-text {
	margin-top: var(--wp--preset--spacing--20);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.4;
	color: var(--wp--preset--color--ink-soft);
}

/* Classic float alignment on narrow screens would squeeze text; stack instead. */
@media (max-width: 40rem) {
	.entry-content .alignleft,
	.entry-content .alignright,
	.entry-content img[align="left"],
	.entry-content img[align="right"] {
		float: none;
		display: block;
		margin-inline: auto;
	}
}