//
// Copyright IBM Corp. 2016, 2018
//
// This source code is licensed under the Apache-2.0 license found in the
// LICENSE file in the root directory of this source tree.
//

@import './vendor/@rocketsoftware/elements/scss/layout/mini-unit';
@import './vendor/@rocketsoftware/elements/scss/layout/spacing';

//-------------------------------------------
// 🌌 Spacing
// ------------------------------------------
//
//   Size in px based on 16px base
//
//   Spacing Scale
//   ==========================================
//   4xs  ||  1px
//   3xs  ||  2px
//   2xs  ||  4px
//   xs   ||  8px
//   sm   ||  12px
//   md   ||  16px
//   lg   ||  24px
//   xl   ||  32px
//   2xl  ||  40px
//   3xl  ||  48px
//   ==========================================
//
//   Layout Scale
//   ==========================================
//   2xs  ||  16px
//   xs   ||  24px
//   sm   ||  32px
//   md   ||  48px
//   lg   ||  64px
//   xl   ||  96px
//   2xl  ||  160px
//   ==========================================

/// 1rem baseline spacing
/// @access public
/// @type Number
/// @group global-spacing
$spacing-baseline: 1rem !default;

/// 1px spacing in rem units
/// @access public
/// @type Number
/// @group global-spacing
$spacing-4xs: $spacing-baseline * 0.0625 !default;

/// 2px spacing in rem units
/// @access public
/// @type Number
/// @group global-spacing
$spacing-3xs: $spacing-baseline * 0.125 !default;

/// 4px spacing in rem units
/// @access public
/// @type Number
/// @group global-spacing
$spacing-2xs: $spacing-baseline * 0.25 !default;

/// 8px spacing in rem units
/// @access public
/// @type Number
/// @group global-spacing
$spacing-xs: $spacing-baseline * 0.5 !default;

/// 12px spacing in rem units
/// @access public
/// @type Number
/// @group global-spacing
$spacing-sm: $spacing-baseline * 0.75 !default;

/// 16px spacing in rem units
/// @access public
/// @type Number
/// @group global-spacing
$spacing-md: $spacing-baseline !default;

/// 24px spacing in rem units
/// @access public
/// @type Number
/// @group global-spacing
$spacing-lg: $spacing-baseline * 1.5 !default;

/// 32px spacing in rem units
/// @access public
/// @type Number
/// @group global-spacing
$spacing-xl: $spacing-baseline * 2 !default;

/// 40px spacing in rem units
/// @access public
/// @type Number
/// @group global-spacing
$spacing-2xl: $spacing-baseline * 2.5 !default;

/// 48px spacing in rem units
/// @access public
/// @type Number
/// @group global-spacing
$spacing-3xl: $spacing-baseline * 3 !default;

/// 16px layout in rem units
/// @access public
/// @type Number
/// @group global-spacing
$layout-2xs: $spacing-baseline !default;

/// 24px layout in rem units
/// @access public
/// @type Number
/// @group global-spacing
$layout-xs: $spacing-baseline * 1.5 !default;

/// 32px layout in rem units
/// @access public
/// @type Number
/// @group global-spacing
$layout-sm: $spacing-baseline * 2 !default;

/// 48px layout in rem units
/// @access public
/// @type Number
/// @group global-spacing
$layout-md: $spacing-baseline * 3 !default;

/// 64px layout in rem units
/// @access public
/// @type Number
/// @group global-spacing
$layout-lg: $spacing-baseline * 4 !default;

/// 96px layout in rem units
/// @access public
/// @type Number
/// @group global-spacing
$layout-xl: $spacing-baseline * 6 !default;

/// 160px layout in rem units
/// @access public
/// @type Number
/// @group global-spacing
$layout-2xl: $spacing-baseline * 10 !default;
