@include export-module('co-transaction-text-line-layout') {
  .co-transaction-text-line {
    display: flex;
    align-items: center;
    column-gap: $tp-transaction-text-line-column-gap;
    padding: $tp-transaction-text-line-column-padding;
    .transaction-line-text {
      cursor: pointer;
    }

    .transaction-line-delete {
      display: flex;
      flex-direction: row;
      column-gap: 5px;
      flex-basis: 50px;

      .delete-wrapper {
        cursor: pointer;
        display: flex;
        flex-direction: row;
        align-items: center;
      }
    }

    .delete-icon, .link-icon {
      cursor: pointer;
      height: $tp-transaction-text-line-delete-icon-size;
      width: $tp-transaction-text-line-delete-icon-size;

      &.active {
        svg { // for fontawesome icons
          fill: $tp-color-action;
        }
        & [fill] { // for own icons
          fill: $tp-color-action;
        }
      }
    }

    .color-block {
      height: 20px;
      width: 5px;
    }
  }
}
