/**
 * Columns Extension - Frontend Styles
 *
 * Vertical alignment styles for core/columns and core/column blocks.
 */

/* Columns container vertical alignment.
 * Each rule also targets the direct .wp-block-column children with align-self
 * because in flexbox a child's align-self always wins over the parent's
 * align-items. Without the child rule, WP's native verticalAlignment (which
 * adds is-vertically-aligned-* classes to each column) overrides our parent
 * intent. The compound selector specificity (0,3,0) beats native's (0,2,0). */

.wp-block-columns.sfcore-vertical-align-top {
	align-items: flex-start;
}
.wp-block-columns.sfcore-vertical-align-top > .wp-block-column {
	align-self: flex-start;
}

.wp-block-columns.sfcore-vertical-align-center {
	align-items: center;
}
.wp-block-columns.sfcore-vertical-align-center > .wp-block-column {
	align-self: center;
}

.wp-block-columns.sfcore-vertical-align-bottom {
	align-items: flex-end;
}
.wp-block-columns.sfcore-vertical-align-bottom > .wp-block-column {
	align-self: flex-end;
}

.wp-block-columns.sfcore-vertical-align-stretch {
	align-items: stretch;
}
.wp-block-columns.sfcore-vertical-align-stretch > .wp-block-column {
	align-self: stretch;
}

.wp-block-columns.sfcore-vertical-align-space-between {
	align-items: stretch;
}

.wp-block-columns.sfcore-vertical-align-space-around {
	align-items: stretch;
}

.wp-block-columns.sfcore-vertical-align-space-evenly {
	align-items: stretch;
}

/* Individual column content alignment */
.wp-block-column.sfcore-vertical-align-top {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

.wp-block-column.sfcore-vertical-align-center {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.wp-block-column.sfcore-vertical-align-bottom {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

.wp-block-column.sfcore-vertical-align-space-between {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.wp-block-column.sfcore-vertical-align-space-around {
	display: flex;
	flex-direction: column;
	justify-content: space-around;
}

.wp-block-column.sfcore-vertical-align-space-evenly {
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
}

.wp-block-column.sfcore-vertical-align-stretch {
	display: flex;
	flex-direction: column;
	justify-content: stretch;
}

.wp-block-column.sfcore-vertical-align-stretch > * {
	flex-grow: 1;
}
