/* --------------------------------------------------------------------------
   Explore page — consolidated
-------------------------------------------------------------------------- */

/* Local variables */
.ph-explore {
  --ph-grid-gap: 12px;
  --ph-grid-gap-mobile: 10px;
  --ph-thumbnail-pt: 10px;
  --ph-thumbnail-pb: 0px;
  --ph-hover-scale: 1.05;
  --astra-below-header-display: none; /* keep if other code reads it */
}

/* hide ast below header wrapper (keeps both approaches available) */
.ph-explore .ast-below-header-wrap { display: none !important; }

/* inline code rendering */
.ph-explore .products > code { display: contents !important; }

/* Explore grid wrapper & base list */
.ph-explore #pulse-explore-grid { padding: 10px !important; }

.ph-explore ul.products {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: var(--ph-grid-gap) !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Product card base */
.ph-explore ul.products li.product {
  box-sizing: border-box;
  width: calc((100% - (3 * var(--ph-grid-gap))) / 4) !important;
  margin: 0 !important;
  padding: 0 !important;
  background-color: #f9f9f9 !important;
  border-radius: 0 !important; /* square corners */
  overflow: hidden;
}

/* Thumbnail / link (consolidated) */
.ph-explore ul.products li.product .astra-shop-thumbnail-wrap,
.ph-explore ul.products li.product a.woocommerce-loop-product__link {
  display: block !important;
  padding-top: var(--ph-thumbnail-pt) !important;
  padding-bottom: var(--ph-thumbnail-pb) !important;
  box-sizing: content-box !important;
  overflow: hidden !important;
  position: relative !important;
  border-radius: 0 !important;
}

/* Ensure images behave predictably inside the grid */
.ph-explore ul.products li.product img {
  display: block;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

/* Subtle hover-zoom on images */
.ph-explore ul.products li.product a.woocommerce-loop-product__link img {
  transition: transform 0.4s ease-in-out !important;
}
.ph-explore ul.products li.product a.woocommerce-loop-product__link:hover img {
  transform: scale(var(--ph-hover-scale)) !important;
}

/* Minimalist card text: category -> title -> price */
.ph-explore ul.products li.product .ph-summary-wrap {
  text-align: center !important;
  position: relative !important;
  margin: 0 0 .8em 0 !important;
}

.ph-explore ul.products li.product small.ast-woo-product-category {
  display: block !important;
  font-size: 13.6px !important;
  color: rgba(0, 0, 0, 0.9) !important;
  pointer-events: none !important;
}
.ph-explore ul.products li.product small.ast-woo-product-category a {
  color: inherit !important;
  text-decoration: none !important;
}

.ph-explore ul.products li.product .woocommerce-loop-product__title {
  margin: 0 0 .5em 0 !important;
  font-weight: 500 !important;
  font-size: 16px !important;
  color: #000 !important;
  padding: 0 1.2em !important;
  box-sizing: border-box !important;
}

.ph-explore ul.products li.product .price {
  display: block !important;
  margin-bottom: 0.5em !important;
  font-weight: 400 !important;
  font-size: 14.4px !important;
  color: #000 !important;
}
.ph-explore ul.products li.product .price ins .woocommerce-Price-amount {
  font-weight: 400 !important;
}

/* Remove underline on product links */
.ph-explore ul.products li.product a.ast-loop-product__link {
  text-decoration: none !important;
}

/* Hide actions/ratings (grouped) */
.ph-explore ul.products li.product .add_to_cart_button,
.ph-explore ul.products li.product .button.product_type_simple,
.ph-explore ul.products li.product .button.product_type_variable,
.ph-explore ul.products li.product .star-rating,
.ph-explore ul.products li.product .woocommerce-product-rating {
  display: none !important;
}

/* Square corners for grid / thumbnails */
.ph-explore #pulse-explore-grid ul.products li.product,
.ph-explore #pulse-explore-grid ul.products li.product img,
.ph-explore #pulse-explore-grid ul.products li.product .astra-shop-thumbnail-wrap {
  border-radius: 0 !important;
}

/* --------------------------------------------------------------------------
   Loader — unified approach (Astra/Woo loader is authoritative for visuals)
   - Old #pulse-explore-loading removed.
   - ASTRA loader visual/animation lives in your woo customizations CSS.
   - This file provides small scope & default hide rules.
-------------------------------------------------------------------------- */

/* Keep a scoped wrapper for Explore so loader sits under the grid and centers properly */
.ph-explore .ph-explore-loader {
  width: 100%;
  display: block;
  margin: 12px auto;
  text-align: center;
  position: relative;
  z-index: 10;
}

/* Hide the ast-loader by default; JS shows it with phExploreShowLoader() */
.ph-explore .ph-explore-loader .ast-loader {
  display: none; /* shown by JS */
  margin: 0 auto;
  width: min(220px, 78%);
  box-sizing: border-box;
}

/* Keep skeleton shimmer rules in this file (placeholders shown during initial hydrate) */
@keyframes phShimmer {
  0%   { background-position: -400px 0; }
  100% { background-position: 400px 0; }
}
.ph-explore .ph-explore-skeleton { pointer-events: none; }
.ph-explore .ph-explore-skeleton .ph-skel-img,
.ph-explore .ph-explore-skeleton .ph-skel-line {
  border-radius: 10px;
  background: linear-gradient(90deg, #eeeeee 25%, #f6f6f6 37%, #eeeeee 63%);
  background-size: 800px 100%;
  animation: phShimmer 1.2s infinite linear;
}
.ph-explore .ph-explore-skeleton .ph-skel-img {
  width: 100%;
  aspect-ratio: 1 / 1;
  margin-bottom: 12px;
}
.ph-explore .ph-explore-skeleton .ph-skel-meta { padding: 0 2px 2px; }
.ph-explore .ph-explore-skeleton .ph-skel-line { height: 12px; margin: 8px 0; }
.ph-explore .ph-explore-skeleton .ph-skel-cat { width: 35%; height: 10px; }
.ph-explore .ph-explore-skeleton .ph-skel-title { width: 75%; }
.ph-explore .ph-explore-skeleton .ph-skel-price { width: 45%; height: 11px; }

/* Responsive adjustments */

/* Tablet: 3 columns */
@media (max-width: 61.24em) {
  .ph-explore ul.products { gap: var(--ph-grid-gap) !important; }

  .ph-explore ul.products li.product {
    flex: 0 0 calc((100% - (2 * var(--ph-grid-gap))) / 3) !important;
    max-width: calc((100% - (2 * var(--ph-grid-gap))) / 3) !important;
  }

  .ph-explore ul.products li.product .woocommerce-loop-product__title { font-size: 14.592px !important; }
  .ph-explore ul.products li.product small.ast-woo-product-category { font-size: 12.4032px !important; }
  .ph-explore ul.products li.product .price { font-size: 13.1328px !important; }

  /* Explorer loader sizing adjustments to keep it visually consistent on tablet */
  .ph-explore .ph-explore-loader .ast-loader { width: min(200px, 82%); }
}

/* Mobile: 2 columns */
@media (max-width: 46.24em) {
  .ph-explore ul.products { gap: var(--ph-grid-gap-mobile) !important; }

  .ph-explore ul.products li.product {
    flex: 0 0 calc((100% - var(--ph-grid-gap-mobile)) / 2) !important;
    max-width: calc((100% - var(--ph-grid-gap-mobile)) / 2) !important;
  }

  /* a slightly smaller loader width on mobile if needed */
  .ph-explore .ph-explore-loader .ast-loader { width: min(180px, 88%); }
}