@charset 'utf-8';

/*  ========================================================================
    JUICE -> HELPERS -> ELEMENT SPACING
    ========================================================================  */

.has-no-element-spacing {
    margin-bottom: 0 !important;
}

.has-default-element-spacing {
    margin-bottom: $default-element-spacing !important;
}

.has-no-top-element-spacing {
    margin-top: 0 !important;
}

.has-default-top-element-spacing {
    margin-top: $default-element-spacing !important;
}

.has-no-last-child-element-spacing {
    &>*:last-child {
        margin-bottom: 0 !important;
    }
}

// Cycle through all of the sizes
@each $size in $sizes {
    .has-#{$size}-element-spacing {
        margin-bottom: map-get($default-element-spacing-sizes, $size) !important;
    }

    .has-#{$size}-top-element-spacing {
        margin-top: map-get($default-element-spacing-sizes, $size) !important;
    }
}

// Cycle throuhgh all of the breakpoints
@each $breakpoint-name, $breakpoint-value in $breakpoints {
    // Breakpoint
    @include breakpoint($breakpoint-name) {
        .has-no-element-spacing\@#{$breakpoint-name} {
            margin-bottom: 0 !important;
        }

        .has-default-element-spacing\@#{$breakpoint-name} {
            margin-bottom: $default-element-spacing !important;
        }

        .has-no-top-element-spacing\@#{$breakpoint-name} {
            margin-bottom: 0 !important;
        }

        .has-default-top-element-spacing\@#{$breakpoint-name} {
            margin-top: $default-element-spacing !important;
        }

        .has-no-last-child-element-spacing\@#{$breakpoint-name} {
            &>*:last-child {
                margin-bottom: 0 !important;
            }
        }

        // Cycle through all of the sizes
        @each $size in $sizes {
            .has-#{$size}-element-spacing\@#{$breakpoint-name} {
                margin-bottom: map-get($default-element-spacing-sizes, $size) !important;
            }

            .has-#{$size}-top-element-spacing\@#{$breakpoint-name} {
                margin-top: map-get($default-element-spacing-sizes, $size) !important;
            }
        }
    }
}
