/**
 * SG AI Commerce — conversion action pill (fashion VIEW CART DNA).
 * Primary actions only; page chrome, glass sticky bar, and secondary links stay as-is.
 */
.sg-ai-commerce {
  --sg-action-pill-bg: #ffffff;
  --sg-action-pill-ink: #0a0a0a;
  --sg-action-pill-shadow: 0 10px 26px rgba(0, 0, 0, 0.22), 0 2px 8px rgba(0, 0, 0, 0.08);
  --sg-action-pill-shadow-hover: 0 12px 30px rgba(0, 0, 0, 0.28), 0 2px 8px rgba(0, 0, 0, 0.1);
}

.sg-ai-commerce .sg-commerce-sticky__cta--primary,
.sg-ai-commerce .sg-ai-cart-page__checkout,
.sg-ai-commerce .sg-ai-checkout-continue,
.sg-ai-commerce .sg-ai-checkout-page__place-order,
.sg-ai-commerce .sg-ai-product__add,
.sg-ai-commerce .sg-ai-cart-page__continue--primary,
.sg-ai-commerce .sg-ai-cart__checkout,
.sg-ai-commerce .sg-ai-shop__filter-apply,
.sg-ai-commerce .sg-ai-shop__empty-cta {
  background: var(--sg-action-pill-bg) !important;
  color: var(--sg-action-pill-ink) !important;
  border: 1px solid color-mix(in srgb, var(--sg-border, #d4d4d4) 40%, transparent) !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  box-shadow: var(--sg-action-pill-shadow) !important;
  text-decoration: none;
  cursor: pointer;
  transition:
    transform .32s cubic-bezier(.22, 1, .36, 1),
    box-shadow .32s ease,
    opacity .25s ease;
}

.sg-ai-commerce .sg-commerce-sticky__cta--primary {
  font-size: 0.78rem;
  padding: 0.85rem 1.25rem;
}

.sg-ai-commerce .sg-ai-cart-page__checkout,
.sg-ai-commerce .sg-ai-checkout-continue,
.sg-ai-commerce .sg-ai-checkout-page__place-order,
.sg-ai-commerce .sg-ai-product__add,
.sg-ai-commerce .sg-ai-cart__checkout,
.sg-ai-commerce .sg-ai-shop__filter-apply {
  font-size: 0.8125rem;
}

.sg-ai-commerce .sg-commerce-sticky__cta--primary:hover,
.sg-ai-commerce .sg-ai-cart-page__checkout:hover,
.sg-ai-commerce .sg-ai-checkout-continue:hover,
.sg-ai-commerce .sg-ai-checkout-page__place-order:hover,
.sg-ai-commerce .sg-ai-product__add:hover,
.sg-ai-commerce .sg-ai-cart-page__continue--primary:hover,
.sg-ai-commerce .sg-ai-cart__checkout:hover,
.sg-ai-commerce .sg-ai-shop__filter-apply:hover,
.sg-ai-commerce .sg-ai-shop__empty-cta:hover {
  transform: translateY(-1px);
  box-shadow: var(--sg-action-pill-shadow-hover) !important;
  opacity: 1;
}

.sg-ai-commerce .sg-commerce-sticky__cta--primary:active,
.sg-ai-commerce .sg-commerce-sticky__cta--primary.is-pressed,
.sg-ai-commerce .sg-ai-cart-page__checkout:active,
.sg-ai-commerce .sg-ai-cart-page__checkout.is-pressed,
.sg-ai-commerce .sg-ai-checkout-continue:active,
.sg-ai-commerce .sg-ai-checkout-continue.is-pressed,
.sg-ai-commerce .sg-ai-checkout-page__place-order:active,
.sg-ai-commerce .sg-ai-checkout-page__place-order.is-pressed,
.sg-ai-commerce .sg-ai-product__add:active,
.sg-ai-commerce .sg-ai-cart__checkout:active,
.sg-ai-commerce .sg-ai-shop__filter-apply:active {
  transform: scale(0.97);
}

.sg-ai-commerce .sg-ai-cart-page__continue--primary,
.sg-ai-commerce .sg-ai-shop__empty-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 0.85rem 1.35rem;
  font-size: 0.78rem;
  border-bottom: none !important;
}

.sg-ai-commerce .sg-ai-checkout-continue.is-success {
  background: color-mix(in srgb, var(--sg-accent) 85%, #0a0a0a) !important;
  color: #fff !important;
  border-color: transparent !important;
}

/* Quick-add (+) on product cards — round white pill, stands out on glass cards */
.sg-ai-commerce .sg-ai-card__quick-add {
  background: var(--sg-action-pill-bg) !important;
  color: var(--sg-action-pill-ink) !important;
  border: 1px solid color-mix(in srgb, var(--sg-border, #d4d4d4) 40%, transparent) !important;
  box-shadow: var(--sg-action-pill-shadow) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  opacity: 1;
  transform: scale(1) translateY(0);
}

.sg-ai-commerce .sg-ai-card__quick-add:hover,
.sg-ai-commerce .sg-ai-card__quick-add:focus-visible {
  transform: translateY(-1px) scale(1.04) !important;
  box-shadow: var(--sg-action-pill-shadow-hover) !important;
  background: var(--sg-action-pill-bg) !important;
  color: var(--sg-action-pill-ink) !important;
}

.sg-ai-commerce .sg-ai-card__quick-add.is-added {
  background: color-mix(in srgb, var(--sg-accent, #c9a962) 18%, #ffffff) !important;
  color: var(--sg-action-pill-ink) !important;
  border-color: color-mix(in srgb, var(--sg-accent, #c9a962) 35%, transparent) !important;
}

.sg-ai-commerce .sg-ai-card__quick-add:active {
  transform: scale(0.96) !important;
}
