@include export-module('co-transaction-line-direct-sell-layout') {
  .co-transaction-line-direct-sell {
    .available-stock-wrapper {
      display: flex;
      column-gap: 20px;
      user-select: none;
    }
    .warehouse-cc-tab-content-wrapper {
      height: 100%;
      overflow-y: auto;
    }
    .stock-list-item, .available-stock-wrapper {
      cursor: pointer;
      height: $tp-transaction-line-direct-sell-stock-item-height;
      border-style: $tp-transaction-line-direct-sell-stock-item-border-style;
      border-width: $tp-transaction-line-direct-sell-stock-item-border-width;
      border-radius: $tp-transaction-line-direct-sell-stock-item-border-radius;
      margin: $tp-transaction-line-direct-sell-stock-item-margin;
      padding: $tp-transaction-line-direct-sell-stock-item-padding;
    }
    .forecast-table {
      display: flex;
      flex-direction: column;
    }
    .forecast-row {
      display: flex;
      flex-direction: row;
      align-items: center;
      margin: 0;
    }
    .forecast-row.header {
      font-weight: bold;
      margin: 10px 0;
    }
    .forecast-cell {
      flex: 1 1 0;
      padding: 0 5px;
      text-align: left;
    }
    .forecast-cell.checkbox-cell {
      flex: 0 0 20px;
      text-align: center;
      padding: 0;
    }
    .loader-wrapper {
      position: absolute;
      top: 0;
      left: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 100%;
      z-index: 2;
      backdrop-filter: blur(2px);
      .co-loader {
        display: block;
        width: 50px;
        height: 50px;
      }
    }
  }
}