/* Bootstrap étire .modal de top:0 à bottom:0, et .modal-dialog plafonne à 600px.
   .pk-modal remet top à 50% sans annuler bottom : la fenêtre ne faisait
   que la moitié de l'écran, puis le bouton sortait du cadre trop étroit. */
.modal.quick-view.pk-modal {
  top: 50%;
  bottom: auto;
  height: auto;
  max-height: calc(100vh - 2rem);
  width: min(1000px, calc(100vw - 2rem));
  overflow: auto;
}

.modal.quick-view .modal-dialog {
  width: 100%;
  max-width: none;
  margin: 0;
}

.modal.quick-view .product-prices {
  display: flex;
  flex-flow: row wrap;
  align-items: baseline;
  column-gap: 0.6rem;
}

.modal.quick-view .current-price {
  margin-bottom: 0;
}

.modal.quick-view .tax-shipping-delivery-label {
  margin-left: 0;
  font-size: 1.3rem;
}

.modal.quick-view .product-prices-kg {
  flex: 0 0 100%;
}

.modal.quick-view .product-variants select {
  width: 100%;
  max-width: 100%;
}

.modal.quick-view .product-quantity {
  flex-wrap: wrap;
  max-width: 100%;
}

.modal.quick-view .add-to-cart {
  max-width: 100%;
}

/* L'input a la classe .input-group (display:table) : les +/- passaient dessous. */
.modal.quick-view .product-quantity .qty {
  display: flex;
  align-items: stretch;
  width: 81px;
  flex: 0 0 81px;
  height: 46px;
}

.modal.quick-view .product-quantity #quantity_wanted {
  display: block;
  flex: 0 0 60px;
  height: 46px;
}

.modal.quick-view .product-quantity .input-group-btn-vertical {
  width: 21px;
  height: 46px;
}