/**
 * Content design system — single source of truth (site → block → row → column → module).
 *
 * PHP: Inversaweb\Business\ContentDesignSystem
 * Admin live: assets/js/iw-content-design-live.js (window.iwContentDesign)
 *
 * Structure (grid, gap, tracks, row layout) uses CSS vars + data-* — not inline margin/gap longhands.
 */

/* —— Row —— */
.iw-pb-block__row {
	display: grid;
	/* Tracks are stamped on the row (--iw-pb-layout-cols). Do not fall back to a 2-col catalog. */
	grid-template-columns: var(--iw-pb-layout-cols);
	gap: var(--iw-pb-row-gap, var(--iw-pb-col-gap, 40px));
	box-sizing: border-box;
	align-items: stretch;
	min-width: 0;
}

.iw-pb-block__row[data-iw-pb-row-layout="center"] {
	margin-left: auto;
	margin-right: auto;
}

.iw-pb-block__row[data-iw-pb-row-layout="bleed"] {
	width: calc(100% + var(--iw-pb-block-pad-left, 24px) + var(--iw-pb-block-pad-right, 24px));
	max-width: none;
	margin-left: calc(-1 * var(--iw-pb-block-pad-left, 24px));
	margin-right: calc(-1 * var(--iw-pb-block-pad-right, 24px));
}

.iw-pb-block__row[data-iw-pb-row-layout="sized"] {
	width: var(--iw-pb-row-width-pct, 100%);
	max-width: var(--iw-pb-row-width-pct, 100%);
	margin-left: auto;
	margin-right: auto;
}

.iw-pb-block__row[data-iw-pb-cols-mode="stack"] {
	grid-template-columns: minmax(0, 1fr) !important;
}

/* —— Column —— */
.iw-pb-block__col,
.iw-pb-block__col[data-iw-pb-design-node] {
	min-width: 0;
	box-sizing: border-box;
	justify-content: var(--iw-pb-content-justify, flex-start);
	text-align: var(--iw-pb-content-text-align, left);
}

/* —— Module shell —— */
.iw-pb-block [data-iw-pb-design-node]:not([class*="__row"]):not([class*="__col"]) {
	box-sizing: border-box;
	min-width: 0;
}