/**
 * Axismundi — core/latest-posts + core/rss as M3 collection cards.
 *
 * Both blocks render a <ul> of items and share a list/grid layout (postLayout /
 * blockLayout = list|grid, with is-grid + columns-N classes). The M3 treatment:
 * every item is a FILLED, shadow-less card (surface-container) — except the RSS
 * LIST, which reads better as ONE grouped feed card with row dividers than as a
 * stack of separate cards for a dense feed.
 *
 * What core already does in WP 7.0 (verified, so NOT redone here): the item <ul>
 * is already list-style:none with no list indent, and the grid is core's own
 * responsive flex (is-grid is display:flex; columns-N widths apply at >=600px;
 * single column below). Core's margin-based gaps leave a trailing gutter,
 * especially for RSS and mobile. Replace those margins with one tokenised flex
 * gap and recompute widths so rows fill exactly.
 *
 * theme.json cannot reach the per-<li> card surface (it styles the block, not its
 * items), which is why this lives in CSS. Enqueued on the front (functions.php)
 * and mirrored into the editor canvas (add_editor_style).
 */

/* Card surface — latest-posts items (list + grid) and RSS GRID items are each a
 * filled, shadow-less card. RSS LIST is the exception, handled below. */
.wp-block-latest-posts > li,
.wp-block-rss.is-grid > li {
	box-sizing: border-box;
	padding: var(--wp--preset--spacing--200);
	border-radius: 12px;
	background-color: var(--wp--preset--color--surface-container);
	box-shadow: none;
}

/* Latest Posts list = a single-column stack of cards. */
.wp-block-latest-posts:not(.is-grid) {
	display: grid;
	gap: var(--wp--preset--spacing--200);
}

/* RSS list = ONE grouped feed card; rows split by dividers. A dense feed reads
 * better grouped than as separate cards. */
.wp-block-rss:not(.is-grid) {
	overflow: clip;
	border-radius: 12px;
	background-color: var(--wp--preset--color--surface-container);
}
.wp-block-rss:not(.is-grid) > li {
	box-sizing: border-box;
	padding: var(--wp--preset--spacing--200);
}
.wp-block-rss:not(.is-grid) > li + li {
	border-block-start: 1px solid var(--wp--preset--color--outline-variant);
}

/* Card interior rhythm — the card padding owns the edges; one token gap stacks the
 * item's parts. Core's ad-hoc per-element margins (excerpt, featured image) are
 * reset first so the rhythm is even. Margin-based (not flex gap) because
 * featuredImageAlign uses float, which a flex container would drop. */
.wp-block-latest-posts > li > *,
.wp-block-rss > li > * {
	margin-block: 0;
}
.wp-block-latest-posts > li > * + *,
.wp-block-rss > li > * + * {
	margin-block-start: var(--wp--preset--spacing--50);
}

/* Item typography — dynamic blocks render their own inner markup, so theme.json
 * can only style the wrapper. Keep Latest Posts and RSS visually identical:
 * title-medium for the item headline, body-small for metadata, body-medium for
 * excerpts. Font family is inherited from the surrounding content. */
.wp-block-latest-posts .wp-block-latest-posts__post-title,
.wp-block-rss .wp-block-rss__item-title a {
	color: var(--wp--preset--color--on-surface);
	font-size: var(--wp--preset--font-size--title-medium);
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0.15px;
	text-decoration: none;
}
.wp-block-latest-posts .wp-block-latest-posts__post-title:hover,
.wp-block-latest-posts .wp-block-latest-posts__post-title:focus-visible,
.wp-block-rss .wp-block-rss__item-title a:hover,
.wp-block-rss .wp-block-rss__item-title a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 0.15em;
}
.wp-block-latest-posts :is(.wp-block-latest-posts__post-date, .wp-block-latest-posts__post-author),
.wp-block-rss :is(.wp-block-rss__item-publish-date, .wp-block-rss__item-author) {
	color: var(--wp--preset--color--on-surface-variant);
	font-size: var(--wp--preset--font-size--body-small);
	line-height: 1.333;
	letter-spacing: 0.4px;
}
.wp-block-latest-posts .wp-block-latest-posts__post-excerpt,
.wp-block-rss .wp-block-rss__item-excerpt {
	color: var(--wp--preset--color--on-surface-variant);
	font-size: var(--wp--preset--font-size--body-medium);
	line-height: 1.429;
	letter-spacing: 0.25px;
	margin-block-start: var(--wp--preset--spacing--100);
}

/* Grid — keep core's flex/grid class contract, but replace its margin gutter
 * with a real gap. Resetting margin here must be scoped to .is-grid so list
 * views keep their own rhythm. */
ul.wp-block-latest-posts.is-grid,
ul.wp-block-rss.is-grid {
	gap: var(--wp--preset--spacing--200);
}
ul.wp-block-latest-posts.is-grid > li,
ul.wp-block-rss.is-grid > li {
	margin: 0;
	inline-size: 100%;
}
@media (min-width: 600px) {
	ul.wp-block-latest-posts.is-grid.columns-2 > li,
	ul.wp-block-rss.is-grid.columns-2 > li {
		inline-size: calc((100% - var(--wp--preset--spacing--200)) / 2);
	}
	ul.wp-block-latest-posts.is-grid.columns-3 > li,
	ul.wp-block-rss.is-grid.columns-3 > li {
		inline-size: calc((100% - 2 * var(--wp--preset--spacing--200)) / 3);
	}
	ul.wp-block-latest-posts.is-grid.columns-4 > li,
	ul.wp-block-rss.is-grid.columns-4 > li {
		inline-size: calc((100% - 3 * var(--wp--preset--spacing--200)) / 4);
	}
	ul.wp-block-latest-posts.is-grid.columns-5 > li,
	ul.wp-block-rss.is-grid.columns-5 > li {
		inline-size: calc((100% - 4 * var(--wp--preset--spacing--200)) / 5);
	}
	ul.wp-block-latest-posts.is-grid.columns-6 > li,
	ul.wp-block-rss.is-grid.columns-6 > li {
		inline-size: calc((100% - 5 * var(--wp--preset--spacing--200)) / 6);
	}
}

/* Featured image = the card media frame. The theme owns fit / aspect / radius;
 * core owns the width + alignment (featuredImageSizeWidth / featuredImageAlign),
 * so cap with max-inline-size (never force a width) and let core place it. */
.wp-block-latest-posts .wp-block-latest-posts__featured-image img {
	max-inline-size: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: 8px;
}

/*
 * Opt-in "Feed header" (is-style-feed-header): a quiet feed-identity band the
 * theme injects above the RSS items via render_block_core/rss. It is a sibling
 * before the list <ul>; against the LIST card it shares the surface and butts
 * flush (header = top corners + divider, list = bottom corners) so the two read
 * as one grouped feed. Markup/values match the RSS item card above.
 */
.axismundi-rss-header {
	display: flex;
	gap: var(--wp--preset--spacing--100);
	align-items: center;
	box-sizing: border-box;
	padding: var(--wp--preset--spacing--200);
	background-color: var(--wp--preset--color--surface-container);
	border-radius: 12px;
}
.axismundi-rss-header__icon {
	flex: none;
	inline-size: 32px;
	block-size: 32px;
	border-radius: 8px;
	object-fit: cover;
}
.axismundi-rss-header__text {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--50);
	min-inline-size: 0;
}
.axismundi-rss-header__title {
	color: var(--wp--preset--color--on-surface);
	font-size: var(--wp--preset--font-size--title-medium);
	font-weight: 500;
	line-height: 1.4;
}
.axismundi-rss-header__title a {
	color: inherit;
	text-decoration: none;
}
.axismundi-rss-header__title a:hover,
.axismundi-rss-header__title a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 0.15em;
}
.axismundi-rss-header__desc {
	overflow: hidden;
	color: var(--wp--preset--color--on-surface-variant);
	font-size: var(--wp--preset--font-size--body-small);
	line-height: 1.4;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

/* Merge the header into the top of the LIST card: flush, with one divider. */
.axismundi-rss-header:has(+ .wp-block-rss:not(.is-grid)) {
	border-end-start-radius: 0;
	border-end-end-radius: 0;
	border-block-end: 1px solid var(--wp--preset--color--outline-variant);
}
.axismundi-rss-header + .wp-block-rss:not(.is-grid) {
	margin-block-start: 0;
	border-start-start-radius: 0;
	border-start-end-radius: 0;
}