/* ============================================================
   CATTRESSI — COLLECTION CARD FIXES (v1.0.9)
   Higher specificity to override WooCommerce default styling
   ============================================================ */

/* Reset any WC default padding/margin on product cards */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.products-grid .product-card,
.products.products-grid li.product {
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  text-align: left !important;
  clear: none !important;
  float: none !important;
  list-style: none !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Force products-grid to use CSS grid, not WC default flex */
.products.products-grid,
ul.products.products-grid,
ul.products {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 2rem 1.5rem !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

@media (max-width: 1100px) {
  .products.products-grid,
  ul.products.products-grid,
  ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 600px) {
  .products.products-grid,
  ul.products.products-grid,
  ul.products {
    grid-template-columns: 1fr !important;
  }
}

/* Product card container */
.products-grid .product-card,
.products .product-card,
a.product-card {
  display: flex !important;
  flex-direction: column !important;
  text-decoration: none !important;
  color: inherit !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  transition: transform .3s ease;
  position: relative;
  opacity: 1;
}

/* Pill tag — top-left, compact */
.products-grid .product-card .product-type,
.products .product-card .product-type {
  position: absolute !important;
  top: 12px !important;
  left: 12px !important;
  z-index: 3 !important;
  font-size: 10px !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  color: #5C2E0E !important;
  background: #F5E1D8 !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  font-weight: 500 !important;
  font-family: var(--f-body, 'Inter', sans-serif) !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  display: inline-block !important;
}

/* Image area — compact aspect ratio, constrained */
.products-grid .product-card .product-image,
.products .product-card .product-image {
  position: relative !important;
  aspect-ratio: 1 !important;
  overflow: hidden !important;
  background: #FAF4EE !important;
  margin: 0 0 12px 0 !important;
  border: 1px solid #E5D9CC !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

.products-grid .product-card .product-image img,
.products .product-card .product-image img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: opacity .4s ease, transform .6s ease;
  margin: 0 !important;
  padding: 0 !important;
}

.products-grid .product-card .product-img-hover,
.products .product-card .product-img-hover {
  opacity: 0 !important;
}

.products-grid .product-card:hover .product-img-primary,
.products .product-card:hover .product-img-primary {
  opacity: 0 !important;
}

.products-grid .product-card:hover .product-img-hover,
.products .product-card:hover .product-img-hover {
  opacity: 1 !important;
}

.products-grid .product-card:hover .product-image img,
.products .product-card:hover .product-image img {
  transform: scale(1.04);
}

/* Body area */
.products-grid .product-card .product-body,
.products .product-card .product-body {
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  background: transparent !important;
}

/* Name — italic serif, smaller than before */
.products-grid .product-card .product-name,
.products .product-card .product-name,
.products-grid .product-card h3,
.products .product-card h3 {
  font-family: var(--f-display, 'Cormorant Garamond', serif) !important;
  font-weight: 400 !important;
  font-size: 1.15rem !important;
  line-height: 1.25 !important;
  color: #3D1E08 !important;
  letter-spacing: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  font-style: italic !important;
}

/* Specs — small grey */
.products-grid .product-card .product-specs,
.products .product-card .product-specs {
  font-size: 12px !important;
  color: #8B7B6E !important;
  letter-spacing: 0.01em !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--f-body, 'Inter', sans-serif) !important;
}

.products-grid .product-card .product-specs .spec-metal,
.products .product-card .product-specs .spec-metal {
  color: #8B7B6E !important;
  font-weight: 400 !important;
}

/* Metal circles — SMALLER, 20px */
.products-grid .product-card .product-metals,
.products .product-card .product-metals {
  display: flex !important;
  gap: 6px !important;
  margin: 2px 0 !important;
  padding: 0 !important;
  align-items: center !important;
  list-style: none !important;
}

.products-grid .product-card .metal-circle,
.products .product-card .metal-circle,
a.product-card button.metal-circle {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  min-height: 22px !important;
  max-width: 22px !important;
  max-height: 22px !important;
  border-radius: 50% !important;
  border: 1px solid transparent !important;
  cursor: pointer !important;
  transition: all .2s ease;
  padding: 0 !important;
  margin: 0 !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0 !important;  /* hide text inside circles — just show colored dot */
  color: transparent !important;
  letter-spacing: 0 !important;
  font-family: inherit !important;
  line-height: 1 !important;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08) !important;
}

.products-grid .product-card .metal-circle:hover,
.products .product-card .metal-circle:hover {
  transform: scale(1.1);
}

.products-grid .product-card .metal-circle.active,
.products .product-card .metal-circle.active {
  border-color: #3D1E08 !important;
  border-width: 1.5px !important;
}

.products-grid .product-card .metal-circle[data-metal="white14"],
.products-grid .product-card .metal-circle[data-metal="white18"],
.products .product-card .metal-circle[data-metal="white14"],
.products .product-card .metal-circle[data-metal="white18"] {
  background: #E8E4DC !important;
}
.products-grid .product-card .metal-circle[data-metal="yellow14"],
.products-grid .product-card .metal-circle[data-metal="yellow18"],
.products .product-card .metal-circle[data-metal="yellow14"],
.products .product-card .metal-circle[data-metal="yellow18"] {
  background: #D4AF37 !important;
}
.products-grid .product-card .metal-circle[data-metal="rose14"],
.products-grid .product-card .metal-circle[data-metal="rose18"],
.products .product-card .metal-circle[data-metal="rose14"],
.products .product-card .metal-circle[data-metal="rose18"] {
  background: #E8B4A0 !important;
}
.products-grid .product-card .metal-circle[data-metal="platinum"],
.products .product-card .metal-circle[data-metal="platinum"] {
  background: #CED1D6 !important;
}

/* Carat chips — small pills */
.products-grid .product-card .product-carats,
.products .product-card .product-carats {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  align-items: center !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.products-grid .product-card .carat-chip,
.products .product-card .carat-chip,
a.product-card button.carat-chip {
  padding: 3px 10px !important;
  font-size: 11px !important;
  font-family: var(--f-body, 'Inter', sans-serif) !important;
  font-weight: 400 !important;
  color: #3D1E08 !important;
  background: transparent !important;
  border: 1px solid #E5D9CC !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: all .2s ease;
  line-height: 1.4 !important;
  min-width: auto !important;
  min-height: auto !important;
}

.products-grid .product-card .carat-chip:hover,
.products .product-card .carat-chip:hover {
  border-color: #5C2E0E !important;
}

.products-grid .product-card .carat-chip.active,
.products .product-card .carat-chip.active {
  border-color: #3D1E08 !important;
  border-width: 1.5px !important;
  padding: calc(3px - 0.5px) calc(10px - 0.5px) !important;
  font-weight: 500 !important;
}

.products-grid .product-card .carat-variants-more,
.products .product-card .carat-variants-more {
  padding: 3px 8px !important;
  font-size: 10px !important;
  color: #8B7B6E !important;
  background: transparent !important;
  border: 1px solid #E5D9CC !important;
  border-radius: 999px !important;
  line-height: 1.4 !important;
}

/* Price block */
.products-grid .product-card .product-price,
.products .product-card .product-price {
  display: flex !important;
  align-items: baseline !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin-top: 8px !important;
  padding: 0 !important;
  font-family: var(--f-body, 'Inter', sans-serif) !important;
}

.products-grid .product-card .price-full,
.products .product-card .price-full {
  font-size: 12px !important;
  color: #8B7B6E !important;
  text-decoration: line-through !important;
  font-weight: 400 !important;
}

.products-grid .product-card .price-sale,
.products .product-card .price-sale {
  font-size: 14px !important;
  color: #B83A3A !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em !important;
}

.products-grid .product-card .price-off,
.products .product-card .price-off {
  font-size: 10px !important;
  font-weight: 600 !important;
  color: #FFFFFF !important;
  background: #006634 !important;
  padding: 2px 7px !important;
  border-radius: 999px !important;
  letter-spacing: 0 !important;
  line-height: 1.4 !important;
}

/* Hide WooCommerce default sale badge */
.woocommerce span.onsale {
  display: none !important;
}

/* Hide WooCommerce default add-to-cart button under archive products */
.woocommerce ul.products li.product .button {
  display: none !important;
}
