:host {
  display: block;
}

.drag-item {
  display: flex;
  background: #ffffff;
  border: 1px solid #ebeff3;
  box-shadow: 0px 2px 4px rgba(18, 52, 77, 0.06);
  border-radius: 4px;
  padding-inline: 12px;
  padding-block: 8px;
  align-items: center;
  margin-inline: 0px;
  margin-block: 8px;

  .drag-item__label {
    flex: 1 1 auto;
  }

  .drag-item__prefix {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
  }

  .drag-item__suffix {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
  }

  .drag-icon {
    padding-inline-end: 12px;

    &.drag {
      &:hover,
      &:focus {
        cursor: grab;
      }
    }
  }
}
