mixin entryPreview
  .bg-white.rounded-3.me-1.me-xl-4.g-0
    .dictionary-content-top.mx-0
      .mb-1.d-flex.align-items-start.row
        .d-sm-block.col-sm-4.preview-column-width
          span.smaller-gray-info TERMIN:
        .flex-grow-1.col-sm-8
          span#selected-term.bold-blue-subheading.text-break!= entryData.term
      //- .headword-preview.mt-1.d-flex.align-items-start.row
        .d-sm-block.col-sm-4.preview-column-width
          span.smaller-gray-info OBLIKE, NAGLASI, IZGOVOR:
        .flex-grow-1.flex-column.col-sm-8
          .headword-button
            a(
              data-bs-toggle="collapse"
              href="#headword-table"
              role="button"
              aria-expanded="false"
              aria-controls="headword-table"
            )!= 'Oblike, naglasi, izgovor'
          #headword-table.collapse.flex-column.my-2
            .card.card-body
              | tabela
      if (structure)
        if (structure.hasDomainLabels && !!selectedDomainLabelsForEntryString)
          #preview-domain-secondary.preview-domain-secondary.mt-1.d-flex.align-items-start.row
            .d-sm-block.col-sm-4.preview-column-width
              span.smaller-gray-info PODROČNA OZNAKA:
            .flex-grow-1.col-sm-8
              span#selected-domain-secondary.text-uppercase.text-break!= selectedDomainLabelsForEntryString
        if (structure.hasLabel && entryData.label)
          #preview-label.preview-label.mt-1.d-flex.align-items-start.row
            .d-sm-block.preview-column-width.col-sm-4
              span.smaller-gray-info POJASNILO:
            .flex-grow-1.col-sm-8
              span#selected-label.text-break!= entryData.label
        if (structure.hasDefinition && entryData.definition)
          #preview-definition.preview-definition.mt-1.d-flex.align-items-start.row
            .col-sm-4.d-flex.preview-column-width
              span.smaller-gray-info DEFINICIJA:
            .flex-grow-1.col-sm-8
              span#selected-definition.fw-bold!= entryData.definition
        if (structure.hasSynonyms && entryData.synonym && entryData.synonym.join(", ").length)
          #preview-synonym.preview-synonym.mt-1.d-flex.align-items-start.row
            .d-sm-block.col-sm-4.preview-column-width
              span.smaller-gray-info SINONIM:
            .flex-grow-1.col-sm-8
              span#selected-synonyms.small-blue-text.text-break!= entryData.synonym.join(', ')
        //- TODO POVEZANI TERMIN
        if (structure.hasLinks && entryData.link)
          #preview-linked-term.preview-linked-terms.mt-1.d-flex.align-items-start.row
            .d-sm-block.col-sm-4.preview-column-width
              span.smaller-gray-info POVEZANI TERMIN:
            .flex-grow-1.col-sm-8
              span#linked-terms.text-break.text-break!= entryData.link
        if (structure.hasOther && entryData.other)
          #preview-other-field.mt-1.d-flex.align-items-start.row
            .d-sm-block.col-sm-4.preview-column-width
              span.smaller-gray-info DRUGO:
            .flex-grow-1.col-sm-8
              span#selected-other-field.text-break!= entryData.other
        - const isLastBreakPointRequired = (structure.hasImages && entryData.image && entryData.image.join(', ').length) || (structure.hasAudio && entryData.audio && entryData.audio.join(', ').length) || (structure.hasVideo && entryData.video && entryData.video.join(', ').length)
        if (structure.hasForeignLanguages && entryData.foreign_entries && entryData.foreign_entries.length)
          .preview-languages-container.mt-2
            if (entryData.foreign_entries.length)
              each entry, index in entryData.foreign_entries
                hr(class=index ? 'd-none' : '')
                .preview-foreign-language
                  span.smaller-black-info.text-break!= entry.name_sl
                if (structure.hasForeignLanguages && entry.term && entry.term.join(", ").length)
                  .preview-foreign-terms.mt-1.d-flex.align-items-start.row
                    .d-sm-block.col-sm-4.preview-column-width
                      span.smaller-gray-info TERMIN:
                    .selected-label.flex-grow-1.col-sm-8
                      span.preview-f-term.bold-blue-subheading.text-break!= entry.term.join(', ')
                if (structure.hasForeignDefinitions && entry.definition)
                  .preview-foreign-definition.mt-1.d-flex.align-items-start.row
                    .d-sm-block.col-sm-4.preview-column-width
                      span.smaller-gray-info DEFINICIJA:
                    .selected-label.flex-grow-1.col-sm-8
                      span.preview-f-def.text-break #{ entry.definition }
                if (structure.hasForeignSynonyms && entry.synonym && entry.synonym.join(", ").length)
                  .preview-foreign-synonyms.mt-1.d-flex.align-items-start.row
                    .d-sm-block.col-sm-4.preview-column-width
                      span.smaller-gray-info SINONIM:
                    .selected-label.flex-grow-1.col-sm-8
                      span.preview-f-synonym.text-break #{ entry.synonym.join(", ") }
                hr(
                  class=index === entryData.foreign_entries.length - 1 && !isLastBreakPointRequired ? 'd-none' : ''
                )
        if (structure.hasImages && entryData.image && entryData.image.join(", ").length)
          #preview-images.preview-images.mt-1.d-flex.align-items-start.row
            .col-sm-4.d-sm-block.preview-column-width
              span.smaller-gray-info SLIKA:
            .flex-grow-1.col-sm-8
              a#selected-images.text-decoration-none.text-break(
                href=entryData.image
              ) #{ entryData.image }
        if (structure.hasAudio && entryData.audio && entryData.audio.join(", ").length)
          #preview-audio.preview-audio.mt-1.d-flex.align-items-start.row
            .col-sm-4.d-sm-block.preview-column-width
              span.smaller-gray-info ZVOK:
            .flex-grow-1.col-sm-8
              a#selected-audio.text-decoration-none.text-break(
                href=entryData.audio
              ) #{ entryData.audio }
        if (structure.hasVideo && entryData.video && entryData.video.join(", ").length)
          #preview-video.preview-video.mt-1.d-flex.align-items-start.row
            .col-sm-4.d-sm-block.preview-column-width
              span.smaller-gray-info VIDEO:
            .flex-grow-1.col-sm-8
              a#selected-video.text-decoration-none.text-break(
                href=entryData.video
              ) #{ entryData.video }