.to-do-list{
  @extend %box-appearance;
  border: none;
  li{
    @extend %flex;
    @extend %align-items-center;
    @extend %justify-content-space-between;
    min-height: 2*$box-padding;
    &>.list-item-buttons{
      @extend %order-3;
      @extend %flex;
      @extend %flex-direction-column;
      opacity: 0;
    }
    &>.list-item-text{
      @extend %flex-grow-1;
      margin: 0 .25*$box-padding;
    }
    &:hover{
      &>.list-item-buttons{
        opacity: 1;
      }
    }
  }
  .toolbar-bottom {
    padding: $gap 0;
  }
  .ui-state-default {
    padding: 0.5*$gap 1.5*$gap !important;
  }
  .link-list {
    padding-bottom: 0;
  }
}