/**
 * B2BPerfume quantity controls
 * Shared visual language for classic WooCommerce and Cart Blocks.
 */


/* Classic WooCommerce ---------------------------------------------------- */
.woocommerce .quantity.b2bp-quantity-control,
.woocommerce-page .quantity.b2bp-quantity-control {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: var(--b2bp-qty-height, 50px) !important;
  align-items: stretch !important;
  width: 136px !important;
  min-width: 126px !important;
  height: var(--b2bp-qty-height, 50px) !important;
  min-height: var(--b2bp-qty-height, 50px) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--b2bp-surface, #fff) !important;
  border: 1px solid color-mix(in srgb, var(--b2bp-primary, #5a5042) 28%, transparent) !important;
  border-radius: var(--b2bp-qty-radius, 13px) !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

.woocommerce .quantity.b2bp-quantity-control .b2bp-qty-button,
.woocommerce-page .quantity.b2bp-quantity-control .b2bp-qty-button,
.woocommerce .quantity.b2bp-quantity-control .qty,
.woocommerce-page .quantity.b2bp-quantity-control .qty {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

.woocommerce .quantity.b2bp-quantity-control .b2bp-qty-button,
.woocommerce-page .quantity.b2bp-quantity-control .b2bp-qty-button {
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  background: var(--b2bp-qty-soft, #f1eddd) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--b2bp-primary, #5a5042) !important;
  font: 700 18px/1 var(--b2bp-font-ui, inherit) !important;
  cursor: pointer !important;
  transition: background-color 160ms ease, color 160ms ease, opacity 160ms ease !important;
}

.woocommerce .quantity.b2bp-quantity-control .b2bp-qty-minus,
.woocommerce-page .quantity.b2bp-quantity-control .b2bp-qty-minus {
  grid-column: 1 !important;
  border-right: 1px solid color-mix(in srgb, var(--b2bp-primary, #5a5042) 18%, transparent) !important;
}

.woocommerce .quantity.b2bp-quantity-control .qty,
.woocommerce-page .quantity.b2bp-quantity-control .qty {
  grid-column: 2 !important;
  padding: 0 4px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--b2bp-text, #211f1b) !important;
  font: 650 13px/1 var(--b2bp-font-ui, inherit) !important;
  text-align: center !important;
  appearance: textfield !important;
  -moz-appearance: textfield !important;
}

.woocommerce .quantity.b2bp-quantity-control .qty::-webkit-outer-spin-button,
.woocommerce .quantity.b2bp-quantity-control .qty::-webkit-inner-spin-button,
.woocommerce-page .quantity.b2bp-quantity-control .qty::-webkit-outer-spin-button,
.woocommerce-page .quantity.b2bp-quantity-control .qty::-webkit-inner-spin-button {
  margin: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

.woocommerce .quantity.b2bp-quantity-control .b2bp-qty-plus,
.woocommerce-page .quantity.b2bp-quantity-control .b2bp-qty-plus {
  grid-column: 3 !important;
  border-left: 1px solid color-mix(in srgb, var(--b2bp-primary, #5a5042) 18%, transparent) !important;
}

.woocommerce .quantity.b2bp-quantity-control .b2bp-qty-button:hover:not(:disabled),
.woocommerce-page .quantity.b2bp-quantity-control .b2bp-qty-button:hover:not(:disabled) {
  background: var(--b2bp-primary, #5a5042) !important;
  color: #fff !important;
}

.woocommerce .quantity.b2bp-quantity-control .b2bp-qty-button:focus-visible,
.woocommerce-page .quantity.b2bp-quantity-control .b2bp-qty-button:focus-visible,
.woocommerce .quantity.b2bp-quantity-control .qty:focus-visible,
.woocommerce-page .quantity.b2bp-quantity-control .qty:focus-visible {
  outline: 2px solid var(--b2bp-primary, #5a5042) !important;
  outline-offset: -3px !important;
}

.woocommerce .quantity.b2bp-quantity-control .b2bp-qty-button:disabled,
.woocommerce-page .quantity.b2bp-quantity-control .b2bp-qty-button:disabled {
  cursor: not-allowed !important;
  opacity: .32 !important;
}

/* Product page quantity fills the configured purchase-column width. */
body.single-product div.product form.cart .quantity.b2bp-quantity-control {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

/* Classic cart stays compact. */
.woocommerce-cart-form .product-quantity .quantity.b2bp-quantity-control,
.woocommerce table.shop_table .product-quantity .quantity.b2bp-quantity-control {
  width: 136px !important;
  min-width: 126px !important;
}

/* WooCommerce Cart Block ------------------------------------------------- */
.wc-block-cart-item__quantity .wc-block-components-quantity-selector,
.editor-styles-wrapper table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector,
table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: 46px !important;
  align-items: stretch !important;
  width: 132px !important;
  min-width: 124px !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--b2bp-surface, #fff) !important;
  border: 1px solid color-mix(in srgb, var(--b2bp-primary, #5a5042) 28%, transparent) !important;
  border-radius: var(--b2bp-qty-radius, 13px) !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

.wc-block-cart-item__quantity .wc-block-components-quantity-selector::after,
.editor-styles-wrapper table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector::after,
table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector::after {
  display: none !important;
}

.wc-block-cart-item__quantity .wc-block-components-quantity-selector__input,
.editor-styles-wrapper table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector__input,
table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector__input {
  grid-column: 2 !important;
  grid-row: 1 !important;
  position: static !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 4px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--b2bp-text, #211f1b) !important;
  font: 650 13px/1 var(--b2bp-font-ui, inherit) !important;
  text-align: center !important;
  appearance: textfield !important;
  -moz-appearance: textfield !important;
  box-sizing: border-box !important;
}

.wc-block-cart-item__quantity .wc-block-components-quantity-selector__button,
.editor-styles-wrapper table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector__button,
table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector__button {
  grid-row: 1 !important;
  position: static !important;
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--b2bp-qty-soft, #f1eddd) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--b2bp-primary, #5a5042) !important;
  font-size: 18px !important;
  line-height: 1 !important;
  transition: background-color 160ms ease, color 160ms ease, opacity 160ms ease !important;
  box-sizing: border-box !important;
}

.wc-block-cart-item__quantity .wc-block-components-quantity-selector__button--minus,
.editor-styles-wrapper table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector__button--minus,
table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector__button--minus {
  grid-column: 1 !important;
  border-right: 1px solid color-mix(in srgb, var(--b2bp-primary, #5a5042) 18%, transparent) !important;
}

.wc-block-cart-item__quantity .wc-block-components-quantity-selector__button--plus,
.editor-styles-wrapper table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector__button--plus,
table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector__button--plus {
  grid-column: 3 !important;
  border-left: 1px solid color-mix(in srgb, var(--b2bp-primary, #5a5042) 18%, transparent) !important;
}

.wc-block-cart-item__quantity .wc-block-components-quantity-selector__button:hover:not(:disabled),
table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector__button:hover:not(:disabled) {
  background: var(--b2bp-primary, #5a5042) !important;
  color: #fff !important;
}

.wc-block-cart-item__quantity {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px 12px !important;
}

@media (max-width: 680px) {
  .woocommerce-cart-form .product-quantity .quantity.b2bp-quantity-control,
  .woocommerce table.shop_table .product-quantity .quantity.b2bp-quantity-control,
  .wc-block-cart-item__quantity .wc-block-components-quantity-selector,
  table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-components-quantity-selector {
    width: 128px !important;
    min-width: 120px !important;
  }
}