// ============================================================================
// :: Layout
// ============================================================================
/**
 * This file contains any layout and component options that should be globally
 * defined. These values are to be used within other components and help define
 * the layout and structure.
 */

// ============================================================================
// :: Dimensions
// ============================================================================
$container-width: 1440px;
$container-width-small: 840px;
$container-width-extra-small: 650px;

// ============================================================================
// :: Z-index
// ============================================================================
$z-index-lowest: -1;
$z-index-lower: 0;
$z-index-low: 1;

$z-index-base: 10;

$z-index-high: 100;
$z-index-higher: 1000;
$z-index-highest: 9999;

// ============================================================================
// :: Border
// ============================================================================
$border-default: 1px solid $border-color-grey;
$border-default-m: 2px solid $border-color-grey;
$border-light: 3px solid $border-color-grey-extra-light;
$border-default-m-extra-light: 2px solid $grey-extra-light;
$border-error: 1px solid $ui-color-error;
$border-error-m: 2px solid $ui-color-error;
$border-primary: 1px solid $border-color-primary;
$border-white: 1px solid rgba($border-color-white, 0.5);
$border-light-white: 3px solid rgba($border-color-white, 0.1);

$border-radius-round: 50%;
$border-radius-xs: 0.2rem;
$border-radius-s: 0.3rem;
$border-radius-m: 0.5rem;
$border-radius: 2rem;
$border-radius-l: 2.5rem;
$border-radius-xl: 2.7rem;

// ============================================================================
// :: Box Shadow
// ============================================================================
$box-shadow: 0 0 50px 0 rgba(15,13,9,0.08);
$box-shadow-overlay: 2px 0 10px 0 rgba(15,13,9,0.15);
$box-shadow-header: 0 0 10px 0 rgba(15,13,9,0.25);
$box-shadow-tab: 2px 0 30px 0 rgba(15,13,9,0.15);

// ============================================================================
// :: Text Shadow
// ============================================================================
$text-shadow: 0 0.7rem 2rem rgba(0,0,0,0.3);
$text-shadow-dark: 0 0 2rem rgba(0,0,0,0.9);