/* ===========================================
   STUDIMO V4 — Products Section Override
   Homepage scope: body.in-index
   Category pages: globalni design styly
   =========================================== */

/* ══════════════════════════════════════════
   A) HOMEPAGE — fixni 4-product grid (body.in-index)
   ══════════════════════════════════════════ */

/* ── Homepage section headings — DIV.homepage-group-title (MIMO products-wrapper) ── */
body.in-index .homepage-group-title,
body.in-index [class*="homepage-products-heading"] {
  font-family: 'Marcellus', serif !important;
  font-weight: 700 !important;
  font-size: 48px !important;
  color: #9A7236 !important;
  text-align: center !important;
  margin-top: 120px !important;
  margin-bottom: 20px !important;
  letter-spacing: 0.02em !important;
}

/* ── Subtitle (injected via JS) ── */
.studimo-products-subtitle {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #9A7236;
  opacity: 0.5;
  text-align: center;
  margin-top: 0;
  margin-bottom: 60px;
}

/* ── Homepage wrapper — max-width 1200px (= collections) ── */
body.in-index .products-wrapper.product-slider-holder {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  padding-top: 0 !important;
  padding-bottom: 120px !important;
  overflow: visible !important;
}

/* ── Homepage: KILL slider — fixni grid ── */
body.in-index .product-slider {
  width: 100% !important;
  overflow: visible !important;
  cursor: default !important;
}

body.in-index .products-block {
  display: flex !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  transform: none !important;
  transition: none !important;
  gap: 32px 0 !important;
}

body.in-index .products-block .product {
  width: 25% !important;
  flex: 0 0 25% !important;
  padding: 0 16px !important;
}

/* Zobrazit jen prvnich 4 na homepage */
body.in-index .products-block .product:nth-child(n+5) {
  display: none !important;
}

/* Hide slider controls on homepage */
body.in-index .product-slider-navigation,
body.in-index .slider-navigation,
body.in-index .slider-pagination,
body.in-index .product-slider-pagination {
  display: none !important;
}

/* Hide buy buttons on homepage */
body.in-index .product .p-tools,
body.in-index .product .custom-button,
body.in-index .product .p-button-detail {
  display: none !important;
}

/* ══════════════════════════════════════════
   B) GLOBALNI — design styly pro vsechny produkty
   ══════════════════════════════════════════ */

/* ── Product card — clean ── */
body .product {
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  text-align: left !important;
}

body .product:hover {
  box-shadow: none !important;
  transform: none !important;
}

/* ── Product image ── */
body .product .p.swap-images,
body .product .p.swap-images a.image {
  display: block !important;
  overflow: hidden !important;
  position: relative !important;
  border-radius: 4px !important;
}

body .product .p.swap-images img,
body .product .p.swap-images a.image img {
  width: 100% !important;
  display: block !important;
  object-fit: cover !important;
  aspect-ratio: 4 / 5 !important;
  transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

body .product:hover .p.swap-images img,
body .product:hover .p.swap-images a.image img {
  transform: scale(1.05) !important;
}

/* ── Hover overlay — na fotce uvnitr a.image (jen homepage) ── */
.studimo-product-hover {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 0.1em;
  color: #FFFFFF;
  opacity: 0;
  padding: 24px 0 14px 0;
  background: linear-gradient(to top, rgba(0,0,0,0.35) 0%, transparent 100%);
  transform: translateY(4px);
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  z-index: 5;
  pointer-events: none;
}

body .product:hover .studimo-product-hover {
  opacity: 1;
  transform: translateY(0);
}

/* ── Product name ── */
body .product a.name,
body .product .p-in-in a.name {
  font-family: 'Marcellus', serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #9A7236 !important;
  text-decoration: none !important;
  line-height: 1.3 !important;
  text-align: left !important;
  text-transform: none !important;
  display: block !important;
  margin-bottom: 6px !important;
  height: auto !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: unset !important;
  overflow: visible !important;
}

body .product a.name span {
  font-family: 'Marcellus', serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #9A7236 !important;
}

body .product a.name:hover {
  color: #9A7236 !important;
  opacity: 0.7 !important;
  text-decoration: none !important;
}

/* ── Text wrappers — tight spacing ── */
body .product .p-in {
  text-align: left !important;
  padding: 20px 0 0 0 !important;
}

body .product .p-in-in {
  text-align: left !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ── Price ── */
body .product .p-bottom {
  text-align: left !important;
  padding: 0 !important;
  margin: 0 !important;
}

body .product .p-bottom > div,
body .product .p-bottom > div[data-micro] {
  display: inline !important;
}

body .product .prices {
  text-align: left !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline !important;
}

body .product .price.price-final,
body .product .prices .price.price-final {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #9A7236 !important;
  opacity: 0.7 !important;
  text-align: left !important;
  display: inline !important;
}

body .product .price.price-final strong,
body .product .price.price-final small {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 400 !important;
  color: #9A7236 !important;
}

body .product .price-before,
body .product del {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  color: #9A7236 !important;
  opacity: 0.4 !important;
}

/* ── HIDE — globalne ── */
body .product .p-stock,
body .product .p-code,
body .p-code,
body .product .p-short-description,
body .product .ratings-wrapper,
body .product .stars-wrapper,
body .product .review-stars,
body .product .p-rating,
body .product .rating,
body .product [class*="rating"],
body .product [class*="stars"],
body .product [class*="review"] {
  display: none !important;
}

/* ── Availability — inline vedle ceny ── */
body .product .availability {
  display: inline !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  color: #9A7236 !important;
  opacity: 0.5 !important;
  margin-left: 8px !important;
  padding-left: 10px !important;
  border-left: 1px solid rgba(154, 114, 54, 0.25) !important;
}

body .product .availability span {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  color: #9A7236 !important;
}

/* ── Badge / Flags ── */
body .product .flags {
  position: absolute !important;
  top: 12px !important;
  left: 12px !important;
  z-index: 10 !important;
}

body .product .flags .flag,
body .product .flag,
body .product .flags span {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 500 !important;
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: #9A7236 !important;
  background: #F3CDC4 !important;
  background-color: #F3CDC4 !important;
  padding: 5px 10px !important;
  border-radius: 2px !important;
  border: none !important;
}

body .product .flags .flag[style],
body .product .flag[style] {
  color: #9A7236 !important;
  background: #F3CDC4 !important;
  background-color: #F3CDC4 !important;
}

/* ══════════════════════════════════════════
   C) RESPONSIVE
   ══════════════════════════════════════════ */

/* ── Tablet (≤991px) ── */
@media (max-width: 991px) {
  body.in-index .homepage-group-title,
  body.in-index [class*="homepage-products-heading"] {
    font-size: 40px !important;
    margin-top: 80px !important;
  }

  /* Homepage: 2-column grid */
  body.in-index .products-block .product {
    width: 50% !important;
    flex: 0 0 50% !important;
    padding: 0 10px !important;
    margin-bottom: 24px !important;
  }

  /* Skryt hover overlay na dotykových zařízeních */
  .studimo-product-hover {
    display: none !important;
  }

  .studimo-products-subtitle {
    margin-bottom: 40px;
    font-size: 13px;
  }

  body.in-index .products-wrapper.product-slider-holder {
    padding-bottom: 80px !important;
  }
}

/* ── Mobile (≤767px) ── */
@media (max-width: 767px) {
  body.in-index .homepage-group-title,
  body.in-index [class*="homepage-products-heading"] {
    font-size: 35px !important;
    margin-top: 60px !important;
  }

  body.in-index .products-block .product {
    padding: 0 8px !important;
    margin-bottom: 20px !important;
  }

  .studimo-products-subtitle {
    margin-bottom: 32px;
    font-size: 12px;
  }

  body .product a.name {
    font-size: 14px !important;
  }

  body .product .price.price-final {
    font-size: 13px !important;
  }

  body .product .availability {
    font-size: 11px !important;
  }

  body .product .p-in {
    padding: 12px 0 0 0 !important;
  }

  body .product a.name {
    margin-bottom: 4px !important;
  }

  body.in-index .products-wrapper.product-slider-holder {
    padding-bottom: 60px !important;
  }
}