@import "mixins/tools.functions";

// The following breakpoint values will be used by default, but can be
// overridden by projects that consume the pattern library. To override them
// copy and paste these variables into your project (i.e. PageBuilder), remove
// the !default keywords, and modify them to suit your needs. Make sure you
// declare your overrides before importing this file. For example:
//
// $break-mobile: 400px;
// @import "settings.breakpoints";
//
// See https://robots.thoughtbot.com/sass-default

$break-mobile: 320px !default;
$break-mobile-medium: 360px !default;
$break-mobile-wide: 570px !default;
$break-tablet: 768px !default;
$break-tablet-medium: 980px !default;
$break-tablet-wide: 1023px !default;
$break-desktop: 1280px !default;
$break-desktop-wide: 1400px !default;

$mq-breakpoints: (
  mobile: $break-mobile,
  mobileMedium: $break-mobile-medium,
  mobileWide: $break-mobile-wide,
  tablet: $break-tablet,
  tabletMedium: $break-tablet-medium,
  tabletWide: $break-tablet-wide,
  desktop: $break-desktop,
  desktopWide: $break-desktop-wide
) !default;

// Contains default $mq-breakpoints hashmap, which we're overriding with the above
@import "settings.vendor.sass-mq";

// Max container widths (for horizontally centering the page in the viewport, etc.)
// TODO: Maybe we can eliminate this variable?
$max-container-width-desktop: 1260px !default;
