/* Master Palm Store App Patch 454
   Homepage featured/product-section grid correction.
   The Featured Products section previously used .mpb2b-home-layout with a
   1fr + 285px right volume-pricing column, which trapped product cards in the
   left column and left too little width. This override keeps the content
   full-width and caps home product grids at 3 cards per desktop row. */

body.site-masterpalm #site-main .mpb2b-home-products > .mpb2b-home-layout,
body.masterpalm-theme #site-main .mpb2b-home-products > .mpb2b-home-layout,
body.masterpalm-store-dark #site-main .mpb2b-home-products > .mpb2b-home-layout {
  display: block !important;
  grid-template-columns: none !important;
  width: 100% !important;
}

body.site-masterpalm #site-main .mpb2b-home-products > .mpb2b-home-layout > div:first-child,
body.masterpalm-theme #site-main .mpb2b-home-products > .mpb2b-home-layout > div:first-child,
body.masterpalm-store-dark #site-main .mpb2b-home-products > .mpb2b-home-layout > div:first-child {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

body.site-masterpalm #site-main .mpb2b-home-products .mpb2b-product-grid,
body.masterpalm-theme #site-main .mpb2b-home-products .mpb2b-product-grid,
body.masterpalm-store-dark #site-main .mpb2b-home-products .mpb2b-product-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body.site-masterpalm #site-main .mpb2b-home-products .mpb2b-product-grid > .mpb2b-product-card,
body.masterpalm-theme #site-main .mpb2b-home-products .mpb2b-product-grid > .mpb2b-product-card,
body.masterpalm-store-dark #site-main .mpb2b-home-products .mpb2b-product-grid > .mpb2b-product-card {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

/* Keep the volume-pricing card visible, but make it a full-width supporting
   block underneath Featured Products instead of stealing a right column. */
body.site-masterpalm #site-main .mpb2b-home-products > .mpb2b-home-layout > .mpb2b-volume-card,
body.masterpalm-theme #site-main .mpb2b-home-products > .mpb2b-home-layout > .mpb2b-volume-card,
body.masterpalm-store-dark #site-main .mpb2b-home-products > .mpb2b-home-layout > .mpb2b-volume-card {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 24px !important;
}

body.site-masterpalm #site-main .mpb2b-home-products > .mpb2b-home-layout > .mpb2b-volume-card table,
body.masterpalm-theme #site-main .mpb2b-home-products > .mpb2b-home-layout > .mpb2b-volume-card table,
body.masterpalm-store-dark #site-main .mpb2b-home-products > .mpb2b-home-layout > .mpb2b-volume-card table {
  width: 100% !important;
}

@media (max-width: 991.98px) {
  body.site-masterpalm #site-main .mpb2b-home-products .mpb2b-product-grid,
  body.masterpalm-theme #site-main .mpb2b-home-products .mpb2b-product-grid,
  body.masterpalm-store-dark #site-main .mpb2b-home-products .mpb2b-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 575.98px) {
  body.site-masterpalm #site-main .mpb2b-home-products .mpb2b-product-grid,
  body.masterpalm-theme #site-main .mpb2b-home-products .mpb2b-product-grid,
  body.masterpalm-store-dark #site-main .mpb2b-home-products .mpb2b-product-grid {
    grid-template-columns: 1fr !important;
  }
}