/*
Theme Name: Street Icon (Kadence Child)
Theme URI: https://streeticon.co.uk
Description: Child theme of Kadence for Street Icon (streeticon.co.uk) — custom homepage layout, product page tweaks, and site-specific CSS live here so they survive parent theme updates.
Author: mafiaclo
Author URI: https://streeticon.co.uk
Template: kadence
Version: 1.0.1
Text Domain: si-kadence-child
*/

/* ==========================================================================
   All custom CSS for Street Icon goes below this line.
   Nothing above this comment should be edited — it's the required
   WordPress child theme header and must stay intact.
   ========================================================================== */

/* --- Example: category tile hover zoom (from the "Shop by Category" build) --- */
.si-category-grid .kt-adv-image-wrap {
  overflow: hidden;
  position: relative;
}

.si-category-grid .kt-adv-image-wrap img {
  transition: transform 0.4s ease;
}

.si-category-grid .kt-adv-image-wrap:hover img {
  transform: scale(1.05);
}

/* --- Example: horizontal scroll product carousel (from the "Best Sellers" build) --- */
.bestsellers-scroll ul.products,
.bestsellers-scroll .wc-block-product-template {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  gap: 16px;
  padding-bottom: 12px;
  scrollbar-width: none;
}

.bestsellers-scroll ul.products::-webkit-scrollbar,
.bestsellers-scroll .wc-block-product-template::-webkit-scrollbar {
  display: none;
}

.bestsellers-scroll li.product,
.bestsellers-scroll .wc-block-product-template__product {
  flex: 0 0 auto;
  width: 260px;
  scroll-snap-align: start;
}

/* Add any further site-specific CSS below this line */

/* --- Fix: WooCommerce product hover-swap image showing stacked instead of on hover --- */
.wc-block-grid__product-link,
a.woocommerce-loop-product__link {
  position: relative;
  display: block;
  overflow: hidden;
}

.wc-block-grid__product-link img.secondary-product-image,
a.woocommerce-loop-product__link img.wp-post-image--secondary {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

.wc-block-grid__product-link:hover img.secondary-product-image,
a.woocommerce-loop-product__link:hover img.wp-post-image--secondary {
  opacity: 1;
}

/* --- Fix: single product gallery stuck invisible (opacity:0 never flips to 1) --- */
.woocommerce-product-gallery {
  opacity: 1 !important;
}

/* --- Fix: large blank gap between gallery and product title on mobile --- */
@media (max-width: 768px) {
  .single-product div.product,
  .woocommerce-product-gallery,
  .woocommerce-product-gallery__wrapper,
  .images.woocommerce-product-gallery {
    height: auto !important;
    min-height: 0 !important;
  }
}