/* ═══════════════════════════════════════════════════════════════════════════════
   5.2 PRODUCT CARDS
   ═══════════════════════════════════════════════════════════════════════════════ */

.product-small.box {
  padding: 0 !important;
  overflow: hidden;
  transition: transform var(--duration-normal) var(--ease-bounce),
              border-color var(--duration-fast) var(--ease-default),
              box-shadow var(--duration-normal) var(--ease-default) !important;
}

.product-small:hover .box {
  border-color: var(--color-accent) !important;
  transform: translateY(-4px);
  box-shadow: var(--shadow-xl), var(--shadow-glow) !important;
}

.box-text,
.box-image {
  background-color: transparent !important;
}

.box-text {
  padding: var(--space-4) !important;
}

.product-small .name,
.product-small .product-title {
  font-size: var(--text-base) !important;
  font-weight: var(--font-semibold) !important;
  color: var(--color-text-primary) !important;
  line-height: var(--leading-snug) !important;
}

.price,
.amount {
  color: var(--color-accent) !important;
  font-weight: var(--font-bold) !important;
  font-size: var(--text-lg) !important;
  letter-spacing: var(--tracking-tight);
}

.price del {
  color: var(--color-text-muted) !important;
  font-weight: var(--font-normal) !important;
  font-size: var(--text-sm) !important;
}

.price ins {
  text-decoration: none !important;
}



/* ─────────────────────────────────────────────────────────────────────────────
   PRODUCT CARD TEXT BOX FIXES
   ───────────────────────────────────────────────────────────────────────────── */

/* Product info/text container */
.product-small .box-text,
.product-small .product-info,
.product-small .box-text-products {
  background: var(--color-bg-elevated, #111827) !important;
  padding: var(--space-4) !important;
}

/* Category/parent info line */
.product-small .category-label,
.product-small .product-category,
.product-small .is-smaller {
  color: var(--color-text-muted) !important;
  font-size: var(--text-sm) !important;
}

/* Price container - remove any background */
.product-small .price-wrapper,
.product-small .price,
.product-small .box-text .price {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin-top: var(--space-2) !important;
}

/* Ensure price text is green */
.product-small .price .amount,
.product-small .price bdi {
  color: var(--color-accent) !important;
  background: transparent !important;
}

/* Add to cart button on cards */
.product-small .add_to_cart_button {
  background: var(--color-accent) !important;
  color: #0a0f1a !important;
  border: none !important;
  padding: 8px 16px !important;
  border-radius: var(--radius-md) !important;
  font-size: var(--text-sm) !important;
  font-weight: var(--font-semibold) !important;
  margin-top: var(--space-3) !important;
}

/* Quick view button */
.product-small .quick-view {
  background: rgba(30, 41, 59, 0.9) !important;
  border: 1px solid var(--color-border) !important;
  color: var(--color-text-body) !important;
  padding: 8px 16px !important;
  border-radius: var(--radius-md) !important;
  font-size: var(--text-xs) !important;
}

.product-small .quick-view:hover {
  background: var(--color-bg-hover) !important;
  border-color: var(--color-accent) !important;
  color: var(--color-accent) !important;
}

/* Badge styling */
.badge-inner {
  background: var(--color-accent) !important;
  color: #0a0f1a !important;
  padding: 4px 10px !important;
  font-size: 10px !important;
  font-weight: var(--font-bold) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

.badge-inner.on-sale {
  background: #ef4444 !important;
  color: white !important;
}

/* Product card image overlay effects */
.product-small .image-tools {
  background: transparent !important;
}

.product-small .box-image {
  background: var(--color-bg-base) !important;
}