/* Maintain consistent aspect ratio for WooCommerce main image */
.woocommerce div.product div.images .woocommerce-product-gallery__image {
  aspect-ratio: 4 / 3; /* same ratio as 1350x1000 */
  overflow: hidden;
}
.woocommerce div.product div.images .woocommerce-product-gallery__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: none !important;
}
/* Fix for flickering product gallery */
.woocommerce div.product div.images .woocommerce-product-gallery__image {
  aspect-ratio: 4 / 3;
  overflow: hidden;
}
.woocommerce div.product div.images .woocommerce-product-gallery__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: none !important;
}

/* Disable mobile double-tap (hover zoom) on product thumbnails */
@media (max-width: 768px) {
  .woocommerce ul.products li.product a img,
  .woocommerce ul.products li.product a {
    pointer-events: auto !important;
  }

  .woocommerce ul.products li.product a img {
    transform: none !important;
    transition: none !important;
  }

  .woocommerce ul.products li.product:hover a img {
    transform: none !important;
  }
}
/* Force direct tap on product images for mobile */
@media (max-width: 768px) {
  .woocommerce ul.products li.product a::before,
  .woocommerce ul.products li.product a::after {
    display: none !important;
    content: none !important;
  }
  .woocommerce ul.products li.product a {
    touch-action: manipulation !important;
  }
}
/* Show all product thumbnails below the main image */
.woocommerce div.product div.images .flex-control-thumbs {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: center;
  overflow-x: auto !important;  /* allow horizontal scroll if needed */
  gap: 8px;
}
/* Force product thumbnails visible and clickable */
.woocommerce div.product div.images .flex-control-thumbs,
.woocommerce div.product .thumbnails {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  overflow-x: scroll !important;
  -webkit-overflow-scrolling: touch !important;
  padding: 0 !important;
  margin-top: 10px !important;
}

.woocommerce div.product div.images .flex-control-thumbs li,
.woocommerce div.product .thumbnails li {
  flex: 0 0 auto !important;
  width: 85px !important;  /* adjust if you want larger/smaller thumbnails */
  height: auto !important;
  margin: 0 !important;
  display: inline-block !important;
}

.woocommerce div.product div.images .flex-control-thumbs img,
.woocommerce div.product .thumbnails img {
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  transition: none !important;
  transform: none !important;
}

img[src*="mypos-checkout-logo"], 
img[src*="mypos_logo"] {
    content: url("https://outframemedia.com/wp-content/uploads/2025/11/myPOS-Logo-Colour-RGB.png");
    max-width: 120px;
    height: auto;
}
/* Show header cart on mobile */
@media (max-width: 768px) {
    .site-header .header-cart, 
    .site-header .woocommerce-cart {
        display: block !important;
    }
}
/* Make WooCommerce prices red and use sans-serif font */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce .woocommerce-Price-amount {
    color: #ff0000 !important;  /* red color */
    font-family: sans-serif !important;  /* use sans-serif font */
    font-weight: 600;  /* make slightly bold */
    letter-spacing: 0.5px;  /* optional: adds small spacing between letters/numbers */
}
