exemplifi_dat_scss_4.scss

//
// Package Name: DAT
// Package URI: https://www.dat.com
// Subpackage: Stylesheet
// Author: Exemplifi
// Author URI: https://www.dat.com
// Description: Elementor fixes
// Version: 1.0
// License: Creative Commons 3.0 Attribution
// License URI: https://creativecommons.org/licenses/by/3.0/us/
// Tags: app
//

/**
 * Fix elementor display for collapsing margins
 * @see https://github.com/elementor/elementor/issues/7671
 * @see https://github.com/elementor/elementor/issues/7366
 */
.elementor:not(.elementor-bc-flex-widget) .elementor-widget-wrap {
	display: block;
}

// Fixes column spacing for sm devices where margins are not required for lg devices
.section-vm-default {

	// By default let's set the column spacings for mobile to medium
	> .elementor-container {
		@include media-breakpoint-down(sm) {
			grid-row-gap: var(--vertical-margin-md);
		}
	}
	
}

// Elementor Section Vertical Margin Spacings
.section-vm-xs {
	margin-top: var(--vertical-margin-xs);
	margin-bottom: var(--vertical-margin-xs);

	// FIXES COLUMN VERTICAL SPACING ON MOBILE DEVICES
	.elementor-container {
		@include media-breakpoint-down(xs) {
			grid-row-gap: var(--vertical-margin-xs);
		}
	}

}

.section-vm-sm {
	margin-top: var(--vertical-margin-sm);
	margin-bottom: var(--vertical-margin-sm);

	// FIXES COLUMN VERTICAL SPACING ON MOBILE DEVICES
	.elementor-container {
		@include media-breakpoint-down(sm) {
			grid-row-gap: var(--vertical-margin-sm);
		}
	}

}

.section-vm-md {
	margin-top: var(--vertical-margin-md);
	margin-bottom: var(--vertical-margin-md);

	// FIXES COLUMN VERTICAL SPACING ON MOBILE DEVICES
	.elementor-container {
		@include media-breakpoint-down(sm) {
			grid-row-gap: var(--vertical-margin-md);
		}
	}

}

.section-vm-lg {
	margin-top: var(--vertical-margin-lg);
	margin-bottom: var(--vertical-margin-lg);

	// FIXES COLUMN VERTICAL SPACING ON MOBILE DEVICES
	.elementor-container {
		@include media-breakpoint-down(sm) {
			grid-row-gap: var(--vertical-margin-lg);
		}
	}

}

.section-vm-xl {
	margin-top: var(--vertical-margin-xl);
	margin-bottom: var(--vertical-margin-xl);

	// FIXES COLUMN VERTICAL SPACING ON MOBILE DEVICES
	.elementor-container {
		@include media-breakpoint-down(sm) {
			grid-row-gap: var(--vertical-margin-xl);
		}
	}

}

// Elementor Section Vertical Padding Spacings
.section-vp-xs {
	padding-top: var(--vertical-padding-xs);
	padding-bottom: var(--vertical-padding-xs);
}

.section-vp-sm {
	padding-top: var(--vertical-padding-sm);
	padding-bottom: var(--vertical-padding-sm);
}

.section-vp-md {
	padding-top: var(--vertical-padding-md);
	padding-bottom: var(--vertical-padding-md);
}

.section-vp-lg {
	padding-top: var(--vertical-padding-lg);
	padding-bottom: var(--vertical-padding-lg);
}

.section-vp-xl {
	padding-top: var(--vertical-padding-xl);
	padding-bottom: var(--vertical-padding-xl);
}

// Fixes elementor Column Gaps
.elementor-column-gap-default,
.elementor-column-gap-narrow,
.elementor-column-gap-extended,
.elementor-column-gap-wide,
.elementor-column-gap-wider {

	// Remove default Elementor paddings for better control
	> .elementor-column > .elementor-element-populated {
		padding: 0;
	}

	> .elementor-row > .elementor-column > .elementor-element-populated {
		padding: 0;
	}

}

.elementor-column-gap-default {

	> .elementor-column {
		padding-left: var(--column-gutter-spacing-sm);
		padding-right: var(--column-gutter-spacing-sm);
	}

}

.elementor-column-gap-narrow {

	> .elementor-column {
		padding-left: var(--column-gutter-spacing-xs);
		padding-right: var(--column-gutter-spacing-xs);
	}

}

.elementor-column-gap-extended {

	> .elementor-column {
		padding-left: var(--column-gutter-spacing-md);
		padding-right: var(--column-gutter-spacing-md);
	}

}

.elementor-column-gap-wide {

	> .elementor-column {
		padding-left: var(--column-gutter-spacing-lg);
		padding-right: var(--column-gutter-spacing-lg);
	}

}

// Margin pull for layout adjustment
.elementor-container.margin-push-sm {
	margin-left: var(--margin-push-sm);
	margin-right: var(--margin-push-sm);
}

.elementor-column-gap-wider {

	> .elementor-column {
		padding-left: var(--column-gutter-spacing-xl);
		padding-right: var(--column-gutter-spacing-xl);
	}

}