/**
 * WooCommerce Shop Container CSS
 * This file controls the shop container width and lateral spacing.
 */

/* Mobile first - padding lateral em telas pequenas */
body.woocommerce #primary,
body.woocommerce-page #primary,
.woocommerce-shop #primary,
.woocommerce-page #primary,
.single-product #primary,
.archive.woocommerce #primary {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px; 
  padding-right: 15px;
  box-sizing: border-box;
}

/* Tablet - padding lateral médio */
@media (min-width: 768px) and (max-width: 991px) {
  body.woocommerce #primary,
  body.woocommerce-page #primary,
  .woocommerce-shop #primary,
  .woocommerce-page #primary,
  .single-product #primary,
  .archive.woocommerce #primary {
    padding-left: 30px; 
    padding-right: 30px;
  }
}

/* Desktop - padding lateral médio */
@media (min-width: 992px) and (max-width: 1459px) {
  body.woocommerce #primary,
  body.woocommerce-page #primary,
  .woocommerce-shop #primary,
  .woocommerce-page #primary,
  .single-product #primary,
  .archive.woocommerce #primary {
    max-width: 1400px;
    padding-left: 200px; 
    padding-right: 200px;
  }
}

/* Grandes telas (1460px+) incluindo 1920px, 2K, 4K */
@media (min-width: 1460px) {
  body.woocommerce #primary,
  body.woocommerce-page #primary,
  .woocommerce-shop #primary,
  .woocommerce-page #primary,
  .single-product #primary,
  .archive.woocommerce #primary {
    max-width: none; /* Sem limite máximo para telas grandes */
    padding-left: 300px; 
    padding-right: 300px;
    width: 100%;
    box-sizing: border-box;
  }
}

/* Estilos comuns a todos os tamanhos de desktop */
@media (min-width: 992px) {
  /* Fix for main content wrapper */
  .woocommerce .woocommerce-products-header,
  .woocommerce .woocommerce-breadcrumb,
  .woocommerce ul.products,
  .woocommerce-notices-wrapper,
  .woocommerce-result-count,
  .woocommerce-ordering,
  .shop-top-bar,
  .woocommerce-pagination {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  
  /* Ensure product grid doesn't overflow */
  .woocommerce ul.products {
    margin-left: 0;
    margin-right: 0;
  }
  
  /* Ensure consistent padding for product cards */
  .woocommerce ul.products li.product {
    box-sizing: border-box;
    padding: 15px !important;
    margin-bottom: 30px !important;
  }
  
  /* Give more breathing room to the shop content */
  .site-main .woocommerce {
    padding-top: 30px;
    padding-bottom: 50px;
  }
}