@import '../../static/styles/common/vars.os.less';

.card-sidebar {
  width: 100%;
  height: 100vh;
  border-radius: unset !important;
  box-shadow: none !important;
  z-index: 9;
  > .@{ant-prefix}-card-body {
    position: relative;
    padding: 0 8px !important;
    height: 100%;
    .wrapper-sidebar {
      height: 100%;
      flex-flow: column !important;
      justify-content: space-between;
    }
  }
  .card-app-icon {
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 12px !important;
    cursor: pointer;
    .@{ant-prefix}-card-body {
      padding: 8px !important;
    }
    &:hover,
    &.active {
      background: rgba(249, 87, 94, 0.1) !important;
    }
  }
}

.notification-item {
  padding: 8px 24px !important;
  &:hover {
    cursor: pointer;
  }
}

#light {
  .card-sidebar {
    background: @WHITE !important;
  }
  .notification-item {
    &:hover {
      background: @NEUTRAL10;
    }
  }
}

#dark {
  .card-sidebar {
    background: @NEUTRAL100 !important;
  }
  .notification-item {
    &:hover {
      background: @NEUTRAL95;
    }
  }
}