/* ==========================================================================
   NOVAURA — Product card
   Shared by the homepage featured section, the shop grid and related
   products. Two variants: --featured and --grid.
   ========================================================================== */

.nva-product-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: var(--nva-surface);
  border: 1px solid var(--nva-line);
  border-radius: var(--nva-r-lg);
  transition: box-shadow var(--nva-d-slow) var(--nva-ease);
}
.nva-product-card:hover { box-shadow: var(--nva-shadow-feature-hover); }

.nva-product-card--grid {
  overflow: hidden;
  border-radius: var(--nva-r-md);
}
.nva-product-card--grid:hover { box-shadow: var(--nva-shadow-card-hover); }

/* --- Media --------------------------------------------------------------- */
.nva-product-card__media {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 120px;
  padding: var(--nva-s-3) var(--nva-s-3) 0;
}

.nva-product-card__image {
  height: 110px;
  width: auto;
  max-width: 92%;
  object-fit: contain;
  user-select: none;
  transition: transform var(--nva-d-slow) var(--nva-ease);
}
.nva-product-card:hover .nva-product-card__image { transform: translateY(-6px); }

/* Placeholder inherits colour rather than shipping a grey box */
.nva-product-card__image--placeholder {
  color: #CFCFCF;
  height: 110px;
  width: auto;
}

/* --- Body ---------------------------------------------------------------- */
.nva-product-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: var(--nva-s-3);
}

.nva-product-card__title {
  font-family: var(--nva-font-body);
  font-size: 0.8125rem;
  font-weight: var(--nva-w-bold);
  line-height: 1.25;
  letter-spacing: 0.01em;
  color: var(--nva-ink);
}


.nva-product-card__stock {
  margin-top: var(--nva-s-2);
  font-size: var(--nva-t-nano);
  font-weight: var(--nva-w-semi);
  text-transform: uppercase;
  letter-spacing: var(--nva-ls-label);
  color: var(--nva-ink-40);
}

.nva-product-card__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--nva-s-2);
  margin-top: auto;
  padding-top: var(--nva-s-3);
}

.nva-product-card__price {
  font-size: 1rem;
  color: var(--nva-ink);
}

.nva-product-card__cta {
  display: inline-flex;
  align-items: center;
  gap: var(--nva-s-1);
  font-size: 0.625rem;
  font-weight: var(--nva-w-medium);
  text-transform: uppercase;
  letter-spacing: var(--nva-ls-button);
  color: var(--nva-ink-60);
  /*
   * Kept on one line — uppercase letter-spaced text wraps badly — but
   * allowed to shrink and ellipsis rather than force the row wider than
   * the card at 320px.
   */
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nva-product-card__cta .nva-icon {
  transition: transform var(--nva-d-slow) var(--nva-ease);
}
.nva-product-card:hover .nva-product-card__cta .nva-icon { transform: translateX(4px); }

/* Circular add button, grid variant only */
.nva-product-card__add {
  position: absolute;
  right: var(--nva-s-3);
  bottom: var(--nva-s-3);
  z-index: 2;
}

/* --------------------------------------------------------------------------
   WooCommerce price markup
   get_price_html() emits <del>/<ins> on sale and <bdi> for currency. These
   rules style WooCommerce's own output rather than replacing it.
   -------------------------------------------------------------------------- */
.nva-product-card__price .woocommerce-Price-amount { font-family: var(--nva-font-heading); }

.nva-product-card__price del {
  margin-right: var(--nva-s-2);
  font-size: 0.8em;
  color: var(--nva-ink-40);
  text-decoration: line-through;
}

.nva-product-card__price ins {
  text-decoration: none;
  color: var(--nva-ink);
}

.nva-product-card__price .woocommerce-Price-currencySymbol { font-family: var(--nva-font-heading); }

/* --------------------------------------------------------------------------
   Rating
   Values come from WooCommerce review data. No reviews means no stars.
   -------------------------------------------------------------------------- */
.nva-rating {
  display: inline-flex;
  align-items: center;
  gap: var(--nva-s-2);
  margin-top: var(--nva-s-2);
}

.nva-rating__stars {
  display: inline-flex;
  gap: 1px;
  color: var(--nva-red-rating);
  font-size: 0.75rem;
  line-height: 1;
  transition: color var(--nva-d-base) var(--nva-ease);
}
.nva-product-card:hover .nva-rating__stars { color: var(--nva-red-rating-hi); }

.nva-rating__star { opacity: 0.25; }
.nva-rating__star.is-on { opacity: 1; }

.nva-rating__value {
  font-size: var(--nva-t-nano);
  font-weight: var(--nva-w-medium);
  font-variant-numeric: tabular-nums;
  color: var(--nva-ink-55);
}

/* --------------------------------------------------------------------------
   Larger screens
   -------------------------------------------------------------------------- */
@media (min-width: 640px) {
  .nva-product-card--grid .nva-product-card__media { height: 222px; padding-inline: var(--nva-s-6); }
  .nva-product-card--grid .nva-product-card__image { height: 212px; }
  .nva-product-card--grid .nva-product-card__body  { padding: var(--nva-s-5) var(--nva-s-6) var(--nva-s-6); }
  .nva-product-card--grid .nva-product-card__title { font-size: 1.125rem; }
  .nva-product-card--grid .nva-product-card__price { font-size: 1.375rem; }
  .nva-product-card--grid .nva-product-card__foot  { padding-top: var(--nva-s-6); }
  .nva-product-card__add { right: var(--nva-s-5); bottom: var(--nva-s-5); }
}

@media (min-width: 768px) {
  .nva-product-card--grid .nva-product-card__media { height: 278px; }
  .nva-product-card--grid .nva-product-card__image { height: 268px; }
}

@media (min-width: 1024px) {
  .nva-product-card--featured {
    border-radius: var(--nva-r-xl);
    padding: var(--nva-s-8);
  }
  .nva-product-card--featured .nva-product-card__media {
    height: 230px;
    padding: 0;
  }
  .nva-product-card--featured .nva-product-card__image,
  .nva-product-card--featured .nva-product-card__image--placeholder { height: 220px; }

  .nva-product-card--featured .nva-product-card__body { padding: 0; margin-top: var(--nva-s-8); }
  .nva-product-card--featured .nva-product-card__title { font-size: 1.125rem; }
  .nva-product-card--featured .nva-product-card__price { font-size: 1.5rem; }
  .nva-product-card--featured .nva-product-card__cta   { font-size: var(--nva-t-micro); gap: var(--nva-s-2); }
  .nva-product-card--featured .nva-product-card__foot  { margin-top: var(--nva-s-10); padding-top: 0; }
}