.new-workflow_action_definition-button
  display: inline-block
  margin-left: 12px
  .icon
    margin-right: 12px

.workflow_group-name
  padding-right: rem-calc(10)

.workflow-instance-workflow-groups-container
  display: flex
  flex-direction: row
  flex-wrap: wrap
  align-items: flex-start
  justify-content: space-around

.workflow-instance-workflow-group-container
  @extend .title-box
  //float: left
  width: 412px
  padding-bottom: 0
  .workflow-instance-workflow-group-title
    @extend .title-box-heading
    margin-bottom: 0
    .right.floated.buttons
      margin-right: -12px

  .workflow-instance-workflow-group-body
    .display-row
      &.attribute-notes
        display: none
    .display-label
      width: 65%
    .display-field
      width: 35%
    .page-actions
      //display: none
      text-align: center
      .collection-edit
        margin: 0
        padding: 5px 12px
    .workflow-action-container
      border-bottom: 1px solid #eee
      margin-left: -15px
      margin-right: -15px
      &:last-child
        border-width: 0
      .ui.grid
        margin: 0
      &.planned
        background-color: #ddd
      &.overdue
        background-color: #f7da00
      &.processing
        background-color: #cef
      &.rejected
        background-color: #ff4848
      &.completed
        background-color: #f2ffdd
  &.processing
    @extend .title-box-primary
  &.rejected
    @extend .title-box-danger
  &.completed
    @extend .title-box-success
  &.overdue
    @extend .title-box-warning

.modal
  .workflow-instance-workflow-group-container
    width: 242px