/**
 * Shop / category archive — loads after WooCommerce CSS.
 */

.cn-shop-archive {
  background: var(--cn-zinc-50);
}

.cn-shop-layout {
  display: block;
  width: 100%;
}

.cn-shop-sidebar {
  display: none;
}

.cn-shop-main {
  width: 100%;
  min-width: 0;
}

.cn-products-grid--archive {
  width: 100%;
  max-width: 100%;
}

/* Grid: works with or without .cn-products-grid--archive wrapper */
body.woocommerce ul.products.cn-wc-product-grid,
body.woocommerce-page ul.products.cn-wc-product-grid,
.cn-products-grid--archive ul.products.cn-wc-product-grid,
.cn-products-grid--archive ul.products,
.cn-shop-main ul.products.cn-wc-product-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  float: none !important;
}

body.woocommerce ul.products.cn-wc-product-grid::before,
body.woocommerce ul.products.cn-wc-product-grid::after,
body.woocommerce-page ul.products.cn-wc-product-grid::before,
body.woocommerce-page ul.products.cn-wc-product-grid::after,
.cn-products-grid--archive ul.products::before,
.cn-products-grid--archive ul.products::after {
  display: none !important;
  content: none !important;
}

body.woocommerce ul.products.cn-wc-product-grid > li.product,
body.woocommerce-page ul.products.cn-wc-product-grid > li.product,
.cn-products-grid--archive ul.products > li.product {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  clear: none !important;
  display: block !important;
}

/* Desktop only — mobile stays 2-column (rules above, max-width: 991px) */
@media (min-width: 992px) {
  .cn-shop-layout {
    display: grid !important;
    grid-template-columns: 260px minmax(0, 1fr) !important;
    gap: 24px !important;
    align-items: start;
  }

  .cn-shop-sidebar {
    display: block !important;
    position: sticky;
    top: 88px;
  }

  body.woocommerce .cn-shop-layout ul.products.cn-wc-product-grid,
  body.woocommerce-page .cn-shop-layout ul.products.cn-wc-product-grid,
  .cn-shop-layout .cn-products-grid--archive ul.products.cn-wc-product-grid,
  .cn-shop-layout .cn-products-grid--archive ul.products {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 16px !important;
  }

  /* Compact product cards on PC (avoid huge square image boxes) */
  .cn-shop-layout .cn-card-inner {
    padding: 8px;
  }

  .cn-shop-layout .cn-card-image {
    height: 200px;
    padding-bottom: 0;
    aspect-ratio: auto;
  }

  .cn-shop-layout .cn-card-img-wrap {
    padding: 8px;
  }

  .cn-shop-layout .cn-card-title {
    font-size: 13px;
    margin-top: 6px;
  }

  .cn-shop-layout .cn-price-current {
    font-size: 14px;
  }
}

@media (min-width: 1280px) {
  body.woocommerce .cn-shop-layout ul.products.cn-wc-product-grid,
  body.woocommerce-page .cn-shop-layout ul.products.cn-wc-product-grid,
  .cn-shop-layout .cn-products-grid--archive ul.products {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}
