/* ==========================================================================
   AURA LUXIFY — Category showcase pages
   (Home Appliances, Kitchen Appliances, Electronics, Technology)
   Reuses the exact Shop page design tokens/cards from shop.css; this file
   only adds what a plain WordPress Page needs that the Shop archive already
   gets for free (background scoping, a centered max-width container).
   Scoped ONLY to these 4 pages — homepage untouched.
   ========================================================================== */

body.page-id-526,
body.page-id-527,
body.page-id-528,
body.page-id-529{
  background:var(--al-bg) !important;
}
body.page-id-526 #primary,
body.page-id-526 .content-area,
body.page-id-527 #primary,
body.page-id-527 .content-area,
body.page-id-528 #primary,
body.page-id-528 .content-area,
body.page-id-529 #primary,
body.page-id-529 .content-area{
  background:var(--al-bg) !important;
}

/* The [products] shortcode renders straight into the page content with no
   wrapping container of its own — give it the same centered width as the
   Shop page's product grid. */
body.page-id-526 .woocommerce ul.products,
body.page-id-527 .woocommerce ul.products,
body.page-id-528 .woocommerce ul.products,
body.page-id-529 .woocommerce ul.products{
  max-width:1240px !important;
  margin:0 auto !important;
  padding:0 24px 60px !important;
}
body.page-id-526 nav.woocommerce-pagination,
body.page-id-527 nav.woocommerce-pagination,
body.page-id-528 nav.woocommerce-pagination,
body.page-id-529 nav.woocommerce-pagination{
  max-width:1240px;
  margin:0 auto 60px !important;
  padding:0 24px;
}

@media (max-width:640px){
  body.page-id-526 .woocommerce ul.products,
  body.page-id-527 .woocommerce ul.products,
  body.page-id-528 .woocommerce ul.products,
  body.page-id-529 .woocommerce ul.products{
    padding:0 14px 50px;
  }
}
