@import '../../Pages/MainLayout/themes.scss';

.main-layout {
  width: 100%;
  height: auto;
  min-height: 100%;
  display: flex;
  flex-flow: row nowrap;
  .main {
    max-width: 100%;
    margin-top: 5rem;
    transition: margin-left 0.33s ease;
    flex: 1 1 auto;
    background-color: #fafafa;
    @include themify($themes) {
      color: themed('textColor');
      background-color: themed('backgroundMainColor');
    }
    .label-collapse {
      width: 100%;
      height: 100%;
    }
    &-row {
      display: flex;
    }
    .content {
      background: white;
      position: relative;
      height: 100%;
    }
  }
  @media screen and (min-width: 768px) {
    &.fixed-sidebar .collapsed + .main {
      margin-left: 4rem;
    }
    &.fixed-sidebar .expanded + .main {
      margin-left: 18rem;
    }
    [name='notification'] {
      z-index: 1000;
    }
  }
}