@let prd = item().product;
@let rPoints = points();
@if (prd) {
  <checkout-product-info [item]="baseItem()" [nameSize]="nameSize()">
    <div class="isa-text-body-2-regular" data-what="product-points">
      <span class="isa-text-body-2-bold">{{ rPoints }}</span>
      Lesepunkte
    </div>
  </checkout-product-info>
  <div
    class="flex flex-1 flex-col gap-2"
    [class.ml-20]="orientation() === 'vertical'"
    [class.max-w-80]="orientation() === 'vertical'"
  >
    <shared-product-format
      [format]="prd.format"
      [formatDetail]="prd.formatDetail"
      [formatDetailsBold]="true"
    ></shared-product-format>
    <div
      class="flex items-center gap-1 isa-text-body-2-regular text-neutral-600"
      data-what="product-manufacturer-ean"
    >
      <span class="truncate">{{ prd.manufacturer }}</span>
      <span class="shrink-0">| {{ prd.ean }}</span>
    </div>
    <div class="isa-text-body-2-regular text-neutral-600" data-what="product-publication-date">
      {{ prd.publicationDate | date: 'dd. MMMM yyyy' }}
    </div>
  </div>
}
