/* ============================================================
 * MIXORA PRODUCT CARD — site er SHOB product card er design
 * ------------------------------------------------------------
 * HTML: includes/product-card.php (Mixora_Product_Card::render)
 * Kothay dekhay: homepage (Product Tabs + New Arrivals), category / shop /
 * search archive, product page er related carousel, WooCommerce loop.
 *
 * KENO `body .mixora-product-card ...`: purono archive CSS
 * (product-filter.css) ar Elementor widget er style control er cheye
 * specificity beshi rakhte. Design bodlate SHUDHU niche-r variable gulo.
 * ============================================================ */
.mixora-product-card {
  --mpc-ink: #111111;          /* EDIT ME: title / price / button rong */
  --mpc-muted: #6b7280;        /* EDIT ME: category label rong */
  --mpc-line: #d4d4d4;         /* EDIT ME: button border */
  --mpc-placeholder: #f3f3f3;  /* image load howar age background */
  --mpc-font: "Red Hat Display", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mpc-title: 15px;
  --mpc-price: 16px;
  --mpc-btn-h: 42px;
}

/* ---------- Card ---------- */
body .mixora-product-card {
  position: relative;
  display: flex !important;
  flex-direction: column !important;
  min-width: 0;
  height: 100%;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  font-family: var(--mpc-font);
  text-align: left;
  list-style: none;
}

/* ---------- Image (4:5, borderless) ---------- */
body .mixora-product-card .mixora-product-card__image {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  margin: 0;
  background: var(--mpc-placeholder) !important;
  border-radius: 0 !important;
}
body .mixora-product-card .mixora-product-card__image img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none;
  margin: 0 !important;
  object-fit: cover;
  border-radius: 0 !important;
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
/* Zoom shudhu mouse e — phone e tap korle lafiye uthto */
@media (hover: hover) {
  body .mixora-product-card:hover .mixora-product-card__image img {
    transform: scale(1.04);
  }
}

/* ---------- Image er upor label: New / Sale / Sold Out ---------- */
body .mixora-product-card .mixora-product-card__flag {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
  padding: 5px 8px;
  background: var(--mpc-ink);
  color: #ffffff;
  font-family: var(--mpc-font);
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  border-radius: 0 !important;
}
body .mixora-product-card .mixora-product-card__flag--sale {
  background: #b42318;
}
body .mixora-product-card .mixora-product-card__flag--soldout {
  background: #ffffff;
  color: var(--mpc-ink);
}
body .mixora-product-card.is-out-of-stock .mixora-product-card__image img {
  opacity: 0.55;
}

/* ---------- Text ---------- */
body .mixora-product-card .mixora-product-card__body {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto;
  padding: 12px 0 0 !important;
  background: transparent !important;
}
body .mixora-product-card .mixora-product-card__badge {
  margin: 0 0 4px !important;
  font-family: var(--mpc-font);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--mpc-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Title shob shomoy 2 line er jayga ney — tai ek row er price/button ek line e */
body .mixora-product-card .mixora-product-card__title {
  margin: 0 0 6px !important;
  padding: 0 !important;
  min-height: calc(var(--mpc-title) * 1.35 * 2);
  font-family: var(--mpc-font) !important;
  font-size: var(--mpc-title) !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.1px !important;
  /* product-filter.css e `.mxswpf-root h3 { uppercase !important }` ache */
  text-transform: none !important;
  color: var(--mpc-ink);
}
body .mixora-product-card .mixora-product-card__title a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: var(--mpc-ink) !important;
  text-decoration: none !important;
  font: inherit;
}
body .mixora-product-card .mixora-product-card__title a:hover {
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* ---------- Price ---------- */
body .mixora-product-card .mixora-product-card__price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 8px;
  margin: 0 0 12px !important;
  font-family: var(--mpc-font);
  font-size: var(--mpc-price) !important;
  font-weight: 700 !important;
  line-height: 1.25;
  letter-spacing: 0;
  color: var(--mpc-ink) !important;
}
body .mixora-product-card .mixora-product-card__price .amount,
body .mixora-product-card .mixora-product-card__price bdi {
  font: inherit !important;
  color: inherit !important;
}
body .mixora-product-card .mixora-product-card__price ins {
  order: -1;                       /* notun dam age, purono dam pore */
  text-decoration: none !important;
  background: none;
  color: var(--mpc-ink) !important;
}
body .mixora-product-card .mixora-product-card__price del {
  font-size: 0.82em !important;
  font-weight: 500 !important;
  color: var(--mpc-muted) !important;
  opacity: 1 !important;
}
body .mixora-product-card .mixora-product-card__price del .amount,
body .mixora-product-card .mixora-product-card__price del bdi {
  font-weight: 500 !important;
  color: var(--mpc-muted) !important;
}
/* "Original price was: ..." screen reader lekha — chokhe dekhabe na */
body .mixora-product-card .screen-reader-text {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ---------- Button (outline, hover e kalo) ---------- */
body .mixora-product-card .mixora-product-card__button {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  min-height: var(--mpc-btn-h);
  margin: auto 0 0 !important;     /* card er niche bose */
  padding: 0 12px !important;
  box-sizing: border-box;
  background: transparent !important;
  color: var(--mpc-ink) !important;
  border: 1px solid var(--mpc-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: var(--mpc-font) !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  letter-spacing: 0.6px !important;
  text-transform: uppercase !important;
  text-align: center;
  text-decoration: none !important;
  cursor: pointer;
  transform: none !important;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
body .mixora-product-card .mixora-product-card__button:hover,
body .mixora-product-card .mixora-product-card__button:focus-visible {
  background: var(--mpc-ink) !important;
  border-color: var(--mpc-ink) !important;
  color: #ffffff !important;
}
body .mixora-product-card .mixora-product-card__button:focus-visible {
  outline: 2px solid var(--mpc-ink);
  outline-offset: 2px;
}
body .mixora-product-card .mixora-product-card__button--muted {
  color: var(--mpc-muted) !important;
}
/* Add to cart chaplay loading / added obostha */
body .mixora-product-card .mixora-product-card__button.loading {
  opacity: 0.6;
  pointer-events: none;
}
body .mixora-product-card .mixora-product-card__button.loading::after,
body .mixora-product-card .mixora-product-card__button.added::after {
  display: none !important;
}
/* Cart e jog howar por button-i "View Cart" (product-card.php er JS) —
 * kalo bhora, tai bojha jay. WooCommerce er alada link lukano. */
body .mixora-product-card .mixora-product-card__button.is-in-cart {
  background: var(--mpc-ink) !important;
  border-color: var(--mpc-ink) !important;
  color: #ffffff !important;
}
body .mixora-product-card .added_to_cart {
  display: none !important;
}

/* ---------- Grid: shob jaygay ek maap ----------
 * Desktop 4, tablet 3, mobile 2 column. */
.mixora-product-tabs__grid,
.mixora-new-arrivals__grid,
.mxswpf-root .mixora-product-grid,
body ul.products:has(> .mixora-product-card) {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 36px 24px !important;
  margin: 0 !important;
  padding: 0 !important;
}
body ul.products:has(> .mixora-product-card)::before,
body ul.products:has(> .mixora-product-card)::after {
  display: none !important;   /* WooCommerce er clearfix grid e fake cell banay */
}
body ul.products > li.mixora-product-card {
  width: auto !important;
  float: none !important;
}

@media (max-width: 1024px) {
  .mixora-product-card {
    --mpc-title: 14.5px;
  }
  .mixora-product-tabs__grid,
  .mixora-new-arrivals__grid,
  .mxswpf-root .mixora-product-grid,
  body ul.products:has(> .mixora-product-card) {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 28px 18px !important;
  }
}

@media (max-width: 767px) {
  .mixora-product-card {
    --mpc-title: 13.5px;
    --mpc-price: 15px;
    --mpc-btn-h: 40px;
  }
  body .mixora-product-card .mixora-product-card__body {
    padding-top: 10px !important;
  }
  body .mixora-product-card .mixora-product-card__badge {
    font-size: 10px;
    letter-spacing: 1px;
  }
  body .mixora-product-card .mixora-product-card__price {
    margin-bottom: 10px !important;
  }
  body .mixora-product-card .mixora-product-card__button {
    font-size: 11.5px !important;
    letter-spacing: 0.4px !important;
    padding: 0 8px !important;
  }
  body .mixora-product-card .mixora-product-card__flag {
    top: 8px;
    left: 8px;
    padding: 4px 6px;
    font-size: 9.5px;
  }
  .mixora-product-tabs__grid,
  .mixora-new-arrivals__grid,
  .mxswpf-root .mixora-product-grid,
  body ul.products:has(> .mixora-product-card) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px 12px !important;
  }
}

/* ---------- Product page "related" carousel (Elementor loop item) ----------
 * Slide er bhitore [mixora_product_card] — card ta slide er puro uchchota ney. */
.e-loop-item .mixora-product-card {
  height: 100%;
}
.e-loop-item .elementor-widget-shortcode,
.e-loop-item .elementor-widget-shortcode > .elementor-widget-container,
.e-loop-item .elementor-shortcode {
  height: 100%;
}