/* ==========================================================================
   Grid System style - begin
   ========================================================================== */

.eltd-two-columns-form-without-space {
    
    .eltd-column-left {
        display: table-cell;
        width: 99%;
        vertical-align: top;
    }
    
    .eltd-column-right {
        display: table-cell;
        width: 1%;
        text-align: left;
        vertical-align: top;
    }
}

.eltd-two-columns-form-with-space {
	
	.eltd-column-left {
		display: table-cell;
		width: 99%;
		vertical-align: top;
		padding: 0 10px 0 0;
		box-sizing: border-box;
	}
	
	.eltd-column-right {
		display: table-cell;
		width: 1%;
		text-align: left;
		vertical-align: top;
		padding: 0 0 0 10px;
		box-sizing: border-box;
	}
}

/*
* If you changed some value for space do the same thing in masonry-type, product-list-main-and-vc scss files
*/
$columns_space_label: ('no', 'tiny', 'small', 'normal', 'medium', 'large', 'huge' );
$columns_space_width: (0, 5, 10, 15, 20, 25, 40);

@for $i from 0 to length($columns_space_label) {
	.eltd-#{nth($columns_space_label,$i+1)}-space {
		$column_width: nth($columns_space_width,$i+1);
		$column_width_margin: $column_width*2;
		
		&.eltd-disable-bottom-space {
			@if($column_width == 0) {
				margin-bottom: 0;
			} @else {
				margin-bottom: -#{$column_width_margin}px;
			}
		}
		
		.eltd-outer-space {
			@if($column_width == 0) {
				margin: 0;
			} @else {
				margin: 0 -#{$column_width}px;
			}
			
			.eltd-item-space {
				padding: 0 #{$column_width}px;
				margin: 0 0 #{$column_width_margin}px;
			}
		}

        &.eltd-disable-item-bottom-space {
            .eltd-item-space {
                margin: 0;
            }
        }
	}
}

@import 'grid-system-mixin';

.eltd-grid-row {
    @include createGridRow();
    @include eltdClearfix();
}

//generate gutter spaces
$columns_space_label: ('no', 'tiny', 'small', 'normal', 'medium', 'large', 'huge' );
$columns_space: (0, 5, 10, 15, 20, 25, 40);

@for $i from 0 to length($columns_space_label) {
    .eltd-grid-#{nth($columns_space_label,$i+1)}-gutter {
        $item_space: nth($columns_space, $i+1);
    
        //generate holder margin
        @include createGridRow($item_space);
        
        //generate columns padding
        > div {
            @include createGridColumnPadding($item_space);
        }
    }
}

//generate column classes
@for $i from 1 to (map-get($gridConfig, numberOfCols) + 1) {
    .eltd-grid-col-#{$i} {
        @include createGridColumn($i);
        
        @include createGridColumnResponsive(map-get($gridConfig, stackOn));
    }
}

//generate push / pull classes
@for $i from 1 to (map-get($gridConfig, numberOfCols) + 1) {
    .eltd-grid-col-push-#{$i} {
        @include createGridColumnPush($i);
    }
    
    .eltd-grid-col-pull-#{$i} {
        @include createGridColumnPull($i);
    }
}

//generate responsive width column classes
@for $i from 1 to (map-get($gridConfig, numberOfCols) + 1) {
    @each $size, $width in $breakpoints {
        .eltd-grid-col-#{$size}-#{$i} {
            $stack: false;
            
            //check if current column is max number of columns.
            //if it is than we need to stack columns
            @if($i == map-get($gridConfig, numberOfCols)) {
                $stack: true;
            }
            
            //if current column isn't the max number of columns
            //than generate responsive for it.
            @if($i < (map-get($gridConfig, numberOfCols) + 1)) {
                @include createGridColumnResponsive($size, $i, $stack);
            }
        }
    }
}
/* ==========================================================================
   Grid System style - end
   ========================================================================== */