// Base font size
$base-font-size: 16px;

// primary font stack
$font-stack: 'Montserrat', Arial, sans-serif !default;
$font-weight: (
  regular: 400,
  heading: 600,
) !default;

//Font sizes presets (mobile, desktop)
$font-sizes: (
  xs:   (14px, 14px),
  sm:   (16px, 16px),
  md:   (18px, 20px),
  lg:   (22px, 24px),
  xl:   (26px, 28px),
  xxl:  (28px, 32px),
  xxxl: (36px, 48px)
) !default;

$font-size-reponsive-breakpoint: 'lg';

// Lineheight mapping
$line-height: (
  nospace: 1,
  default: 1.25,
  paragraph: 1.5,
) !default;

$transitions: (
  base: all 0.25s ease-in-out,
  card: box-shadow 0.25s ease-in-out
) !default;

$border-radii: (
  none: 0,
  default: 4px,
  tag: 13px,
  round: 50%,
) !default;

$border-width: (
  none: 0,
  sm: 1px,
  md: 2px,
  lg: 4px,
  highlight: 6px,
) !default;

// Spacing - Used with margin and padding
$spacing-sizes: (
  none:   0,    //0rem
  xs:     8px,  //0.5rem
  sm:     12px, //0.8rem
  md:     16px, //1rem
  lg:     24px, //1.5rem
  xl:     32px, //2rem
  xxl:    48px, //3rem
  xxxl:   64px, //4rem
  xxxxl:  80px  //5rem
) !default;

// Predefined Colours and their names
// Brand
$nsw-primary-blue: #002664 !default;
$nsw-primary-highlight: #d7153a !default;
$nsw-secondary-blue: #2e5299 !default;

// Shades
$black: #000000 !default;
$dark80: #333333 !default;
$dark70: #4c4f55 !default;
$dark60: #6d7079 !default;
$light40: #a0a5ae !default;
$light20: #e4e4e6 !default;
$light10: #f4f4f7 !default;
$white: #ffffff !default;

// Utility colors
$info: $nsw-secondary-blue !default;
$info-background: #eaedf4 !default;
$success: #00a908 !default;
$success-background: #e5f6e6 !default;
$warning: #dc5800 !default;
$warning-background: #fbeee5 !default;
$critical: #b81237 !default;
$critical-background: #f7e7eb !default;
$focus-color: #0085b3 !default;
$hover-colour: rgba($focus-color, 0.2);
$link-color: $nsw-primary-blue;
$link-visited: #551a8b;

$focus-offset: 3px;

$border-colors: (
  brand: $nsw-primary-blue,
  light: $light20,
  medium: $light40,
  dark: $dark80,
  highlight: $nsw-primary-highlight,
) !default;

//Box Shadows
$shadows: (
  menu: 0 4px 9px -5px rgba($black, 0.4),
  card: 0 4px 12px 0 rgba($black, 0.15),
  card-hover: 2px 6px 12px 0 rgba($black, 0.25),
) !default;

// Breakpoints
$breakpoints: (
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px,
) !default;

// z-index
$z-index: (
  top: 900,
  upper: 300,
  middle: 200,
  base: 100,
  below: -100,
) !default;


// Container
$container-offset: 16px;
$container-max-width: 1200px;

// Layout
$layout-gap: 32px;
$layout-sidebar-minwidth: 224px;
$layout-sidebar-maxwidth: 25%;

// Grid
$grid-gutters: 8px;
$grid-container-offset: -($grid-gutters);
$grid-margins: (
  xs: 8px,
  sm: 8px,
  md: 8px,
  lg: 32px,
  xl: 32px,
);
$grid-col-sizes: (
  sm: (
    half: 50%,
  ),
  md: (
    third: 33.3%,
    two-thirds: 66.6%,
    quarter: 50%,
    three-quarters: 50%
  ),
  lg: (
    quarter: 25%,
    three-quarters: 75%
  )
);

// Notification variations
$notification: (
  info: (
    border: $info,
    background: $info-background,
    fill: $info,
  ),
  success: (
    border: $success,
    background: $success-background,
    fill: $success,
  ),
  warning: (
    border: $warning,
    background: $warning-background,
    fill: $warning,
  ),
  error: (
    border: $critical,
    background: $critical-background,
    fill: $critical,
  ),
) !default;

// Overlays
$overlays: (
  light: rgba($white, 0.8),
  dark: rgba($black, 0.8)
) !default;

$icon-colors: (
  error: $critical,
  success: $success,
  info: $info,
  warning: $warning,
  default: $nsw-primary-blue,
) !default;

$button-variations: (
  primary: (
    text-color: $white,
    text-color-hover: $white,
    background: $nsw-primary-blue,
    background-hover: lighten($nsw-primary-blue, 5.88),
    border: $nsw-primary-blue,
    border-hover: lighten($nsw-primary-blue, 5.88)
  ),
  highlight: (
    text-color: $white,
    text-color-hover: $white,
    background: $nsw-primary-highlight,
    background-hover: lighten($nsw-primary-highlight, 5.88),
    border: $nsw-primary-highlight,
    border-hover: lighten($nsw-primary-highlight, 5.88)
  ),
  outline: (
    text-color: $dark80,
    text-color-hover: $white,
    background: $white,
    background-hover: $nsw-primary-blue,
    border: $nsw-primary-blue,
    border-hover: $nsw-primary-blue
  ),
  white: (
    text-color: $dark80,
    text-color-hover: $dark80,
    background: $white,
    background-hover: $light20,
    border: $white,
    border-hover: $light20
  ),
) !default;

$sitewide-message: (
  default: (
    text-color: $white,
    background: $nsw-secondary-blue,
  ),
  light: (
    text-color: $dark80,
    background: $info-background,
  ),
  critical: (
    text-color: $white,
    background: $critical,
  ),
) !default;

$icons: (
  chevron-right: '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="32" viewBox="0 0 20 32"><path d="M20 16l-16-16-4 4 12 12-12 12 4 4 16-16z"></path></svg>',
  chevron-down: '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path d="M16 26l16-16-4-4-12 12-12-12-4 4 16 16z"></path></svg>',
  chevron-left: '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="32" viewBox="0 0 20 32"><path d="M0 16l16-16 4 4-12 12 12 12-4 4-16-16z"></path></svg>',
  chevron-up: '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path d="M16 6l16 16-4 4-12-12-12 12-4-4 16-16z"></path></svg>',
  tick: '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path d="M29.362 3.742l-18.867 19.204-7.857-7.997-2.638 2.685 9.175 9.34 1.319 1.284 1.318-1.284 20.187-20.547z"></path></svg>',
  error: '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path d="M16 32c4.243 0 8.313-1.686 11.314-4.686 3-3.001 4.686-7.070 4.686-11.314s-1.686-8.313-4.686-11.314c-3.001-3-7.070-4.686-11.314-4.686s-8.313 1.686-11.314 4.686c-3 3.001-4.686 7.070-4.686 11.314s1.686 8.313 4.686 11.314c3.001 3 7.070 4.686 11.314 4.686zM16 7c0.809 0 1.538 0.487 1.848 1.234s0.138 1.608-0.434 2.18c-0.572 0.572-1.432 0.744-2.18 0.434s-1.234-1.039-1.234-1.848c0-1.104 0.896-2 2-2zM14 14h4v11h-4v-11z"></path></svg>'
) !default;