/** =================================================================================================
 *  The 'z-index-map' is used for managing the elements stacking order in the 'root' stacking context
 *  This way we have a overview of all the z-index values that are used across the project.
 ==================================================================================================== */


$z-index: (
  visible-grid: 10000,
  cookie: 9999,
  header: 50,
  body: 40,
  footer: 20,
  subfooter: 10,
);


/**
    USAGE:

    @include z(z-modal);

 */

@mixin z($label) {
  z-index: map-get($z-index, $label);
}