// Variables

// Color system

// scss-docs-start brand-color-variables
$brand: #267aff !default;
// scss-docs-end brand-color-variables

// scss-docs-start auxiliary-color-variables
$purple: #995efc !default;
$blue-purple: #6575ff !default;
$blue: #29c3ff !default;
$cyan: #00cbb8 !default;
$yellow: #ffaa10 !default;
$orange: #ff8225 !default;
$orange-red: #ff6a4c !default;
$gray-offline: #7c879b !default;
// scss-docs-end auxiliary-color-variables

// scss-docs-start auxiliary-color-map
$auxiliary-colors: (
  'purple': $purple,
  'blue-purple': $blue-purple,
  'blue': $blue,
  'cyan': $cyan,
  'yellow': $yellow,
  'orange': $orange,
  'orange-red': $orange-red,
  'gray-offline': $gray-offline
) !default;
// scss-docs-end auxiliary-color-map

// scss-docs-start black-gray-color-variables
$dark-black: #000000 !default;
$black: #232323 !default;
$dark-gray: #666666 !default;
$gray: #8a8a8f !default;
$light-gray: #c7c7cc !default;
$spliter-gray: #f2f2f2 !default;
$background-gray: #f9f9f9 !default;
$auxiliary-gray: #E5E5E8 !default;
$white: #ffffff !default;
// scss-docs-end black-gray-color-variables

// scss-docs-start black-gray-color-map
$black-gray-colors: (
  'dark-black': $dark-black,
  'black': $black,
  'dark-gray': $dark-gray,
  'gray': $gray,
  'light-gray': $light-gray,
  'spliter-gray': $spliter-gray,
  'background-gray': $background-gray,
  'white': $white
) !default;
// scss-docs-end black-gray-color-map

// scss-docs-start functional colors
$warning: #ff8225 !default;
$success: #25cf42 !default;
$error: #ff3b30 !default;
// scss-docs-end functional colors

// scss-docs-start functional-color-map
$functional-colors: (
  'warning': $warning,
  'success': $success,
  'error': $error
) !default;
// scss-docs-end functional-color-map

// scss-docs-start purple-color-variables
$purple-01: #eee8f8 !default;
$purple-02: #e0d2f9 !default;
$purple-03: #d2bbfa !default;
$purple-04: #c4a4fb !default;
$purple-05: #b58cfa !default;
$purple-06: #ab7cfb !default;
$purple-07: #a26dfb !default;
$purple-08: #995efc !default;
$purple-09: #8954e2 !default;
$purple-10: #7a4bc9 !default;
// scss-docs-end purple-color-variables

// scss-docs-start purple-color-map
$purples: (
  'purple-01': $purple-01,
  'purple-02': $purple-02,
  'purple-03': $purple-03,
  'purple-04': $purple-04,
  'purple-05': $purple-05,
  'purple-06': $purple-06,
  'purple-07': $purple-07,
  'purple-08': $purple-08,
  'purple-09': $purple-09,
  'purple-10': $purple-10
) !default;
// scss-docs-end purple-color-map

// scss-docs-start blue-color-variables
$blue-01: #e9ebf9 !default;
$blue-02: #d3d7fa !default;
$blue-03: #bdc4fb !default;
$blue-04: #a7b0fc !default;
$blue-05: #909cfd !default;
$blue-06: #818ffd !default;
$blue-07: #7382fe !default;
$blue-08: #6575ff !default;
$blue-09: #5a69e5 !default;
$blue-10: #505dcc !default;
// scss-docs-end blue-color-variables

// scss-docs-start blue-color-map
$blues: (
  'blue-01': $blue-01,
  'blue-02': $blue-02,
  'blue-03': $blue-03,
  'blue-04': $blue-04,
  'blue-05': $blue-05,
  'blue-06': $blue-06,
  'blue-07': $blue-07,
  'blue-08': $blue-08,
  'blue-09': $blue-09,
  'blue-10': $blue-10
) !default;
// scss-docs-end blue-color-map

// scss-docs-start brand-blue-color-variables
$brand-blue-01: #e3ebf9 !default;
$brand-blue-02: #c4d9fa !default;
$brand-blue-03: #a4c6fb !default;
$brand-blue-04: #85b3fc !default;
$brand-blue-05: #659ffd !default;
$brand-blue-06: #4f93fd !default;
$brand-blue-07: #3a86fe !default;
$brand-blue-08: #267aff !default;
$brand-blue-09: #226de5 !default;
$brand-blue-10: #2568d3 !default;
// scss-docs-end brand-blue-color-variables

// scss-docs-start brand-blue-color-map
$brand-blues: (
  'brand-blue-01': $brand-blue-01,
  'brand-blue-02': $brand-blue-02,
  'brand-blue-03': $brand-blue-03,
  'brand-blue-04': $brand-blue-04,
  'brand-blue-05': $brand-blue-05,
  'brand-blue-06': $brand-blue-06,
  'brand-blue-07': $brand-blue-07,
  'brand-blue-08': $brand-blue-08,
  'brand-blue-09': $brand-blue-09,
  'brand-blue-10': $brand-blue-10
) !default;
// scss-docs-end brand-blue-color-map

// scss-docs-start lake-blue-color-variables
$lake-blue-01: #e3f3f9 !default;
$lake-blue-02: #c4ebfa !default;
$lake-blue-03: #a5e3fb !default;
$lake-blue-04: #87dbfc !default;
$lake-blue-05: #67d3fd !default;
$lake-blue-06: #52cdfd !default;
$lake-blue-07: #3dc8fe !default;
$lake-blue-08: #29c3ff !default;
$lake-blue-09: #25b3eb !default;
$lake-blue-10: #22a3d6 !default;
// scss-docs-end lake-blue-color-variables

// scss-docs-start lake-blue-color-map
$lake-blues: (
  'lake-blue-01': $lake-blue-01,
  'lake-blue-02': $lake-blue-02,
  'lake-blue-03': $lake-blue-03,
  'lake-blue-04': $lake-blue-04,
  'lake-blue-05': $lake-blue-05,
  'lake-blue-06': $lake-blue-06,
  'lake-blue-07': $lake-blue-07,
  'lake-blue-08': $lake-blue-08,
  'lake-blue-09': $lake-blue-09,
  'lake-blue-10': $lake-blue-10
) !default;
// scss-docs-end lake-blue-color-map

// scss-docs-start cyan-color-variables
$cyan-01: #dff3f1 !default;
$cyan-02: #baede8 !default;
$cyan-03: #95e6df !default;
$cyan-04: #70e0d5 !default;
$cyan-05: #4ad8cb !default;
$cyan-06: #31d4c4 !default;
$cyan-07: #18cfbe !default;
$cyan-08: #00cbb8 !default;
$cyan-09: #00c0ae !default;
$cyan-10: #00b6a5 !default;
// scss-docs-end cyan-color-variables

// scss-docs-start cyan-color-map
$cyans: (
  'cyan-01': $cyan-01,
  'cyan-02': $cyan-02,
  'cyan-03': $cyan-03,
  'cyan-04': $cyan-04,
  'cyan-05': $cyan-05,
  'cyan-06': $cyan-06,
  'cyan-07': $cyan-07,
  'cyan-08': $cyan-08,
  'cyan-09': $cyan-09,
  'cyan-10': $cyan-10
) !default;
// scss-docs-end cyan-color-map

// scss-docs-start green-color-variables
$green-01: #e3f4e6 !default;
$green-02: #c3eeca !default;
$green-03: #a4e8af !default;
$green-04: #84e294 !default;
$green-05: #64db78 !default;
$green-06: #4fd766 !default;
$green-07: #39d253 !default;
$green-08: #25cf42 !default;
$green-09: #22be3c !default;
$green-10: #1fb038 !default;
// scss-docs-end green-color-variables

// scss-docs-start green-color-map
$greens: (
  'green-01': $green-01,
  'green-02': $green-02,
  'green-03': $green-03,
  'green-04': $green-04,
  'green-05': $green-05,
  'green-06': $green-06,
  'green-07': $green-07,
  'green-08': $green-08,
  'green-09': $green-09,
  'green-10': $green-10
) !default;
// scss-docs-end green-color-map

// scss-docs-start yellow-color-variables
$yellow-01: #f9f0e1 !default;
$yellow-02: #fae5be !default;
$yellow-03: #fbd99b !default;
$yellow-04: #fcce79 !default;
$yellow-05: #fdc155 !default;
$yellow-06: #fdb93e !default;
$yellow-07: #feb126 !default;
$yellow-08: #ffaa10 !default;
$yellow-09: #e5980e !default;
$yellow-10: #cc880c !default;
// scss-docs-end yellow-color-variables

// scss-docs-start yellow-color-map
$yellows: (
  'yellow-01': $yellow-01,
  'yellow-02': $yellow-02,
  'yellow-03': $yellow-03,
  'yellow-04': $yellow-04,
  'yellow-05': $yellow-05,
  'yellow-06': $yellow-06,
  'yellow-07': $yellow-07,
  'yellow-08': $yellow-08,
  'yellow-09': $yellow-09,
  'yellow-10': $yellow-10
) !default;
// scss-docs-end yellow-color-map

// scss-docs-start orange-color-variables
$orange-01: #f9ece3 !default;
$orange-02: #fadbc3 !default;
$orange-03: #fbc9a4 !default;
$orange-04: #fcb884 !default;
$orange-05: #fda564 !default;
$orange-06: #fd994f !default;
$orange-07: #fe8d39 !default;
$orange-08: #ff8225 !default;
$orange-09: #e57421 !default;
$orange-10: #cc681d !default;
// scss-docs-end orange-color-variables

// scss-docs-start orange-color-map
$oranges: (
  'orange-01': $orange-01,
  'orange-02': $orange-02,
  'orange-03': $orange-03,
  'orange-04': $orange-04,
  'orange-05': $orange-05,
  'orange-06': $orange-06,
  'orange-07': $orange-07,
  'orange-08': $orange-08,
  'orange-09': $orange-09,
  'orange-10': $orange-10
) !default;
// scss-docs-end orange-color-map

// scss-docs-start orange-red-color-variables
$orange-red-01: #f8e9e6 !default;
$orange-red-02: #f9d4cc !default;
$orange-red-03: #fabeb3 !default;
$orange-red-04: #fba899 !default;
$orange-red-05: #fb927e !default;
$orange-red-06: #fc836c !default;
$orange-red-07: #fc745a !default;
$orange-red-08: #ff6a4c !default;
$orange-red-09: #e45c42 !default;
$orange-red-10: #cb523b !default;
// scss-docs-end orange-red-color-variables

// scss-docs-start orange-red-color-map
$orange-reds: (
  'orange-red-01': $orange-red-01,
  'orange-red-02': $orange-red-02,
  'orange-red-03': $orange-red-03,
  'orange-red-04': $orange-red-04,
  'orange-red-05': $orange-red-05,
  'orange-red-06': $orange-red-06,
  'orange-red-07': $orange-red-07,
  'orange-red-08': $orange-red-08,
  'orange-red-09': $orange-red-09,
  'orange-red-10': $orange-red-10
) !default;
// scss-docs-end orange-red-color-map

// scss-docs-start red-color-variables
$red-01: #f9e5e4 !default;
$red-02: #fac9c6 !default;
$red-03: #fbada8 !default;
$red-04: #fc908a !default;
$red-05: #fd736c !default;
$red-06: #fd6057 !default;
$red-07: #fe4d43 !default;
$red-08: #ff3b30 !default;
$red-09: #e5342b !default;
$red-10: #cc2f26 !default;
// scss-docs-end red-color-variables

// scss-docs-start red-color-map
$reds: (
  'red-01': $red-01,
  'red-02': $red-02,
  'red-03': $red-03,
  'red-04': $red-04,
  'red-05': $red-05,
  'red-06': $red-06,
  'red-07': $red-07,
  'red-08': $red-08,
  'red-09': $red-09,
  'red-10': $red-10
) !default;
// scss-docs-end red-color-map

// scss-docs-start monochrome-gradient-color-variables

// scss-docs-end monochrome-gradient-color-variables

// scss-docs-start complex-gradient-color-variables

// scss-docs-end complex-gradient-color-variables

// scss-docs-start transition
$duration: 0.36s !default;
$time-function: cubic-bezier(0.25, 0.46, 0.45, 0.94) !default;
// scss-docs-end transition

//scss-docs-start font-size
$font-size-10: 10px !default;
$font-size-12: 12px !default;
$font-size-14: 14px !default;
$font-size-16: 16px !default;
$font-size-18: 18px !default;
$font-size-28: 28px !default;
$font-size-48: 48px !default;

$font-size-large: $font-size-48 !default;
//scss-docs-end font-size

// scss-docs-start zindex-stack
$zindex-dropdown: 1000 !default;
$zindex-fixed: 1030 !default;
$zindex-offcanvas-backdrop: 1040 !default;
$zindex-offcanvas: 1045 !default;
$zindex-modal-backdrop: 1050 !default;
$zindex-modal: 1055 !default;
$zindex-sticky: 1060 !default;
$zindex-popover: 1070 !default;
$zindex-tooltip: 1080 !default;
// scss-docs-end zindex-stack

$spliter: 0.5px solid $spliter-gray !default;

$shadow-white-1: 0px 1px 15px 2px rgba($dark-black, 0.03) !default;
$shadow-white-2: 0px 2px 30px 4px rgba($dark-black, 0.04) !default;
$shadow-white-3: 0px 4px 50px 8px rgba($dark-black, 0.05) !default;

$shadow-gray-1: 0px 1px 15px 2px rgba($dark-black, 0.01) !default;
$shadow-gray-2: 0px 2px 30px 4px rgba($dark-black, 0.02) !default;
$shadow-gray-3: 0px 4px 50px 8px rgba($dark-black, 0.03) !default;

$padding-sm: 8px !default;
$padding-xxs: 3px !default;