Index Core
      button link base-header base-section base-heading counter img icon modal footer pagination header photogallery cart-navigation listing-navigation listing-switch tabs
    Sections
      posts-grid-section post-detail-section posts-list-section usps-section banner-section faq-section signpost-section text-and-media-section events-section calendar-section contact-form-section steps-section newsletter-section hero-slider-section documents-section persons-section testimonials-section pricetable-section priceplan-section jobs-section error-404-section breadcrumbs-section content-section category-list-section intro-section registration-section seo-section team-image-section gallery-section cart-steps-section products-listing-section basket-thank-you-section address-section product-info-section order-detail-section order-section ordered-products-section product-detail individual-print-section filters-section company-references-section person-references-section numbers-section timeline-section contact-boxes-section reviews-section print-configuration-footer-section print-configuration-price-section user-configurations-section products-slider-section
    Items
      post-item tag-item alert-item category-item partner-item information-item content-toggle-item product-item product-overview-item price-item availability-item progress-item total-price-item cart-item tooltip-item order-info-item product-order-item print-info-item comparator-item print-variant-item
    Fields
      text-field password-field file-field textarea single-select-field single-select-inline-field checkbox-field checkbox-select-field switch-field date-field color-field radio-box-field address-box-field range-slider-field
    Forms
      contact-form newsletter-form registration-form discount-form address-form user-info-form review-form send-cv-form print-configuration-form
    Widgets
      cart-overview-widget
    Modals
      dimesions-modal print-info-modal product-out-of-stock-modal wishlist-share-modal print-method-modal send-cv-modal edit-comparator-name-modal print-configuration-modal delete-comparator-modal delete-comparator-product-modal delete-configuration-modal
    Aside
      documents-aside delivery-aside user-panel-aside
  • id:
  • figma
    Preview Twig Html
  • Více od AC/DC

    Hlasu zkrátka nevratné duší indičtí půlkilometrová začali nutné už od středisko. Společných snažila líně budoucnost začne vloženy stal objevováním, umělé cílem starým dne větvičky názvy moři zabíjí.
    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)
    30%
    Limitovaná edice Novinka Akce

    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)

    Min. 100 ks. 2,75Kč
    Od 1 000 ks. 2,65Kč
    Od 3 000 ks. 2,50Kč
    Od 5 000 ks. 2,40Kč
    Od 10 000 ks. 2,00Kč
    100
    ks
    Min. 100 ks
    Skladem
    ( 52265 Ks )
    1 ks 1 990 Kč
    Celkem: 1 990 Kč bez DPH
    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)
    30%
    Akce

    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)

    Min. 100 ks. 2,75Kč
    Od 1 000 ks. 2,65Kč
    Od 3 000 ks. 2,50Kč
    Od 5 000 ks. 2,40Kč
    Od 10 000 ks. 2,00Kč
    100
    ks
    Min. 100 ks
    Na dotaz
    ( 0 )
    1 ks 1 990 Kč
    Celkem: 1 990 Kč bez DPH
    Papírová taška hnědá Takeaway 26x16x30
    Doprava zdarma Nízká cena Výprodej

    Papírová taška hnědá Takeaway 26x16x30

    Min. 100 ks. 2,75Kč
    Od 1 000 ks. 2,65Kč
    Od 3 000 ks. 2,50Kč
    Od 5 000 ks. 2,40Kč
    Od 10 000 ks. 2,00Kč
    100
    ks
    Min. 100 ks
    Nedostupné
    ( Zpět 24.5. )
    1 ks 1 990 Kč
    Celkem: 1 990 Kč bez DPH
    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)
    30%
    Limitovaná edice Novinka Akce

    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)

    Min. 100 ks. 2,75Kč
    Od 1 000 ks. 2,65Kč
    Od 3 000 ks. 2,50Kč
    Od 5 000 ks. 2,40Kč
    Od 10 000 ks. 2,00Kč
    100
    ks
    Min. 100 ks
    Skladem
    ( 52265 Ks )
    1 ks 1 990 Kč
    Celkem: 1 990 Kč bez DPH
  •         {% include "@Components/sections/products-slider-section/products-slider-section.twig" with {props: {
      header: {
        heading: {
          title: "Více od AC/DC"
        },
        perex: "Hlasu zkrátka nevratné duší indičtí půlkilometrová začali nutné už od středisko. Společných snažila líně budoucnost začne vloženy stal objevováním, umělé cílem starým dne větvičky názvy moři zabíjí."
      },
      group: {
        items: products_sample[:4]
      },
    }} %}
    
          
  •           
    
    
    <section class="base-section  s-products-slider">
      <div class="base-section__container container">
        
              <header class="base-header d-flex flex-column gap-3 text-center align-items-center">
    
      
          <h2 class="base-heading mb-0 u-fw-700 u-h2">
                Více od AC/DC
          </h2>
      
          <div class="base-header__description entry-content mb-0">Hlasu zkrátka nevratné duší indičtí půlkilometrová začali nutné už od středisko. Společných snažila líně budoucnost začne vloženy stal objevováním, umělé cílem starým dne větvičky názvy moři zabíjí.</div>
      
      
      
    
    </header>
        
              <div class="s-products-slider__slider u-posr">
            
    
    <div class="swiper g-products-slider --loading">
      <div class="swiper-wrapper">
                      <div class="swiper-slide">
              <article class="i-product u-container-inline u-posr u-border u-border--tertiary-500 u-rounded-3 h-100  --vertical" data-product-id="1">
      <div class="i-product__body d-flex flex-column gap-2 p-2 h-100">
        <figure class="i-product__image d-block u-posr overflow-hidden u-img-hover">
          <a href="#" class="i-product__image-link d-flex align-items-center" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
                      <div class="img u-posr overflow-hidden --cover  --ratio-1-1 i-product__image-full">
      <picture>
        
        <img src="" data-src="https://placehold.co/308x308" alt="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)" width="308" height="308" draggable="false" srcset="" data-srcset="https://placehold.co/308x308 1x, https://placehold.co/618x618/?paper-bag 2x">
      </picture>
    </div>
                  </a>
    
                  <div class="i-discount d-flex flex-column justify-content-center align-items-center  i-product__discount u-posa u-top-0 u-right-0 my-1 me-1">
      <div class="i-discount__value u-fw-700 u-fz-sm">30%</div>
    </div>
          
                    <div class="g-tags d-flex flex-wrap gap-1 i-product__tags u-posa u-top-0 u-left-0 mt-1 ms-1 align-items-start flex-column">
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-blue-400 --sm    i-product__tag">
          <span class="i-tag__title">Limitovaná edice</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-pink-400 --sm    i-product__tag">
          <span class="i-tag__title">Novinka</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-violet-400 --sm    i-product__tag">
          <span class="i-tag__title">Akce</span>
        </span>
          </div>
              </figure>
    
        <div class="i-product__header d-flex flex-column">
          <h2 class="i-product__title u-fz-md u-fw-700">
            <a class="link d-inline-flex u-fw-600 align-items-center      i-product__link u-fz-md u-clamp" href="#" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
          <span class="link__title">Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)</span>
      
      
      </a>
          </h2>
        </div>
    
        <div class="i-product__content mt-auto --js-pricelist-controler">
          <div class="row gx-0 mb-2">
    
                      <div class="i-pricelist u-fz-xs i-product__pricelist col-12 mb-2">
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    --active --first
                    
                  "
             data-price="2.75"
             data-min-count="100"
             data-index="0"
        >
                  <span>Min. 100 ks.</span>
          
                  <span>2,75Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.65"
             data-min-count="1000"
             data-index="1"
        >
                  <span>Od 1 000 ks.</span>
          
                  <span>2,65Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.5"
             data-min-count="3000"
             data-index="2"
        >
                  <span>Od 3 000 ks.</span>
          
                  <span>2,50Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.4"
             data-min-count="5000"
             data-index="3"
        >
                  <span>Od 5 000 ks.</span>
          
                  <span>2,40Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    --last
                  "
             data-price="2"
             data-min-count="10000"
             data-index="4"
        >
                  <span>Od 10 000 ks.</span>
          
                  <span>2,00Kč</span>
              </div>
      </div>
            
            <div class="col-6 d-flex i-product__print-checkbox-wrapper">
              <label class="f-checkbox d-inline-flex gap-1 u-posr  align-items-center  --checkbox   i-product__print-checkbox --js-product-item-checkbox u-fw-600">
      <input class="f-checkbox__input u-posa" type="checkbox">
      <span class="f-checkbox__visual flex-shrink-0 d-flex align-items-center justify-content-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>  </span>
      <div class="f-checkbox__body d-flex column-gap-1 align-items-center">
        <span class="f-checkbox__title">
                            Vlastní potisk
                  
              </span>
    
        
          </div>
    
      <span class="f-error u-fz-sm gap-1 d-none">
      <span class="f-error__icon d-flex align-items-center justify-content-center">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24v112c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm-32 224a32 32 0 1 1 64 0 32 32 0 1 1-64 0z"/></svg>      </span>
      </span>
    
      <span class="f-error__title"></span>
    </span>
    
    </label>
            </div>
            <div class="col-6 i-product__print-counter-wrapper">
              
    <div class="c-counter u-fw-700 u-fz-14 u-bg-white u-posr d-flex align-items-center justify-content-between p-1 flex-shrink-0 u-border u-border--tertiary-500  product-quantity --js-product-counter">
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --minus u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#B0B2D4" fill-rule="evenodd" d="M4 12a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <div class="c-counter__value-visual d-flex">
        <div class="c-counter__value" contenteditable="true">100</div>
              <div class="c-counter__units">ks</div>
                  <div class="c-counter__label u-posa u-top-0 u-left-50-p u-fz-xs px-1 u-bg-white text-nowrap">Min. 100 ks</div>
          </div>
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --plus">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.975 6.975V3h2.05v3.975H13v2.05H9.025V13h-2.05V9.025H3v-2.05h3.975Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <input class="c-counter__input d-none" type="number" name="product-quantity" value="100" min="100" max="50000">
    </div>
            </div>
          </div>
    
          <div class="d-flex flex-row gap-2 justify-content-between flex-grow-1 align-items-center flex-wrap">
                      <div class="i-availability u-fz-sm d-flex flex-column --available  i-product__availability">  
      <div class="i-availability__title d-flex align-items-center u-fw-700 u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>      </span>
    
        Skladem
      </div>
      <span class="i-availability__quantity flex-shrink-0 u-color-tertiary-600 u-fz-xs u-color-text-400">
              ( 52265 Ks )
          </span>
    
      </div>
            
                      <div class="d-flex justify-content-end flex-column align-items-end">
                <div class="i-price p-1 d-flex flex-column justify-content-center flex-shrink-0 u-bg-primary-400 i-product__price">
            <div class="i-price__row i-price__main d-flex justify-content-end align-items-end gap-1">
    
          
                  <span class="i-price__title u-fz-md u-fw-700">1 ks</span>
          
          <span class="i-price__main u-fw-700">
            <span class="--js-product-item-price">
              1 990
            </span>
                      Kč              </span>
        </div>
      
      </div>
                <span class="u-fw-500 u-fz-sm d-inline">Celkem:
                  <span class="--js-product-total-price">1 990</span>
                  Kč
                  bez DPH
                </span>
              </div>
                  </div>
        </div>
        <div class="i-product__buttons d-flex gap-2 justify-content-between">
          <div class="i-add-wishlist-button --wishlisted   i-product__wishlist flex-shrink-0">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__add js-wishlist-add" type="button" aria-label="Přidat do wishlistu" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971ZM12 19.879C9.29 17.82 3.67 12.764 3.67 8.97c-.118-2.216 1.57-4.142 3.749-4.277 2.178.135 3.866 2.06 3.748 4.277h1.666c-.118-2.216 1.57-4.142 3.748-4.277 2.18.135 3.867 2.06 3.749 4.277 0 3.795-5.62 8.85-8.33 10.908Z"/></svg>      </span>
        </span>
      
      </button>
    
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__remove js-wishlist-remove" type="button" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971Z"/></svg>      </span>
        </span>
      
      </button>
    </div>
    
            <div class="i-add-cart-buttons u-posr text-center flex-grow-1  flex-grow-1 i-product__cart-add">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__cart-add js-cart-add --shown u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Přidat do košíku" data-product-id="1" data-modal-target="add-product-to-cart-modal">
          <span class="btn__title u-z-index-1">
          Přidat do košíku
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0C5.718 0 3.807 1.58 3.416 3.667H.782V13.99c0 1.116.948 2.01 2.097 2.01H13.12c1.148 0 2.096-.894 2.096-2.01V3.667h-2.633C12.193 1.58 10.28 0 8 0Zm0 1.575c1.386 0 2.55.89 2.91 2.092H5.09C5.45 2.465 6.614 1.575 8 1.575ZM2.415 13.99V5.242h11.17v8.748c0 .232-.2.435-.464.435H2.879a.451.451 0 0 1-.464-.435Zm2.56-7.266H3.343v.787c0 2.864 2.14 5.066 4.657 5.066 2.526 0 4.657-2.213 4.657-5.066v-.787h-1.633v.787c0 1.948-1.378 3.491-3.024 3.491-1.646 0-3.025-1.543-3.025-3.491v-.787Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
    
          <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__print js-print-add --hidden u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Chci vlastní potisk" data-product-id="1" data-modal-target="product-print-modal">
          <span class="btn__title u-z-index-1">
          Chci vlastní potisk
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M6 19.572H3.92a2.419 2.419 0 0 1-2.42-2.418v-6.737A2.418 2.418 0 0 1 3.918 8H6V1.5h12V8h2.082a2.418 2.418 0 0 1 2.418 2.417v6.737a2.418 2.418 0 0 1-2.418 2.418H18V22.5H6v-2.928Zm12-1.538h2.082a.88.88 0 0 0 .88-.88v-6.737a.88.88 0 0 0-.881-.88H3.919a.88.88 0 0 0-.88.88v6.737c0 .486.394.88.88.88H6v-2.496H4.59V14h14.82v1.538H18v2.496ZM7.537 8h8.926V3.039l-8.926-.001V8ZM15 11h4v1.539h-4V11Zm-7.463 4.538v5.424h8.926v-5.424H7.537Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
      
      
      <div class="i-add-cart-button__animation u-posa u-top-50-p u-left-50-p u-translate-middle btn --primary u-posa --icon-only --js-product-button-animation --sm">
        <svg width="26" height="12" viewbox="0 0 26 12" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M3 6C4.65685 6 6 7.34315 6 9C6 10.6569 4.65685 12 3 12C1.34315 12 0 10.6569 0 9C0 7.34315 1.34315 6 3 6Z" fill="currentColor"/>
          <path d="M13 6C14.6569 6 16 7.34315 16 9C16 10.6569 14.6569 12 13 12C11.3431 12 10 10.6569 10 9C10 7.34315 11.3431 6 13 6Z" fill="currentColor"/>
          <path d="M23 6C24.6569 6 26 7.34315 26 9C26 10.6569 24.6569 12 23 12C21.3431 12 20 10.6569 20 9C20 7.34315 21.3431 6 23 6Z" fill="currentColor"/>
        </svg>
      </div>
    </div>
        </div>
      </div>
    </article>
            </div>
                  <div class="swiper-slide">
              <article class="i-product u-container-inline u-posr u-border u-border--tertiary-500 u-rounded-3 h-100  --vertical" data-product-id="2">
      <div class="i-product__body d-flex flex-column gap-2 p-2 h-100">
        <figure class="i-product__image d-block u-posr overflow-hidden u-img-hover">
          <a href="#" class="i-product__image-link d-flex align-items-center" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
                      <div class="img u-posr overflow-hidden --cover  --ratio-1-1 i-product__image-full">
      <picture>
        
        <img src="" data-src="https://placehold.co/308x308" alt="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)" width="308" height="308" draggable="false" srcset="" data-srcset="https://placehold.co/308x308 1x, https://placehold.co/618x618/?paper-bag 2x">
      </picture>
    </div>
                  </a>
    
                  <div class="i-discount d-flex flex-column justify-content-center align-items-center  i-product__discount u-posa u-top-0 u-right-0 my-1 me-1">
      <div class="i-discount__value u-fw-700 u-fz-sm">30%</div>
    </div>
          
                    <div class="g-tags d-flex flex-wrap gap-1 i-product__tags u-posa u-top-0 u-left-0 mt-1 ms-1 align-items-start flex-column">
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-secondary-400 --sm    i-product__tag">
          <span class="i-tag__title">Akce</span>
        </span>
          </div>
              </figure>
    
        <div class="i-product__header d-flex flex-column">
          <h2 class="i-product__title u-fz-md u-fw-700">
            <a class="link d-inline-flex u-fw-600 align-items-center      i-product__link u-fz-md u-clamp" href="#" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
          <span class="link__title">Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)</span>
      
      
      </a>
          </h2>
        </div>
    
        <div class="i-product__content mt-auto --js-pricelist-controler">
          <div class="row gx-0 mb-2">
    
                      <div class="i-pricelist u-fz-xs i-product__pricelist col-12 mb-2">
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    --active --first
                    
                  "
             data-price="2.75"
             data-min-count="100"
             data-index="0"
        >
                  <span>Min. 100 ks.</span>
          
                  <span>2,75Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.65"
             data-min-count="1000"
             data-index="1"
        >
                  <span>Od 1 000 ks.</span>
          
                  <span>2,65Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.5"
             data-min-count="3000"
             data-index="2"
        >
                  <span>Od 3 000 ks.</span>
          
                  <span>2,50Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.4"
             data-min-count="5000"
             data-index="3"
        >
                  <span>Od 5 000 ks.</span>
          
                  <span>2,40Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    --last
                  "
             data-price="2"
             data-min-count="10000"
             data-index="4"
        >
                  <span>Od 10 000 ks.</span>
          
                  <span>2,00Kč</span>
              </div>
      </div>
            
            <div class="col-6 d-flex i-product__print-checkbox-wrapper">
              <label class="f-checkbox d-inline-flex gap-1 u-posr  align-items-center  --checkbox   i-product__print-checkbox --js-product-item-checkbox u-fw-600">
      <input class="f-checkbox__input u-posa" type="checkbox">
      <span class="f-checkbox__visual flex-shrink-0 d-flex align-items-center justify-content-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>  </span>
      <div class="f-checkbox__body d-flex column-gap-1 align-items-center">
        <span class="f-checkbox__title">
                            Vlastní potisk
                  
              </span>
    
        
          </div>
    
      <span class="f-error u-fz-sm gap-1 d-none">
      <span class="f-error__icon d-flex align-items-center justify-content-center">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24v112c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm-32 224a32 32 0 1 1 64 0 32 32 0 1 1-64 0z"/></svg>      </span>
      </span>
    
      <span class="f-error__title"></span>
    </span>
    
    </label>
            </div>
            <div class="col-6 i-product__print-counter-wrapper">
              
    <div class="c-counter u-fw-700 u-fz-14 u-bg-white u-posr d-flex align-items-center justify-content-between p-1 flex-shrink-0 u-border u-border--tertiary-500  product-quantity --js-product-counter">
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --minus u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#B0B2D4" fill-rule="evenodd" d="M4 12a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <div class="c-counter__value-visual d-flex">
        <div class="c-counter__value" contenteditable="true">100</div>
              <div class="c-counter__units">ks</div>
                  <div class="c-counter__label u-posa u-top-0 u-left-50-p u-fz-xs px-1 u-bg-white text-nowrap">Min. 100 ks</div>
          </div>
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --plus">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.975 6.975V3h2.05v3.975H13v2.05H9.025V13h-2.05V9.025H3v-2.05h3.975Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <input class="c-counter__input d-none" type="number" name="product-quantity" value="100" min="100" max="50000">
    </div>
            </div>
          </div>
    
          <div class="d-flex flex-row gap-2 justify-content-between flex-grow-1 align-items-center flex-wrap">
                      <div class="i-availability u-fz-sm d-flex flex-column --default  i-product__availability">  
      <div class="i-availability__title d-flex align-items-center u-fw-700 u-color-text-500">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --text --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M9.05 5h-2.1V3h2.1v2ZM6 6v2.099h.95v2.8H6V13h.95v.002h2.1v-.002H10v-2.1h-.95V6H6Z" clip-rule="evenodd"/></svg>      </span>
    
        Na dotaz
      </div>
      <span class="i-availability__quantity flex-shrink-0 u-color-tertiary-600 u-fz-xs u-color-text-400">
              ( 0 )
          </span>
    
      </div>
            
                      <div class="d-flex justify-content-end flex-column align-items-end">
                <div class="i-price p-1 d-flex flex-column justify-content-center flex-shrink-0 u-bg-primary-400 i-product__price">
            <div class="i-price__row i-price__main d-flex justify-content-end align-items-end gap-1">
    
          
                  <span class="i-price__title u-fz-md u-fw-700">1 ks</span>
          
          <span class="i-price__main u-fw-700">
            <span class="--js-product-item-price">
              1 990
            </span>
                      Kč              </span>
        </div>
      
      </div>
                <span class="u-fw-500 u-fz-sm d-inline">Celkem:
                  <span class="--js-product-total-price">1 990</span>
                  Kč
                  bez DPH
                </span>
              </div>
                  </div>
        </div>
        <div class="i-product__buttons d-flex gap-2 justify-content-between">
          <div class="i-add-wishlist-button --wishlisted   i-product__wishlist flex-shrink-0">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__add js-wishlist-add" type="button" aria-label="Přidat do wishlistu" data-product-id="2">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971ZM12 19.879C9.29 17.82 3.67 12.764 3.67 8.97c-.118-2.216 1.57-4.142 3.749-4.277 2.178.135 3.866 2.06 3.748 4.277h1.666c-.118-2.216 1.57-4.142 3.748-4.277 2.18.135 3.867 2.06 3.749 4.277 0 3.795-5.62 8.85-8.33 10.908Z"/></svg>      </span>
        </span>
      
      </button>
    
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__remove js-wishlist-remove" type="button" data-product-id="2">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971Z"/></svg>      </span>
        </span>
      
      </button>
    </div>
    
            <div class="i-add-cart-buttons u-posr text-center flex-grow-1  flex-grow-1 i-product__cart-add">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__cart-add js-cart-add --shown u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Přidat do košíku" data-product-id="2" data-modal-target="add-product-to-cart-modal">
          <span class="btn__title u-z-index-1">
          Přidat do košíku
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0C5.718 0 3.807 1.58 3.416 3.667H.782V13.99c0 1.116.948 2.01 2.097 2.01H13.12c1.148 0 2.096-.894 2.096-2.01V3.667h-2.633C12.193 1.58 10.28 0 8 0Zm0 1.575c1.386 0 2.55.89 2.91 2.092H5.09C5.45 2.465 6.614 1.575 8 1.575ZM2.415 13.99V5.242h11.17v8.748c0 .232-.2.435-.464.435H2.879a.451.451 0 0 1-.464-.435Zm2.56-7.266H3.343v.787c0 2.864 2.14 5.066 4.657 5.066 2.526 0 4.657-2.213 4.657-5.066v-.787h-1.633v.787c0 1.948-1.378 3.491-3.024 3.491-1.646 0-3.025-1.543-3.025-3.491v-.787Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
    
          <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__print js-print-add --hidden u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Chci vlastní potisk" data-product-id="2" data-modal-target="product-print-modal">
          <span class="btn__title u-z-index-1">
          Chci vlastní potisk
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M6 19.572H3.92a2.419 2.419 0 0 1-2.42-2.418v-6.737A2.418 2.418 0 0 1 3.918 8H6V1.5h12V8h2.082a2.418 2.418 0 0 1 2.418 2.417v6.737a2.418 2.418 0 0 1-2.418 2.418H18V22.5H6v-2.928Zm12-1.538h2.082a.88.88 0 0 0 .88-.88v-6.737a.88.88 0 0 0-.881-.88H3.919a.88.88 0 0 0-.88.88v6.737c0 .486.394.88.88.88H6v-2.496H4.59V14h14.82v1.538H18v2.496ZM7.537 8h8.926V3.039l-8.926-.001V8ZM15 11h4v1.539h-4V11Zm-7.463 4.538v5.424h8.926v-5.424H7.537Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
      
      
      <div class="i-add-cart-button__animation u-posa u-top-50-p u-left-50-p u-translate-middle btn --primary u-posa --icon-only --js-product-button-animation --sm">
        <svg width="26" height="12" viewbox="0 0 26 12" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M3 6C4.65685 6 6 7.34315 6 9C6 10.6569 4.65685 12 3 12C1.34315 12 0 10.6569 0 9C0 7.34315 1.34315 6 3 6Z" fill="currentColor"/>
          <path d="M13 6C14.6569 6 16 7.34315 16 9C16 10.6569 14.6569 12 13 12C11.3431 12 10 10.6569 10 9C10 7.34315 11.3431 6 13 6Z" fill="currentColor"/>
          <path d="M23 6C24.6569 6 26 7.34315 26 9C26 10.6569 24.6569 12 23 12C21.3431 12 20 10.6569 20 9C20 7.34315 21.3431 6 23 6Z" fill="currentColor"/>
        </svg>
      </div>
    </div>
        </div>
      </div>
    </article>
            </div>
                  <div class="swiper-slide">
              <article class="i-product u-container-inline u-posr u-border u-border--tertiary-500 u-rounded-3 h-100  --vertical" data-product-id="3">
      <div class="i-product__body d-flex flex-column gap-2 p-2 h-100">
        <figure class="i-product__image d-block u-posr overflow-hidden u-img-hover">
          <a href="#" class="i-product__image-link d-flex align-items-center" title="Papírová taška hnědá Takeaway 26x16x30">
                      <div class="img u-posr overflow-hidden --cover  --ratio-1-1 i-product__image-full">
      <picture>
        
        <img src="" data-src="https://placehold.co/308x308" alt="Papírová taška hnědá Takeaway 26x16x30" width="308" height="308" draggable="false" srcset="" data-srcset="https://placehold.co/308x308 1x, https://placehold.co/618x618/?paper-bag 2x">
      </picture>
    </div>
                  </a>
    
          
                    <div class="g-tags d-flex flex-wrap gap-1 i-product__tags u-posa u-top-0 u-left-0 mt-1 ms-1 align-items-start flex-column">
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-blue-400 --sm    i-product__tag">
          <span class="i-tag__title">Doprava zdarma</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-pink-400 --sm    i-product__tag">
          <span class="i-tag__title">Nízká cena</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-primary-400 --sm    i-product__tag">
          <span class="i-tag__title">Výprodej</span>
        </span>
          </div>
              </figure>
    
        <div class="i-product__header d-flex flex-column">
          <h2 class="i-product__title u-fz-md u-fw-700">
            <a class="link d-inline-flex u-fw-600 align-items-center      i-product__link u-fz-md u-clamp" href="#" title="Papírová taška hnědá Takeaway 26x16x30">
          <span class="link__title">Papírová taška hnědá Takeaway 26x16x30</span>
      
      
      </a>
          </h2>
        </div>
    
        <div class="i-product__content mt-auto --js-pricelist-controler">
          <div class="row gx-0 mb-2">
    
                      <div class="i-pricelist u-fz-xs i-product__pricelist col-12 mb-2">
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    --active --first
                    
                  "
             data-price="2.75"
             data-min-count="100"
             data-index="0"
        >
                  <span>Min. 100 ks.</span>
          
                  <span>2,75Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.65"
             data-min-count="1000"
             data-index="1"
        >
                  <span>Od 1 000 ks.</span>
          
                  <span>2,65Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.5"
             data-min-count="3000"
             data-index="2"
        >
                  <span>Od 3 000 ks.</span>
          
                  <span>2,50Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.4"
             data-min-count="5000"
             data-index="3"
        >
                  <span>Od 5 000 ks.</span>
          
                  <span>2,40Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    --last
                  "
             data-price="2"
             data-min-count="10000"
             data-index="4"
        >
                  <span>Od 10 000 ks.</span>
          
                  <span>2,00Kč</span>
              </div>
      </div>
            
            <div class="col-6 d-flex i-product__print-checkbox-wrapper">
              <label class="f-checkbox d-inline-flex gap-1 u-posr  align-items-center  --checkbox   i-product__print-checkbox --js-product-item-checkbox u-fw-600">
      <input class="f-checkbox__input u-posa" type="checkbox">
      <span class="f-checkbox__visual flex-shrink-0 d-flex align-items-center justify-content-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>  </span>
      <div class="f-checkbox__body d-flex column-gap-1 align-items-center">
        <span class="f-checkbox__title">
                            Vlastní potisk
                  
              </span>
    
        
          </div>
    
      <span class="f-error u-fz-sm gap-1 d-none">
      <span class="f-error__icon d-flex align-items-center justify-content-center">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24v112c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm-32 224a32 32 0 1 1 64 0 32 32 0 1 1-64 0z"/></svg>      </span>
      </span>
    
      <span class="f-error__title"></span>
    </span>
    
    </label>
            </div>
            <div class="col-6 i-product__print-counter-wrapper">
              
    <div class="c-counter u-fw-700 u-fz-14 u-bg-white u-posr d-flex align-items-center justify-content-between p-1 flex-shrink-0 u-border u-border--tertiary-500  product-quantity --js-product-counter">
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --minus u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#B0B2D4" fill-rule="evenodd" d="M4 12a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <div class="c-counter__value-visual d-flex">
        <div class="c-counter__value" contenteditable="true">100</div>
              <div class="c-counter__units">ks</div>
                  <div class="c-counter__label u-posa u-top-0 u-left-50-p u-fz-xs px-1 u-bg-white text-nowrap">Min. 100 ks</div>
          </div>
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --plus">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.975 6.975V3h2.05v3.975H13v2.05H9.025V13h-2.05V9.025H3v-2.05h3.975Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <input class="c-counter__input d-none" type="number" name="product-quantity" value="100" min="100" max="50000">
    </div>
            </div>
          </div>
    
          <div class="d-flex flex-row gap-2 justify-content-between flex-grow-1 align-items-center flex-wrap">
                      <div class="i-availability u-fz-sm d-flex flex-column --unavailable  i-product__availability">  
      <div class="i-availability__title d-flex align-items-center u-fw-700 u-color-danger">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.495 8.002 3.203 4.746l1.478-1.5 3.32 3.272 3.317-3.272 1.478 1.5-3.292 3.256 3.292 3.246-1.494 1.507L8 9.489l-3.303 3.266-1.494-1.507 3.292-3.246Z" clip-rule="evenodd"/></svg>      </span>
    
        Nedostupné
      </div>
      <span class="i-availability__quantity flex-shrink-0 u-color-tertiary-600 u-fz-xs u-color-text-400">
              ( Zpět 24.5. )
          </span>
    
      </div>
            
                      <div class="d-flex justify-content-end flex-column align-items-end">
                <div class="i-price p-1 d-flex flex-column justify-content-center flex-shrink-0 u-bg-primary-400 i-product__price">
            <div class="i-price__row i-price__main d-flex justify-content-end align-items-end gap-1">
    
          
                  <span class="i-price__title u-fz-md u-fw-700">1 ks</span>
          
          <span class="i-price__main u-fw-700">
            <span class="--js-product-item-price">
              1 990
            </span>
                      Kč              </span>
        </div>
      
      </div>
                <span class="u-fw-500 u-fz-sm d-inline">Celkem:
                  <span class="--js-product-total-price">1 990</span>
                  Kč
                  bez DPH
                </span>
              </div>
                  </div>
        </div>
        <div class="i-product__buttons d-flex gap-2 justify-content-between">
          <div class="i-add-wishlist-button    i-product__wishlist flex-shrink-0">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__add js-wishlist-add" type="button" aria-label="Přidat do wishlistu" data-product-id="3">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971ZM12 19.879C9.29 17.82 3.67 12.764 3.67 8.97c-.118-2.216 1.57-4.142 3.749-4.277 2.178.135 3.866 2.06 3.748 4.277h1.666c-.118-2.216 1.57-4.142 3.748-4.277 2.18.135 3.867 2.06 3.749 4.277 0 3.795-5.62 8.85-8.33 10.908Z"/></svg>      </span>
        </span>
      
      </button>
    
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__remove js-wishlist-remove" type="button" data-product-id="3">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971Z"/></svg>      </span>
        </span>
      
      </button>
    </div>
    
            <div class="i-add-cart-buttons u-posr text-center flex-grow-1  flex-grow-1 i-product__cart-add">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__cart-add js-cart-add --shown u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Přidat do košíku" data-product-id="3" data-modal-target="add-product-to-cart-modal">
          <span class="btn__title u-z-index-1">
          Přidat do košíku
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0C5.718 0 3.807 1.58 3.416 3.667H.782V13.99c0 1.116.948 2.01 2.097 2.01H13.12c1.148 0 2.096-.894 2.096-2.01V3.667h-2.633C12.193 1.58 10.28 0 8 0Zm0 1.575c1.386 0 2.55.89 2.91 2.092H5.09C5.45 2.465 6.614 1.575 8 1.575ZM2.415 13.99V5.242h11.17v8.748c0 .232-.2.435-.464.435H2.879a.451.451 0 0 1-.464-.435Zm2.56-7.266H3.343v.787c0 2.864 2.14 5.066 4.657 5.066 2.526 0 4.657-2.213 4.657-5.066v-.787h-1.633v.787c0 1.948-1.378 3.491-3.024 3.491-1.646 0-3.025-1.543-3.025-3.491v-.787Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
    
          <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__print js-print-add --hidden u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Chci vlastní potisk" data-product-id="3" data-modal-target="product-print-modal">
          <span class="btn__title u-z-index-1">
          Chci vlastní potisk
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M6 19.572H3.92a2.419 2.419 0 0 1-2.42-2.418v-6.737A2.418 2.418 0 0 1 3.918 8H6V1.5h12V8h2.082a2.418 2.418 0 0 1 2.418 2.417v6.737a2.418 2.418 0 0 1-2.418 2.418H18V22.5H6v-2.928Zm12-1.538h2.082a.88.88 0 0 0 .88-.88v-6.737a.88.88 0 0 0-.881-.88H3.919a.88.88 0 0 0-.88.88v6.737c0 .486.394.88.88.88H6v-2.496H4.59V14h14.82v1.538H18v2.496ZM7.537 8h8.926V3.039l-8.926-.001V8ZM15 11h4v1.539h-4V11Zm-7.463 4.538v5.424h8.926v-5.424H7.537Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
      
      
      <div class="i-add-cart-button__animation u-posa u-top-50-p u-left-50-p u-translate-middle btn --primary u-posa --icon-only --js-product-button-animation --sm">
        <svg width="26" height="12" viewbox="0 0 26 12" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M3 6C4.65685 6 6 7.34315 6 9C6 10.6569 4.65685 12 3 12C1.34315 12 0 10.6569 0 9C0 7.34315 1.34315 6 3 6Z" fill="currentColor"/>
          <path d="M13 6C14.6569 6 16 7.34315 16 9C16 10.6569 14.6569 12 13 12C11.3431 12 10 10.6569 10 9C10 7.34315 11.3431 6 13 6Z" fill="currentColor"/>
          <path d="M23 6C24.6569 6 26 7.34315 26 9C26 10.6569 24.6569 12 23 12C21.3431 12 20 10.6569 20 9C20 7.34315 21.3431 6 23 6Z" fill="currentColor"/>
        </svg>
      </div>
    </div>
        </div>
      </div>
    </article>
            </div>
                  <div class="swiper-slide">
              <article class="i-product u-container-inline u-posr u-border u-border--tertiary-500 u-rounded-3 h-100  --vertical" data-product-id="1">
      <div class="i-product__body d-flex flex-column gap-2 p-2 h-100">
        <figure class="i-product__image d-block u-posr overflow-hidden u-img-hover">
          <a href="#" class="i-product__image-link d-flex align-items-center" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
                      <div class="img u-posr overflow-hidden --cover  --ratio-1-1 i-product__image-full">
      <picture>
        
        <img src="" data-src="https://placehold.co/308x308" alt="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)" width="308" height="308" draggable="false" srcset="" data-srcset="https://placehold.co/308x308 1x, https://placehold.co/618x618/?paper-bag 2x">
      </picture>
    </div>
                  </a>
    
                  <div class="i-discount d-flex flex-column justify-content-center align-items-center  i-product__discount u-posa u-top-0 u-right-0 my-1 me-1">
      <div class="i-discount__value u-fw-700 u-fz-sm">30%</div>
    </div>
          
                    <div class="g-tags d-flex flex-wrap gap-1 i-product__tags u-posa u-top-0 u-left-0 mt-1 ms-1 align-items-start flex-column">
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-blue-400 --sm    i-product__tag">
          <span class="i-tag__title">Limitovaná edice</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-pink-400 --sm    i-product__tag">
          <span class="i-tag__title">Novinka</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-violet-400 --sm    i-product__tag">
          <span class="i-tag__title">Akce</span>
        </span>
          </div>
              </figure>
    
        <div class="i-product__header d-flex flex-column">
          <h2 class="i-product__title u-fz-md u-fw-700">
            <a class="link d-inline-flex u-fw-600 align-items-center      i-product__link u-fz-md u-clamp" href="#" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
          <span class="link__title">Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)</span>
      
      
      </a>
          </h2>
        </div>
    
        <div class="i-product__content mt-auto --js-pricelist-controler">
          <div class="row gx-0 mb-2">
    
                      <div class="i-pricelist u-fz-xs i-product__pricelist col-12 mb-2">
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    --active --first
                    
                  "
             data-price="2.75"
             data-min-count="100"
             data-index="0"
        >
                  <span>Min. 100 ks.</span>
          
                  <span>2,75Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.65"
             data-min-count="1000"
             data-index="1"
        >
                  <span>Od 1 000 ks.</span>
          
                  <span>2,65Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.5"
             data-min-count="3000"
             data-index="2"
        >
                  <span>Od 3 000 ks.</span>
          
                  <span>2,50Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.4"
             data-min-count="5000"
             data-index="3"
        >
                  <span>Od 5 000 ks.</span>
          
                  <span>2,40Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    --last
                  "
             data-price="2"
             data-min-count="10000"
             data-index="4"
        >
                  <span>Od 10 000 ks.</span>
          
                  <span>2,00Kč</span>
              </div>
      </div>
            
            <div class="col-6 d-flex i-product__print-checkbox-wrapper">
              <label class="f-checkbox d-inline-flex gap-1 u-posr  align-items-center  --checkbox   i-product__print-checkbox --js-product-item-checkbox u-fw-600">
      <input class="f-checkbox__input u-posa" type="checkbox">
      <span class="f-checkbox__visual flex-shrink-0 d-flex align-items-center justify-content-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>  </span>
      <div class="f-checkbox__body d-flex column-gap-1 align-items-center">
        <span class="f-checkbox__title">
                            Vlastní potisk
                  
              </span>
    
        
          </div>
    
      <span class="f-error u-fz-sm gap-1 d-none">
      <span class="f-error__icon d-flex align-items-center justify-content-center">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24v112c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm-32 224a32 32 0 1 1 64 0 32 32 0 1 1-64 0z"/></svg>      </span>
      </span>
    
      <span class="f-error__title"></span>
    </span>
    
    </label>
            </div>
            <div class="col-6 i-product__print-counter-wrapper">
              
    <div class="c-counter u-fw-700 u-fz-14 u-bg-white u-posr d-flex align-items-center justify-content-between p-1 flex-shrink-0 u-border u-border--tertiary-500  product-quantity --js-product-counter">
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --minus u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#B0B2D4" fill-rule="evenodd" d="M4 12a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <div class="c-counter__value-visual d-flex">
        <div class="c-counter__value" contenteditable="true">100</div>
              <div class="c-counter__units">ks</div>
                  <div class="c-counter__label u-posa u-top-0 u-left-50-p u-fz-xs px-1 u-bg-white text-nowrap">Min. 100 ks</div>
          </div>
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --plus">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.975 6.975V3h2.05v3.975H13v2.05H9.025V13h-2.05V9.025H3v-2.05h3.975Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <input class="c-counter__input d-none" type="number" name="product-quantity" value="100" min="100" max="50000">
    </div>
            </div>
          </div>
    
          <div class="d-flex flex-row gap-2 justify-content-between flex-grow-1 align-items-center flex-wrap">
                      <div class="i-availability u-fz-sm d-flex flex-column --available  i-product__availability">  
      <div class="i-availability__title d-flex align-items-center u-fw-700 u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>      </span>
    
        Skladem
      </div>
      <span class="i-availability__quantity flex-shrink-0 u-color-tertiary-600 u-fz-xs u-color-text-400">
              ( 52265 Ks )
          </span>
    
      </div>
            
                      <div class="d-flex justify-content-end flex-column align-items-end">
                <div class="i-price p-1 d-flex flex-column justify-content-center flex-shrink-0 u-bg-primary-400 i-product__price">
            <div class="i-price__row i-price__main d-flex justify-content-end align-items-end gap-1">
    
          
                  <span class="i-price__title u-fz-md u-fw-700">1 ks</span>
          
          <span class="i-price__main u-fw-700">
            <span class="--js-product-item-price">
              1 990
            </span>
                      Kč              </span>
        </div>
      
      </div>
                <span class="u-fw-500 u-fz-sm d-inline">Celkem:
                  <span class="--js-product-total-price">1 990</span>
                  Kč
                  bez DPH
                </span>
              </div>
                  </div>
        </div>
        <div class="i-product__buttons d-flex gap-2 justify-content-between">
          <div class="i-add-wishlist-button --wishlisted   i-product__wishlist flex-shrink-0">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__add js-wishlist-add" type="button" aria-label="Přidat do wishlistu" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971ZM12 19.879C9.29 17.82 3.67 12.764 3.67 8.97c-.118-2.216 1.57-4.142 3.749-4.277 2.178.135 3.866 2.06 3.748 4.277h1.666c-.118-2.216 1.57-4.142 3.748-4.277 2.18.135 3.867 2.06 3.749 4.277 0 3.795-5.62 8.85-8.33 10.908Z"/></svg>      </span>
        </span>
      
      </button>
    
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__remove js-wishlist-remove" type="button" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971Z"/></svg>      </span>
        </span>
      
      </button>
    </div>
    
            <div class="i-add-cart-buttons u-posr text-center flex-grow-1  flex-grow-1 i-product__cart-add">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__cart-add js-cart-add --shown u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Přidat do košíku" data-product-id="1" data-modal-target="add-product-to-cart-modal">
          <span class="btn__title u-z-index-1">
          Přidat do košíku
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0C5.718 0 3.807 1.58 3.416 3.667H.782V13.99c0 1.116.948 2.01 2.097 2.01H13.12c1.148 0 2.096-.894 2.096-2.01V3.667h-2.633C12.193 1.58 10.28 0 8 0Zm0 1.575c1.386 0 2.55.89 2.91 2.092H5.09C5.45 2.465 6.614 1.575 8 1.575ZM2.415 13.99V5.242h11.17v8.748c0 .232-.2.435-.464.435H2.879a.451.451 0 0 1-.464-.435Zm2.56-7.266H3.343v.787c0 2.864 2.14 5.066 4.657 5.066 2.526 0 4.657-2.213 4.657-5.066v-.787h-1.633v.787c0 1.948-1.378 3.491-3.024 3.491-1.646 0-3.025-1.543-3.025-3.491v-.787Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
    
          <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__print js-print-add --hidden u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Chci vlastní potisk" data-product-id="1" data-modal-target="product-print-modal">
          <span class="btn__title u-z-index-1">
          Chci vlastní potisk
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M6 19.572H3.92a2.419 2.419 0 0 1-2.42-2.418v-6.737A2.418 2.418 0 0 1 3.918 8H6V1.5h12V8h2.082a2.418 2.418 0 0 1 2.418 2.417v6.737a2.418 2.418 0 0 1-2.418 2.418H18V22.5H6v-2.928Zm12-1.538h2.082a.88.88 0 0 0 .88-.88v-6.737a.88.88 0 0 0-.881-.88H3.919a.88.88 0 0 0-.88.88v6.737c0 .486.394.88.88.88H6v-2.496H4.59V14h14.82v1.538H18v2.496ZM7.537 8h8.926V3.039l-8.926-.001V8ZM15 11h4v1.539h-4V11Zm-7.463 4.538v5.424h8.926v-5.424H7.537Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
      
      
      <div class="i-add-cart-button__animation u-posa u-top-50-p u-left-50-p u-translate-middle btn --primary u-posa --icon-only --js-product-button-animation --sm">
        <svg width="26" height="12" viewbox="0 0 26 12" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M3 6C4.65685 6 6 7.34315 6 9C6 10.6569 4.65685 12 3 12C1.34315 12 0 10.6569 0 9C0 7.34315 1.34315 6 3 6Z" fill="currentColor"/>
          <path d="M13 6C14.6569 6 16 7.34315 16 9C16 10.6569 14.6569 12 13 12C11.3431 12 10 10.6569 10 9C10 7.34315 11.3431 6 13 6Z" fill="currentColor"/>
          <path d="M23 6C24.6569 6 26 7.34315 26 9C26 10.6569 24.6569 12 23 12C21.3431 12 20 10.6569 20 9C20 7.34315 21.3431 6 23 6Z" fill="currentColor"/>
        </svg>
      </div>
    </div>
        </div>
      </div>
    </article>
            </div>
                </div>
    
        </div>
    
      <div class="g-products-slider__buttons d-flex u-z-index-1 justify-content-center justify-content-sm-between gap-1 w-100 u-posa u-translate-middle-y u-top-50-p u-left-0">
    
        <span class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --xs  --animation-left  --icon-only     g-products-slider__button --prev">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m.704 6.235 4.654-4.653 1.137 1.137-4.392 4.393L16 7.136v1.61L2.054 8.722l4.56 4.559-1.138 1.137-4.772-4.77a2.417 2.417 0 0 1 0-3.413Z"/></svg>      </span>
        </span>
      
      </span>
    
        <span class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --xs  --animation-right  --icon-only     g-products-slider__button --next">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m15.296 6.235-4.653-4.653-1.138 1.137 4.392 4.393L0 7.136v1.61l13.946-.024-4.56 4.559 1.138 1.137 4.772-4.77a2.417 2.417 0 0 0 0-3.413Z"/></svg>      </span>
        </span>
      
      </span>
    
      </div>
    
      <div class="g-products-slider__buttons--bottom d-flex d-sm-none u-z-index-1 justify-content-center justify-content-sm-between gap-1 w-100 mt-2">
    
        <span class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --xs  --animation-left  --icon-only     g-products-slider__button --prev --bottom">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m.704 6.235 4.654-4.653 1.137 1.137-4.392 4.393L16 7.136v1.61L2.054 8.722l4.56 4.559-1.138 1.137-4.772-4.77a2.417 2.417 0 0 1 0-3.413Z"/></svg>      </span>
        </span>
      
      </span>
    
        <span class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --xs  --animation-right  --icon-only     g-products-slider__button --next --bottom">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m15.296 6.235-4.653-4.653-1.138 1.137 4.392 4.393L0 7.136v1.61l13.946-.024-4.56 4.559 1.138 1.137 4.772-4.77a2.417 2.417 0 0 0 0-3.413Z"/></svg>      </span>
        </span>
      
      </span>
    
      </div>
          </div>
        
        </div>
    </section>
    
            
    Preview Twig Html
  • Více od AC/DC

    Hlasu zkrátka nevratné duší indičtí půlkilometrová začali nutné už od středisko. Společných snažila líně budoucnost začne vloženy stal objevováním, umělé cílem starým dne větvičky názvy moři zabíjí.
    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)
    30%
    Limitovaná edice Novinka Akce

    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)

    Min. 100 ks. 2,75Kč
    Od 1 000 ks. 2,65Kč
    Od 3 000 ks. 2,50Kč
    Od 5 000 ks. 2,40Kč
    Od 10 000 ks. 2,00Kč
    100
    ks
    Min. 100 ks
    Skladem
    ( 52265 Ks )
    1 ks 1 990 Kč
    Celkem: 1 990 Kč bez DPH
    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)
    30%
    Akce

    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)

    Min. 100 ks. 2,75Kč
    Od 1 000 ks. 2,65Kč
    Od 3 000 ks. 2,50Kč
    Od 5 000 ks. 2,40Kč
    Od 10 000 ks. 2,00Kč
    100
    ks
    Min. 100 ks
    Na dotaz
    ( 0 )
    1 ks 1 990 Kč
    Celkem: 1 990 Kč bez DPH
    Papírová taška hnědá Takeaway 26x16x30
    Doprava zdarma Nízká cena Výprodej

    Papírová taška hnědá Takeaway 26x16x30

    Min. 100 ks. 2,75Kč
    Od 1 000 ks. 2,65Kč
    Od 3 000 ks. 2,50Kč
    Od 5 000 ks. 2,40Kč
    Od 10 000 ks. 2,00Kč
    100
    ks
    Min. 100 ks
    Nedostupné
    ( Zpět 24.5. )
    1 ks 1 990 Kč
    Celkem: 1 990 Kč bez DPH
    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)
    30%
    Limitovaná edice Novinka Akce

    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)

    Min. 100 ks. 2,75Kč
    Od 1 000 ks. 2,65Kč
    Od 3 000 ks. 2,50Kč
    Od 5 000 ks. 2,40Kč
    Od 10 000 ks. 2,00Kč
    100
    ks
    Min. 100 ks
    Skladem
    ( 52265 Ks )
    1 ks 1 990 Kč
    Celkem: 1 990 Kč bez DPH
    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)
    30%
    Limitovaná edice Novinka Akce

    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)

    Min. 100 ks. 2,75Kč
    Od 1 000 ks. 2,65Kč
    Od 3 000 ks. 2,50Kč
    Od 5 000 ks. 2,40Kč
    Od 10 000 ks. 2,00Kč
    100
    ks
    Min. 100 ks
    Na dotaz
    ( 0 )
    1 ks 1 990 Kč
    Celkem: 1 990 Kč bez DPH
    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)
    30%
    Limitovaná edice Novinka Akce

    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)

    Min. 100 ks. 2,75Kč
    Od 1 000 ks. 2,65Kč
    Od 3 000 ks. 2,50Kč
    Od 5 000 ks. 2,40Kč
    Od 10 000 ks. 2,00Kč
    100
    ks
    Min. 100 ks
    Nedostupné
    ( Zpět 24.5. )
    1 ks 1 990 Kč
    Celkem: 1 990 Kč bez DPH
    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)
    30%
    Limitovaná edice Novinka Akce

    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)

    Min. 100 ks. 2,75Kč
    Od 1 000 ks. 2,65Kč
    Od 3 000 ks. 2,50Kč
    Od 5 000 ks. 2,40Kč
    Od 10 000 ks. 2,00Kč
    100
    ks
    Min. 100 ks
    Skladem
    ( 0 )
    1 ks 1 990 Kč
    Celkem: 1 990 Kč bez DPH
    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)
    30%
    Limitovaná edice Novinka Akce

    Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)

    Min. 100 ks. 2,75Kč
    Od 1 000 ks. 2,65Kč
    Od 3 000 ks. 2,50Kč
    Od 5 000 ks. 2,40Kč
    Od 10 000 ks. 2,00Kč
    100
    ks
    Min. 100 ks
    Skladem
    ( 0 )
    1 ks 1 990 Kč
    Celkem: 1 990 Kč bez DPH
  •         {% include "@Components/sections/products-slider-section/products-slider-section.twig" with {props: {
      header: {
        heading: {
          title: "Více od AC/DC"
        },
        perex: "Hlasu zkrátka nevratné duší indičtí půlkilometrová začali nutné už od středisko. Společných snažila líně budoucnost začne vloženy stal objevováním, umělé cílem starým dne větvičky názvy moři zabíjí."
      },
      group: {
        items: products_sample
      }
    }} %}
    
          
  •           
    
    
    <section class="base-section  s-products-slider">
      <div class="base-section__container container">
        
              <header class="base-header d-flex flex-column gap-3 text-center align-items-center">
    
      
          <h2 class="base-heading mb-0 u-fw-700 u-h2">
                Více od AC/DC
          </h2>
      
          <div class="base-header__description entry-content mb-0">Hlasu zkrátka nevratné duší indičtí půlkilometrová začali nutné už od středisko. Společných snažila líně budoucnost začne vloženy stal objevováním, umělé cílem starým dne větvičky názvy moři zabíjí.</div>
      
      
      
    
    </header>
        
              <div class="s-products-slider__slider u-posr">
            
    
    <div class="swiper g-products-slider --loading">
      <div class="swiper-wrapper">
                      <div class="swiper-slide">
              <article class="i-product u-container-inline u-posr u-border u-border--tertiary-500 u-rounded-3 h-100  --vertical" data-product-id="1">
      <div class="i-product__body d-flex flex-column gap-2 p-2 h-100">
        <figure class="i-product__image d-block u-posr overflow-hidden u-img-hover">
          <a href="#" class="i-product__image-link d-flex align-items-center" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
                      <div class="img u-posr overflow-hidden --cover  --ratio-1-1 i-product__image-full">
      <picture>
        
        <img src="" data-src="https://placehold.co/308x308" alt="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)" width="308" height="308" draggable="false" srcset="" data-srcset="https://placehold.co/308x308 1x, https://placehold.co/618x618/?paper-bag 2x">
      </picture>
    </div>
                  </a>
    
                  <div class="i-discount d-flex flex-column justify-content-center align-items-center  i-product__discount u-posa u-top-0 u-right-0 my-1 me-1">
      <div class="i-discount__value u-fw-700 u-fz-sm">30%</div>
    </div>
          
                    <div class="g-tags d-flex flex-wrap gap-1 i-product__tags u-posa u-top-0 u-left-0 mt-1 ms-1 align-items-start flex-column">
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-blue-400 --sm    i-product__tag">
          <span class="i-tag__title">Limitovaná edice</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-pink-400 --sm    i-product__tag">
          <span class="i-tag__title">Novinka</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-violet-400 --sm    i-product__tag">
          <span class="i-tag__title">Akce</span>
        </span>
          </div>
              </figure>
    
        <div class="i-product__header d-flex flex-column">
          <h2 class="i-product__title u-fz-md u-fw-700">
            <a class="link d-inline-flex u-fw-600 align-items-center      i-product__link u-fz-md u-clamp" href="#" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
          <span class="link__title">Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)</span>
      
      
      </a>
          </h2>
        </div>
    
        <div class="i-product__content mt-auto --js-pricelist-controler">
          <div class="row gx-0 mb-2">
    
                      <div class="i-pricelist u-fz-xs i-product__pricelist col-12 mb-2">
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    --active --first
                    
                  "
             data-price="2.75"
             data-min-count="100"
             data-index="0"
        >
                  <span>Min. 100 ks.</span>
          
                  <span>2,75Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.65"
             data-min-count="1000"
             data-index="1"
        >
                  <span>Od 1 000 ks.</span>
          
                  <span>2,65Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.5"
             data-min-count="3000"
             data-index="2"
        >
                  <span>Od 3 000 ks.</span>
          
                  <span>2,50Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.4"
             data-min-count="5000"
             data-index="3"
        >
                  <span>Od 5 000 ks.</span>
          
                  <span>2,40Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    --last
                  "
             data-price="2"
             data-min-count="10000"
             data-index="4"
        >
                  <span>Od 10 000 ks.</span>
          
                  <span>2,00Kč</span>
              </div>
      </div>
            
            <div class="col-6 d-flex i-product__print-checkbox-wrapper">
              <label class="f-checkbox d-inline-flex gap-1 u-posr  align-items-center  --checkbox   i-product__print-checkbox --js-product-item-checkbox u-fw-600">
      <input class="f-checkbox__input u-posa" type="checkbox">
      <span class="f-checkbox__visual flex-shrink-0 d-flex align-items-center justify-content-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>  </span>
      <div class="f-checkbox__body d-flex column-gap-1 align-items-center">
        <span class="f-checkbox__title">
                            Vlastní potisk
                  
              </span>
    
        
          </div>
    
      <span class="f-error u-fz-sm gap-1 d-none">
      <span class="f-error__icon d-flex align-items-center justify-content-center">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24v112c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm-32 224a32 32 0 1 1 64 0 32 32 0 1 1-64 0z"/></svg>      </span>
      </span>
    
      <span class="f-error__title"></span>
    </span>
    
    </label>
            </div>
            <div class="col-6 i-product__print-counter-wrapper">
              
    <div class="c-counter u-fw-700 u-fz-14 u-bg-white u-posr d-flex align-items-center justify-content-between p-1 flex-shrink-0 u-border u-border--tertiary-500  product-quantity --js-product-counter">
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --minus u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#B0B2D4" fill-rule="evenodd" d="M4 12a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <div class="c-counter__value-visual d-flex">
        <div class="c-counter__value" contenteditable="true">100</div>
              <div class="c-counter__units">ks</div>
                  <div class="c-counter__label u-posa u-top-0 u-left-50-p u-fz-xs px-1 u-bg-white text-nowrap">Min. 100 ks</div>
          </div>
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --plus">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.975 6.975V3h2.05v3.975H13v2.05H9.025V13h-2.05V9.025H3v-2.05h3.975Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <input class="c-counter__input d-none" type="number" name="product-quantity" value="100" min="100" max="50000">
    </div>
            </div>
          </div>
    
          <div class="d-flex flex-row gap-2 justify-content-between flex-grow-1 align-items-center flex-wrap">
                      <div class="i-availability u-fz-sm d-flex flex-column --available  i-product__availability">  
      <div class="i-availability__title d-flex align-items-center u-fw-700 u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>      </span>
    
        Skladem
      </div>
      <span class="i-availability__quantity flex-shrink-0 u-color-tertiary-600 u-fz-xs u-color-text-400">
              ( 52265 Ks )
          </span>
    
      </div>
            
                      <div class="d-flex justify-content-end flex-column align-items-end">
                <div class="i-price p-1 d-flex flex-column justify-content-center flex-shrink-0 u-bg-primary-400 i-product__price">
            <div class="i-price__row i-price__main d-flex justify-content-end align-items-end gap-1">
    
          
                  <span class="i-price__title u-fz-md u-fw-700">1 ks</span>
          
          <span class="i-price__main u-fw-700">
            <span class="--js-product-item-price">
              1 990
            </span>
                      Kč              </span>
        </div>
      
      </div>
                <span class="u-fw-500 u-fz-sm d-inline">Celkem:
                  <span class="--js-product-total-price">1 990</span>
                  Kč
                  bez DPH
                </span>
              </div>
                  </div>
        </div>
        <div class="i-product__buttons d-flex gap-2 justify-content-between">
          <div class="i-add-wishlist-button --wishlisted   i-product__wishlist flex-shrink-0">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__add js-wishlist-add" type="button" aria-label="Přidat do wishlistu" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971ZM12 19.879C9.29 17.82 3.67 12.764 3.67 8.97c-.118-2.216 1.57-4.142 3.749-4.277 2.178.135 3.866 2.06 3.748 4.277h1.666c-.118-2.216 1.57-4.142 3.748-4.277 2.18.135 3.867 2.06 3.749 4.277 0 3.795-5.62 8.85-8.33 10.908Z"/></svg>      </span>
        </span>
      
      </button>
    
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__remove js-wishlist-remove" type="button" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971Z"/></svg>      </span>
        </span>
      
      </button>
    </div>
    
            <div class="i-add-cart-buttons u-posr text-center flex-grow-1  flex-grow-1 i-product__cart-add">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__cart-add js-cart-add --shown u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Přidat do košíku" data-product-id="1" data-modal-target="add-product-to-cart-modal">
          <span class="btn__title u-z-index-1">
          Přidat do košíku
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0C5.718 0 3.807 1.58 3.416 3.667H.782V13.99c0 1.116.948 2.01 2.097 2.01H13.12c1.148 0 2.096-.894 2.096-2.01V3.667h-2.633C12.193 1.58 10.28 0 8 0Zm0 1.575c1.386 0 2.55.89 2.91 2.092H5.09C5.45 2.465 6.614 1.575 8 1.575ZM2.415 13.99V5.242h11.17v8.748c0 .232-.2.435-.464.435H2.879a.451.451 0 0 1-.464-.435Zm2.56-7.266H3.343v.787c0 2.864 2.14 5.066 4.657 5.066 2.526 0 4.657-2.213 4.657-5.066v-.787h-1.633v.787c0 1.948-1.378 3.491-3.024 3.491-1.646 0-3.025-1.543-3.025-3.491v-.787Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
    
          <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__print js-print-add --hidden u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Chci vlastní potisk" data-product-id="1" data-modal-target="product-print-modal">
          <span class="btn__title u-z-index-1">
          Chci vlastní potisk
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M6 19.572H3.92a2.419 2.419 0 0 1-2.42-2.418v-6.737A2.418 2.418 0 0 1 3.918 8H6V1.5h12V8h2.082a2.418 2.418 0 0 1 2.418 2.417v6.737a2.418 2.418 0 0 1-2.418 2.418H18V22.5H6v-2.928Zm12-1.538h2.082a.88.88 0 0 0 .88-.88v-6.737a.88.88 0 0 0-.881-.88H3.919a.88.88 0 0 0-.88.88v6.737c0 .486.394.88.88.88H6v-2.496H4.59V14h14.82v1.538H18v2.496ZM7.537 8h8.926V3.039l-8.926-.001V8ZM15 11h4v1.539h-4V11Zm-7.463 4.538v5.424h8.926v-5.424H7.537Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
      
      
      <div class="i-add-cart-button__animation u-posa u-top-50-p u-left-50-p u-translate-middle btn --primary u-posa --icon-only --js-product-button-animation --sm">
        <svg width="26" height="12" viewbox="0 0 26 12" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M3 6C4.65685 6 6 7.34315 6 9C6 10.6569 4.65685 12 3 12C1.34315 12 0 10.6569 0 9C0 7.34315 1.34315 6 3 6Z" fill="currentColor"/>
          <path d="M13 6C14.6569 6 16 7.34315 16 9C16 10.6569 14.6569 12 13 12C11.3431 12 10 10.6569 10 9C10 7.34315 11.3431 6 13 6Z" fill="currentColor"/>
          <path d="M23 6C24.6569 6 26 7.34315 26 9C26 10.6569 24.6569 12 23 12C21.3431 12 20 10.6569 20 9C20 7.34315 21.3431 6 23 6Z" fill="currentColor"/>
        </svg>
      </div>
    </div>
        </div>
      </div>
    </article>
            </div>
                  <div class="swiper-slide">
              <article class="i-product u-container-inline u-posr u-border u-border--tertiary-500 u-rounded-3 h-100  --vertical" data-product-id="2">
      <div class="i-product__body d-flex flex-column gap-2 p-2 h-100">
        <figure class="i-product__image d-block u-posr overflow-hidden u-img-hover">
          <a href="#" class="i-product__image-link d-flex align-items-center" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
                      <div class="img u-posr overflow-hidden --cover  --ratio-1-1 i-product__image-full">
      <picture>
        
        <img src="" data-src="https://placehold.co/308x308" alt="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)" width="308" height="308" draggable="false" srcset="" data-srcset="https://placehold.co/308x308 1x, https://placehold.co/618x618/?paper-bag 2x">
      </picture>
    </div>
                  </a>
    
                  <div class="i-discount d-flex flex-column justify-content-center align-items-center  i-product__discount u-posa u-top-0 u-right-0 my-1 me-1">
      <div class="i-discount__value u-fw-700 u-fz-sm">30%</div>
    </div>
          
                    <div class="g-tags d-flex flex-wrap gap-1 i-product__tags u-posa u-top-0 u-left-0 mt-1 ms-1 align-items-start flex-column">
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-secondary-400 --sm    i-product__tag">
          <span class="i-tag__title">Akce</span>
        </span>
          </div>
              </figure>
    
        <div class="i-product__header d-flex flex-column">
          <h2 class="i-product__title u-fz-md u-fw-700">
            <a class="link d-inline-flex u-fw-600 align-items-center      i-product__link u-fz-md u-clamp" href="#" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
          <span class="link__title">Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)</span>
      
      
      </a>
          </h2>
        </div>
    
        <div class="i-product__content mt-auto --js-pricelist-controler">
          <div class="row gx-0 mb-2">
    
                      <div class="i-pricelist u-fz-xs i-product__pricelist col-12 mb-2">
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    --active --first
                    
                  "
             data-price="2.75"
             data-min-count="100"
             data-index="0"
        >
                  <span>Min. 100 ks.</span>
          
                  <span>2,75Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.65"
             data-min-count="1000"
             data-index="1"
        >
                  <span>Od 1 000 ks.</span>
          
                  <span>2,65Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.5"
             data-min-count="3000"
             data-index="2"
        >
                  <span>Od 3 000 ks.</span>
          
                  <span>2,50Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.4"
             data-min-count="5000"
             data-index="3"
        >
                  <span>Od 5 000 ks.</span>
          
                  <span>2,40Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    --last
                  "
             data-price="2"
             data-min-count="10000"
             data-index="4"
        >
                  <span>Od 10 000 ks.</span>
          
                  <span>2,00Kč</span>
              </div>
      </div>
            
            <div class="col-6 d-flex i-product__print-checkbox-wrapper">
              <label class="f-checkbox d-inline-flex gap-1 u-posr  align-items-center  --checkbox   i-product__print-checkbox --js-product-item-checkbox u-fw-600">
      <input class="f-checkbox__input u-posa" type="checkbox">
      <span class="f-checkbox__visual flex-shrink-0 d-flex align-items-center justify-content-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>  </span>
      <div class="f-checkbox__body d-flex column-gap-1 align-items-center">
        <span class="f-checkbox__title">
                            Vlastní potisk
                  
              </span>
    
        
          </div>
    
      <span class="f-error u-fz-sm gap-1 d-none">
      <span class="f-error__icon d-flex align-items-center justify-content-center">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24v112c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm-32 224a32 32 0 1 1 64 0 32 32 0 1 1-64 0z"/></svg>      </span>
      </span>
    
      <span class="f-error__title"></span>
    </span>
    
    </label>
            </div>
            <div class="col-6 i-product__print-counter-wrapper">
              
    <div class="c-counter u-fw-700 u-fz-14 u-bg-white u-posr d-flex align-items-center justify-content-between p-1 flex-shrink-0 u-border u-border--tertiary-500  product-quantity --js-product-counter">
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --minus u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#B0B2D4" fill-rule="evenodd" d="M4 12a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <div class="c-counter__value-visual d-flex">
        <div class="c-counter__value" contenteditable="true">100</div>
              <div class="c-counter__units">ks</div>
                  <div class="c-counter__label u-posa u-top-0 u-left-50-p u-fz-xs px-1 u-bg-white text-nowrap">Min. 100 ks</div>
          </div>
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --plus">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.975 6.975V3h2.05v3.975H13v2.05H9.025V13h-2.05V9.025H3v-2.05h3.975Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <input class="c-counter__input d-none" type="number" name="product-quantity" value="100" min="100" max="50000">
    </div>
            </div>
          </div>
    
          <div class="d-flex flex-row gap-2 justify-content-between flex-grow-1 align-items-center flex-wrap">
                      <div class="i-availability u-fz-sm d-flex flex-column --default  i-product__availability">  
      <div class="i-availability__title d-flex align-items-center u-fw-700 u-color-text-500">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --text --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M9.05 5h-2.1V3h2.1v2ZM6 6v2.099h.95v2.8H6V13h.95v.002h2.1v-.002H10v-2.1h-.95V6H6Z" clip-rule="evenodd"/></svg>      </span>
    
        Na dotaz
      </div>
      <span class="i-availability__quantity flex-shrink-0 u-color-tertiary-600 u-fz-xs u-color-text-400">
              ( 0 )
          </span>
    
      </div>
            
                      <div class="d-flex justify-content-end flex-column align-items-end">
                <div class="i-price p-1 d-flex flex-column justify-content-center flex-shrink-0 u-bg-primary-400 i-product__price">
            <div class="i-price__row i-price__main d-flex justify-content-end align-items-end gap-1">
    
          
                  <span class="i-price__title u-fz-md u-fw-700">1 ks</span>
          
          <span class="i-price__main u-fw-700">
            <span class="--js-product-item-price">
              1 990
            </span>
                      Kč              </span>
        </div>
      
      </div>
                <span class="u-fw-500 u-fz-sm d-inline">Celkem:
                  <span class="--js-product-total-price">1 990</span>
                  Kč
                  bez DPH
                </span>
              </div>
                  </div>
        </div>
        <div class="i-product__buttons d-flex gap-2 justify-content-between">
          <div class="i-add-wishlist-button --wishlisted   i-product__wishlist flex-shrink-0">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__add js-wishlist-add" type="button" aria-label="Přidat do wishlistu" data-product-id="2">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971ZM12 19.879C9.29 17.82 3.67 12.764 3.67 8.97c-.118-2.216 1.57-4.142 3.749-4.277 2.178.135 3.866 2.06 3.748 4.277h1.666c-.118-2.216 1.57-4.142 3.748-4.277 2.18.135 3.867 2.06 3.749 4.277 0 3.795-5.62 8.85-8.33 10.908Z"/></svg>      </span>
        </span>
      
      </button>
    
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__remove js-wishlist-remove" type="button" data-product-id="2">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971Z"/></svg>      </span>
        </span>
      
      </button>
    </div>
    
            <div class="i-add-cart-buttons u-posr text-center flex-grow-1  flex-grow-1 i-product__cart-add">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__cart-add js-cart-add --shown u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Přidat do košíku" data-product-id="2" data-modal-target="add-product-to-cart-modal">
          <span class="btn__title u-z-index-1">
          Přidat do košíku
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0C5.718 0 3.807 1.58 3.416 3.667H.782V13.99c0 1.116.948 2.01 2.097 2.01H13.12c1.148 0 2.096-.894 2.096-2.01V3.667h-2.633C12.193 1.58 10.28 0 8 0Zm0 1.575c1.386 0 2.55.89 2.91 2.092H5.09C5.45 2.465 6.614 1.575 8 1.575ZM2.415 13.99V5.242h11.17v8.748c0 .232-.2.435-.464.435H2.879a.451.451 0 0 1-.464-.435Zm2.56-7.266H3.343v.787c0 2.864 2.14 5.066 4.657 5.066 2.526 0 4.657-2.213 4.657-5.066v-.787h-1.633v.787c0 1.948-1.378 3.491-3.024 3.491-1.646 0-3.025-1.543-3.025-3.491v-.787Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
    
          <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__print js-print-add --hidden u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Chci vlastní potisk" data-product-id="2" data-modal-target="product-print-modal">
          <span class="btn__title u-z-index-1">
          Chci vlastní potisk
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M6 19.572H3.92a2.419 2.419 0 0 1-2.42-2.418v-6.737A2.418 2.418 0 0 1 3.918 8H6V1.5h12V8h2.082a2.418 2.418 0 0 1 2.418 2.417v6.737a2.418 2.418 0 0 1-2.418 2.418H18V22.5H6v-2.928Zm12-1.538h2.082a.88.88 0 0 0 .88-.88v-6.737a.88.88 0 0 0-.881-.88H3.919a.88.88 0 0 0-.88.88v6.737c0 .486.394.88.88.88H6v-2.496H4.59V14h14.82v1.538H18v2.496ZM7.537 8h8.926V3.039l-8.926-.001V8ZM15 11h4v1.539h-4V11Zm-7.463 4.538v5.424h8.926v-5.424H7.537Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
      
      
      <div class="i-add-cart-button__animation u-posa u-top-50-p u-left-50-p u-translate-middle btn --primary u-posa --icon-only --js-product-button-animation --sm">
        <svg width="26" height="12" viewbox="0 0 26 12" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M3 6C4.65685 6 6 7.34315 6 9C6 10.6569 4.65685 12 3 12C1.34315 12 0 10.6569 0 9C0 7.34315 1.34315 6 3 6Z" fill="currentColor"/>
          <path d="M13 6C14.6569 6 16 7.34315 16 9C16 10.6569 14.6569 12 13 12C11.3431 12 10 10.6569 10 9C10 7.34315 11.3431 6 13 6Z" fill="currentColor"/>
          <path d="M23 6C24.6569 6 26 7.34315 26 9C26 10.6569 24.6569 12 23 12C21.3431 12 20 10.6569 20 9C20 7.34315 21.3431 6 23 6Z" fill="currentColor"/>
        </svg>
      </div>
    </div>
        </div>
      </div>
    </article>
            </div>
                  <div class="swiper-slide">
              <article class="i-product u-container-inline u-posr u-border u-border--tertiary-500 u-rounded-3 h-100  --vertical" data-product-id="3">
      <div class="i-product__body d-flex flex-column gap-2 p-2 h-100">
        <figure class="i-product__image d-block u-posr overflow-hidden u-img-hover">
          <a href="#" class="i-product__image-link d-flex align-items-center" title="Papírová taška hnědá Takeaway 26x16x30">
                      <div class="img u-posr overflow-hidden --cover  --ratio-1-1 i-product__image-full">
      <picture>
        
        <img src="" data-src="https://placehold.co/308x308" alt="Papírová taška hnědá Takeaway 26x16x30" width="308" height="308" draggable="false" srcset="" data-srcset="https://placehold.co/308x308 1x, https://placehold.co/618x618/?paper-bag 2x">
      </picture>
    </div>
                  </a>
    
          
                    <div class="g-tags d-flex flex-wrap gap-1 i-product__tags u-posa u-top-0 u-left-0 mt-1 ms-1 align-items-start flex-column">
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-blue-400 --sm    i-product__tag">
          <span class="i-tag__title">Doprava zdarma</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-pink-400 --sm    i-product__tag">
          <span class="i-tag__title">Nízká cena</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-primary-400 --sm    i-product__tag">
          <span class="i-tag__title">Výprodej</span>
        </span>
          </div>
              </figure>
    
        <div class="i-product__header d-flex flex-column">
          <h2 class="i-product__title u-fz-md u-fw-700">
            <a class="link d-inline-flex u-fw-600 align-items-center      i-product__link u-fz-md u-clamp" href="#" title="Papírová taška hnědá Takeaway 26x16x30">
          <span class="link__title">Papírová taška hnědá Takeaway 26x16x30</span>
      
      
      </a>
          </h2>
        </div>
    
        <div class="i-product__content mt-auto --js-pricelist-controler">
          <div class="row gx-0 mb-2">
    
                      <div class="i-pricelist u-fz-xs i-product__pricelist col-12 mb-2">
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    --active --first
                    
                  "
             data-price="2.75"
             data-min-count="100"
             data-index="0"
        >
                  <span>Min. 100 ks.</span>
          
                  <span>2,75Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.65"
             data-min-count="1000"
             data-index="1"
        >
                  <span>Od 1 000 ks.</span>
          
                  <span>2,65Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.5"
             data-min-count="3000"
             data-index="2"
        >
                  <span>Od 3 000 ks.</span>
          
                  <span>2,50Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.4"
             data-min-count="5000"
             data-index="3"
        >
                  <span>Od 5 000 ks.</span>
          
                  <span>2,40Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    --last
                  "
             data-price="2"
             data-min-count="10000"
             data-index="4"
        >
                  <span>Od 10 000 ks.</span>
          
                  <span>2,00Kč</span>
              </div>
      </div>
            
            <div class="col-6 d-flex i-product__print-checkbox-wrapper">
              <label class="f-checkbox d-inline-flex gap-1 u-posr  align-items-center  --checkbox   i-product__print-checkbox --js-product-item-checkbox u-fw-600">
      <input class="f-checkbox__input u-posa" type="checkbox">
      <span class="f-checkbox__visual flex-shrink-0 d-flex align-items-center justify-content-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>  </span>
      <div class="f-checkbox__body d-flex column-gap-1 align-items-center">
        <span class="f-checkbox__title">
                            Vlastní potisk
                  
              </span>
    
        
          </div>
    
      <span class="f-error u-fz-sm gap-1 d-none">
      <span class="f-error__icon d-flex align-items-center justify-content-center">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24v112c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm-32 224a32 32 0 1 1 64 0 32 32 0 1 1-64 0z"/></svg>      </span>
      </span>
    
      <span class="f-error__title"></span>
    </span>
    
    </label>
            </div>
            <div class="col-6 i-product__print-counter-wrapper">
              
    <div class="c-counter u-fw-700 u-fz-14 u-bg-white u-posr d-flex align-items-center justify-content-between p-1 flex-shrink-0 u-border u-border--tertiary-500  product-quantity --js-product-counter">
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --minus u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#B0B2D4" fill-rule="evenodd" d="M4 12a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <div class="c-counter__value-visual d-flex">
        <div class="c-counter__value" contenteditable="true">100</div>
              <div class="c-counter__units">ks</div>
                  <div class="c-counter__label u-posa u-top-0 u-left-50-p u-fz-xs px-1 u-bg-white text-nowrap">Min. 100 ks</div>
          </div>
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --plus">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.975 6.975V3h2.05v3.975H13v2.05H9.025V13h-2.05V9.025H3v-2.05h3.975Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <input class="c-counter__input d-none" type="number" name="product-quantity" value="100" min="100" max="50000">
    </div>
            </div>
          </div>
    
          <div class="d-flex flex-row gap-2 justify-content-between flex-grow-1 align-items-center flex-wrap">
                      <div class="i-availability u-fz-sm d-flex flex-column --unavailable  i-product__availability">  
      <div class="i-availability__title d-flex align-items-center u-fw-700 u-color-danger">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.495 8.002 3.203 4.746l1.478-1.5 3.32 3.272 3.317-3.272 1.478 1.5-3.292 3.256 3.292 3.246-1.494 1.507L8 9.489l-3.303 3.266-1.494-1.507 3.292-3.246Z" clip-rule="evenodd"/></svg>      </span>
    
        Nedostupné
      </div>
      <span class="i-availability__quantity flex-shrink-0 u-color-tertiary-600 u-fz-xs u-color-text-400">
              ( Zpět 24.5. )
          </span>
    
      </div>
            
                      <div class="d-flex justify-content-end flex-column align-items-end">
                <div class="i-price p-1 d-flex flex-column justify-content-center flex-shrink-0 u-bg-primary-400 i-product__price">
            <div class="i-price__row i-price__main d-flex justify-content-end align-items-end gap-1">
    
          
                  <span class="i-price__title u-fz-md u-fw-700">1 ks</span>
          
          <span class="i-price__main u-fw-700">
            <span class="--js-product-item-price">
              1 990
            </span>
                      Kč              </span>
        </div>
      
      </div>
                <span class="u-fw-500 u-fz-sm d-inline">Celkem:
                  <span class="--js-product-total-price">1 990</span>
                  Kč
                  bez DPH
                </span>
              </div>
                  </div>
        </div>
        <div class="i-product__buttons d-flex gap-2 justify-content-between">
          <div class="i-add-wishlist-button    i-product__wishlist flex-shrink-0">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__add js-wishlist-add" type="button" aria-label="Přidat do wishlistu" data-product-id="3">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971ZM12 19.879C9.29 17.82 3.67 12.764 3.67 8.97c-.118-2.216 1.57-4.142 3.749-4.277 2.178.135 3.866 2.06 3.748 4.277h1.666c-.118-2.216 1.57-4.142 3.748-4.277 2.18.135 3.867 2.06 3.749 4.277 0 3.795-5.62 8.85-8.33 10.908Z"/></svg>      </span>
        </span>
      
      </button>
    
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__remove js-wishlist-remove" type="button" data-product-id="3">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971Z"/></svg>      </span>
        </span>
      
      </button>
    </div>
    
            <div class="i-add-cart-buttons u-posr text-center flex-grow-1  flex-grow-1 i-product__cart-add">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__cart-add js-cart-add --shown u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Přidat do košíku" data-product-id="3" data-modal-target="add-product-to-cart-modal">
          <span class="btn__title u-z-index-1">
          Přidat do košíku
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0C5.718 0 3.807 1.58 3.416 3.667H.782V13.99c0 1.116.948 2.01 2.097 2.01H13.12c1.148 0 2.096-.894 2.096-2.01V3.667h-2.633C12.193 1.58 10.28 0 8 0Zm0 1.575c1.386 0 2.55.89 2.91 2.092H5.09C5.45 2.465 6.614 1.575 8 1.575ZM2.415 13.99V5.242h11.17v8.748c0 .232-.2.435-.464.435H2.879a.451.451 0 0 1-.464-.435Zm2.56-7.266H3.343v.787c0 2.864 2.14 5.066 4.657 5.066 2.526 0 4.657-2.213 4.657-5.066v-.787h-1.633v.787c0 1.948-1.378 3.491-3.024 3.491-1.646 0-3.025-1.543-3.025-3.491v-.787Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
    
          <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__print js-print-add --hidden u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Chci vlastní potisk" data-product-id="3" data-modal-target="product-print-modal">
          <span class="btn__title u-z-index-1">
          Chci vlastní potisk
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M6 19.572H3.92a2.419 2.419 0 0 1-2.42-2.418v-6.737A2.418 2.418 0 0 1 3.918 8H6V1.5h12V8h2.082a2.418 2.418 0 0 1 2.418 2.417v6.737a2.418 2.418 0 0 1-2.418 2.418H18V22.5H6v-2.928Zm12-1.538h2.082a.88.88 0 0 0 .88-.88v-6.737a.88.88 0 0 0-.881-.88H3.919a.88.88 0 0 0-.88.88v6.737c0 .486.394.88.88.88H6v-2.496H4.59V14h14.82v1.538H18v2.496ZM7.537 8h8.926V3.039l-8.926-.001V8ZM15 11h4v1.539h-4V11Zm-7.463 4.538v5.424h8.926v-5.424H7.537Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
      
      
      <div class="i-add-cart-button__animation u-posa u-top-50-p u-left-50-p u-translate-middle btn --primary u-posa --icon-only --js-product-button-animation --sm">
        <svg width="26" height="12" viewbox="0 0 26 12" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M3 6C4.65685 6 6 7.34315 6 9C6 10.6569 4.65685 12 3 12C1.34315 12 0 10.6569 0 9C0 7.34315 1.34315 6 3 6Z" fill="currentColor"/>
          <path d="M13 6C14.6569 6 16 7.34315 16 9C16 10.6569 14.6569 12 13 12C11.3431 12 10 10.6569 10 9C10 7.34315 11.3431 6 13 6Z" fill="currentColor"/>
          <path d="M23 6C24.6569 6 26 7.34315 26 9C26 10.6569 24.6569 12 23 12C21.3431 12 20 10.6569 20 9C20 7.34315 21.3431 6 23 6Z" fill="currentColor"/>
        </svg>
      </div>
    </div>
        </div>
      </div>
    </article>
            </div>
                  <div class="swiper-slide">
              <article class="i-product u-container-inline u-posr u-border u-border--tertiary-500 u-rounded-3 h-100  --vertical" data-product-id="1">
      <div class="i-product__body d-flex flex-column gap-2 p-2 h-100">
        <figure class="i-product__image d-block u-posr overflow-hidden u-img-hover">
          <a href="#" class="i-product__image-link d-flex align-items-center" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
                      <div class="img u-posr overflow-hidden --cover  --ratio-1-1 i-product__image-full">
      <picture>
        
        <img src="" data-src="https://placehold.co/308x308" alt="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)" width="308" height="308" draggable="false" srcset="" data-srcset="https://placehold.co/308x308 1x, https://placehold.co/618x618/?paper-bag 2x">
      </picture>
    </div>
                  </a>
    
                  <div class="i-discount d-flex flex-column justify-content-center align-items-center  i-product__discount u-posa u-top-0 u-right-0 my-1 me-1">
      <div class="i-discount__value u-fw-700 u-fz-sm">30%</div>
    </div>
          
                    <div class="g-tags d-flex flex-wrap gap-1 i-product__tags u-posa u-top-0 u-left-0 mt-1 ms-1 align-items-start flex-column">
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-blue-400 --sm    i-product__tag">
          <span class="i-tag__title">Limitovaná edice</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-pink-400 --sm    i-product__tag">
          <span class="i-tag__title">Novinka</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-violet-400 --sm    i-product__tag">
          <span class="i-tag__title">Akce</span>
        </span>
          </div>
              </figure>
    
        <div class="i-product__header d-flex flex-column">
          <h2 class="i-product__title u-fz-md u-fw-700">
            <a class="link d-inline-flex u-fw-600 align-items-center      i-product__link u-fz-md u-clamp" href="#" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
          <span class="link__title">Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)</span>
      
      
      </a>
          </h2>
        </div>
    
        <div class="i-product__content mt-auto --js-pricelist-controler">
          <div class="row gx-0 mb-2">
    
                      <div class="i-pricelist u-fz-xs i-product__pricelist col-12 mb-2">
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    --active --first
                    
                  "
             data-price="2.75"
             data-min-count="100"
             data-index="0"
        >
                  <span>Min. 100 ks.</span>
          
                  <span>2,75Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.65"
             data-min-count="1000"
             data-index="1"
        >
                  <span>Od 1 000 ks.</span>
          
                  <span>2,65Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.5"
             data-min-count="3000"
             data-index="2"
        >
                  <span>Od 3 000 ks.</span>
          
                  <span>2,50Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.4"
             data-min-count="5000"
             data-index="3"
        >
                  <span>Od 5 000 ks.</span>
          
                  <span>2,40Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    --last
                  "
             data-price="2"
             data-min-count="10000"
             data-index="4"
        >
                  <span>Od 10 000 ks.</span>
          
                  <span>2,00Kč</span>
              </div>
      </div>
            
            <div class="col-6 d-flex i-product__print-checkbox-wrapper">
              <label class="f-checkbox d-inline-flex gap-1 u-posr  align-items-center  --checkbox   i-product__print-checkbox --js-product-item-checkbox u-fw-600">
      <input class="f-checkbox__input u-posa" type="checkbox">
      <span class="f-checkbox__visual flex-shrink-0 d-flex align-items-center justify-content-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>  </span>
      <div class="f-checkbox__body d-flex column-gap-1 align-items-center">
        <span class="f-checkbox__title">
                            Vlastní potisk
                  
              </span>
    
        
          </div>
    
      <span class="f-error u-fz-sm gap-1 d-none">
      <span class="f-error__icon d-flex align-items-center justify-content-center">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24v112c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm-32 224a32 32 0 1 1 64 0 32 32 0 1 1-64 0z"/></svg>      </span>
      </span>
    
      <span class="f-error__title"></span>
    </span>
    
    </label>
            </div>
            <div class="col-6 i-product__print-counter-wrapper">
              
    <div class="c-counter u-fw-700 u-fz-14 u-bg-white u-posr d-flex align-items-center justify-content-between p-1 flex-shrink-0 u-border u-border--tertiary-500  product-quantity --js-product-counter">
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --minus u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#B0B2D4" fill-rule="evenodd" d="M4 12a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <div class="c-counter__value-visual d-flex">
        <div class="c-counter__value" contenteditable="true">100</div>
              <div class="c-counter__units">ks</div>
                  <div class="c-counter__label u-posa u-top-0 u-left-50-p u-fz-xs px-1 u-bg-white text-nowrap">Min. 100 ks</div>
          </div>
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --plus">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.975 6.975V3h2.05v3.975H13v2.05H9.025V13h-2.05V9.025H3v-2.05h3.975Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <input class="c-counter__input d-none" type="number" name="product-quantity" value="100" min="100" max="50000">
    </div>
            </div>
          </div>
    
          <div class="d-flex flex-row gap-2 justify-content-between flex-grow-1 align-items-center flex-wrap">
                      <div class="i-availability u-fz-sm d-flex flex-column --available  i-product__availability">  
      <div class="i-availability__title d-flex align-items-center u-fw-700 u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>      </span>
    
        Skladem
      </div>
      <span class="i-availability__quantity flex-shrink-0 u-color-tertiary-600 u-fz-xs u-color-text-400">
              ( 52265 Ks )
          </span>
    
      </div>
            
                      <div class="d-flex justify-content-end flex-column align-items-end">
                <div class="i-price p-1 d-flex flex-column justify-content-center flex-shrink-0 u-bg-primary-400 i-product__price">
            <div class="i-price__row i-price__main d-flex justify-content-end align-items-end gap-1">
    
          
                  <span class="i-price__title u-fz-md u-fw-700">1 ks</span>
          
          <span class="i-price__main u-fw-700">
            <span class="--js-product-item-price">
              1 990
            </span>
                      Kč              </span>
        </div>
      
      </div>
                <span class="u-fw-500 u-fz-sm d-inline">Celkem:
                  <span class="--js-product-total-price">1 990</span>
                  Kč
                  bez DPH
                </span>
              </div>
                  </div>
        </div>
        <div class="i-product__buttons d-flex gap-2 justify-content-between">
          <div class="i-add-wishlist-button --wishlisted   i-product__wishlist flex-shrink-0">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__add js-wishlist-add" type="button" aria-label="Přidat do wishlistu" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971ZM12 19.879C9.29 17.82 3.67 12.764 3.67 8.97c-.118-2.216 1.57-4.142 3.749-4.277 2.178.135 3.866 2.06 3.748 4.277h1.666c-.118-2.216 1.57-4.142 3.748-4.277 2.18.135 3.867 2.06 3.749 4.277 0 3.795-5.62 8.85-8.33 10.908Z"/></svg>      </span>
        </span>
      
      </button>
    
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__remove js-wishlist-remove" type="button" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971Z"/></svg>      </span>
        </span>
      
      </button>
    </div>
    
            <div class="i-add-cart-buttons u-posr text-center flex-grow-1  flex-grow-1 i-product__cart-add">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__cart-add js-cart-add --shown u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Přidat do košíku" data-product-id="1" data-modal-target="add-product-to-cart-modal">
          <span class="btn__title u-z-index-1">
          Přidat do košíku
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0C5.718 0 3.807 1.58 3.416 3.667H.782V13.99c0 1.116.948 2.01 2.097 2.01H13.12c1.148 0 2.096-.894 2.096-2.01V3.667h-2.633C12.193 1.58 10.28 0 8 0Zm0 1.575c1.386 0 2.55.89 2.91 2.092H5.09C5.45 2.465 6.614 1.575 8 1.575ZM2.415 13.99V5.242h11.17v8.748c0 .232-.2.435-.464.435H2.879a.451.451 0 0 1-.464-.435Zm2.56-7.266H3.343v.787c0 2.864 2.14 5.066 4.657 5.066 2.526 0 4.657-2.213 4.657-5.066v-.787h-1.633v.787c0 1.948-1.378 3.491-3.024 3.491-1.646 0-3.025-1.543-3.025-3.491v-.787Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
    
          <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__print js-print-add --hidden u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Chci vlastní potisk" data-product-id="1" data-modal-target="product-print-modal">
          <span class="btn__title u-z-index-1">
          Chci vlastní potisk
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M6 19.572H3.92a2.419 2.419 0 0 1-2.42-2.418v-6.737A2.418 2.418 0 0 1 3.918 8H6V1.5h12V8h2.082a2.418 2.418 0 0 1 2.418 2.417v6.737a2.418 2.418 0 0 1-2.418 2.418H18V22.5H6v-2.928Zm12-1.538h2.082a.88.88 0 0 0 .88-.88v-6.737a.88.88 0 0 0-.881-.88H3.919a.88.88 0 0 0-.88.88v6.737c0 .486.394.88.88.88H6v-2.496H4.59V14h14.82v1.538H18v2.496ZM7.537 8h8.926V3.039l-8.926-.001V8ZM15 11h4v1.539h-4V11Zm-7.463 4.538v5.424h8.926v-5.424H7.537Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
      
      
      <div class="i-add-cart-button__animation u-posa u-top-50-p u-left-50-p u-translate-middle btn --primary u-posa --icon-only --js-product-button-animation --sm">
        <svg width="26" height="12" viewbox="0 0 26 12" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M3 6C4.65685 6 6 7.34315 6 9C6 10.6569 4.65685 12 3 12C1.34315 12 0 10.6569 0 9C0 7.34315 1.34315 6 3 6Z" fill="currentColor"/>
          <path d="M13 6C14.6569 6 16 7.34315 16 9C16 10.6569 14.6569 12 13 12C11.3431 12 10 10.6569 10 9C10 7.34315 11.3431 6 13 6Z" fill="currentColor"/>
          <path d="M23 6C24.6569 6 26 7.34315 26 9C26 10.6569 24.6569 12 23 12C21.3431 12 20 10.6569 20 9C20 7.34315 21.3431 6 23 6Z" fill="currentColor"/>
        </svg>
      </div>
    </div>
        </div>
      </div>
    </article>
            </div>
                  <div class="swiper-slide">
              <article class="i-product u-container-inline u-posr u-border u-border--tertiary-500 u-rounded-3 h-100  --vertical" data-product-id="1">
      <div class="i-product__body d-flex flex-column gap-2 p-2 h-100">
        <figure class="i-product__image d-block u-posr overflow-hidden u-img-hover">
          <a href="#" class="i-product__image-link d-flex align-items-center" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
                      <div class="img u-posr overflow-hidden --cover  --ratio-1-1 i-product__image-full">
      <picture>
        
        <img src="" data-src="https://placehold.co/308x308" alt="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)" width="308" height="308" draggable="false" srcset="" data-srcset="https://placehold.co/308x308 1x, https://placehold.co/618x618/?paper-bag 2x">
      </picture>
    </div>
                  </a>
    
                  <div class="i-discount d-flex flex-column justify-content-center align-items-center  i-product__discount u-posa u-top-0 u-right-0 my-1 me-1">
      <div class="i-discount__value u-fw-700 u-fz-sm">30%</div>
    </div>
          
                    <div class="g-tags d-flex flex-wrap gap-1 i-product__tags u-posa u-top-0 u-left-0 mt-1 ms-1 align-items-start flex-column">
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-blue-400 --sm    i-product__tag">
          <span class="i-tag__title">Limitovaná edice</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-pink-400 --sm    i-product__tag">
          <span class="i-tag__title">Novinka</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-violet-400 --sm    i-product__tag">
          <span class="i-tag__title">Akce</span>
        </span>
          </div>
              </figure>
    
        <div class="i-product__header d-flex flex-column">
          <h2 class="i-product__title u-fz-md u-fw-700">
            <a class="link d-inline-flex u-fw-600 align-items-center      i-product__link u-fz-md u-clamp" href="#" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
          <span class="link__title">Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)</span>
      
      
      </a>
          </h2>
        </div>
    
        <div class="i-product__content mt-auto --js-pricelist-controler">
          <div class="row gx-0 mb-2">
    
                      <div class="i-pricelist u-fz-xs i-product__pricelist col-12 mb-2">
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    --active --first
                    
                  "
             data-price="2.75"
             data-min-count="100"
             data-index="0"
        >
                  <span>Min. 100 ks.</span>
          
                  <span>2,75Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.65"
             data-min-count="1000"
             data-index="1"
        >
                  <span>Od 1 000 ks.</span>
          
                  <span>2,65Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.5"
             data-min-count="3000"
             data-index="2"
        >
                  <span>Od 3 000 ks.</span>
          
                  <span>2,50Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.4"
             data-min-count="5000"
             data-index="3"
        >
                  <span>Od 5 000 ks.</span>
          
                  <span>2,40Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    --last
                  "
             data-price="2"
             data-min-count="10000"
             data-index="4"
        >
                  <span>Od 10 000 ks.</span>
          
                  <span>2,00Kč</span>
              </div>
      </div>
            
            <div class="col-6 d-flex i-product__print-checkbox-wrapper">
              <label class="f-checkbox d-inline-flex gap-1 u-posr  align-items-center  --checkbox   i-product__print-checkbox --js-product-item-checkbox u-fw-600">
      <input class="f-checkbox__input u-posa" type="checkbox">
      <span class="f-checkbox__visual flex-shrink-0 d-flex align-items-center justify-content-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>  </span>
      <div class="f-checkbox__body d-flex column-gap-1 align-items-center">
        <span class="f-checkbox__title">
                            Vlastní potisk
                  
              </span>
    
        
          </div>
    
      <span class="f-error u-fz-sm gap-1 d-none">
      <span class="f-error__icon d-flex align-items-center justify-content-center">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24v112c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm-32 224a32 32 0 1 1 64 0 32 32 0 1 1-64 0z"/></svg>      </span>
      </span>
    
      <span class="f-error__title"></span>
    </span>
    
    </label>
            </div>
            <div class="col-6 i-product__print-counter-wrapper">
              
    <div class="c-counter u-fw-700 u-fz-14 u-bg-white u-posr d-flex align-items-center justify-content-between p-1 flex-shrink-0 u-border u-border--tertiary-500  product-quantity --js-product-counter">
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --minus u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#B0B2D4" fill-rule="evenodd" d="M4 12a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <div class="c-counter__value-visual d-flex">
        <div class="c-counter__value" contenteditable="true">100</div>
              <div class="c-counter__units">ks</div>
                  <div class="c-counter__label u-posa u-top-0 u-left-50-p u-fz-xs px-1 u-bg-white text-nowrap">Min. 100 ks</div>
          </div>
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --plus">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.975 6.975V3h2.05v3.975H13v2.05H9.025V13h-2.05V9.025H3v-2.05h3.975Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <input class="c-counter__input d-none" type="number" name="product-quantity" value="100" min="100" max="50000">
    </div>
            </div>
          </div>
    
          <div class="d-flex flex-row gap-2 justify-content-between flex-grow-1 align-items-center flex-wrap">
                      <div class="i-availability u-fz-sm d-flex flex-column --default  i-product__availability">  
      <div class="i-availability__title d-flex align-items-center u-fw-700 u-color-text-500">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --text --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M9.05 5h-2.1V3h2.1v2ZM6 6v2.099h.95v2.8H6V13h.95v.002h2.1v-.002H10v-2.1h-.95V6H6Z" clip-rule="evenodd"/></svg>      </span>
    
        Na dotaz
      </div>
      <span class="i-availability__quantity flex-shrink-0 u-color-tertiary-600 u-fz-xs u-color-text-400">
              ( 0 )
          </span>
    
      </div>
            
                      <div class="d-flex justify-content-end flex-column align-items-end">
                <div class="i-price p-1 d-flex flex-column justify-content-center flex-shrink-0 u-bg-primary-400 i-product__price">
            <div class="i-price__row i-price__main d-flex justify-content-end align-items-end gap-1">
    
          
                  <span class="i-price__title u-fz-md u-fw-700">1 ks</span>
          
          <span class="i-price__main u-fw-700">
            <span class="--js-product-item-price">
              1 990
            </span>
                      Kč              </span>
        </div>
      
      </div>
                <span class="u-fw-500 u-fz-sm d-inline">Celkem:
                  <span class="--js-product-total-price">1 990</span>
                  Kč
                  bez DPH
                </span>
              </div>
                  </div>
        </div>
        <div class="i-product__buttons d-flex gap-2 justify-content-between">
          <div class="i-add-wishlist-button --wishlisted   i-product__wishlist flex-shrink-0">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__add js-wishlist-add" type="button" aria-label="Přidat do wishlistu" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971ZM12 19.879C9.29 17.82 3.67 12.764 3.67 8.97c-.118-2.216 1.57-4.142 3.749-4.277 2.178.135 3.866 2.06 3.748 4.277h1.666c-.118-2.216 1.57-4.142 3.748-4.277 2.18.135 3.867 2.06 3.749 4.277 0 3.795-5.62 8.85-8.33 10.908Z"/></svg>      </span>
        </span>
      
      </button>
    
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__remove js-wishlist-remove" type="button" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971Z"/></svg>      </span>
        </span>
      
      </button>
    </div>
    
            <div class="i-add-cart-buttons u-posr text-center flex-grow-1  flex-grow-1 i-product__cart-add">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__cart-add js-cart-add --shown u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Přidat do košíku" data-product-id="1" data-modal-target="add-product-to-cart-modal">
          <span class="btn__title u-z-index-1">
          Přidat do košíku
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0C5.718 0 3.807 1.58 3.416 3.667H.782V13.99c0 1.116.948 2.01 2.097 2.01H13.12c1.148 0 2.096-.894 2.096-2.01V3.667h-2.633C12.193 1.58 10.28 0 8 0Zm0 1.575c1.386 0 2.55.89 2.91 2.092H5.09C5.45 2.465 6.614 1.575 8 1.575ZM2.415 13.99V5.242h11.17v8.748c0 .232-.2.435-.464.435H2.879a.451.451 0 0 1-.464-.435Zm2.56-7.266H3.343v.787c0 2.864 2.14 5.066 4.657 5.066 2.526 0 4.657-2.213 4.657-5.066v-.787h-1.633v.787c0 1.948-1.378 3.491-3.024 3.491-1.646 0-3.025-1.543-3.025-3.491v-.787Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
    
          <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__print js-print-add --hidden u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Chci vlastní potisk" data-product-id="1" data-modal-target="product-print-modal">
          <span class="btn__title u-z-index-1">
          Chci vlastní potisk
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M6 19.572H3.92a2.419 2.419 0 0 1-2.42-2.418v-6.737A2.418 2.418 0 0 1 3.918 8H6V1.5h12V8h2.082a2.418 2.418 0 0 1 2.418 2.417v6.737a2.418 2.418 0 0 1-2.418 2.418H18V22.5H6v-2.928Zm12-1.538h2.082a.88.88 0 0 0 .88-.88v-6.737a.88.88 0 0 0-.881-.88H3.919a.88.88 0 0 0-.88.88v6.737c0 .486.394.88.88.88H6v-2.496H4.59V14h14.82v1.538H18v2.496ZM7.537 8h8.926V3.039l-8.926-.001V8ZM15 11h4v1.539h-4V11Zm-7.463 4.538v5.424h8.926v-5.424H7.537Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
      
      
      <div class="i-add-cart-button__animation u-posa u-top-50-p u-left-50-p u-translate-middle btn --primary u-posa --icon-only --js-product-button-animation --sm">
        <svg width="26" height="12" viewbox="0 0 26 12" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M3 6C4.65685 6 6 7.34315 6 9C6 10.6569 4.65685 12 3 12C1.34315 12 0 10.6569 0 9C0 7.34315 1.34315 6 3 6Z" fill="currentColor"/>
          <path d="M13 6C14.6569 6 16 7.34315 16 9C16 10.6569 14.6569 12 13 12C11.3431 12 10 10.6569 10 9C10 7.34315 11.3431 6 13 6Z" fill="currentColor"/>
          <path d="M23 6C24.6569 6 26 7.34315 26 9C26 10.6569 24.6569 12 23 12C21.3431 12 20 10.6569 20 9C20 7.34315 21.3431 6 23 6Z" fill="currentColor"/>
        </svg>
      </div>
    </div>
        </div>
      </div>
    </article>
            </div>
                  <div class="swiper-slide">
              <article class="i-product u-container-inline u-posr u-border u-border--tertiary-500 u-rounded-3 h-100  --vertical" data-product-id="1">
      <div class="i-product__body d-flex flex-column gap-2 p-2 h-100">
        <figure class="i-product__image d-block u-posr overflow-hidden u-img-hover">
          <a href="#" class="i-product__image-link d-flex align-items-center" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
                      <div class="img u-posr overflow-hidden --cover  --ratio-1-1 i-product__image-full">
      <picture>
        
        <img src="" data-src="https://placehold.co/308x308" alt="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)" width="308" height="308" draggable="false" srcset="" data-srcset="https://placehold.co/308x308 1x, https://placehold.co/618x618/?paper-bag 2x">
      </picture>
    </div>
                  </a>
    
                  <div class="i-discount d-flex flex-column justify-content-center align-items-center  i-product__discount u-posa u-top-0 u-right-0 my-1 me-1">
      <div class="i-discount__value u-fw-700 u-fz-sm">30%</div>
    </div>
          
                    <div class="g-tags d-flex flex-wrap gap-1 i-product__tags u-posa u-top-0 u-left-0 mt-1 ms-1 align-items-start flex-column">
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-blue-400 --sm    i-product__tag">
          <span class="i-tag__title">Limitovaná edice</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-pink-400 --sm    i-product__tag">
          <span class="i-tag__title">Novinka</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-violet-400 --sm    i-product__tag">
          <span class="i-tag__title">Akce</span>
        </span>
          </div>
              </figure>
    
        <div class="i-product__header d-flex flex-column">
          <h2 class="i-product__title u-fz-md u-fw-700">
            <a class="link d-inline-flex u-fw-600 align-items-center      i-product__link u-fz-md u-clamp" href="#" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
          <span class="link__title">Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)</span>
      
      
      </a>
          </h2>
        </div>
    
        <div class="i-product__content mt-auto --js-pricelist-controler">
          <div class="row gx-0 mb-2">
    
                      <div class="i-pricelist u-fz-xs i-product__pricelist col-12 mb-2">
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    --active --first
                    
                  "
             data-price="2.75"
             data-min-count="100"
             data-index="0"
        >
                  <span>Min. 100 ks.</span>
          
                  <span>2,75Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.65"
             data-min-count="1000"
             data-index="1"
        >
                  <span>Od 1 000 ks.</span>
          
                  <span>2,65Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.5"
             data-min-count="3000"
             data-index="2"
        >
                  <span>Od 3 000 ks.</span>
          
                  <span>2,50Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.4"
             data-min-count="5000"
             data-index="3"
        >
                  <span>Od 5 000 ks.</span>
          
                  <span>2,40Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    --last
                  "
             data-price="2"
             data-min-count="10000"
             data-index="4"
        >
                  <span>Od 10 000 ks.</span>
          
                  <span>2,00Kč</span>
              </div>
      </div>
            
            <div class="col-6 d-flex i-product__print-checkbox-wrapper">
              <label class="f-checkbox d-inline-flex gap-1 u-posr  align-items-center  --checkbox   i-product__print-checkbox --js-product-item-checkbox u-fw-600">
      <input class="f-checkbox__input u-posa" type="checkbox">
      <span class="f-checkbox__visual flex-shrink-0 d-flex align-items-center justify-content-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>  </span>
      <div class="f-checkbox__body d-flex column-gap-1 align-items-center">
        <span class="f-checkbox__title">
                            Vlastní potisk
                  
              </span>
    
        
          </div>
    
      <span class="f-error u-fz-sm gap-1 d-none">
      <span class="f-error__icon d-flex align-items-center justify-content-center">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24v112c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm-32 224a32 32 0 1 1 64 0 32 32 0 1 1-64 0z"/></svg>      </span>
      </span>
    
      <span class="f-error__title"></span>
    </span>
    
    </label>
            </div>
            <div class="col-6 i-product__print-counter-wrapper">
              
    <div class="c-counter u-fw-700 u-fz-14 u-bg-white u-posr d-flex align-items-center justify-content-between p-1 flex-shrink-0 u-border u-border--tertiary-500  product-quantity --js-product-counter">
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --minus u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#B0B2D4" fill-rule="evenodd" d="M4 12a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <div class="c-counter__value-visual d-flex">
        <div class="c-counter__value" contenteditable="true">100</div>
              <div class="c-counter__units">ks</div>
                  <div class="c-counter__label u-posa u-top-0 u-left-50-p u-fz-xs px-1 u-bg-white text-nowrap">Min. 100 ks</div>
          </div>
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --plus">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.975 6.975V3h2.05v3.975H13v2.05H9.025V13h-2.05V9.025H3v-2.05h3.975Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <input class="c-counter__input d-none" type="number" name="product-quantity" value="100" min="100" max="50000">
    </div>
            </div>
          </div>
    
          <div class="d-flex flex-row gap-2 justify-content-between flex-grow-1 align-items-center flex-wrap">
                      <div class="i-availability u-fz-sm d-flex flex-column --unavailable  i-product__availability">  
      <div class="i-availability__title d-flex align-items-center u-fw-700 u-color-danger">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.495 8.002 3.203 4.746l1.478-1.5 3.32 3.272 3.317-3.272 1.478 1.5-3.292 3.256 3.292 3.246-1.494 1.507L8 9.489l-3.303 3.266-1.494-1.507 3.292-3.246Z" clip-rule="evenodd"/></svg>      </span>
    
        Nedostupné
      </div>
      <span class="i-availability__quantity flex-shrink-0 u-color-tertiary-600 u-fz-xs u-color-text-400">
              ( Zpět 24.5. )
          </span>
    
      </div>
            
                      <div class="d-flex justify-content-end flex-column align-items-end">
                <div class="i-price p-1 d-flex flex-column justify-content-center flex-shrink-0 u-bg-primary-400 i-product__price">
            <div class="i-price__row i-price__main d-flex justify-content-end align-items-end gap-1">
    
          
                  <span class="i-price__title u-fz-md u-fw-700">1 ks</span>
          
          <span class="i-price__main u-fw-700">
            <span class="--js-product-item-price">
              1 990
            </span>
                      Kč              </span>
        </div>
      
      </div>
                <span class="u-fw-500 u-fz-sm d-inline">Celkem:
                  <span class="--js-product-total-price">1 990</span>
                  Kč
                  bez DPH
                </span>
              </div>
                  </div>
        </div>
        <div class="i-product__buttons d-flex gap-2 justify-content-between">
          <div class="i-add-wishlist-button --wishlisted   i-product__wishlist flex-shrink-0">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__add js-wishlist-add" type="button" aria-label="Přidat do wishlistu" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971ZM12 19.879C9.29 17.82 3.67 12.764 3.67 8.97c-.118-2.216 1.57-4.142 3.749-4.277 2.178.135 3.866 2.06 3.748 4.277h1.666c-.118-2.216 1.57-4.142 3.748-4.277 2.18.135 3.867 2.06 3.749 4.277 0 3.795-5.62 8.85-8.33 10.908Z"/></svg>      </span>
        </span>
      
      </button>
    
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__remove js-wishlist-remove" type="button" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971Z"/></svg>      </span>
        </span>
      
      </button>
    </div>
    
            <div class="i-add-cart-buttons u-posr text-center flex-grow-1  flex-grow-1 i-product__cart-add">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__cart-add js-cart-add --shown u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Přidat do košíku" data-product-id="1" data-modal-target="add-product-to-cart-modal">
          <span class="btn__title u-z-index-1">
          Přidat do košíku
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0C5.718 0 3.807 1.58 3.416 3.667H.782V13.99c0 1.116.948 2.01 2.097 2.01H13.12c1.148 0 2.096-.894 2.096-2.01V3.667h-2.633C12.193 1.58 10.28 0 8 0Zm0 1.575c1.386 0 2.55.89 2.91 2.092H5.09C5.45 2.465 6.614 1.575 8 1.575ZM2.415 13.99V5.242h11.17v8.748c0 .232-.2.435-.464.435H2.879a.451.451 0 0 1-.464-.435Zm2.56-7.266H3.343v.787c0 2.864 2.14 5.066 4.657 5.066 2.526 0 4.657-2.213 4.657-5.066v-.787h-1.633v.787c0 1.948-1.378 3.491-3.024 3.491-1.646 0-3.025-1.543-3.025-3.491v-.787Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
    
          <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__print js-print-add --hidden u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Chci vlastní potisk" data-product-id="1" data-modal-target="product-print-modal">
          <span class="btn__title u-z-index-1">
          Chci vlastní potisk
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M6 19.572H3.92a2.419 2.419 0 0 1-2.42-2.418v-6.737A2.418 2.418 0 0 1 3.918 8H6V1.5h12V8h2.082a2.418 2.418 0 0 1 2.418 2.417v6.737a2.418 2.418 0 0 1-2.418 2.418H18V22.5H6v-2.928Zm12-1.538h2.082a.88.88 0 0 0 .88-.88v-6.737a.88.88 0 0 0-.881-.88H3.919a.88.88 0 0 0-.88.88v6.737c0 .486.394.88.88.88H6v-2.496H4.59V14h14.82v1.538H18v2.496ZM7.537 8h8.926V3.039l-8.926-.001V8ZM15 11h4v1.539h-4V11Zm-7.463 4.538v5.424h8.926v-5.424H7.537Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
      
      
      <div class="i-add-cart-button__animation u-posa u-top-50-p u-left-50-p u-translate-middle btn --primary u-posa --icon-only --js-product-button-animation --sm">
        <svg width="26" height="12" viewbox="0 0 26 12" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M3 6C4.65685 6 6 7.34315 6 9C6 10.6569 4.65685 12 3 12C1.34315 12 0 10.6569 0 9C0 7.34315 1.34315 6 3 6Z" fill="currentColor"/>
          <path d="M13 6C14.6569 6 16 7.34315 16 9C16 10.6569 14.6569 12 13 12C11.3431 12 10 10.6569 10 9C10 7.34315 11.3431 6 13 6Z" fill="currentColor"/>
          <path d="M23 6C24.6569 6 26 7.34315 26 9C26 10.6569 24.6569 12 23 12C21.3431 12 20 10.6569 20 9C20 7.34315 21.3431 6 23 6Z" fill="currentColor"/>
        </svg>
      </div>
    </div>
        </div>
      </div>
    </article>
            </div>
                  <div class="swiper-slide">
              <article class="i-product u-container-inline u-posr u-border u-border--tertiary-500 u-rounded-3 h-100  --vertical" data-product-id="1">
      <div class="i-product__body d-flex flex-column gap-2 p-2 h-100">
        <figure class="i-product__image d-block u-posr overflow-hidden u-img-hover">
          <a href="#" class="i-product__image-link d-flex align-items-center" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
                      <div class="img u-posr overflow-hidden --cover  --ratio-1-1 i-product__image-full">
      <picture>
        
        <img src="" data-src="https://placehold.co/308x308" alt="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)" width="308" height="308" draggable="false" srcset="" data-srcset="https://placehold.co/308x308 1x, https://placehold.co/618x618/?paper-bag 2x">
      </picture>
    </div>
                  </a>
    
                  <div class="i-discount d-flex flex-column justify-content-center align-items-center  i-product__discount u-posa u-top-0 u-right-0 my-1 me-1">
      <div class="i-discount__value u-fw-700 u-fz-sm">30%</div>
    </div>
          
                    <div class="g-tags d-flex flex-wrap gap-1 i-product__tags u-posa u-top-0 u-left-0 mt-1 ms-1 align-items-start flex-column">
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-blue-400 --sm    i-product__tag">
          <span class="i-tag__title">Limitovaná edice</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-pink-400 --sm    i-product__tag">
          <span class="i-tag__title">Novinka</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-violet-400 --sm    i-product__tag">
          <span class="i-tag__title">Akce</span>
        </span>
          </div>
              </figure>
    
        <div class="i-product__header d-flex flex-column">
          <h2 class="i-product__title u-fz-md u-fw-700">
            <a class="link d-inline-flex u-fw-600 align-items-center      i-product__link u-fz-md u-clamp" href="#" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
          <span class="link__title">Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)</span>
      
      
      </a>
          </h2>
        </div>
    
        <div class="i-product__content mt-auto --js-pricelist-controler">
          <div class="row gx-0 mb-2">
    
                      <div class="i-pricelist u-fz-xs i-product__pricelist col-12 mb-2">
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    --active --first
                    
                  "
             data-price="2.75"
             data-min-count="100"
             data-index="0"
        >
                  <span>Min. 100 ks.</span>
          
                  <span>2,75Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.65"
             data-min-count="1000"
             data-index="1"
        >
                  <span>Od 1 000 ks.</span>
          
                  <span>2,65Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.5"
             data-min-count="3000"
             data-index="2"
        >
                  <span>Od 3 000 ks.</span>
          
                  <span>2,50Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.4"
             data-min-count="5000"
             data-index="3"
        >
                  <span>Od 5 000 ks.</span>
          
                  <span>2,40Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    --last
                  "
             data-price="2"
             data-min-count="10000"
             data-index="4"
        >
                  <span>Od 10 000 ks.</span>
          
                  <span>2,00Kč</span>
              </div>
      </div>
            
            <div class="col-6 d-flex i-product__print-checkbox-wrapper">
              <label class="f-checkbox d-inline-flex gap-1 u-posr  align-items-center  --checkbox   i-product__print-checkbox --js-product-item-checkbox u-fw-600">
      <input class="f-checkbox__input u-posa" type="checkbox">
      <span class="f-checkbox__visual flex-shrink-0 d-flex align-items-center justify-content-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>  </span>
      <div class="f-checkbox__body d-flex column-gap-1 align-items-center">
        <span class="f-checkbox__title">
                            Vlastní potisk
                  
              </span>
    
        
          </div>
    
      <span class="f-error u-fz-sm gap-1 d-none">
      <span class="f-error__icon d-flex align-items-center justify-content-center">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24v112c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm-32 224a32 32 0 1 1 64 0 32 32 0 1 1-64 0z"/></svg>      </span>
      </span>
    
      <span class="f-error__title"></span>
    </span>
    
    </label>
            </div>
            <div class="col-6 i-product__print-counter-wrapper">
              
    <div class="c-counter u-fw-700 u-fz-14 u-bg-white u-posr d-flex align-items-center justify-content-between p-1 flex-shrink-0 u-border u-border--tertiary-500  product-quantity --js-product-counter">
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --minus u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#B0B2D4" fill-rule="evenodd" d="M4 12a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <div class="c-counter__value-visual d-flex">
        <div class="c-counter__value" contenteditable="true">100</div>
              <div class="c-counter__units">ks</div>
                  <div class="c-counter__label u-posa u-top-0 u-left-50-p u-fz-xs px-1 u-bg-white text-nowrap">Min. 100 ks</div>
          </div>
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --plus">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.975 6.975V3h2.05v3.975H13v2.05H9.025V13h-2.05V9.025H3v-2.05h3.975Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <input class="c-counter__input d-none" type="number" name="product-quantity" value="100" min="100" max="50000">
    </div>
            </div>
          </div>
    
          <div class="d-flex flex-row gap-2 justify-content-between flex-grow-1 align-items-center flex-wrap">
                      <div class="i-availability u-fz-sm d-flex flex-column --available  i-product__availability">  
      <div class="i-availability__title d-flex align-items-center u-fw-700 u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>      </span>
    
        Skladem
      </div>
      <span class="i-availability__quantity flex-shrink-0 u-color-tertiary-600 u-fz-xs u-color-text-400">
              ( 0 )
          </span>
    
      </div>
            
                      <div class="d-flex justify-content-end flex-column align-items-end">
                <div class="i-price p-1 d-flex flex-column justify-content-center flex-shrink-0 u-bg-primary-400 i-product__price">
            <div class="i-price__row i-price__main d-flex justify-content-end align-items-end gap-1">
    
          
                  <span class="i-price__title u-fz-md u-fw-700">1 ks</span>
          
          <span class="i-price__main u-fw-700">
            <span class="--js-product-item-price">
              1 990
            </span>
                      Kč              </span>
        </div>
      
      </div>
                <span class="u-fw-500 u-fz-sm d-inline">Celkem:
                  <span class="--js-product-total-price">1 990</span>
                  Kč
                  bez DPH
                </span>
              </div>
                  </div>
        </div>
        <div class="i-product__buttons d-flex gap-2 justify-content-between">
          <div class="i-add-wishlist-button --wishlisted   i-product__wishlist flex-shrink-0">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__add js-wishlist-add" type="button" aria-label="Přidat do wishlistu" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971ZM12 19.879C9.29 17.82 3.67 12.764 3.67 8.97c-.118-2.216 1.57-4.142 3.749-4.277 2.178.135 3.866 2.06 3.748 4.277h1.666c-.118-2.216 1.57-4.142 3.748-4.277 2.18.135 3.867 2.06 3.749 4.277 0 3.795-5.62 8.85-8.33 10.908Z"/></svg>      </span>
        </span>
      
      </button>
    
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__remove js-wishlist-remove" type="button" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971Z"/></svg>      </span>
        </span>
      
      </button>
    </div>
    
            <div class="i-add-cart-buttons u-posr text-center flex-grow-1  flex-grow-1 i-product__cart-add">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__cart-add js-cart-add --shown u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Přidat do košíku" data-product-id="1" data-modal-target="add-product-to-cart-modal">
          <span class="btn__title u-z-index-1">
          Přidat do košíku
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0C5.718 0 3.807 1.58 3.416 3.667H.782V13.99c0 1.116.948 2.01 2.097 2.01H13.12c1.148 0 2.096-.894 2.096-2.01V3.667h-2.633C12.193 1.58 10.28 0 8 0Zm0 1.575c1.386 0 2.55.89 2.91 2.092H5.09C5.45 2.465 6.614 1.575 8 1.575ZM2.415 13.99V5.242h11.17v8.748c0 .232-.2.435-.464.435H2.879a.451.451 0 0 1-.464-.435Zm2.56-7.266H3.343v.787c0 2.864 2.14 5.066 4.657 5.066 2.526 0 4.657-2.213 4.657-5.066v-.787h-1.633v.787c0 1.948-1.378 3.491-3.024 3.491-1.646 0-3.025-1.543-3.025-3.491v-.787Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
    
          <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__print js-print-add --hidden u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Chci vlastní potisk" data-product-id="1" data-modal-target="product-print-modal">
          <span class="btn__title u-z-index-1">
          Chci vlastní potisk
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M6 19.572H3.92a2.419 2.419 0 0 1-2.42-2.418v-6.737A2.418 2.418 0 0 1 3.918 8H6V1.5h12V8h2.082a2.418 2.418 0 0 1 2.418 2.417v6.737a2.418 2.418 0 0 1-2.418 2.418H18V22.5H6v-2.928Zm12-1.538h2.082a.88.88 0 0 0 .88-.88v-6.737a.88.88 0 0 0-.881-.88H3.919a.88.88 0 0 0-.88.88v6.737c0 .486.394.88.88.88H6v-2.496H4.59V14h14.82v1.538H18v2.496ZM7.537 8h8.926V3.039l-8.926-.001V8ZM15 11h4v1.539h-4V11Zm-7.463 4.538v5.424h8.926v-5.424H7.537Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
      
      
      <div class="i-add-cart-button__animation u-posa u-top-50-p u-left-50-p u-translate-middle btn --primary u-posa --icon-only --js-product-button-animation --sm">
        <svg width="26" height="12" viewbox="0 0 26 12" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M3 6C4.65685 6 6 7.34315 6 9C6 10.6569 4.65685 12 3 12C1.34315 12 0 10.6569 0 9C0 7.34315 1.34315 6 3 6Z" fill="currentColor"/>
          <path d="M13 6C14.6569 6 16 7.34315 16 9C16 10.6569 14.6569 12 13 12C11.3431 12 10 10.6569 10 9C10 7.34315 11.3431 6 13 6Z" fill="currentColor"/>
          <path d="M23 6C24.6569 6 26 7.34315 26 9C26 10.6569 24.6569 12 23 12C21.3431 12 20 10.6569 20 9C20 7.34315 21.3431 6 23 6Z" fill="currentColor"/>
        </svg>
      </div>
    </div>
        </div>
      </div>
    </article>
            </div>
                  <div class="swiper-slide">
              <article class="i-product u-container-inline u-posr u-border u-border--tertiary-500 u-rounded-3 h-100  --vertical" data-product-id="1">
      <div class="i-product__body d-flex flex-column gap-2 p-2 h-100">
        <figure class="i-product__image d-block u-posr overflow-hidden u-img-hover">
          <a href="#" class="i-product__image-link d-flex align-items-center" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
                      <div class="img u-posr overflow-hidden --cover  --ratio-1-1 i-product__image-full">
      <picture>
        
        <img src="" data-src="https://placehold.co/308x308" alt="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)" width="308" height="308" draggable="false" srcset="" data-srcset="https://placehold.co/308x308 1x, https://placehold.co/618x618/?paper-bag 2x">
      </picture>
    </div>
                  </a>
    
                  <div class="i-discount d-flex flex-column justify-content-center align-items-center  i-product__discount u-posa u-top-0 u-right-0 my-1 me-1">
      <div class="i-discount__value u-fw-700 u-fz-sm">30%</div>
    </div>
          
                    <div class="g-tags d-flex flex-wrap gap-1 i-product__tags u-posa u-top-0 u-left-0 mt-1 ms-1 align-items-start flex-column">
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-blue-400 --sm    i-product__tag">
          <span class="i-tag__title">Limitovaná edice</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-pink-400 --sm    i-product__tag">
          <span class="i-tag__title">Novinka</span>
        </span>
              
    <span class="i-tag d-inline-flex align-items-center text-center justify-content-center gap-1 u-fw-500  --color-support-violet-400 --sm    i-product__tag">
          <span class="i-tag__title">Akce</span>
        </span>
          </div>
              </figure>
    
        <div class="i-product__header d-flex flex-column">
          <h2 class="i-product__title u-fz-md u-fw-700">
            <a class="link d-inline-flex u-fw-600 align-items-center      i-product__link u-fz-md u-clamp" href="#" title="Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)">
          <span class="link__title">Goodrem Delta: I Honestly Love You (Limited Coloured Transpare)</span>
      
      
      </a>
          </h2>
        </div>
    
        <div class="i-product__content mt-auto --js-pricelist-controler">
          <div class="row gx-0 mb-2">
    
                      <div class="i-pricelist u-fz-xs i-product__pricelist col-12 mb-2">
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    --active --first
                    
                  "
             data-price="2.75"
             data-min-count="100"
             data-index="0"
        >
                  <span>Min. 100 ks.</span>
          
                  <span>2,75Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.65"
             data-min-count="1000"
             data-index="1"
        >
                  <span>Od 1 000 ks.</span>
          
                  <span>2,65Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.5"
             data-min-count="3000"
             data-index="2"
        >
                  <span>Od 3 000 ks.</span>
          
                  <span>2,50Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    
                  "
             data-price="2.4"
             data-min-count="5000"
             data-index="3"
        >
                  <span>Od 5 000 ks.</span>
          
                  <span>2,40Kč</span>
              </div>
          <div class="
                    i-pricelist__selector d-flex justify-content-between px-1 u-cursor-pointer
                    
                    --last
                  "
             data-price="2"
             data-min-count="10000"
             data-index="4"
        >
                  <span>Od 10 000 ks.</span>
          
                  <span>2,00Kč</span>
              </div>
      </div>
            
            <div class="col-6 d-flex i-product__print-checkbox-wrapper">
              <label class="f-checkbox d-inline-flex gap-1 u-posr  align-items-center  --checkbox   i-product__print-checkbox --js-product-item-checkbox u-fw-600">
      <input class="f-checkbox__input u-posa" type="checkbox">
      <span class="f-checkbox__visual flex-shrink-0 d-flex align-items-center justify-content-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>  </span>
      <div class="f-checkbox__body d-flex column-gap-1 align-items-center">
        <span class="f-checkbox__title">
                            Vlastní potisk
                  
              </span>
    
        
          </div>
    
      <span class="f-error u-fz-sm gap-1 d-none">
      <span class="f-error__icon d-flex align-items-center justify-content-center">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
              <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24v112c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm-32 224a32 32 0 1 1 64 0 32 32 0 1 1-64 0z"/></svg>      </span>
      </span>
    
      <span class="f-error__title"></span>
    </span>
    
    </label>
            </div>
            <div class="col-6 i-product__print-counter-wrapper">
              
    <div class="c-counter u-fw-700 u-fz-14 u-bg-white u-posr d-flex align-items-center justify-content-between p-1 flex-shrink-0 u-border u-border--tertiary-500  product-quantity --js-product-counter">
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --minus u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#B0B2D4" fill-rule="evenodd" d="M4 12a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <div class="c-counter__value-visual d-flex">
        <div class="c-counter__value" contenteditable="true">100</div>
              <div class="c-counter__units">ks</div>
                  <div class="c-counter__label u-posa u-top-0 u-left-50-p u-fz-xs px-1 u-bg-white text-nowrap">Min. 100 ks</div>
          </div>
    
      <div class="c-counter__button d-flex align-items-center justify-content-center u-posr --plus">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.975 6.975V3h2.05v3.975H13v2.05H9.025V13h-2.05V9.025H3v-2.05h3.975Z" clip-rule="evenodd"/></svg>      </span>
      </div>
    
      <input class="c-counter__input d-none" type="number" name="product-quantity" value="100" min="100" max="50000">
    </div>
            </div>
          </div>
    
          <div class="d-flex flex-row gap-2 justify-content-between flex-grow-1 align-items-center flex-wrap">
                      <div class="i-availability u-fz-sm d-flex flex-column --available  i-product__availability">  
      <div class="i-availability__title d-flex align-items-center u-fw-700 u-color-conversion">
          
      <span class="icon d-flex align-items-center justify-content-center --colored --conversion --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#fff" d="M12.522 4 14 5.5 7.901 11.51a2.107 2.107 0 0 1-2.972-.005L2 8.664l1.467-1.513 2.94 2.85L12.522 4Z"/></svg>      </span>
    
        Skladem
      </div>
      <span class="i-availability__quantity flex-shrink-0 u-color-tertiary-600 u-fz-xs u-color-text-400">
              ( 0 )
          </span>
    
      </div>
            
                      <div class="d-flex justify-content-end flex-column align-items-end">
                <div class="i-price p-1 d-flex flex-column justify-content-center flex-shrink-0 u-bg-primary-400 i-product__price">
            <div class="i-price__row i-price__main d-flex justify-content-end align-items-end gap-1">
    
          
                  <span class="i-price__title u-fz-md u-fw-700">1 ks</span>
          
          <span class="i-price__main u-fw-700">
            <span class="--js-product-item-price">
              1 990
            </span>
                      Kč              </span>
        </div>
      
      </div>
                <span class="u-fw-500 u-fz-sm d-inline">Celkem:
                  <span class="--js-product-total-price">1 990</span>
                  Kč
                  bez DPH
                </span>
              </div>
                  </div>
        </div>
        <div class="i-product__buttons d-flex gap-2 justify-content-between">
          <div class="i-add-wishlist-button --wishlisted   i-product__wishlist flex-shrink-0">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__add js-wishlist-add" type="button" aria-label="Přidat do wishlistu" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971ZM12 19.879C9.29 17.82 3.67 12.764 3.67 8.97c-.118-2.216 1.57-4.142 3.749-4.277 2.178.135 3.866 2.06 3.748 4.277h1.666c-.118-2.216 1.57-4.142 3.748-4.277 2.18.135 3.867 2.06 3.749 4.277 0 3.795-5.62 8.85-8.33 10.908Z"/></svg>      </span>
        </span>
      
      </button>
    
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm    --icon-only     i-add-wishlist-button__remove js-wishlist-remove" type="button" data-product-id="1">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.581 3A5.325 5.325 0 0 0 12 5.795 5.325 5.325 0 0 0 7.419 3c-3.093.137-5.532 2.826-5.415 5.97 0 5.739 9.126 12.366 9.514 12.647l.482.347.482-.347c.388-.28 9.514-6.908 9.514-12.646.117-3.145-2.322-5.834-5.415-5.971Z"/></svg>      </span>
        </span>
      
      </button>
    </div>
    
            <div class="i-add-cart-buttons u-posr text-center flex-grow-1  flex-grow-1 i-product__cart-add">
      <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__cart-add js-cart-add --shown u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Přidat do košíku" data-product-id="1" data-modal-target="add-product-to-cart-modal">
          <span class="btn__title u-z-index-1">
          Přidat do košíku
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white --sm">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 0C5.718 0 3.807 1.58 3.416 3.667H.782V13.99c0 1.116.948 2.01 2.097 2.01H13.12c1.148 0 2.096-.894 2.096-2.01V3.667h-2.633C12.193 1.58 10.28 0 8 0Zm0 1.575c1.386 0 2.55.89 2.91 2.092H5.09C5.45 2.465 6.614 1.575 8 1.575ZM2.415 13.99V5.242h11.17v8.748c0 .232-.2.435-.464.435H2.879a.451.451 0 0 1-.464-.435Zm2.56-7.266H3.343v.787c0 2.864 2.14 5.066 4.657 5.066 2.526 0 4.657-2.213 4.657-5.066v-.787h-1.633v.787c0 1.948-1.378 3.491-3.024 3.491-1.646 0-3.025-1.543-3.025-3.491v-.787Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
    
          <button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --primary --sm         flex-grow-1 i-product__cart-add i-add-cart-button__print js-print-add --hidden u-posa u-top-50-p u-left-50-p u-translate-middle" type="button" aria-label="Chci vlastní potisk" data-product-id="1" data-modal-target="product-print-modal">
          <span class="btn__title u-z-index-1">
          Chci vlastní potisk
        </span>
          
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center --colored --white">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M6 19.572H3.92a2.419 2.419 0 0 1-2.42-2.418v-6.737A2.418 2.418 0 0 1 3.918 8H6V1.5h12V8h2.082a2.418 2.418 0 0 1 2.418 2.417v6.737a2.418 2.418 0 0 1-2.418 2.418H18V22.5H6v-2.928Zm12-1.538h2.082a.88.88 0 0 0 .88-.88v-6.737a.88.88 0 0 0-.881-.88H3.919a.88.88 0 0 0-.88.88v6.737c0 .486.394.88.88.88H6v-2.496H4.59V14h14.82v1.538H18v2.496ZM7.537 8h8.926V3.039l-8.926-.001V8ZM15 11h4v1.539h-4V11Zm-7.463 4.538v5.424h8.926v-5.424H7.537Z" clip-rule="evenodd"/></svg>      </span>
        </span>
      
      </button>
      
      
      <div class="i-add-cart-button__animation u-posa u-top-50-p u-left-50-p u-translate-middle btn --primary u-posa --icon-only --js-product-button-animation --sm">
        <svg width="26" height="12" viewbox="0 0 26 12" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M3 6C4.65685 6 6 7.34315 6 9C6 10.6569 4.65685 12 3 12C1.34315 12 0 10.6569 0 9C0 7.34315 1.34315 6 3 6Z" fill="currentColor"/>
          <path d="M13 6C14.6569 6 16 7.34315 16 9C16 10.6569 14.6569 12 13 12C11.3431 12 10 10.6569 10 9C10 7.34315 11.3431 6 13 6Z" fill="currentColor"/>
          <path d="M23 6C24.6569 6 26 7.34315 26 9C26 10.6569 24.6569 12 23 12C21.3431 12 20 10.6569 20 9C20 7.34315 21.3431 6 23 6Z" fill="currentColor"/>
        </svg>
      </div>
    </div>
        </div>
      </div>
    </article>
            </div>
                </div>
    
        </div>
    
      <div class="g-products-slider__buttons d-flex u-z-index-1 justify-content-center justify-content-sm-between gap-1 w-100 u-posa u-translate-middle-y u-top-50-p u-left-0">
    
        <span class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --xs  --animation-left  --icon-only     g-products-slider__button --prev">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m.704 6.235 4.654-4.653 1.137 1.137-4.392 4.393L16 7.136v1.61L2.054 8.722l4.56 4.559-1.138 1.137-4.772-4.77a2.417 2.417 0 0 1 0-3.413Z"/></svg>      </span>
        </span>
      
      </span>
    
        <span class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --xs  --animation-right  --icon-only     g-products-slider__button --next">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m15.296 6.235-4.653-4.653-1.138 1.137 4.392 4.393L0 7.136v1.61l13.946-.024-4.56 4.559 1.138 1.137 4.772-4.77a2.417 2.417 0 0 0 0-3.413Z"/></svg>      </span>
        </span>
      
      </span>
    
      </div>
    
      <div class="g-products-slider__buttons--bottom d-flex d-sm-none u-z-index-1 justify-content-center justify-content-sm-between gap-1 w-100 mt-2">
    
        <span class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --xs  --animation-left  --icon-only     g-products-slider__button --prev --bottom">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m.704 6.235 4.654-4.653 1.137 1.137-4.392 4.393L16 7.136v1.61L2.054 8.722l4.56 4.559-1.138 1.137-4.772-4.77a2.417 2.417 0 0 1 0-3.413Z"/></svg>      </span>
        </span>
      
      </span>
    
        <span class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --xs  --animation-right  --icon-only     g-products-slider__button --next --bottom">
      
          <span class="btn__icon d-flex align-items-center justify-content-center">
            
      <span class="icon d-flex align-items-center justify-content-center  --lg">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m15.296 6.235-4.653-4.653-1.138 1.137 4.392 4.393L0 7.136v1.61l13.946-.024-4.56 4.559 1.138 1.137 4.772-4.77a2.417 2.417 0 0 0 0-3.413Z"/></svg>      </span>
        </span>
      
      </span>
    
      </div>
          </div>
        
        </div>
    </section>