/* This file is compiled using Sass. Instead of editing it directly
 * please modify g/scss/carts.scss.
 */
.cc {
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
  height: 18px;
  width: 30px;
}
.cc.cc-amex {
  background-image: url("https://gfamedia.org/images/creditcards/amex.png");
}
.cc.cc-mastercard {
  background-image: url("https://gfamedia.org/images/creditcards/mastercard.png");
}
.cc.cc-paypal {
  background-image: url("https://gfamedia.org/images/creditcards/paypal.png");
}
.cc.cc-visa {
  background-image: url("https://gfamedia.org/images/creditcards/visa.png");
}

#cart {
  container-name: editable-cart;
  container-type: inline-size;
}
#cart .modal {
  --bs-modal-width: 400px;
}
#cart .modal .modal-content > img.img-fluid {
  border-bottom-left-radius: var(--bs-modal-border-radius);
  border-bottom-right-radius: var(--bs-modal-border-radius);
  object-fit: contain;
  max-height: 75vh;
}

#items .card-img-top {
  aspect-ratio: 7/10;
  background-color: var(--bs-gray-200);
  object-fit: contain;
  object-position: center;
}

.row.row-item {
  --bs-gutter-x: 1rem;
  --bs-item-label-width: 100%;
  --bs-item-remove-width: calc(4rem + var(--bs-gutter-x));
  --bs-item-change-width: calc(100% - var(--bs-item-remove-width));
}
.row.row-item .col.col-form-label,
.row.row-item .col.col-label {
  flex: 0 0 auto;
  width: var(--bs-item-label-width);
}
.row.row-item .col.col-remove {
  flex: 0 0 auto;
  width: var(--bs-item-remove-width);
}
.row.row-item .col.col-change {
  flex: 0 0 auto;
  width: var(--bs-item-change-width);
}
.row.row-item .col.col-label {
  display: flex;
  gap: 0.5rem;
  justify-content: flex-start;
  align-items: baseline;
}
.row.row-item .col.col-label .form-label {
  display: inline-block;
  margin-bottom: 0.25rem;
}
@container editable-cart (462px <= width) {
  .row.row-item {
    --bs-item-label-width: calc(50% - var(--bs-item-remove-width));
    --bs-item-change-width: 50%;
  }
  .row.row-item .col.col-label {
    align-items: center;
  }
  .row.row-item .col.col-label .form-label {
    margin-bottom: 0;
  }
}

.btn-checkout {
  flex-grow: 1;
  max-width: 18rem;
}

@media (width < 576px) {
  #mobile-checkout {
    background-color: var(--bs-white);
    border-top: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1030;
  }
  #mobile-checkout .btn-checkout {
    max-width: unset;
  }
}

/*# sourceMappingURL=carts.css.map */