/**
 * RobloxPets — product-card stock limiter (quiet card-state treatment).
 *
 * No pills, no extra rows, no height change. When the customer already holds
 * all available stock the card softly dims and the add button becomes a muted
 * "Max in cart" (label set in JS). Distinct from real out-of-stock, which
 * keeps WooCommerce's existing top-right "Out of Stock" badge.
 *
 * Scoped to limiter classes only — never styles WooCommerce buttons globally.
 */

:root {
  --rp-stock-accent: #38bdf8;
}

/* Soft card dim — lighter than the true out-of-stock overlay so it reads as
   "you've got the max", not "globally unavailable". No layout impact. */
.product.rp-product-card--stock-limited > a.woocommerce-LoopProduct-link,
.product.rp-product-card--stock-limited .woocommerce-loop-product__title,
.product.rp-product-card--stock-limited .price {
  opacity: 0.62;
  filter: saturate(0.75);
  transition: opacity 0.18s ease, filter 0.18s ease;
}

/* Muted, lower-emphasis add button carrying the "Max in cart" label. */
.add_to_cart_button.rp-add-to-cart--limited,
.button.rp-add-to-cart--limited,
a.rp-add-to-cart--limited {
  cursor: not-allowed;
  opacity: 0.82;
  filter: saturate(0.5);
  background: linear-gradient(
    180deg,
    rgba(56, 189, 248, 0.18),
    rgba(30, 56, 92, 0.3)
  ) !important;
  color: rgba(226, 240, 255, 0.9) !important;
  box-shadow: inset 0 0 0 1px rgba(56, 189, 248, 0.4) !important;
  transition: opacity 0.18s ease, box-shadow 0.18s ease;
}

.add_to_cart_button.rp-add-to-cart--limited:hover,
.button.rp-add-to-cart--limited:hover,
a.rp-add-to-cart--limited:hover {
  opacity: 0.9;
  box-shadow: inset 0 0 0 1px rgba(56, 189, 248, 0.6) !important;
}

/* Subtle lock glyph before the label — inline, no layout shift. */
.rp-add-to-cart--limited .rp-atc-label::before {
  content: "";
  display: inline-block;
  width: 0.78em;
  height: 0.78em;
  margin-right: 0.45em;
  vertical-align: -0.06em;
  background-color: currentColor;
  -webkit-mask: var(--rp-lock) center / contain no-repeat;
  mask: var(--rp-lock) center / contain no-repeat;
  --rp-lock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 1a5 5 0 0 0-5 5v3H6a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-9a2 2 0 0 0-2-2h-1V6a5 5 0 0 0-5-5zm-3 8V6a3 3 0 0 1 6 0v3z'/%3E%3C/svg%3E");
}

/* Suppress WooCommerce's success flash if it was mid-animation when the
   limit was reached — the card is locked, not "added". */
.add_to_cart_button.rp-add-to-cart--limited.rp-atc-confirmed {
  animation: none !important;
}

/* Tiny non-layout-shifting nudge when a locked button is clicked. */
@keyframes rp-stock-nudge {
  0% { transform: translateX(0); }
  25% { transform: translateX(-3px); }
  55% { transform: translateX(3px); }
  80% { transform: translateX(-1.5px); }
  100% { transform: translateX(0); }
}

.rp-add-to-cart--limited.rp-stock-limit--pulse {
  animation: rp-stock-nudge 0.32s ease both;
}

@media (prefers-reduced-motion: reduce) {
  .rp-add-to-cart--limited.rp-stock-limit--pulse {
    animation: none;
  }
  .add_to_cart_button.rp-add-to-cart--limited,
  .button.rp-add-to-cart--limited,
  a.rp-add-to-cart--limited,
  .product.rp-product-card--stock-limited > a.woocommerce-LoopProduct-link,
  .product.rp-product-card--stock-limited .woocommerce-loop-product__title,
  .product.rp-product-card--stock-limited .price {
    transition: none;
  }
}