// -----------------------------------------
// GRID with MARGIN
//   *Deprecated* in v 0.1
//   Using margin for distance between grid
// -----------------------------------------
$row-width       : em($content-width) !default;
$column-padding  : em(0px) !default;
$column-margin   : em(25px) !default; // Margin between column at maximum row's width
$total-columns   : 12 !default;

// Calculate percentages for grid
@function gridCalc($colNumber, $totalColumns: $total-columns, $collapse: false ) {
	$baseSize : percentage( $colNumber / $totalColumns );

	// Additional size due to margin between grid.
	$fillSize : 0 !default;
	@if $collapse == false {
		$fillSize : $colNumber * ( gridMarginCalc() / $totalColumns );
	}
	
	@return $baseSize + $fillSize;
}

// Calculate percentages for Margin between grid
@function gridMarginCalc($colMargin: $column-margin, $rowWidth: $row-width) {
	@return percentage( $colMargin / $rowWidth );
}

// Create ROW
@mixin grid-row($behavior: false, $minify: false) {
	@if $minify == false {
		@include clearfix;
	}
	
	// use @include grid-row(nest); to include a nested row
	@if $behavior == nest {
		width        : auto;
		max-width    : none;
		margin-#{$default-float}    : -($column-padding);
		margin-#{$default-opposite} : -($column-padding);
	}
	// use @include grid-row(collapse); to collapse a container row margins
	@else if $behavior == collapse {
		width     : 100%;
		max-width : $row-width;
		margin    : 0;
	}
	// use @include grid-row(nest-in-non-collapse); to collapse outer margins of nested-row inside non-collapsed-row
	@else if $behavior == nest-in-non-collapse {
		width     : auto;
		max-width : none;
	}
	// use @include grid-row(nest-in-collapse); to collapse outer margins of nested-row inside collapsed-row
	@else if $behavior == nest-in-collapse {
		width     : auto;
		max-width : none;
		margin    : 0;
	}

	// use @include grid-row; to use a container row
	@else {
		width     : 100%;
		max-width : $row-width;
		margin    : 0 auto;
	}
}

// Create COLUMN
@mixin grid-column($columns  : false,
				$last-column : false,
				$center      : false,
				$offset      : false,
				$push        : false,
				$pull        : false,
				$collapse    : false,
				$minify      : false, // Remove style redundancy
				$float       : left ) {
	
	$not-for-columns : $push == false and $pull == false;
	// If column number not specified
	@if $columns == false and $minify and $not-for-columns {
		position     : relative;
		margin-#{$default-opposite} : gridMarginCalc();
		&:last-child { margin-#{$default-opposite} : 0; }
	}
	
	// If not collapse, add padding
	@if $collapse == false and $minify == false {
		padding-left  : $column-padding;
		padding-right : $column-padding;
	}

	// If collapsed, remove padding and margin
	@if $collapse and $minify == false {
		padding-left  : 0;
		padding-right : 0;
		margin-#{$default-opposite} : 0;
	}

	// If collapsed and no column-number given, remove margin between grid
	@if $collapse and $columns == false and $minify == true {
		margin-#{$default-opposite} : 0;
	}
	
	// If a column number is given, calculate width
	@if $columns {
		@if $minify == false { position : relative; }
		// If collapsed, recalculate the width
		@if $collapse {
			width : gridCalc($columns, $collapse: true);
		}
		// Else, reduce the width with the margin
		@else {
			width : gridCalc($columns) - gridMarginCalc();

			@if $minify == false {
				margin-#{$default-opposite} : gridMarginCalc();

				// If last-column specified explicitly
				@if $last-column {
					margin-#{$default-opposite} : 0;
				} @else {
					&:last-child { margin-#{$default-opposite} : 0; }
				}
			}
		}
	}

	// If offset, calculate appropriate margins
	@if $offset {
		margin-#{$default-float}: gridCalc($offset, $collapse:$collapse);
	}

	// Source Ordering, adds left/right depending on which you use.
	@if $push {
		@if $minify == false { position : relative; }
		#{$default-float}    : gridCalc($push, $collapse: $collapse);
		#{$default-opposite} : auto;
	}
	@if $pull {
		@if $minify == false { position : relative; }
		#{$default-opposite} : gridCalc($pull, $collapse: $collapse);
		#{$default-float}    : auto;
	}
	// If centered, get rid of float and add appropriate margins
	@if $center {
		margin-left  : auto !important;
		margin-right : auto !important;
		float        : none !important;
	}
	@if $float {
		@if $float == left or true {
			float : $default-float;
		} @else if $float == right {
			float : $default-opposite;
		} @else {
			float : none;
		}
	}
}

@if $include-grid {

/* ---------------
EDGE Grid
--------------- */

body {
	&.not-responsive {
		min-width : $row-width;
	}
	&.only-responsive-below-small {
		min-width : $row-width;
		@include small {
			min-width : 0;
		}
	}
}
// For `normal-row`
.row {
	@include grid-row;
	
	.column,
	.columns {
		@include grid-column($columns: false, $minify: true);

		&.last { margin-#{$default-opposite} : 0 !important; }
	}

	// Width for `normal-row`
	@for $i from 1 through $total-columns {
		.large-#{$i} {
			@include grid-column($columns:$i, $collapse:null, $float:false, $minify: true );
		}
	}
	
	// For `collapsed-row`
	&.collapse {
		.column,
		.columns {
			@include grid-column($collapse: true);
		}

		// For `nested-row inside collapsed-row`, it's automatically collapsed
		.row {
			@include grid-row($behavior: nest-in-collapse, $minify: true);
			
			.column,
			.columns {
				@include grid-column($columns: false, $collapse: true, $minify: true);
			}
		}

		@for $i from 1 through $total-columns {
			.large-#{$i} {
				@include grid-column($columns:$i, $collapse:true, $float:false, $minify: true );
			}
		}
	}

	// For `nested-row`
	.row {
		@include grid-row($behavior: nest, $minify: true);
	}

	// Offset for large columns
	@for $i from 1 through $total-columns - 2 {
		.large-offset-#{$i} {
			@include grid-column($offset:$i, $collapse:null, $float:false );
		}
	}
}

.column.large-centered,
.columns.large-centered {
	@include grid-column($center:true, $collapse:null, $float:false );
}

// Push and pull for large-columns
@for $i from 2 through $total-columns - 2 {
	.row {
		.push-#{$i} {
			@include grid-column($push:$i, $collapse:false, $float:false, $minify:true ); }
		.pull-#{$i} {
			@include grid-column($pull:$i, $collapse:false, $float:false, $minify:true ); }
		&.collapse {
			.push-#{$i} {
				@include grid-column($push:$i, $collapse:true, $float:false, $minify:true ); }
			.pull-#{$i} {
				@include grid-column($pull:$i, $collapse:true, $float:false, $minify:true ); }
		}
	}
}

@include medium-up {
	@for $i from 2 through $total-columns - 2 {
		.small-push-#{$i} {
			left: inherit;
		}
		.small-pull-#{$i}  {
			right: inherit;
		}
	}
}

@include small {
	// Set all `large` columns to 100%
	.row .column,
	.row .columns,
	.row.collapse .column,
	.row.collapse .columns {
		@include grid-column($columns: $total-columns, $minify: true);
		
		// Reset push and pull
		&[class*="push"], &[class*="pull"] {
			left  : auto;
			right : auto;
		}
	}
	
	// Reset large-offset
	.row {
		[class*="large-offset"] {
			margin-left : 0;
		}
	}

	// Small columns
	@for $i from 1 through $total-columns {
		.row .small-#{$i} {
			@include grid-column($columns:$i, $collapse:null, $float:false, $minify: true );
		}
	}
	
	// Small offset
	@for $i from 1 through $total-columns - 2 {
		.row {
			.small-offset-#{$i}, &.collapse .small-offset-#{$i} {
				@include grid-column($offset:$i, $collapse:null, $float:false );
			}
		}
	}
	.column.small-centered,
	.columns.small-centered {
		@include grid-column($center:true, $collapse:null, $float:false );
	}
}

}