@import (reference) '../../../design/index.less';

.layout-sidebar {
  // overflow: hidden;

  &.fixed {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
  }

  &.ant-layout-sider-dark {
    background: @sider-dark-bg-color;

    .ant-layout-sider-trigger {
      color: darken(@white, 25%);
      background: @trigger-dark-bg-color;

      &:hover {
        color: @white;
        background: @trigger-dark-hover-bg-color;
      }
    }
  }

  &:not(.ant-layout-sider-dark) {
    // box-shadow: 2px 0 8px 0 rgba(29, 35, 41, 0.05);

    .ant-layout-sider-trigger {
      color: @text-color-base;
      border-top: 1px solid @border-color-light;
    }
  }

  .ant-layout-sider-zero-width-trigger {
    top: 40%;
    z-index: 10;
  }

  &__darg-bar {
    position: absolute;
    top: 0;
    right: -2px;
    z-index: @side-drag-z-index;
    width: 2px;
    height: 100%;
    cursor: col-resize;
    border-top: none;
    border-bottom: none;

    &.hide {
      display: none;
    }

    &:hover {
      background: @primary-color;
      box-shadow: 0 0 4px 0 rgba(28, 36, 56, 0.15);
    }
  }

  & .ant-layout-sider-trigger {
    height: 36px;
    line-height: 36px;
  }
}