/**
 * ETheme AI Design — conversion compatibility styles.
 *
 * core/group wraps its children in a .wp-block-group__inner-container element.
 * Theme layout classes (.eth-grid, .eth-card, .eth-flex-*, .eth-d-flex) and
 * AI-scoped layout classes (.eth-ai-*) rely on their DIRECT children being the
 * grid/flex items, so without this shim a converted group collapses to a
 * single column. These rules make the inner container inherit the outer
 * element's layout, restoring the intended rendering. Loaded on the front end
 * and in the block editor so pages already converted by 0.17 keep rendering.
 * New 0.17.1 conversions preserve risky layout wrappers as core/html blocks.
 * Version 0.18 uses exact-DOM structure blocks, while these rules remain for
 * old 0.17 content and bridge image utility classes onto core/image markup.
 */

.eth-grid > .wp-block-group__inner-container,
.eth-card > .wp-block-group__inner-container,
.eth-d-flex > .wp-block-group__inner-container,
.eth-flex-row > .wp-block-group__inner-container,
.eth-flex-col > .wp-block-group__inner-container,
.eth-flex-wrap > .wp-block-group__inner-container,
[class*="eth-ai-"] > .wp-block-group__inner-container {
	display: inherit;
	grid-template-columns: inherit;
	grid-template-rows: inherit;
	grid-auto-flow: inherit;
	grid-auto-columns: inherit;
	grid-auto-rows: inherit;
	flex-direction: inherit;
	flex-wrap: inherit;
	gap: inherit;
	row-gap: inherit;
	column-gap: inherit;
	align-items: inherit;
	align-content: inherit;
	justify-content: inherit;
	justify-items: inherit;
	place-items: inherit;
	place-content: inherit;
}

/* The editor canvas can use block-editor-block-list__layout as the direct
   inner-block wrapper instead of the saved-content wrapper. */
.eth-grid > .block-editor-block-list__layout,
.eth-card > .block-editor-block-list__layout,
.eth-d-flex > .block-editor-block-list__layout,
.eth-flex-row > .block-editor-block-list__layout,
.eth-flex-col > .block-editor-block-list__layout,
.eth-flex-wrap > .block-editor-block-list__layout,
[class*="eth-ai-"] > .block-editor-block-list__layout {
	display: inherit;
	grid-template-columns: inherit;
	grid-template-rows: inherit;
	grid-auto-flow: inherit;
	grid-auto-columns: inherit;
	grid-auto-rows: inherit;
	flex-direction: inherit;
	flex-wrap: inherit;
	gap: inherit;
	row-gap: inherit;
	column-gap: inherit;
	align-items: inherit;
	align-content: inherit;
	justify-content: inherit;
	justify-items: inherit;
	place-items: inherit;
	place-content: inherit;
}

/* Neutralise Gutenberg's flow spacing between layout items; the theme / AI
   CSS handles spacing on these containers. */
.eth-grid > .wp-block-group__inner-container > * + *,
.eth-card > .wp-block-group__inner-container > * + *,
.eth-d-flex > .wp-block-group__inner-container > * + *,
.eth-flex-row > .wp-block-group__inner-container > * + *,
.eth-flex-col > .wp-block-group__inner-container > * + *,
.eth-flex-wrap > .wp-block-group__inner-container > * + *,
[class*="eth-ai-"] > .wp-block-group__inner-container > * + * {
	margin-block-start: 0;
}

.eth-grid > .block-editor-block-list__layout > * + *,
.eth-card > .block-editor-block-list__layout > * + *,
.eth-d-flex > .block-editor-block-list__layout > * + *,
.eth-flex-row > .block-editor-block-list__layout > * + *,
.eth-flex-col > .block-editor-block-list__layout > * + *,
.eth-flex-wrap > .block-editor-block-list__layout > * + *,
[class*="eth-ai-"] > .block-editor-block-list__layout > * + * {
	margin-block-start: 0;
}

/* core/image places custom classes on <figure>; ETheme image utilities are
   commonly authored on <img>. Mirror the utility effect onto the inner image
   so converted media keeps its crop, aspect, radius and sizing. */
.wp-block-image.eth-w-full,
.wp-block-image.eth-w-full img {
	width: 100%;
}

.wp-block-image.eth-w-auto img {
	width: auto;
}

.wp-block-image.eth-object-cover img {
	object-fit: cover;
}

.wp-block-image.eth-object-contain img {
	object-fit: contain;
}

.wp-block-image.eth-aspect-1 img {
	aspect-ratio: 1 / 1;
}

.wp-block-image.eth-aspect-video img {
	aspect-ratio: 16 / 9;
}

.wp-block-image.eth-aspect-4-3 img {
	aspect-ratio: 4 / 3;
}

.wp-block-image.eth-aspect-3-4 img {
	aspect-ratio: 3 / 4;
}

.wp-block-image.eth-aspect-1 img,
.wp-block-image.eth-aspect-video img,
.wp-block-image.eth-aspect-4-3 img,
.wp-block-image.eth-aspect-3-4 img {
	width: 100%;
	height: 100%;
}

.wp-block-image.eth-radius-s img {
	border-radius: var(--eth-radius-s);
}

.wp-block-image.eth-radius-m img {
	border-radius: var(--eth-radius-m);
}

.wp-block-image.eth-radius-l img {
	border-radius: var(--eth-radius-l);
}

.wp-block-image.eth-radius-full img {
	border-radius: var(--eth-radius-full);
}

.wp-block-image.eth-shadow-s img {
	box-shadow: var(--eth-shadow-s);
}

.wp-block-image.eth-shadow-m img {
	box-shadow: var(--eth-shadow-m);
}

.wp-block-image.eth-shadow-l img {
	box-shadow: var(--eth-shadow-l);
}

.wp-block-image.eth-border img {
	border: 1px solid var(--eth-border);
}

.wp-block-image.eth-border-strong img {
	border: 1px solid var(--eth-border-strong);
}