/// Get the grid gutter at a given layout (breakpoint).
///
/// @param {String|null|Boolean} $layout-name [default] - One of $o-grid-layouts breakpoints e.g. S, M, L...
@function oGridGutter($layout-name: default) {
	// This layout was assigned a gutter directly
	@if map-get($o-grid-gutters, $layout-name) {
		@return map-get($o-grid-gutters, $layout-name);
	}

	// Checking the position of the layout in the list of layouts
	$layout-index: index($_o-grid-layout-names, $layout-name);

	// The first layout (S) should get the default gutter
	@if $layout-index == 1 {
		@return oGridGutter();
	}

	// No gutter found for this layout, let's try again with a smaller one
	$layout: nth($_o-grid-layout-names, $layout-index - 1);
	@return oGridGutter($layout);
}

/// Get the max width of a layout (breakpoint).
///
/// @example
///  .my-large-container { width: oGridGetMaxWidthForLayout(L); }
///
/// @param {String} $layout-name - one of $o-grid-layouts
/// @param {String} $grid-mode [$o-grid-mode]
@function oGridGetMaxWidthForLayout($layout-name, $grid-mode: $o-grid-mode) {
	$grid-is-responsive: $grid-mode != 'fixed';

	$index: index($_o-grid-layout-names, $layout-name);

	// Largest layout: return its width directly
	@if $index == length($_o-grid-layout-names) {
		@return $_o-grid-max-width;
	}

	// Smaller layouts:
	@if $grid-is-responsive {
		// - The grid is responsive (fluid or snappy):
		//   return the next larger layout width
		$next-layout: nth($_o-grid-layout-names, $index + 1);
		@return map-get($o-grid-layouts, $next-layout);
	} @else {
		// - The grid is fixed, return the current layout width
		@return map-get($o-grid-layouts, $layout-name);
	}
}

/// % width of an element in the grid
///
/// @example
///  .one-half   { width: oGridColspan(1/2); }      // 50%
///  .other-half { width: oGridColspan(one-half); } // 50%
///  .sidebar    { width: oGridColspan(5); }        // 41.66667%
///  .two-thirds { width: oGridColspan(2/3); }      // 66.66667%
///  .4-out-of-6 { width: oGridColspan(4, 6); }     // 66.66667%
///
/// @param {Number | String} $span - Number of columns the element spans over
/// @param {Number} $total-cols [$o-grid-columns] - Number of columns in the grid
///
/// @returns {Number} width of the element in the grid, in percents
@function oGridColspan($span, $total-cols: $o-grid-columns) {
	// Match the HTML helper API with human-friendly numbers
	@if $span == 'one-half' { $span: div(1, 2); }
	@if $span == 'one-quarter' { $span: div(1, 4); }
	@if $span == 'one-third' { $span: div(1, 3); }
	@if $span == 'two-thirds' { $span: div(2, 3); }
	@if $span == 'three-quarters' { $span: div(3, 4); }

	@if $span == 'full-width' {
		@return 100%;
	} @else {
		@if $span >= 1 {
			// A number of columns is supplied: converting it into a fraction
			// of the total number of columns
			@return percentage(div($span, $total-cols));
		} @else {
			// A fraction (1/2) or a number (0.5) is supplied:
			// converting it into a percentage
			@return percentage($span);
		}
	}
}

@function _oGridQuoteString($value) {
	@return '"#{$value}"';
}