$bz-sidebar-width: 64px;

@import "./sidebar-badge";
@import "./sidebar-footer";
@import "./sidebar-footer-item";
@import "./sidebar-item";
@import "./sidebar-responsive-container";
@import "./sidebar-responsive-header";
@import "./sidebar-user";
@import "./sidebar-panel";
@import "./sidebar-panel-action";
@import "./sidebar-panel-item";
@import "./sidebar-panel-subitem";

.bz-sidebar-container {
  height: 100%;
  display: flex;
  flex-direction: row;
  overflow: hidden;
}

.bz-sidebar-content {
  height: 100%;
  border-radius: 8px;
  box-shadow: -2px 0 50px 0 rgba(0,0,0,0.2);
  flex-grow: 1;
  overflow: auto;
}

.bz-sidebar {
  height: 100%; // de pronto no se necesita
  background-color: $bz-theme-400;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  width: $bz-sidebar-width;
  min-width: $bz-sidebar-width;
  z-index: 0;

  &__brand-icon {
    display: flex;
    min-height: $bz-sidebar-width;
    padding: $bz-space-inset-m;
    .bz-icn, &:hover .bz-icn {
      fill: $bz-neutral-100;
    }
  }

  &__list {
    flex-direction: column;
    flex-grow: 1;
    overflow-x: hidden;
    overflow-y: auto;
    .bz-icn {
      fill: $bz-neutral-100;
    }
  }

  &__footer {
    display: flex;
    flex-direction: column;
  }
}