
// @optional core/layout/layout.scss
// @optional widgets/card/card.scss

//FIXME: Doesn't work properly inside a nested layout (shouldn't influence the parent layouts)
//FIXME: Pinning doesn't work with nested layouts
//TODO: Add a class that makes the panel stays below the toolbar, in that case the toolbar should have an higher z-index than the panel probably, or maybe pulling it down it's enough (probably not since the background is much larger than the visible part)

/* PANEL */

.panel {
  @include z-depth ( $panel-z-depth, $panel-z-depth-force, $panel-z-depth-basic );
  position: fixed;
  z-index: $panel-z-index !important;
  margin: 0;
  border-radius: 0 !important;
  transition: transform $panel-animation-duration;
}

/* BACKDROP */

.panel-backdrop {

  /* OBSCURED */

  &:before {
    position: fixed !important;
    cursor: pointer !important;
    z-index: $panel-z-index - 1 !important;
    transition-duration: $panel-animation-duration !important;
  }

}

/* LAYOUT */

.panel-layout {

  transition: padding $panel-animation-duration;

  /* STICKY HEADER */

  &.layout.vertical > .layout-header.sticky {
    transition: none; // Safari fix
    transition-property: top, right, bottom, left;
    transition-duration: $panel-animation-duration;
  }

}
