/* bestsellery-compact.css
   Kompaktnejsi vypis bestselleru / top produktu na Shoptetu.
   Cíl: vetsi produktove fotky, ale nizsi vyska jednotlivych radku.
*/

/* Nastaveni velikosti - pripadne uprav jen tyto hodnoty */
#content .bestsellers,
#content .best-sellers,
#content .top-products,
#content .topProducts,
#content .products-top,
#content .productsBlock.bestsellers,
#content .products-block.bestsellers,
#content .products-block.top-products {
  --bs-img-size: 86px;
  --bs-row-padding: 10px;
  --bs-gap: 14px;
  --bs-rank-size: 34px;
}

/* Kompaktni radek produktu */
#content .bestsellers > li,
#content .best-sellers > li,
#content .top-products > li,
#content .topProducts > li,
#content .products-top > li,
#content .productsBlock.bestsellers .p,
#content .products-block.bestsellers .p,
#content .products-block.top-products .p,
#content .productsBlock.bestsellers .product,
#content .products-block.bestsellers .product,
#content .products-block.top-products .product {
  display: grid !important;
  grid-template-columns: var(--bs-rank-size) var(--bs-img-size) minmax(0, 1fr) auto;
  align-items: center !important;
  column-gap: var(--bs-gap) !important;
  min-height: calc(var(--bs-img-size) + (2 * var(--bs-row-padding))) !important;
  height: auto !important;
  margin: 0 !important;
  padding: var(--bs-row-padding) 0 !important;
  border-bottom: 1px solid #e5e5e5;
}

/* Zruseni zbytecnych vnitrnich vyskovych rezerv */
#content .bestsellers .p,
#content .best-sellers .p,
#content .top-products .p,
#content .topProducts .p,
#content .products-top .p,
#content .bestsellers .product,
#content .best-sellers .product,
#content .top-products .product,
#content .topProducts .product,
#content .products-top .product,
#content .bestsellers .p-in,
#content .best-sellers .p-in,
#content .top-products .p-in,
#content .topProducts .p-in,
#content .products-top .p-in,
#content .bestsellers .p-bottom,
#content .best-sellers .p-bottom,
#content .top-products .p-bottom,
#content .topProducts .p-bottom,
#content .products-top .p-bottom {
  min-height: 0 !important;
  height: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Obrazky produktu - vetsi, ale bez natahovani radku */
#content .bestsellers img,
#content .best-sellers img,
#content .top-products img,
#content .topProducts img,
#content .products-top img,
#content .productsBlock.bestsellers img,
#content .products-block.bestsellers img,
#content .products-block.top-products img {
  width: var(--bs-img-size) !important;
  height: var(--bs-img-size) !important;
  max-width: var(--bs-img-size) !important;
  max-height: var(--bs-img-size) !important;
  object-fit: contain !important;
}

#content .bestsellers .image,
#content .best-sellers .image,
#content .top-products .image,
#content .topProducts .image,
#content .products-top .image,
#content .bestsellers .p-image,
#content .best-sellers .p-image,
#content .top-products .p-image,
#content .topProducts .p-image,
#content .products-top .p-image,
#content .bestsellers .p-img-wrapper,
#content .best-sellers .p-img-wrapper,
#content .top-products .p-img-wrapper,
#content .topProducts .p-img-wrapper,
#content .products-top .p-img-wrapper {
  width: var(--bs-img-size) !important;
  min-width: var(--bs-img-size) !important;
  height: var(--bs-img-size) !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Nazev + skladovost tesne pod sebou */
#content .bestsellers .name,
#content .best-sellers .name,
#content .top-products .name,
#content .topProducts .name,
#content .products-top .name,
#content .bestsellers .p-name,
#content .best-sellers .p-name,
#content .top-products .p-name,
#content .topProducts .p-name,
#content .products-top .p-name,
#content .bestsellers .p-name a,
#content .best-sellers .p-name a,
#content .top-products .p-name a,
#content .topProducts .p-name a,
#content .products-top .p-name a {
  margin: 0 0 6px 0 !important;
  line-height: 1.25 !important;
}

#content .bestsellers .availability,
#content .best-sellers .availability,
#content .top-products .availability,
#content .topProducts .availability,
#content .products-top .availability,
#content .bestsellers .availability-amount,
#content .best-sellers .availability-amount,
#content .top-products .availability-amount,
#content .topProducts .availability-amount,
#content .products-top .availability-amount {
  margin: 0 !important;
  line-height: 1.2 !important;
}

/* Cena vpravo, bez zbytecne mezery */
#content .bestsellers .prices,
#content .best-sellers .prices,
#content .top-products .prices,
#content .topProducts .prices,
#content .products-top .prices,
#content .bestsellers .price,
#content .best-sellers .price,
#content .top-products .price,
#content .topProducts .price,
#content .products-top .price {
  margin: 0 !important;
  text-align: right !important;
  white-space: nowrap !important;
}

#content .bestsellers .price-additional,
#content .best-sellers .price-additional,
#content .top-products .price-additional,
#content .topProducts .price-additional,
#content .products-top .price-additional,
#content .bestsellers .price-standard,
#content .best-sellers .price-standard,
#content .top-products .price-standard,
#content .topProducts .price-standard,
#content .products-top .price-standard {
  margin-top: 4px !important;
  line-height: 1.2 !important;
}

/* Kdyby porad zustaval prilis vysoky prostor kvuli popiskum/akcim, schovat je jen v bestsellerech */
#content .bestsellers .p-desc,
#content .best-sellers .p-desc,
#content .top-products .p-desc,
#content .topProducts .p-desc,
#content .products-top .p-desc,
#content .bestsellers .buttons,
#content .best-sellers .buttons,
#content .top-products .buttons,
#content .topProducts .buttons,
#content .products-top .buttons {
  display: none !important;
}

/* Mobil: radeji dvouradkove rozlozeni, aby se to nelamalo mimo obrazovku */
@media (max-width: 767px) {
  #content .bestsellers > li,
  #content .best-sellers > li,
  #content .top-products > li,
  #content .topProducts > li,
  #content .products-top > li,
  #content .productsBlock.bestsellers .p,
  #content .products-block.bestsellers .p,
  #content .products-block.top-products .p,
  #content .productsBlock.bestsellers .product,
  #content .products-block.bestsellers .product,
  #content .products-block.top-products .product {
    grid-template-columns: var(--bs-rank-size) 72px minmax(0, 1fr);
    grid-template-areas:
      "rank img info"
      "rank img price";
    min-height: 92px !important;
  }

  #content .bestsellers,
  #content .best-sellers,
  #content .top-products,
  #content .topProducts,
  #content .products-top,
  #content .productsBlock.bestsellers,
  #content .products-block.bestsellers,
  #content .products-block.top-products {
    --bs-img-size: 72px;
    --bs-row-padding: 8px;
    --bs-gap: 10px;
  }

  #content .bestsellers .prices,
  #content .best-sellers .prices,
  #content .top-products .prices,
  #content .topProducts .prices,
  #content .products-top .prices,
  #content .bestsellers .price,
  #content .best-sellers .price,
  #content .top-products .price,
  #content .topProducts .price,
  #content .products-top .price {
    text-align: left !important;
  }
}