
/* OctaStore v26
   ONE visual rule for Aputure / Profoto / KUPO quantity controls.
   Desktop catalog + product pages: compact controls like the cart.
   Mobile catalog: only "✓ В корзине" state.
   Mobile product page: compact +/- remains available.
*/

/* --- Shared compact quantity control, matching cart UI --- */
.card-qty-control,
.profoto-product-qty{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:7px;
  width:auto;
  min-width:0;
  max-width:none;
  height:auto;
  min-height:0;
  max-height:none;
  margin:10px 0 0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  overflow:visible;
  flex:0 0 auto;
  box-shadow:none;
}
.card-qty-control[hidden],
.profoto-product-qty[hidden]{
  display:none!important;
}

.card-qty-btn,
.profoto-product-qty-btn{
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  min-width:30px;
  height:30px;
  min-height:30px;
  margin:0;
  padding:0;
  border:1px solid var(--line,#d0d5dd);
  border-radius:7px;
  background:#fff;
  color:var(--ink,#101828);
  font-family:Inter,Arial,sans-serif;
  font-size:17px;
  font-weight:600;
  line-height:1;
  cursor:pointer;
  box-shadow:none;
  -webkit-appearance:none;
  appearance:none;
}
.card-qty-btn:hover,
.profoto-product-qty-btn:hover{
  background:#f8fafc;
}
.card-qty-btn:active,
.profoto-product-qty-btn:active{
  transform:none;
  background:#f2f4f7;
}

.card-qty-value,
.profoto-product-qty-value{
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
  width:auto;
  min-width:24px;
  height:30px;
  margin:0;
  padding:0 2px;
  border:0;
  background:transparent;
  color:var(--ink,#101828);
  font-family:Inter,Arial,sans-serif;
  font-size:13px;
  font-weight:700;
  line-height:1;
  text-align:center;
  font-variant-numeric:tabular-nums;
}

/* Product cards: don't let quantity state stretch the card/footer. */
.prod-card .prod-footer{
  align-items:center;
}
.prod-card.card-has-qty .add-btn{
  display:none!important;
}

/* Profoto detail page uses a separate wrapper, but the same control dimensions. */
.profoto-buy-wrap{
  align-items:center!important;
}
.profoto-product-qty{
  margin:10px 0 0!important;
}

/* --- Mobile catalog state: no +/- inside catalog cards --- */
@media (max-width:760px){
  .prod-card:not(.storm-buy-card) .card-qty-control{
    display:none!important;
  }

  .prod-card:not(.storm-buy-card).card-has-qty .add-btn{
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
  }

  .prod-card:not(.storm-buy-card) .add-btn.octa-in-cart{
    background:#eef5ff!important;
    color:#2563eb!important;
    border:1px solid rgba(37,99,235,.25)!important;
    box-shadow:none!important;
  }

  /* Detail pages keep controls, but still compact and touch-friendly. */
  .prod-card.storm-buy-card .card-qty-control,
  .profoto-product-qty{
    gap:8px!important;
    width:auto!important;
    height:auto!important;
    margin:10px 0 0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
  }
  .prod-card.storm-buy-card .card-qty-btn,
  .profoto-product-qty-btn{
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
    min-height:36px!important;
    border-radius:8px!important;
    font-size:19px!important;
  }
  .prod-card.storm-buy-card .card-qty-value,
  .profoto-product-qty-value{
    min-width:28px!important;
    height:36px!important;
    font-size:14px!important;
  }

  /* Never allow old mobile rules to stretch these controls to 100%. */
  .product-detail-qty{
    width:auto!important;
    max-width:100%!important;
  }
}
