:root {
  --background: #ffffff;
  --foreground: #111111;
  --muted-foreground: #71717a;
  --cream-white: #ffffff;
  --cream-classic: #fbf9f4; /* ক্লাসিক লেআউটের ইমেজের ব্যাকগ্রাউন্ড */
  --charcoal: #1e1e24;
  --border: rgba(24, 24, 27, 0.08);
  --gold: #d4af37;
  --gold-deep: #aa8413;
  --success: #16a34a;
  --destructive: #dc2626;
  --font-display: "Playfair Display", Georgia, serif;
  --font-sans: system-ui, -apple-system, sans-serif;
}

/* Grid Framework */
.mpc-product-grid {
  display: grid;
  grid-template-columns: repeat(var(--grid-cols, 4), minmax(0, 1fr));
  column-gap: 24px;
  row-gap: 40px;
  width: 100%;
  margin: 32px 0;
  box-sizing: border-box;
}

/* Responsive Rules */
@media (max-width: 1024px) {
  .mpc-product-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    row-gap: 36px;
  }
}
@media (max-width: 768px) {
  .mpc-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 16px;
    row-gap: 32px;
  }
}
@media (max-width: 639px) {
  .mpc-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 12px;
    row-gap: 28px;
  }
  .mpc-layout-luxury .product-card {
    border-radius: 16px !important;
  }
  .mpc-layout-luxury .product-media-wrapper {
    border-radius: 12px 12px 0 0 !important;
  }
  .mpc-layout-classic .product-media-wrapper {
    border-radius: 12px !important;
  }
  .mpc-product-grid .product-title {
    font-size: 15px !important;
  }
  .mpc-product-grid .btn-quick-add {
    font-size: 9px !important;
    padding: 8px 4px !important;
    letter-spacing: 0.05em !important;
  }
}

/* Base Card Logic */
.mpc-product-grid * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
.mpc-product-grid .product-card {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.mpc-product-grid .product-media-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}
.mpc-product-grid .mpc-media-link {
  display: block;
  width: 100%;
  height: 100%;
}
.mpc-product-grid .product-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 900ms cubic-bezier(0.2, 0.8, 0.2, 1);
}
.mpc-product-grid .product-image.hover-layer {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 700ms ease;
}
.mpc-product-grid .vignette-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(30, 30, 36, 0.15),
    transparent,
    transparent
  );
  opacity: 0;
  transition: opacity 500ms ease;
  pointer-events: none;
}

.mpc-product-grid .product-card:hover .product-image {
  transform: scale(1.04);
}
.mpc-product-grid .product-card:hover .product-image.hover-layer {
  opacity: 1;
}
.mpc-product-grid .product-card:hover .vignette-overlay {
  opacity: 1;
}

/* ==========================================================================
   TYPE 1: LUXURY LAYOUT (সাদা ব্যাকগ্রাউন্ড, রাউন্ডেড কার্ড, টপ রাউন্ডেড ইমেজ)
   ========================================================================== */
.mpc-layout-luxury .product-card {
  background-color: var(--cream-white);
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid var(--border);
  transition:
    transform 400ms cubic-bezier(0.25, 0.46, 0.45, 0.94),
    box-shadow 400ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.mpc-layout-luxury .product-card:hover {
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.06);
}
.mpc-layout-luxury .product-media-wrapper {
  border-radius: 23px 23px 0 0; /* শুধুমাত্র উপরে রাউন্ডেড */
}
.mpc-layout-luxury .product-details {
  padding: 20px 16px 20px 16px;
}

/* ==========================================================================
   TYPE 2: CLASSIC LAYOUT (কোন ব্যাকগ্রাউন্ড নেই, চারদিকে রাউন্ডেড ইমেজ)
   ========================================================================== */
.mpc-layout-classic .product-card {
  background-color: transparent !important; /* কোনো ব্যাকগ্রাউন্ড থাকবে না */
  border: none;
}
.mpc-layout-classic .product-media-wrapper {
  border-radius: 20px !important; /* চারদিকে সমান রাউন্ডেড ইমেজ */
  background-color: var(--cream-classic);
  outline: 1px solid var(--border);
}
.mpc-layout-classic .product-details {
  padding: 16px 4px 0 4px; /* কন্টেন্ট এরিয়া ফ্লাশ ডাউন */
}

/* Common Details & Inner Components */
.mpc-product-grid .rating-row {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: var(--muted-foreground);
  margin-bottom: 6px;
  flex-wrap: wrap;
}
.mpc-product-grid .rating-score {
  font-weight: 500;
  color: rgba(17, 17, 17, 0.8);
}
.mpc-product-grid .category-tag {
  margin-left: auto;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--gold-deep);
  font-weight: 600;
}
.mpc-product-grid .product-title-link {
  text-decoration: none;
  display: block;
}
.mpc-product-grid .product-title {
  font-family: var(--font-display);
  font-size: 16px;
  line-height: 1.25;
  color: var(--foreground);
  font-weight: 400;
  font-style: normal;
  margin-bottom: 6px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mpc-product-grid .product-tagline {
  font-size: 13px;
  color: var(--muted-foreground);
  margin-bottom: 8px;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Badges & Buttons Shared styling */
.mpc-product-grid .badge-stack-left {
  position: absolute;
  top: 12px;
  left: 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  z-index: 2;
}
.mpc-product-grid .badge {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  padding: 4px 10px;
  border-radius: 9999px;
  width: max-content;
}
.mpc-product-grid .badge-dark {
  background-color: var(--charcoal);
  color: #ffffff;
}
.mpc-product-grid .badge-sale {
  position: absolute;
  top: 12px;
  right: 12px;
  background-color: var(--gold);
  color: var(--charcoal);
  font-size: 10px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 9999px;
  letter-spacing: 0.05em;
  z-index: 2;
}
.mpc-product-grid .oos-overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(255, 255, 255, 0.7);
  display: grid;
  place-items: center;
  z-index: 3;
}
.mpc-product-grid .oos-text {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-weight: 600;
  color: var(--foreground);
}

.mpc-product-grid .btn-wishlist {
  position: absolute;
  right: 12px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background-color: rgba(255, 255, 255, 0.95);
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  transition: all 300ms ease;
  z-index: 4;
  color: var(--foreground);
}
.mpc-product-grid .btn-quick-add {
  position: absolute;
  bottom: 12px;
  left: 12px;
  right: 12px;
  background-color: var(--charcoal);
  color: #ffffff;
  border: none;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  padding: 12px;
  border-radius: 9999px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
  transition: all 300ms ease;
  z-index: 4;
  text-decoration: none;
}

@media (min-width: 640px) {
  .mpc-product-grid .btn-wishlist {
    bottom: 12px;
    opacity: 0;
    transform: translateY(4px);
  }
  .mpc-product-grid .product-card:hover .btn-wishlist {
    opacity: 1;
    transform: translateY(0);
  }
  .mpc-product-grid .btn-quick-add {
    right: 56px;
    opacity: 0;
    transform: translateY(4px);
  }
  .mpc-product-grid .product-card:hover .btn-quick-add {
    opacity: 1;
    transform: translateY(0);
  }
}


/*=====================
Phone Version
=======================*/

@media (max-width: 639px) {
  .mpc-product-grid .btn-wishlist {
    top: 12px;
    right: 12px;
    display:none;
  }
  .mpc-product-grid .has-sale-badge .btn-wishlist {
    top: 45px;
  }
  .mpc-product-grid .badge-dark{
      display:none;
  }
}



.mpc-product-grid .btn-quick-add:disabled {
  background-color: var(--muted-foreground);
  cursor: not-allowed;
  opacity: 0.8 !important;
}

/* Swatches & Pricing */
.mpc-product-grid .variant-container {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
  height: 14px;
}
.mpc-product-grid .variant-container-placeholder {
  height: 4px;
  margin-bottom: 0px;
}
.mpc-product-grid .swatch-group {
  display: flex;
}
.mpc-product-grid .swatch-node {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  outline: 1px solid var(--cream-white);
  margin-right: -4px;
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.mpc-layout-classic .swatch-node {
  outline: 1px solid #fff;
}
.mpc-product-grid .variant-label {
  font-size: 11px;
  color: var(--muted-foreground);
}


/*=====================================
=======================================*/

/*.mpc-product-grid .price-row-custom {*/
/*  display: flex;*/
/*  align-items: baseline;*/
/*  gap: 6px;*/
/*  line-height: 1;*/
/*  flex-wrap: wrap;*/
/*  margin-top: 0px;*/
/*}*/
/*.mpc-product-grid .price-row-custom .current-price,*/
/*.mpc-product-grid .price-row-custom .woocommerce-Price-amount {*/
/*  font-size: 16px;*/
/*  font-weight: 600;*/
/*  color: var(--foreground);*/
/*  letter-spacing: -0.01em;*/
/*}*/
/*.mpc-product-grid .price-row-custom .old-price,*/
/*.mpc-product-grid .price-row-custom del .woocommerce-Price-amount {*/
/*  font-size: 10px !important;*/
/*  color: var(--muted-foreground);*/
/*  text-decoration: line-through;*/
/*  font-weight: 400;*/
/*}*/
/*.mpc-product-grid .price-row-custom ins {*/
/*  background: none;*/
/*  text-decoration: none;*/
/*}*/
/*.mpc-product-grid .price-row-custom .save-amount {*/
/*  font-size: 12px;*/
/*  color: var(--success);*/
/*  font-weight: 600;*/
/*  margin-left: auto;*/
/*}*/



/*==================================*/

/* Pricing Row - মেইন কন্টেইনার */
.mpc-product-grid .price-row-custom {
  display: flex;
  align-items: baseline;
  gap: 8px;
  line-height: 1;
  flex-wrap: wrap;
  margin-top: 0px;
}

/* ১. সেল প্রাইস / বর্তমান দাম (Sale / Current Price) */
.mpc-product-grid .price-row-custom .current-price,
.mpc-product-grid .price-row-custom .current-price .woocommerce-Price-amount {
  font-size: 16px; /* আপনার পছন্দমতো সাইজ দিন */
  font-weight: 600; /* ফন্ট কতটুকু মোটা হবে */
  color: #111111;  /* টেক্সট কালার (যেমন: ডার্ক/ব্ল্যাক) */
  letter-spacing: -0.01em;
}

/* ২. রেগুলার প্রাইস / আগের কেটে দেওয়া দাম (Regular / Old Price) */
.mpc-product-grid .price-row-custom .old-price,
.mpc-product-grid .price-row-custom .old-price .woocommerce-Price-amount,
.mpc-product-grid .price-row-custom del .woocommerce-Price-amount {
  font-size: 13px; /* সাইজ কিছুটা ছোট রাখতে পারেন */
  color: #888888;  /* হালকা ছাই/গ্রে কালার */
  text-decoration: line-through; /* মাঝখানে দাগ দেওয়া */
  font-weight: 400;
}

/* ৩. কত টাকা সেভ হলো (Save Amount Badge/Text) */
.mpc-product-grid .price-row-custom .save-amount {
  font-size: 11px; /* ছোট নোটিফিকেশন টেক্সটের মতো সাইজ */
  font-weight: 600;
  color: #16a34a;  /* সবুজ কালার (চাইলে ব্যাকগ্রাউন্ডও দিতে পারেন) */
  background-color: #f0fdf4; /* হালকা সবুজ ব্যাকগ্রাউন্ড (ঐচ্ছিক) */
  padding: 3px 6px;
  border-radius: 4px;
  margin-left: auto; /* ডানপাশে অ্যালাইন করার জন্য */
}

/* রেগুলার ও সেলে ইন্সপেকশন ফিক্স (WooCommerce default strikethrough reset) */
.mpc-product-grid .price-row-custom ins {
  background: none;
  text-decoration: none;
}