playlist {
  display: flex;
  flex-direction: column;

  div {
    padding: unset;
    position: unset;
  }

  .pagination {
    display: flex;
    justify-content: flex-end;
    font-size: 1.5em;
    padding: 5px;

    .item {
      cursor: pointer;
      user-select: none;
      border-radius: 5px;
      margin: 0 3px;

      &.inactive {
        color: #aaa;
        pointer-events: none;
        cursor: not-allowed;
      }

      &:hover {
        color: #006ea8;
      }
    }
  }

  .playlist-item {
    display: flex;
    padding: 5px;
    border-bottom: 1px solid #dcdcdc;
    cursor: pointer;

    &-title {
      margin-left: 10px;
      padding: 5px;
      display: flex;
      align-items: center;
    }

    &-number {
      padding: 5px 10px 5px 5px;
      border-right: 1px solid #ff3232;
      width: 50px;
    }

    &:hover {
      background-color: rgba(0, 0, 0, .4);
    }
  }
}