@import "../menu/menu.ios.vars";
@import "../menu/menu.md.vars";

.menu-content {
  @include transform(translate3d(0, 0, 0));
}

.menu-content-open {
  cursor: pointer;
  touch-action: manipulation;

  // the containing element itself should be clickable but
  // everything inside of it should not clickable when menu is open
  pointer-events: none;
}

.ios .menu-content-reveal {
  box-shadow: $menu-ios-box-shadow-reveal;
}

[dir=rtl].ios .menu-content-reveal {
  box-shadow: $menu-ios-box-shadow-reveal-rtl;
}

.ios .menu-content-push {
  box-shadow: $menu-ios-box-shadow-push;
}

.md .menu-content-reveal {
  box-shadow: $menu-md-box-shadow;
}

.md .menu-content-push {
  box-shadow: $menu-md-box-shadow;
}