/**
 * Theme-level defaults for core Gutenberg blocks that need behaviour
 * theme.json can't express (media-query overrides of block layout).
 * Added 2026-08-16.
 */

/**
 * Mobile stacking for Gutenberg Row and Grid blocks (core/group layout
 * variations: is-layout-flex = Row, is-layout-grid = Grid).
 * These blocks don't stack on mobile out of the box (unlike core/columns,
 * which core CSS already stacks below 781px), so without this content
 * overflows or squeezes on small screens.
 * Breakpoint matches WP core's own block breakpoint (781px) for consistency
 * with core/columns behaviour.
 */
@media (max-width: 781px) {
	/* Row block: force flex items to wrap into a single stacked column,
	   left-aligned instead of inheriting the row's (often centered) cross-axis
	   alignment. */
	.wp-block-group.is-layout-flex {
		flex-direction: column !important;
		align-items: flex-start !important;
	}

	/* Grid block: collapse the grid to a single column, left-aligned instead
	   of the default stretch/center placement. */
	.wp-block-group.is-layout-grid {
		grid-template-columns: 1fr !important;
		justify-items: start !important;
	}
}
