$navigation-width: 240px !default;

////
/// Layout
/// @group foundation/layout
////

$layout-width-data: (
  primary: (
    min: rem(480px),
    max: rem(662px),
  ),
  secondary: (
    min: rem(240px),
    max: rem(320px),
  ),
  one-half-width: (
    base: rem(450px),
  ),
  one-third-width: (
    base: rem(240px),
  ),
  nav: (
    base: rem($navigation-width),
  ),
  page-with-nav: (
    base: rem(769px),
  ),
  page-content: (
    not-condensed: rem(680px),
    partially-condensed: rem(450px),
  ),
  inner-spacing: (
    base: spacing(),
  ),
  outer-spacing: (
    min: spacing(loose),
    max: spacing(extra-loose),
  ),
);

/// Returns the widths of the specified column.
/// @param {String} $name - The column name.
/// @return {Number} The width for the column.

@function layout-width($name, $value: base) {
  $fetched-value: map-get(map-get($layout-width-data, $name), $value);

  @if type-of($fetched-value) != null {
    @return $fetched-value;
  } @else {
    @error 'Column `#{$name} - #{$value}` not found. Available columns: #{available-names($layout-width-data)}';
  }
}

$dismiss-icon-size: 32px;

@function top-bar-height() {
  @return rem(56px);
}

@function mobile-nav-width() {
  @return calc(100vw - #{rem($dismiss-icon-size) + spacing() * 2});
}

@function nav-min-window-corrected() {
  @return rem(769px);
}