/* SURFSUP V32 — unified commerce controls
   One visual language for kits + merchandise. No product assets are changed. */

/* ----- Shared action language ----- */
.kit-lite-actions,
.goods-product .pod-copy .commerce-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  width:100%!important;
  margin:0!important;
}

.kit-lite-actions .buy-row{
  display:contents!important;
}

.kit-lite-actions .buy-button,
.kit-lite-actions .kit-view-link,
.goods-product .goods-checkout{
  box-sizing:border-box!important;
  min-width:126px!important;
  height:44px!important;
  padding:0 18px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  border-radius:999px!important;
  font-family:var(--vibe-mono,monospace)!important;
  font-size:8px!important;
  font-weight:800!important;
  line-height:1!important;
  letter-spacing:.11em!important;
  white-space:nowrap!important;
  text-decoration:none!important;
  transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease!important;
}

/* Primary purchase action — identical on kits and merch. */
.kit-lite-actions .buy-button,
.goods-product .goods-checkout{
  background:var(--vibe-ink,#11110f)!important;
  color:var(--vibe-paper,#f4f0e8)!important;
  border:1px solid var(--vibe-ink,#11110f)!important;
}

.kit-lite-actions .buy-button:hover,
.goods-product .goods-checkout:hover{
  background:var(--vibe-pink,#f89b4f)!important;
  color:var(--vibe-ink,#11110f)!important;
  border-color:var(--vibe-pink,#f89b4f)!important;
  transform:translateY(-1px)!important;
}

/* Secondary action — same dimensions, quieter treatment. */
.kit-lite-actions .kit-view-link{
  background:transparent!important;
  color:var(--vibe-ink,#11110f)!important;
  border:1px solid rgba(17,17,15,.28)!important;
}

.kit-lite-actions .kit-view-link:hover{
  background:var(--vibe-ink,#11110f)!important;
  color:var(--vibe-paper,#f4f0e8)!important;
  border-color:var(--vibe-ink,#11110f)!important;
  transform:translateY(-1px)!important;
}

/* ----- Kit card hierarchy ----- */
.kit-lite-copy{
  align-items:center!important;
  text-align:center!important;
}

.kit-lite-copy .micro,
.kit-lite-copy h3,
.kit-lite-copy .kit-lite-desc{
  width:100%!important;
}

.kit-lite-price-row{
  width:100%!important;
  margin-top:auto!important;
  padding-top:22px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:13px!important;
}

.kit-lite-price-row > strong{
  display:block!important;
  text-align:center!important;
  line-height:1!important;
}

.kit-lite-actions{
  flex-wrap:nowrap!important;
}

/* ----- Merch card hierarchy ----- */
.goods-product .pod-copy{
  align-items:center!important;
  text-align:center!important;
  width:100%!important;
}

.goods-product .pod-copy h3,
.goods-product .pod-copy > p{
  text-align:center!important;
}

.goods-product .goods-price{
  width:100%!important;
  text-align:center!important;
  line-height:1!important;
}

.goods-product .goods-size{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  margin:14px 0 0!important;
}

.goods-product .goods-size select{
  min-height:34px!important;
}

.goods-product .goods-checkout{
  margin:16px auto 0!important;
  align-self:center!important;
}

/* Keep the real merch artwork centered inside a predictable stage.
   The existing PNGs remain untouched. */
.goods-stage{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  overflow:hidden!important;
}

.goods-image-frame{
  width:100%!important;
  height:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

.goods-stage img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  margin:0 auto!important;
}

/* Product cards stay equal-height so action rows line up across the row. */
.goods-product,
.shop-product-lite{
  height:100%!important;
}

.goods-grid,
.kit-grid-simple{
  align-items:stretch!important;
}

/* Mobile: preserve a centered, intentional stack. */
@media(max-width:600px){
  .kit-lite-actions{
    flex-wrap:wrap!important;
  }
  .kit-lite-actions .buy-button,
  .kit-lite-actions .kit-view-link,
  .goods-product .goods-checkout{
    min-width:118px!important;
  }
}
