/**
 * WooCommerce Product Grid Overrides
 */

/* Archive/Shop Wrapper */
.woocommerce-archive-wrapper {
  padding: var(--spacing-3xl) 0;
}

/* Page Title */
.woocommerce-products-header {
  margin-bottom: var(--spacing-3xl);
}

.woocommerce-products-header__title {
  font-size: var(--font-size-3xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-secondary);
  margin-bottom: var(--spacing-md);
}

.woocommerce-archive-description {
  color: var(--color-gray-600);
  font-size: var(--font-size-base);
}

/* Shop Controls */
.woocommerce-result-count {
  color: var(--color-gray-600);
  font-size: var(--font-size-sm);
}

.woocommerce-ordering {
  margin-bottom: var(--spacing-xl);
}

.woocommerce-ordering select {
  padding: 0.5rem 1rem;
  border: 1px solid var(--color-gray-300);
  border-radius: var(--radius-lg);
  font-size: var(--font-size-sm);
}

/* Shop/Archive Product Grid */
.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
  gap: var(--spacing-xl) !important;
  list-style: none !important;
  padding: 0 !important;
  margin: var(--spacing-2xl) 0 !important;
}

.woocommerce ul.products li.product {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  float: none !important;
  display: block !important;
}

/* Ensure product cards show correctly */
.woocommerce ul.products li.product.product-card {
  background: white;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  transition: all 0.2s;
  position: relative;
  display: flex !important;
  flex-direction: column !important;
  border: 1px solid #e5e7eb;
}

/* Price Styling */
.woocommerce .product-card .price {
  display: flex;
  align-items: baseline;
  gap: var(--spacing-sm);
  margin: 0;
}

.woocommerce .product-card .price .amount,
.woocommerce .product-card .price ins .amount {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-primary);
  text-decoration: none;
}

.woocommerce .product-card .price del {
  opacity: 1;
}

.woocommerce .product-card .price del .amount {
  font-size: var(--font-size-sm);
  color: var(--color-gray-400);
  text-decoration: line-through;
  font-weight: normal;
}

.woocommerce .product-card .price ins {
  text-decoration: none;
  background: none;
}

/* Remove WooCommerce Default Styles */
.woocommerce ul.products li.product .woocommerce-loop-category__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h3 {
  padding: 0 !important;
  background: none !important;
  margin: 0 !important;
}

.woocommerce ul.products li.product a {
  text-decoration: none !important;
}

.woocommerce ul.products li.product a img {
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  display: block !important;
}

.woocommerce .star-rating {
  display: none !important;
}

.woocommerce ul.products li.product .button {
  display: none !important;
}

/* Hide default WooCommerce elements we're replacing */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link {
  display: block !important;
  width: 100% !important;
}

/* Ensure vertical layout */
.woocommerce ul.products li.product * {
  box-sizing: border-box;
}

.woocommerce ul.products li.product > * {
  width: 100% !important;
}

/* Responsive Grid */
@media (max-width: 768px) {
  .woocommerce ul.products {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
    gap: var(--spacing-md) !important;
  }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .woocommerce ul.products {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}