<div
  class="product-stock-info-row"
  data-what="stock-info-row"
  data-which="current-stock"
>
  <div
    class="isa-text-body-2-regular"
    data-what="stock-label"
    data-which="current-stock"
  >
    Aktueller Bestand
  </div>
  <div
    *uiSkeletonLoader="stockFetching()"
    class="isa-text-body-2-bold"
    data-what="stock-value"
    data-which="current-stock"
  >
    {{ availableStock() }}x
  </div>
</div>
<div
  class="product-stock-info-row"
  data-what="stock-info-row"
  data-which="remit-amount"
>
  <div
    class="isa-text-body-2-regular"
    data-what="stock-label"
    data-which="remit-amount"
  >
    Remi Menge
  </div>
  <div
    *uiSkeletonLoader="stockFetching()"
    class="isa-text-body-2-bold"
    data-what="stock-value"
    data-which="remit-amount"
  >
    {{ stockToRemit() }}x
  </div>
</div>
<div
  class="product-stock-info-row"
  data-what="stock-info-row"
  data-which="remaining-stock"
>
  <div
    class="isa-text-body-2-regular"
    data-what="stock-label"
    data-which="remaining-stock"
  >
    Übriger Bestand
  </div>
  <div
    *uiSkeletonLoader="stockFetching()"
    class="isa-text-body-2-bold"
    data-what="stock-value"
    data-which="remaining-stock"
  >
    {{ targetStock() }}x
  </div>
</div>
<div class="product-stock-info-row" data-what="stock-info-row" data-which="zob">
  <div class="isa-text-body-2-regular" data-what="stock-label" data-which="zob">
    ZOB
  </div>
  <div
    *uiSkeletonLoader="stockFetching()"
    class="isa-text-body-2-regular grid-flow-row"
    data-what="stock-value"
    data-which="zob"
  >
    {{ zob() }}x
  </div>
</div>
