/*
Theme Name: Thai Corner Child
Theme URI: http://thai-corner.local
Description: Child theme of Kadence for the Thai Corner tea e-commerce site. All visual customisation (colours, typography, header, footer) is managed in Appearance > Customize, which Kadence fully supports.
Author: Thai Corner
Template: kadence
Version: 1.0.0
Text Domain: thai-corner-child
*/

/* ══════════════════════════════════════════════
   WOOCOMMERCE SHOP — 2×2 GRID
══════════════════════════════════════════════ */

/* Force 2 columns at fixed pixel size — 30% smaller than full width */
.woocommerce ul.products,
.woocommerce-page ul.products {
  display: grid !important;
  grid-template-columns: repeat(2, 260px) !important;
  gap: 24px !important;
  justify-content: center !important;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Remove any width overrides Kadence/WooCommerce may set per column count */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  width: 260px !important;
  margin: 0 !important;
  float: none !important;
}

/* Product card polish */
.woocommerce ul.products li.product a img {
  width: 100%;
  height: 200px;
  object-fit: contain;
  background: #FAF6EE;
  border-radius: 8px 8px 0 0;
  display: block;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: Georgia, serif;
  color: #1C3A0F;
  font-size: 1.05rem;
  padding: 12px 0 4px;
}

.woocommerce ul.products li.product .price {
  color: #C79A45;
  font-weight: 700;
  font-size: 1.1rem;
}

.woocommerce ul.products li.product .button {
  background: #1C3A0F !important;
  color: #A8D870 !important;
  border-radius: 5px !important;
  letter-spacing: 0.08em;
  font-size: 0.82rem;
  font-weight: 700;
  padding: 10px 20px !important;
  transition: background 0.2s !important;
}

.woocommerce ul.products li.product .button:hover {
  background: #2D5016 !important;
}

/* Single column on mobile */
@media (max-width: 600px) {
  .woocommerce ul.products,
  .woocommerce-page ul.products {
    grid-template-columns: 1fr !important;
  }
}
