@import '~amos-framework/lib/styles/mixins/scrollbar.scss';
@import '../index.scss';

$scrollOutColor: rgba(#dedede, 0.3);
$scrollInnerColor: rgba(black, 0.1);

.mods-com-firepanal {
  width: 100%;
  height: 100%;
  /* stylelint-disable-next-line declaration-no-important */
  background: $background-transparent !important;

  .mods-com-firepanal-header {
    display: flex;
    align-items: center;
    width: 100%;
    height: 42px;
    line-height: 42px;
    background: $header-background;
    border: solid 1px $border-color-eaeaea;
    border-left: 0;

    .mods-com-firepanal-leftbtns {
      display: flex;
      align-items: center;
      height: 100%;
      padding-left: 17px;

      .eb-com-btn {
        margin-right: 20px;
      }
    }

    .mods-com-firepanal-rightbtns {
      display: flex;
      align-items: center;
      height: 100%;
      padding-right: 24px;

      .eb-com-btn {
        margin-left: 20px;
      }
    }
  }

  .mods-com-firepanal-content {
    position: relative;
    width: 100%;
    height: calc(100% - 42px);

    .mods-com-firepanal-page {
      width: 100%;
      height: 100%;
      background: $background-transparent;
    }

    .amos-sidepane {
      z-index: 200;
      height: 100%;
      background: white;
      border-left: solid 1px $border-color-eaeaea;
    }
  }
}

.mods-com-firepanal-sebar {
  @include pretty-scrollbar(5px, 8px, $scrollOutColor, $scrollInnerColor);

  width: 100%;
  height: 100%;
  overflow: auto;
  background: $firepanal-sebar-background;
  border-left: solid 1px #eaeaea;
}
