/* Product purchase controls: preserve theme actions, clarify their hierarchy. */
#product .product-add-to-cart {
  container-type: inline-size;
  --purchase-border: #dedede;
  --purchase-radius: 6px;
  --purchase-height: 52px;
}
#product .product-add-to-cart .product-quantity {
  gap: 10px;
  align-items: stretch;
  margin: 0;
}
#product .product-quantity > .col {
  flex: 0 0 auto;
  width: auto;
  padding: 0;
  margin: 0;
}
#product .product-quantity .col-add-btn { flex: 0 1 auto; }
#product .product-quantity .qty { width: 80px; height: var(--purchase-height); }
#product .product-quantity .qty input {
  text-align: center;
  padding: 10px 30px 10px 8px;
  border-radius: var(--purchase-radius);
}
#product .product-quantity .add-to-cart {
  min-height: var(--purchase-height);
  padding: 12px 24px;
  font-size: 15px;
  line-height: 26px;
  border-radius: var(--purchase-radius);
}
#product .product-quantity .btn-iconic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--purchase-height);
  height: var(--purchase-height);
  padding: 0;
  border: 1px solid var(--purchase-border);
  border-radius: var(--purchase-radius);
  background: #fff;
  color: #333;
  font-size: 18px;
}
#product .product-quantity .btn-iconic:hover,
#product .product-quantity .btn-iconic:active {
  background: #f5f5f5;
  border-color: #777;
  color: #111;
}
#product .product-quantity button:focus-visible,
#product .product-quantity input:focus-visible,
#product .social-sharing a:focus-visible {
  outline: 2px solid #333;
  outline-offset: 3px;
}
#product .product-quantity .add-to-cart:disabled { opacity: .45; }
#product .social-sharing ul {
  display: flex;
  gap: 8px;
  margin: 0;
  padding: 0;
}
#product .social-sharing li { margin: 0; padding: 0; }
#product .social-sharing a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1px solid #e5e5e5;
  border-radius: 50%;
  background: #fff;
  color: #555;
  font-size: 16px;
}
#product .social-sharing a:hover { color: #111; border-color: #777; background: #f5f5f5; }
#product .social-sharing li i { background: transparent; }
@container (max-width: 400px) {
  #product .product-quantity .col-add-btn { flex: 1 1 calc(100% - 90px); }
  #product .product-quantity .add-to-cart { width: 100%; padding-inline: 12px; }
}