// -------------------------------------------------------------------
// :: z-indexes
// -------------------------------------------------------------------

// these z-indexes are pre-defined to prevent a wildspread of z-indexes
// try to avoid adding new z-index here, if needed you can always use $z-index-base + 1

$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;

// to use a z-index in a project, assign one of the pre-defined indexes to a variable that describes where the z-index is being used.
// this way we have a nice overview of the indexes of all the different components in the project.

$z-index-modal: $z-index-highest;
$z-index-header: $z-index-highest;
$z-index-menu: calc(#{$z-index-highest} - 1);