/* ============================================================
   IPMCKART — PRODUCT DETAIL PAGE PREMIUM REDESIGN
   Matches reference layout from SEO specialist (Product page.png)
   Brand: Red #e5101a on clean warm-white canvas
   Fonts: Barlow Condensed (display) + Figtree (body)
   OKLCH color system — perceptually uniform, matches category-page-premium.css
   ============================================================ */

/* ── Design tokens (hex fallback for legacy browsers; OKLCH where supported) ── */
:root {
  --pdp-bg:           #f7f3f3;
  --pdp-surface:      #ffffff;
  --pdp-surface-alt:  #f8f6f6;
  --pdp-red:          #e5101a;
  --pdp-red-dark:     #b50c14;
  --pdp-red-light:    #fde2e3;
  --pdp-green:        #2ea063;
  --pdp-green-light:  #e3f7ec;
  --pdp-text-1:       #1a1518;
  --pdp-text-2:       #5a5559;
  --pdp-text-3:       #94888e;
  --pdp-border:       #ede7ea;
  --pdp-border-strong:#d6cdd1;
  --pdp-shadow-sm:    0 2px 8px rgba(26, 21, 24, 0.06);
  --pdp-shadow-md:    0 4px 20px rgba(26, 21, 24, 0.10);
  --pdp-shadow-lg:    0 8px 40px rgba(26, 21, 24, 0.13);
  --pdp-radius:       12px;
  --pdp-radius-sm:    8px;
  --pdp-font-display: 'Barlow Condensed', 'Montserrat', sans-serif;
  --pdp-font-body:    'Figtree', 'Poppins', sans-serif;
}

/* ── OKLCH perceptual-uniformity layer (browsers with support) ── */
@supports (color: oklch(0% 0% 0)) {
  :root {
    --pdp-bg:           oklch(0.97 0.004 25);
    --pdp-surface:      oklch(1.00 0.000 0);
    --pdp-surface-alt:  oklch(0.975 0.005 25);
    --pdp-red:          oklch(0.48 0.220 25);
    --pdp-red-dark:     oklch(0.38 0.200 25);
    --pdp-red-light:    oklch(0.95 0.030 25);
    --pdp-green:        oklch(0.52 0.17 145);
    --pdp-green-light:  oklch(0.95 0.05 145);
    --pdp-text-1:       oklch(0.18 0.012 25);
    --pdp-text-2:       oklch(0.42 0.012 25);
    --pdp-text-3:       oklch(0.62 0.008 25);
    --pdp-border:       oklch(0.89 0.006 25);
    --pdp-border-strong:oklch(0.80 0.010 25);
    --pdp-shadow-sm:    0 2px 8px oklch(0.18 0.012 25 / 0.06);
    --pdp-shadow-md:    0 4px 20px oklch(0.18 0.012 25 / 0.10);
    --pdp-shadow-lg:    0 8px 40px oklch(0.18 0.012 25 / 0.13);
  }
}

/* ── Page background ─────────────────────────────────────── */
.main {
  background-color: var(--pdp-bg) !important;
}

/* ── Breadcrumb ──────────────────────────────────────────── */
.breadcrumb-nav {
  margin-bottom: 18px !important;
  margin-top: 4px !important;
}
.breadcrumb {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 2px !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
}
.breadcrumb-item {
  display: inline-flex !important;
  align-items: center !important;
}
.breadcrumb-item a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  color: var(--pdp-text-3) !important;
  text-decoration: none !important;
  padding: 3px 4px !important;
  border-radius: 4px !important;
  transition: color 0.18s ease, background 0.18s ease !important;
}
.breadcrumb-item a:hover,
.breadcrumb-item a:focus-visible {
  color: var(--pdp-red) !important;
  background: var(--pdp-red-light) !important;
}
.breadcrumb-item a:focus-visible {
  outline: 2px solid var(--pdp-red) !important;
  outline-offset: 1px !important;
}
.breadcrumb-item a .ipmc-icon { width: 14px !important; height: 14px !important; fill: currentColor !important; }
.breadcrumb-item.active {
  color: var(--pdp-text-1) !important;
  font-weight: 600 !important;
  max-width: 320px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
/* Replace Bootstrap's "/" separator with a chevron glyph */
.breadcrumb-item + .breadcrumb-item { padding-left: 0 !important; }
.breadcrumb-item + .breadcrumb-item::before {
  content: "\203A" !important;          /* › single right-angle quote */
  color: var(--pdp-text-3) !important;
  font-size: 15px !important;
  line-height: 1 !important;
  padding: 0 6px !important;
  opacity: 0.7 !important;
}

/* ── Trust strip ─────────────────────────────────────────── */
.pdp-trust-strip {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 12px !important;
  background: var(--pdp-surface) !important;
  border: 1px solid var(--pdp-border) !important;
  border-radius: var(--pdp-radius) !important;
  padding: 16px 20px !important;
  margin-bottom: 20px !important;
  box-shadow: var(--pdp-shadow-sm) !important;
}
.pdp-trust-cell {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-family: var(--pdp-font-body) !important;
}
.pdp-trust-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  border-radius: 50% !important;
  background: var(--pdp-red-light) !important;
  line-height: 0 !important;          /* kill glyph baseline gap if any text node remains */
}
/* SVG sprite icon centered + sized inside the circle (replaces tiny entity glyphs) */
.pdp-trust-icon .ipmc-icon,
.pdp-trust-icon svg {
  width: 22px !important;
  height: 22px !important;
  display: block !important;
  fill: var(--pdp-red) !important;
  color: var(--pdp-red) !important;
}
.pdp-trust-cell strong {
  display: block !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: var(--pdp-text-1) !important;
  line-height: 1.2 !important;
  font-family: var(--pdp-font-body) !important;
}
.pdp-trust-cell span {
  display: block !important;
  font-size: 1rem !important;
  color: var(--pdp-text-3) !important;
  line-height: 1.3 !important;
  margin-top: 2px !important;
}

/* ── Product single container card ──────────────────────── */
.product-single-container {
  background: var(--pdp-surface) !important;
  border-radius: var(--pdp-radius) !important;
  border: 1px solid var(--pdp-border) !important;
  box-shadow: var(--pdp-shadow-md) !important;
  padding: 28px 28px 24px !important;
  margin-bottom: 0 !important;
}

/* ── Gallery: vertical thumbnail strip on LEFT ───────────── */
.product-single-gallery {
  display: flex !important;
  flex-direction: row !important;
  gap: 10px !important;
  align-items: flex-start !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* Push thumbnails to the left of the main image */
.prod-thumbnail.owl-dots {
  display: flex !important;
  flex-direction: column !important;
  width: 72px !important;
  min-width: 72px !important;
  max-width: 72px !important;
  gap: 6px !important;
  order: -1 !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: center !important;
}

.prod-thumbnail.owl-dots .owl-dot {
  display: flex !important;
  width: 68px !important;
  height: 68px !important;
  min-height: 68px !important;
  border: 2px solid var(--pdp-border) !important;
  border-radius: var(--pdp-radius-sm) !important;
  overflow: hidden !important;
  cursor: pointer !important;
  background: var(--pdp-surface) !important;
  transition: border-color 0.2s ease !important;
  margin: 0 !important;
  padding: 0 !important;
}
.prod-thumbnail.owl-dots .owl-dot span {
  display: none !important;
}
.prod-thumbnail.owl-dots .owl-dot img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  padding: 4px !important;
}
.prod-thumbnail.owl-dots .owl-dot.active,
.prod-thumbnail.owl-dots .owl-dot:hover {
  border-color: var(--pdp-red) !important;
}

/* Main image carousel stage */
.product-slider-container {
  flex: 1 !important;
  min-width: 0 !important;
  background: var(--pdp-surface) !important;
  border: 1px solid var(--pdp-border) !important;
  border-radius: var(--pdp-radius) !important;
  overflow: hidden !important;
  position: relative !important;
}

.product-single-image {
  max-height: 520px !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  object-fit: contain !important;
  display: block !important;
  padding: 12px !important;
}

.owl-item .product-item {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 360px !important;
  padding: 16px !important;
}

/* Hide default owl carousel dots (we use custom thumb container) */
.product-single-gallery .owl-dots {
  display: none !important;
}

/* ── Product details panel ───────────────────────────────── */
.product-single-details {
  font-family: var(--pdp-font-body) !important;
  padding-left: 24px !important;
}

/* ── Brand badge ─────────────────────────────────────────── */
.pdp-brand-badge {
  display: inline-block !important;
  padding: 3px 12px !important;
  border-radius: 20px !important;
  background: var(--pdp-red-light) !important;
  color: var(--pdp-red) !important;
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  margin-bottom: 8px !important;
}

.product-single-details .product-title {
  font-family: var(--pdp-font-display) !important;
  font-size: clamp(1.5rem, 2.5vw, 2rem) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  color: var(--pdp-text-1) !important;
  letter-spacing: -0.01em !important;
  margin-bottom: 10px !important;
}

/* ── Ratings ─────────────────────────────────────────────── */
.ratings-container {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-bottom: 10px !important;
  flex-wrap: wrap !important;
}
.ratings-container .product-ratings {
  font-size: 16px !important;
}
.ratings-container .product-ratings::before {
  color: oklch(0.88 0.06 80) !important;
}
.ratings-container .ratings::before {
  color: oklch(0.72 0.15 65) !important;
}
.rating-link {
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  color: var(--pdp-red) !important;
  text-decoration: none !important;
}
.rating-link:hover {
  text-decoration: underline !important;
}
.rating-sep {
  color: var(--pdp-border-strong) !important;
  font-size: 1rem !important;
  margin: 0 2px !important;
}
.write-review-link {
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  color: var(--pdp-text-2) !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
}
.write-review-link:hover {
  color: var(--pdp-red) !important;
  text-decoration: underline !important;
}

/* ── Stock badges ────────────────────────────────────────── */
.pdp-stock-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  padding: 5px 14px !important;
  border-radius: 20px !important;
  margin-bottom: 8px !important;
}
.pdp-in-stock {
  background: var(--pdp-green-light) !important;
  color: var(--pdp-green) !important;
}
.pdp-out-stock {
  background: var(--pdp-red-light) !important;
  color: var(--pdp-red) !important;
}
.pdp-stock-badge .ipmc-icon {
  width: 16px !important;
  height: 16px !important;
}

/* Stock status */
.product-stock-status {
  margin-bottom: 14px !important;
}
.product-stock-status span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  padding: 4px 12px !important;
  border-radius: 20px !important;
}
/* In stock */
.product-stock-status span[style*="22c55e"] {
  background: var(--pdp-green-light) !important;
  color: var(--pdp-green) !important;
}
/* Out of stock */
.product-stock-status span[style*="ef4444"] {
  background: var(--pdp-red-light) !important;
  color: var(--pdp-red) !important;
}

/* ── Price box ───────────────────────────────────────────── */
.price-box {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  margin: 14px 0 16px !important;
  padding: 14px 16px !important;
  background: var(--pdp-red-light) !important;
  border-radius: var(--pdp-radius-sm) !important;
}

.new-price,
.product-price {
  font-family: var(--pdp-font-display) !important;
  font-size: clamp(1.8rem, 3vw, 2.4rem) !important;
  font-weight: 800 !important;
  color: var(--pdp-red) !important;
  letter-spacing: -0.02em !important;
  line-height: 1 !important;
}

.old-price {
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  color: var(--pdp-text-3) !important;
  text-decoration: line-through !important;
  font-weight: 400 !important;
}

/* Short divider */
.short-divider {
  border-color: var(--pdp-border) !important;
  margin: 10px 0 !important;
}

/* ── Short description / features ───────────────────────── */
.luxury-short-desc {
  border-radius: var(--pdp-radius-sm) !important;
  border: 1px solid var(--pdp-border) !important;
  box-shadow: none !important;
  margin: 12px 0 !important;
}

/* ── SKU / Category info ─────────────────────────────────── */
.single-info-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 8px 0 12px !important;
  display: flex !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}
.single-info-list li {
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  color: var(--pdp-text-3) !important;
}
.single-info-list li strong,
.single-info-list li a {
  font-weight: 600 !important;
  color: var(--pdp-text-2) !important;
}

/* ── CTA Stack ───────────────────────────────────────────── */
.product-action {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-top: 14px !important;
}

.product-single-qty {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
}

.product-single-qty input,
.product-single-qty .horizontal-quantity {
  width: 80px !important;
  border: 1.5px solid var(--pdp-border-strong) !important;
  border-radius: var(--pdp-radius-sm) !important;
  padding: 10px 12px !important;
  font-family: var(--pdp-font-body) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--pdp-text-1) !important;
  text-align: center !important;
  background: var(--pdp-surface) !important;
}
.product-single-qty input:focus {
  border-color: var(--pdp-red) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px oklch(0.48 0.220 25 / 0.12) !important;
}

/* ── Add to Cart button (filled brand red) ───────────────── */
.pdp-add-cart-btn,
button.add-cart,
a.add-cart {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 16px 24px !important;
  background: var(--pdp-red) !important;
  border: 2px solid var(--pdp-red) !important;
  border-radius: var(--pdp-radius-sm) !important;
  color: white !important;
  font-family: var(--pdp-font-display) !important;
  font-size: 1.2rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.15s ease !important;
  cursor: pointer !important;
  text-decoration: none !important;
  box-shadow: 0 2px 8px rgba(229, 16, 26, 0.25) !important;
}
.pdp-add-cart-btn:hover,
button.add-cart:hover,
a.add-cart:hover {
  background: var(--pdp-red-dark) !important;
  border-color: var(--pdp-red-dark) !important;
  transform: translateY(-1px) !important;
  color: white !important;
  box-shadow: 0 4px 16px rgba(229, 16, 26, 0.35) !important;
}
.pdp-add-cart-btn:focus-visible,
button.add-cart:focus-visible,
a.add-cart:focus-visible {
  outline: 3px solid var(--pdp-red) !important;
  outline-offset: 2px !important;
}
.pdp-add-cart-btn:active,
button.add-cart:active,
a.add-cart:active {
  transform: translateY(0) !important;
}
.pdp-add-cart-btn .ipmc-icon { width: 20px !important; height: 20px !important; fill: #fff !important; }

/* View cart link (hidden by default, revealed after add) */
.view-cart {
  border-radius: var(--pdp-radius-sm) !important;
  font-family: var(--pdp-font-body) !important;
  font-weight: 600 !important;
}

/* ── Buy Now button (filled green accent) ────────────────── */
.pdp-buy-now-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 16px 24px !important;
  background: var(--pdp-green) !important;
  border: 2px solid var(--pdp-green) !important;
  border-radius: var(--pdp-radius-sm) !important;
  color: #fff !important;
  font-family: var(--pdp-font-display) !important;
  font-size: 1.2rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  cursor: pointer !important;
  transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
  box-shadow: 0 2px 8px rgba(46, 160, 99, 0.3) !important;
}
.pdp-buy-now-btn:hover {
  background: #238a4e !important;
  border-color: #238a4e !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 16px rgba(46, 160, 99, 0.35) !important;
  color: #fff !important;
}
.pdp-buy-now-btn:focus-visible {
  outline: 3px solid var(--pdp-green) !important;
  outline-offset: 2px !important;
}
.pdp-buy-now-btn:active {
  transform: translateY(0) !important;
}
.pdp-buy-now-btn .ipmc-icon { width: 20px !important; height: 20px !important; fill: #fff !important; }

/* ── Injected: WhatsApp CTA button (outlined per spec) ──── */
.pdp-whatsapp-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 16px 24px !important;
  background: transparent !important;
  border: 2px solid var(--pdp-border-strong) !important;
  border-radius: var(--pdp-radius-sm) !important;
  color: var(--pdp-text-1) !important;
  font-family: var(--pdp-font-display) !important;
  font-size: 1.2rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-sizing: border-box !important;
}
.pdp-whatsapp-btn:hover {
  background: #25d366 !important;
  border-color: #25d366 !important;
  color: #fff !important;
  text-decoration: none !important;
  transform: translateY(-1px) !important;
}
.pdp-whatsapp-btn:focus-visible {
  outline: 3px solid var(--pdp-green) !important;
  outline-offset: 2px !important;
}
.pdp-whatsapp-btn .ipmc-icon,
.pdp-whatsapp-btn svg { width: 20px !important; height: 20px !important; fill: currentColor !important; }
.pdp-whatsapp-btn:hover .ipmc-icon,
.pdp-whatsapp-btn:hover svg { fill: #fff !important; }

/* ── Wishlist / Share / Compare row ─────────────────────── */
.product-single-share {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--pdp-border) !important;
  margin-top: 16px !important;
  flex-wrap: wrap !important;
}
.product-single-share .social-icon {
  opacity: 0.65 !important;
  transition: opacity 0.2s !important;
}
.product-single-share .social-icon:hover { opacity: 1 !important; }

.pdp-share-icons {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-left: auto !important;
}

.btn-icon-action {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: var(--pdp-text-2) !important;
  text-decoration: none !important;
  transition: color 0.2s, transform 0.15s !important;
  cursor: pointer !important;
  padding: 6px 10px !important;
  border-radius: var(--pdp-radius-sm) !important;
}
.btn-icon-action:hover { color: var(--pdp-red) !important; background: var(--pdp-red-light) !important; transform: translateY(-1px) !important; }
.btn-icon-action .ipmc-icon { width: 20px !important; height: 20px !important; }

.add-compare .ipmc-icon { fill: currentColor !important; }
.add-wishlist .ipmc-icon { fill: currentColor !important; }
.add-wishlist:hover { color: var(--pdp-red) !important; }

/* ═══════════════════════════════════════════════════════════
   FEATURES + SPECIFICATIONS 2-COLUMN CARDS
   ═══════════════════════════════════════════════════════════ */
.pdp-features-specs-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  margin-top: 24px !important;
  padding-top: 24px !important;
  border-top: 1px solid var(--pdp-border) !important;
  font-size: 1.3rem !important;
}

.pdp-features-card,
.pdp-specs-card {
  background: var(--pdp-surface-alt) !important;
  border: 1px solid var(--pdp-border) !important;
  border-radius: var(--pdp-radius) !important;
  padding: 20px 24px !important;
}

.pdp-card-heading {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: var(--pdp-font-display) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: var(--pdp-text-1) !important;
  margin: 0 0 16px !important;
  padding-bottom: 12px !important;
  border-bottom: 2px solid var(--pdp-border) !important;
}
.pdp-card-heading .ipmc-icon { color: var(--pdp-red) !important; width: 20px !important; height: 20px !important; }

/* Features list */
.pdp-features-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
.pdp-features-list li {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  font-family: var(--pdp-font-body) !important;
  font-size: inherit !important;
  line-height: 1.5 !important;
  color: var(--pdp-text-2) !important;
}
.pdp-feat-icon {
  flex-shrink: 0 !important;
  margin-top: 2px !important;
}
.pdp-feat-icon .ipmc-icon {
  width: 16px !important;
  height: 16px !important;
  fill: var(--pdp-green) !important;
  color: var(--pdp-green) !important;
}
.pdp-feat-text strong {
  color: var(--pdp-text-1) !important;
  font-weight: 600 !important;
}

/* Specs table */
.pdp-specs-table {
  width: 100% !important;
  border-collapse: collapse !important;
}
.pdp-specs-table tbody tr {
  border-bottom: 1px solid var(--pdp-border) !important;
}
.pdp-specs-table tbody tr:last-child {
  border-bottom: none !important;
}
.pdp-specs-table td {
  padding: 9px 0 !important;
  font-family: var(--pdp-font-body) !important;
  font-size: inherit !important;
  vertical-align: top !important;
}
.pdp-spec-label {
  font-weight: 600 !important;
  color: var(--pdp-text-1) !important;
  width: 40% !important;
  min-width: 110px !important;
}
.pdp-spec-value {
  color: var(--pdp-text-2) !important;
}

.pdp-features-specs-row--single {
  grid-template-columns: 1fr !important;
}

.pdp-features-specs-row--single .pdp-features-card {
  grid-column: 1 / -1 !important;
}

/* ═══════════════════════════════════════════════════════════
   PAYMENT + TRUST BADGES 2-COLUMN CARDS
   ═══════════════════════════════════════════════════════════ */
.pdp-payment-trust-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  margin-top: 16px !important;
}

.pdp-payment-card,
.pdp-trust-card {
  background: var(--pdp-surface-alt) !important;
  border: 1px solid var(--pdp-border) !important;
  border-radius: var(--pdp-radius) !important;
  padding: 20px 24px !important;
}

.pdp-trust-badges {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}
.pdp-trust-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 14px !important;
  border-radius: 20px !important;
  background: var(--pdp-surface) !important;
  border: 1px solid var(--pdp-border) !important;
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: var(--pdp-text-2) !important;
}
.pdp-trust-badge .ipmc-icon {
  width: 14px !important;
  height: 14px !important;
  fill: var(--pdp-green) !important;
  color: var(--pdp-green) !important;
}

/* ═══════════════════════════════════════════════════════════
   WARRANTY & REFUND BANNER
   ═══════════════════════════════════════════════════════════ */
.pdp-warranty-banner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  margin-top: 16px !important;
  padding: 20px 24px !important;
  background: linear-gradient(135deg, var(--pdp-surface-alt), var(--pdp-surface)) !important;
  border: 1px solid var(--pdp-border) !important;
  border-radius: var(--pdp-radius) !important;
}
.pdp-warranty-content {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  flex: 1 !important;
}
.pdp-warranty-content > .ipmc-icon {
  width: 40px !important;
  height: 40px !important;
  color: var(--pdp-red) !important;
  flex-shrink: 0 !important;
  background: var(--pdp-red-light) !important;
  border-radius: 50% !important;
  padding: 8px !important;
}
.pdp-warranty-text {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
.pdp-warranty-text strong {
  font-family: var(--pdp-font-display) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: var(--pdp-text-1) !important;
}
.pdp-warranty-text span {
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  color: var(--pdp-text-3) !important;
  line-height: 1.5 !important;
}
.pdp-warranty-badge {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 72px !important;
  height: 72px !important;
  border-radius: 50% !important;
  background: var(--pdp-red) !important;
  color: #fff !important;
  flex-shrink: 0 !important;
}
.pdp-warranty-years {
  font-family: var(--pdp-font-display) !important;
  font-size: 1.6rem !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  letter-spacing: -0.02em !important;
}
.pdp-warranty-label {
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  text-align: center !important;
  line-height: 1.2 !important;
  margin-top: 2px !important;
}

/* ── Divider between gallery+details and sections ──────── */
.divider {
  border-color: var(--pdp-border) !important;
  margin: 0 !important;
}

/* ── Payment methods strip ───────────────────────────────── */
.pdp-payment-section {
  background: var(--pdp-surface) !important;
  border: 1px solid var(--pdp-border) !important;
  border-radius: var(--pdp-radius) !important;
  box-shadow: var(--pdp-shadow-sm) !important;
  margin-top: 16px !important;
  padding: 0 !important;
}

.pdp-payment-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  padding: 16px 24px !important;
  flex-wrap: wrap !important;
}

.pdp-payment-header {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: var(--pdp-font-display) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: var(--pdp-text-1) !important;
  white-space: nowrap !important;
}

.pdp-payment-header i {
  color: var(--pdp-green) !important;
  font-size: 15px !important;
}

.pdp-payment-icons {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}

.pdp-payment-icons img {
  height: 28px !important;
  width: auto !important;
  opacity: 0.85 !important;
  transition: opacity 0.2s !important;
  filter: grayscale(15%) !important;
}
.pdp-payment-icons img:hover {
  opacity: 1 !important;
  filter: grayscale(0%) !important;
}

/* ── Customer Reviews section ────────────────────────────── */
.pdp-reviews-section {
  background: var(--pdp-surface) !important;
  border: 1px solid var(--pdp-border) !important;
  border-radius: var(--pdp-radius) !important;
  box-shadow: var(--pdp-shadow-sm) !important;
  margin-top: 16px !important;
  padding: 28px 28px 32px !important;
}

.pdp-reviews-heading {
  font-family: var(--pdp-font-display) !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  color: var(--pdp-text-1) !important;
  text-transform: uppercase !important;
  margin-bottom: 24px !important;
  padding-bottom: 14px !important;
  border-bottom: 2px solid var(--pdp-border) !important;
}

.pdp-reviews-layout {
  display: grid !important;
  grid-template-columns: 280px 1fr !important;
  gap: 32px !important;
  align-items: flex-start !important;
}

/* Rating summary card */
.pdp-rating-summary {
  background: var(--pdp-surface-alt) !important;
  border: 1px solid var(--pdp-border) !important;
  border-radius: var(--pdp-radius) !important;
  padding: 24px !important;
  text-align: center !important;
}

.pdp-rating-score {
  font-family: var(--pdp-font-display) !important;
  font-size: 4rem !important;
  font-weight: 800 !important;
  color: var(--pdp-text-1) !important;
  line-height: 1 !important;
  margin-bottom: 8px !important;
  letter-spacing: -0.03em !important;
}
/* Visible "sample data" badge on the aggregate card while data is still static placeholder.
 * Note to future devs: review JS must removeAttribute('data-rating-aggregate-placeholder')
 * on .pdp-rating-summary once real aggregate data loads — this hides the badge. */
.pdp-rating-summary[data-rating-aggregate-placeholder="true"] .pdp-rating-score {
  position: relative;
  opacity: 0.7;
}
.pdp-rating-summary[data-rating-aggregate-placeholder="true"] .pdp-rating-score::before {
  content: "Sample data";
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--pdp-font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--pdp-text-2);
  background: var(--pdp-surface-alt);
  border: 1px solid var(--pdp-border);
  border-radius: var(--pdp-radius-sm);
  padding: 2px 8px;
  white-space: nowrap;
}

.pdp-rating-stars {
  display: flex !important;
  justify-content: center !important;
  gap: 3px !important;
  margin-bottom: 6px !important;
  font-size: 1.25rem !important;
}
.pdp-rating-stars .fas.fa-star,
.pdp-rating-stars .fas.fa-star-half-alt {
  color: oklch(0.72 0.15 65) !important;
}

.pdp-rating-label {
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  color: var(--pdp-text-3) !important;
  margin-bottom: 20px !important;
}

/* Rating bar chart */
.pdp-rating-bars {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
}

.pdp-bar-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  color: var(--pdp-text-2) !important;
}

.pdp-bar-row > span:first-child {
  width: 28px !important;
  text-align: right !important;
  flex-shrink: 0 !important;
}
.pdp-bar-row > span:last-child {
  width: 30px !important;
  text-align: left !important;
  flex-shrink: 0 !important;
}

.pdp-bar-track {
  flex: 1 !important;
  height: 7px !important;
  background: var(--pdp-border) !important;
  border-radius: 4px !important;
  overflow: hidden !important;
}

.pdp-bar-fill {
  height: 100% !important;
  background: oklch(0.72 0.15 65) !important;
  border-radius: 4px !important;
  transition: width 0.6s ease !important;
}

/* Reviews list */
.pdp-reviews-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

.pdp-reviews-empty {
  font-family: var(--pdp-font-body) !important;
  font-size: 14px !important;
  color: var(--pdp-text-3) !important;
  font-style: italic !important;
  padding: 32px 0 !important;
  text-align: center !important;
}

/* Individual review card */
.pdp-review-card {
  padding: 18px 20px !important;
  border: 1px solid var(--pdp-border) !important;
  border-radius: var(--pdp-radius-sm) !important;
  background: var(--pdp-surface) !important;
}
.pdp-review-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 8px !important;
}
.pdp-review-author {
  font-family: var(--pdp-font-body) !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  color: var(--pdp-text-1) !important;
}
.pdp-review-date {
  font-size: 1rem !important;
  color: var(--pdp-text-3) !important;
}
.pdp-review-stars {
  display: flex !important;
  gap: 2px !important;
  margin-bottom: 8px !important;
}
.pdp-review-stars i { color: oklch(0.72 0.15 65) !important; font-size: 13px !important; }
.pdp-review-text {
  font-family: var(--pdp-font-body) !important;
  font-size: 14px !important;
  color: var(--pdp-text-2) !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

/* ── Related products section tweaks ─────────────────────── */
.products-section {
  margin-top: 20px !important;
}
.products-section .section-title {
  font-family: var(--pdp-font-display) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
  color: var(--pdp-text-1) !important;
}

/* ── Mobile responsive ───────────────────────────────────── */
@media (max-width: 991px) {
  .pdp-trust-strip {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .product-single-details {
    padding-left: 0 !important;
    margin-top: 20px !important;
  }
  .product-single-container {
    padding: 20px 16px !important;
  }
  .pdp-features-specs-row,
  .pdp-payment-trust-row {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .pdp-warranty-banner {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
  }
  .pdp-warranty-badge {
    align-self: center !important;
  }
}

@media (max-width: 767px) {
  /* Gallery: stacked layout on mobile — thumbnails go below as horizontal row */
  .product-single-gallery {
    flex-direction: column !important;
  }
  .prod-thumbnail.owl-dots {
    flex-direction: row !important;
    order: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: unset !important;
    overflow-x: auto !important;
    gap: 8px !important;
    padding-bottom: 4px !important;
  }
  .prod-thumbnail.owl-dots .owl-dot {
    width: 60px !important;
    height: 60px !important;
    min-height: 60px !important;
    flex-shrink: 0 !important;
  }
  .pdp-trust-strip {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }
  .pdp-reviews-layout {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  .pdp-payment-inner {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
  .pdp-payment-icons {
    gap: 12px !important;
  }
  .pdp-reviews-section {
    padding: 20px 16px 24px !important;
  }
  .new-price, .product-price {
    font-size: 1.9rem !important;
  }
  .product-single-container {
    padding: 16px 12px !important;
  }
  .pdp-features-specs-row,
  .pdp-payment-trust-row {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .pdp-features-card,
  .pdp-specs-card,
  .pdp-payment-card,
  .pdp-trust-card {
    padding: 16px 18px !important;
  }
  .pdp-warranty-banner {
    padding: 16px 18px !important;
  }
  .product-single-share {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .pdp-share-icons {
    margin-left: 0 !important;
    width: 100% !important;
    justify-content: flex-start !important;
  }
  .pdp-add-cart-btn,
  .pdp-buy-now-btn,
  .pdp-whatsapp-btn {
    font-size: 1rem !important;
    padding: 12px 16px !important;
  }
}

@media (max-width: 480px) {
  .pdp-trust-strip {
    grid-template-columns: 1fr !important;
  }
  .pdp-card-heading {
    font-size: 1rem !important;
  }
}

/* ════════════════════════════════════════════════════════════
   PREMIUM RIGHT-PANEL POLISH (2026-06-26)
   Price savings pill · full-description readability · CTA stack
   focus rings · reduced-motion. White + brand-red only.
   ════════════════════════════════════════════════════════════ */

/* ── Price block: tabular figures + savings pill ─────────── */
.price-box {
  flex-wrap: wrap !important;
  gap: 8px 12px !important;
}
.new-price,
.product-price,
.old-price {
  font-variant-numeric: tabular-nums !important;
  font-feature-settings: "tnum" 1 !important;
}
.savings-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  background: var(--pdp-red) !important;
  color: #fff !important;
  font-family: var(--pdp-font-body) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
  align-self: center !important;
}

/* ── CTA + quantity: touch targets, press + focus feedback ─ */
.product-action .add-cart,
.product-action button.add-cart,
.pdp-buy-now-btn,
.pdp-whatsapp-btn,
.product-single-qty input {
  min-height: 46px !important;
}
button.add-cart:active,
.pdp-buy-now-btn:active,
.pdp-whatsapp-btn:active {
  transform: translateY(1px) scale(0.99) !important;
}
button.add-cart:focus-visible,
.pdp-buy-now-btn:focus-visible,
.pdp-whatsapp-btn:focus-visible,
.product-single-qty input:focus-visible,
.add-wishlist:focus-visible {
  outline: 3px solid var(--pdp-red) !important;
  outline-offset: 2px !important;
}
/* ── Respect reduced-motion ──────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .breadcrumb-item a,
  button.add-cart,
  .pdp-buy-now-btn,
  .pdp-whatsapp-btn,
  .add-cart {
    transition: none !important;
  }
  button.add-cart:hover,
  .pdp-buy-now-btn:active,
  .pdp-whatsapp-btn:active,
  button.add-cart:active { transform: none !important; }
}
