/**
 * Icon Box layout fallback.
 *
 * Elementor's widget-icon-box.css defaults the wrapper to flex-direction:column and only
 * switches to row when position classes are applied. Cache/optimization can drop or delay
 * that file, leaving "Inline Start" Icon Boxes stacked until a hard refresh.
 * These rules mirror Elementor's position modifiers so layout stays correct regardless.
 */

.elementor-widget-icon-box.elementor-position-inline-start .elementor-icon-box-wrapper,
.elementor-widget-icon-box.elementor-position-left .elementor-icon-box-wrapper {
	display: flex;
	flex-direction: row;
	align-items: center;
	text-align: start;
}

.elementor-widget-icon-box.elementor-position-inline-end .elementor-icon-box-wrapper,
.elementor-widget-icon-box.elementor-position-right .elementor-icon-box-wrapper {
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
	text-align: end;
}

.elementor-widget-icon-box.elementor-position-inline-start .elementor-icon-box-content,
.elementor-widget-icon-box.elementor-position-inline-end .elementor-icon-box-content,
.elementor-widget-icon-box.elementor-position-left .elementor-icon-box-content,
.elementor-widget-icon-box.elementor-position-right .elementor-icon-box-content {
	width: auto;
}

.elementor-widget-icon-box.elementor-position-inline-start .elementor-icon-box-icon,
.elementor-widget-icon-box.elementor-position-inline-end .elementor-icon-box-icon,
.elementor-widget-icon-box.elementor-position-left .elementor-icon-box-icon,
.elementor-widget-icon-box.elementor-position-right .elementor-icon-box-icon {
	display: inline-flex;
	align-items: center;
	line-height: 0;
}

@media (max-width: 767px) {
	.elementor-widget-icon-box.elementor-mobile-position-block-start .elementor-icon-box-wrapper {
		flex-direction: column;
		align-items: unset;
		text-align: center;
	}

	.elementor-widget-icon-box.elementor-mobile-position-block-end .elementor-icon-box-wrapper {
		flex-direction: column-reverse;
		align-items: unset;
		text-align: center;
	}

	.elementor-widget-icon-box.elementor-mobile-position-inline-start .elementor-icon-box-wrapper {
		flex-direction: row;
		align-items: center;
		text-align: start;
	}

	.elementor-widget-icon-box.elementor-mobile-position-inline-end .elementor-icon-box-wrapper {
		flex-direction: row-reverse;
		align-items: center;
		text-align: end;
	}
}
