/* Scoped fixes for the existing Classic child theme. */

/* Product quantity: undo the global .btn size only for TouchSpin arrows. */
#product .product-add-to-cart .product-quantity {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}
#product .product-quantity > .qty,
#product .product-quantity > .add {
  float: none;
  margin: 0;
  max-width: 100%;
}
#product .product-quantity > .qty {
  flex: 0 0 88px;
}
#product .product-quantity .bootstrap-touchspin {
  position: relative;
  display: flex;
  box-sizing: border-box;
  width: 88px;
  height: 48px;
  min-height: 48px;
  margin: 0;
  padding: 0;
  border: 1px solid #899397;
  border-radius: 4px;
  background: var(--aq-white, #fbfcfc);
  box-shadow: none;
}
#product .product-quantity #quantity_wanted {
  box-sizing: border-box;
  width: 88px;
  height: 48px;
  min-height: 48px;
  margin: 0;
  padding: 0 34px 0 12px;
  border: 1px solid #899397;
  border-radius: 4px;
  background: var(--aq-white, #fbfcfc);
  color: var(--aq-ink, #252c2f);
  font: inherit;
  font-size: 16px;
  line-height: normal;
  box-shadow: none;
}
#product .product-quantity .bootstrap-touchspin #quantity_wanted {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  height: 46px;
  min-height: 46px;
  border: 0;
  border-radius: 3px;
  appearance: textfield;
  -moz-appearance: textfield;
}
#product .bootstrap-touchspin #quantity_wanted::-webkit-inner-spin-button,
#product .bootstrap-touchspin #quantity_wanted::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
#product .product-quantity .bootstrap-touchspin .input-group-btn-vertical {
  position: absolute;
  display: flex;
  flex-direction: column;
  top: 0;
  right: 0;
  bottom: 0;
  width: 28px;
  height: 46px;
  margin: 0;
  padding: 0;
  border-left: 1px solid #899397;
}
#product .product-quantity .bootstrap-touchspin .input-group-btn-vertical .btn {
  position: relative;
  display: flex;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  float: none;
  width: 100%;
  height: 23px;
  min-height: 0;
  max-height: 23px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--aq-ink, #252c2f);
  line-height: 1;
  box-shadow: none;
}
#product .product-quantity .bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-down {
  border-top: 1px solid #899397;
}
#product .product-quantity .bootstrap-touchspin .input-group-btn-vertical i {
  position: static;
  display: inline-block;
  margin: 0;
  padding: 0;
  font-size: 16px;
  line-height: 1;
}
#product .product-quantity .add .add-to-cart {
  display: inline-flex;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 48px;
  min-height: 48px;
  max-width: 100%;
  margin: 0;
  padding: 0 20px;
  vertical-align: middle;
  line-height: 1.2;
  text-align: center;
}
#product .product-quantity .add-to-cart .shopping-cart {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  margin: 0;
  padding: 0;
  font-size: 22px;
  line-height: 1;
  vertical-align: middle;
}

/* Visible +/- on the EXISTING TouchSpin buttons; keep their native handlers. */
#product .product-quantity .bootstrap-touchspin .input-group-btn-vertical .btn {
  visibility: visible;
  opacity: 1;
  font-size: 0;
  overflow: visible;
  cursor: pointer;
}
#product .product-quantity .bootstrap-touchspin .input-group-btn-vertical .btn i {
  display: none;
}
#product .product-quantity .bootstrap-touchspin .bootstrap-touchspin-up::after,
#product .product-quantity .bootstrap-touchspin .bootstrap-touchspin-down::after {
  position: static;
  display: block;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  transform: none;
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1;
  color: var(--aq-ink, #252c2f);
}
#product .product-quantity .bootstrap-touchspin .bootstrap-touchspin-up::after {
  content: '\002b';
}
#product .product-quantity .bootstrap-touchspin .bootstrap-touchspin-down::after {
  content: '\2212';
}
#product .product-quantity .bootstrap-touchspin .input-group-btn-vertical .btn:hover {
  background: var(--aq-surface, #f0f3f3);
}
/* If TouchSpin has not created its buttons, retain the browser spinner. */
#product .product-quantity .bootstrap-touchspin:not(:has(.bootstrap-touchspin-up)) #quantity_wanted {
  appearance: auto;
  -moz-appearance: auto;
  padding-right: 6px;
}
#product .bootstrap-touchspin:not(:has(.bootstrap-touchspin-up)) #quantity_wanted::-webkit-inner-spin-button,
#product .bootstrap-touchspin:not(:has(.bootstrap-touchspin-up)) #quantity_wanted::-webkit-outer-spin-button {
  -webkit-appearance: auto;
  opacity: 1;
}

/* Verified on the live page: input z-index 2 was covering both buttons. */
#product .product-quantity .bootstrap-touchspin #quantity_wanted {
  z-index: 0;
}
#product .product-quantity .bootstrap-touchspin .input-group-btn-vertical {
  z-index: 3;
}

/* Cart line quantity: separate DOM and selectors from the product page. */
#cart .cart-items .bootstrap-touchspin {
  position: relative;
  display: flex;
  box-sizing: border-box;
  width: 88px;
  max-width: 100%;
  height: 48px;
  min-height: 48px;
  margin: 0;
  padding: 0;
  border: 1px solid #899397;
  border-radius: 4px;
  background: var(--aq-white, #fbfcfc);
  box-shadow: none;
}
#cart .cart-items .bootstrap-touchspin .js-cart-line-product-quantity {
  position: relative;
  z-index: 0;
  display: block;
  flex: 1 1 auto;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 46px;
  min-height: 46px;
  margin: 0;
  padding: 0 34px 0 12px;
  border: 0;
  border-radius: 3px;
  background: transparent;
  color: var(--aq-ink, #252c2f);
  font-family: inherit;
  font-size: 16px;
  line-height: normal;
  box-shadow: none;
  appearance: textfield;
  -moz-appearance: textfield;
}
#cart .cart-items .bootstrap-touchspin .js-cart-line-product-quantity::-webkit-inner-spin-button,
#cart .cart-items .bootstrap-touchspin .js-cart-line-product-quantity::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
#cart .cart-items .bootstrap-touchspin .input-group-btn-vertical {
  position: absolute;
  z-index: 3;
  display: flex;
  flex-direction: column;
  top: 0;
  right: 0;
  bottom: 0;
  width: 28px;
  height: 46px;
  margin: 0;
  padding: 0;
  border-left: 1px solid #899397;
}
#cart .cart-items .bootstrap-touchspin .input-group-btn-vertical .btn {
  position: relative;
  display: flex;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  float: none;
  width: 100%;
  height: 23px;
  min-height: 0;
  max-height: 23px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--aq-ink, #252c2f);
  font-size: 0;
  line-height: 1;
  box-shadow: none;
  cursor: pointer;
}
#cart .cart-items .bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-down {
  border-top: 1px solid #899397;
}
#cart .cart-items .bootstrap-touchspin .input-group-btn-vertical .btn i {
  display: none;
}
#cart .cart-items .bootstrap-touchspin .bootstrap-touchspin-up::after,
#cart .cart-items .bootstrap-touchspin .bootstrap-touchspin-down::after {
  position: static;
  display: block;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  transform: none;
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1;
  color: var(--aq-ink, #252c2f);
}
#cart .cart-items .bootstrap-touchspin .bootstrap-touchspin-up::after {
  content: '\002b';
}
#cart .cart-items .bootstrap-touchspin .bootstrap-touchspin-down::after {
  content: '\2212';
}
#cart .cart-items .bootstrap-touchspin .input-group-btn-vertical .btn:hover {
  background: var(--aq-surface, #f0f3f3);
}

/* Keep the native search markup, autocomplete and clear action. */
#header #search_widget {
  min-width: 0;
  max-width: 100%;
}
#header .header-top-right #search_widget {
  width: 22rem;
  max-width: 100%;
  clear: both;
  padding: 0;
  margin-top: .75rem;
}
#header #search_widget form {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 46px;
  margin: 0;
  padding: 0;
  background: var(--aq-white, #fbfcfc);
  border: 1px solid #899397;
  border-radius: 4px;
}
#header #search_widget form:focus-within {
  outline: 2px solid var(--aq-brass, #806537);
  outline-offset: 2px;
}
#header #search_widget form input[name='s'] {
  display: block;
  flex: 1 1 auto;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 46px;
  margin: 0;
  padding: 0 86px 0 14px;
  border: 0;
  border-radius: 4px;
  outline: none;
  box-shadow: none;
  background: transparent;
  color: var(--aq-ink, #252c2f);
  font-family: inherit;
  font-size: 14px;
  line-height: normal;
}
#header #search_widget form input[name='s']::placeholder {
  color: var(--aq-muted, #586367);
  opacity: 1;
}
#header #search_widget form i.search,
#header #search_widget form i.clear {
  position: absolute;
  top: 50%;
  bottom: auto;
  left: auto;
  margin: 0;
  padding: 0;
  transform: translateY(-50%);
  color: var(--aq-muted, #586367);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
#header #search_widget form i.search { right: 13px; }
#header #search_widget form i.clear { right: 49px; }
#header #search_widget form input[name='s']:placeholder-shown ~ i.clear {
  display: none;
}

/* Remove the white module rectangle, preserving the field and alerts. */
#footer .block_newsletter,
#footer .block_newsletter > .row,
#footer .block_newsletter form,
#footer .block_newsletter form > .row,
#footer .block_newsletter form > .row > [class*='col-'] {
  background: transparent;
  box-shadow: none;
}
#footer .onyx-footer-signature {
  color: var(--aq-muted, #586367);
}

@media (max-width: 767px) {
  #header .header-top-right #search_widget {
    width: 100%;
    float: none;
    margin-top: 1rem;
  }
  #header #search_widget form input[name='s'] { font-size: 16px; }
}