.main {
  .name {
    margin-right: 24px;
  }
  .toggle {
    margin-left: auto;
    button {
      display: block;
      width: 20px;
      height: 20px;
      padding: 0;
      background: transparent url('~src/assets/images/icons/expand_less_20.svg') 50% 50% no-repeat;
      transform: rotateZ(180deg);
      transition: transform 0.3s;
      &.less {
        transform: rotateZ(0);
      }
    }
  }
  .state {
    display: inline-block;
    padding: 0 8px;
    border-radius: 10px;
    background-color: #777777;
    color: #ffffff;
    font-size: 0.875rem;
    font-weight: 700;
    &.active {background-color: #28A814;}
    &.suspended,&.cancelled {background-color: #D9235F;}
  }
}

.details {
  padding: 16px 0 0;
}

.block {
  margin-bottom: 16px;
  &:last-child {margin-bottom: 0}
  &.row {
    display: flex;
    flex-direction: row;
    align-items: center;
  }
}
