// z-index
// ----------------------------

// @mixin z-index($layer){
//   $value: %('zindex-%s', $layer) !default;
//   z-index: $value;
// }
// @mixin z-index($layer, $step){
//   $value: %('zindex-%s', $layer) !default;
//   z-index: $value + $step;
// }


$zindex-layers: (
  "fullscreen":           9999,
  "tooltip":              1900,
  "popover":              1800,
  "modal":                1700,
  "modal-background":     1600,
  "modal-bg":             1600,
  "navbar-fixed":         1500,
  "navbar-sticky":        1500,
  "menubar":              1400,
  "overlay":              1300,
  "dropdown":             1200,
  "navbar":               1200,
  "header":               1100,
  "footer":               1000,
  "base":                 1,
  "init":                 0,
  "below":                -1
);
$step:                    0 !default;
@function zindex($layer,$step) {
  @if not map-has-key($zindex-layers,$layer) {
    @warn "No layer found for '#{$layer}' in $zindex-layers map. Property omitted.";
  }
  @return map-get($zindex-layers, $layer) + $step;
}


// How to use
// ===============

// .modal {
//   position: absolute;
//   z-index: zindex('modal', 0);
// }

// .modal2 {
//   position: absolute;
//   z-index: $zindex-fullscreen;
// }

// .modal3 {
//   position: relative;
//   z-index: zindex('fullscreen', 30);
// }