/* CG_CART_FINAL_CONFLICT_FIX_START
   Final scoped minicart fix:
   - beats old _mbdesign.less absolute delete/edit rules
   - beats old forced trash pseudo glyph
   - only product list scrolls
   - product image is centered/larger
   - Remove sits right and does not jump on hover
*/
html body .mfp-wrap.cart-modal,
html body .mfp-wrap.cart-modal[style] {
  overflow: hidden !important;
}

html body .mfp-wrap.cart-modal .mfp-container {
  display: flex !important;
  align-items: stretch !important;
  justify-content: flex-end !important;
  width: 100% !important;
  height: 100vh !important;
  height: 100dvh !important;
  padding: 0 !important;
  overflow: hidden !important;
  text-align: left !important;
}

html body .mfp-wrap.cart-modal .mfp-container::before {
  display: none !important;
  content: none !important;
  height: 0 !important;
}

html body .mfp-wrap.cart-modal .mfp-content {
  display: flex !important;
  align-items: stretch !important;
  justify-content: flex-end !important;
  width: min(520px, calc(100vw - 18px)) !important;
  max-width: min(520px, calc(100vw - 18px)) !important;
  height: 100vh !important;
  height: 100dvh !important;
  max-height: 100vh !important;
  max-height: 100dvh !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  vertical-align: top !important;
}

html body .mfp-wrap.cart-modal .minicart-wrapper.minicart-slide,
html body .mfp-wrap.cart-modal .block-minicart,
html body .mfp-wrap.cart-modal .block-minicart .block-content {
  height: 100vh !important;
  height: 100dvh !important;
  max-height: 100vh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
}

html body .mfp-wrap.cart-modal .block-minicart .block-content {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  min-height: 0 !important;
}

/*
 * Current template still has title-top inside minicart-items-wrapper.
 * Make wrapper a grid:
 *   row 1 = title
 *   row 2 = products only, scrollable only when needed
 */
html body .mfp-wrap.cart-modal .minicart-items-wrapper {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

html body .mfp-wrap.cart-modal .title-top {
  grid-row: 1 !important;
  position: static !important;
  flex: 0 0 auto !important;
}

html body .mfp-wrap.cart-modal #mini-cart.minicart-items,
html body .mfp-wrap.cart-modal .minicart-items {
  grid-row: 2 !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 16px 18px 12px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-gutter: auto !important;
}

html body .mfp-wrap.cart-modal .cart-sum-wrap {
  grid-row: 2 !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
}

/* Do not let empty promotion/widget region create phantom height. */
html body .mfp-wrap.cart-modal #minicart-widgets:empty,
html body .mfp-wrap.cart-modal .minicart-widgets:empty {
  display: none !important;
}

/* Product card and image alignment. */
html body .mfp-wrap.cart-modal .minicart-items .product-item {
  padding: 14px !important;
  border-radius: 22px !important;
}

html body .mfp-wrap.cart-modal .minicart-items .product {
  display: grid !important;
  grid-template-columns: 118px minmax(0, 1fr) !important;
  gap: 15px !important;
  align-items: start !important;
  position: relative !important;
}

html body .mfp-wrap.cart-modal .product-item-photo {
  display: grid !important;
  place-items: center !important;
  width: 118px !important;
  min-width: 118px !important;
  max-width: 118px !important;
  height: 118px !important;
  min-height: 118px !important;
  max-height: 118px !important;
  padding: 10px !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  background:
    radial-gradient(9rem 5rem at 20% -45%, rgba(216, 189, 123, .20), transparent 70%),
    #fffaf0 !important;
  border: 1px solid rgba(216, 189, 123, .26) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.76) !important;
}

html body .mfp-wrap.cart-modal .product-image-container,
html body .mfp-wrap.cart-modal .product-image-container[style],
html body .mfp-wrap.cart-modal .product-image-wrapper,
html body .mfp-wrap.cart-modal .product-image-wrapper[style] {
  position: static !important;
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  padding-bottom: 0 !important;
  overflow: visible !important;
}

html body .mfp-wrap.cart-modal .product-image-photo,
html body .mfp-wrap.cart-modal .product-image-photo[style] {
  position: static !important;
  inset: auto !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 108px !important;
  max-height: 108px !important;
  margin: auto !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Actions: Edit left, Remove right. */
html body .mfp-wrap.cart-modal .product.actions {
  position: static !important;
  display: grid !important;
  grid-template-columns: auto minmax(8px, 1fr) auto !important;
  align-items: center !important;
  gap: 9px !important;
  width: 100% !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
}

html body .mfp-wrap.cart-modal .product.actions .primary {
  grid-column: 1 !important;
  justify-self: start !important;
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body .mfp-wrap.cart-modal .product.actions .secondary {
  grid-column: 3 !important;
  justify-self: end !important;
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Beat old absolute .minicart-items .action.edit/delete rules. */
html body .mfp-wrap.cart-modal .minicart-items .product.actions .action.edit,
html body .mfp-wrap.cart-modal .minicart-items .product.actions .action.delete {
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  translate: none !important;
  transform: none !important;
}

/* Edit pill. */
html body .mfp-wrap.cart-modal .product.actions .action.edit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 31px !important;
  width: auto !important;
  height: 31px !important;
  padding: 0 11px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(13, 22, 36, .08) !important;
  color: #172033 !important;
  background: rgba(255,255,255,.74) !important;
  text-decoration: none !important;
  font-family: var(--cg-font, "Inter", "Helvetica Neue", Arial, sans-serif) !important;
  font-size: 11.5px !important;
  font-weight: 850 !important;
  letter-spacing: .01em !important;
  line-height: 1 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65) !important;
}

html body .mfp-wrap.cart-modal .product.actions .action.edit:hover,
html body .mfp-wrap.cart-modal .product.actions .action.edit:focus-visible {
  color: #101828 !important;
  background: #fffaf0 !important;
  border-color: rgba(216, 189, 123, .30) !important;
  transform: none !important;
  outline: none !important;
}

/* Remove pill, right-aligned and stable. */
html body .mfp-wrap.cart-modal .product.actions .action.delete {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  width: auto !important;
  min-height: 31px !important;
  height: 31px !important;
  margin: 0 !important;
  padding: 0 11px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(180, 83, 9, .22) !important;
  color: #7f1d1d !important;
  background: rgba(255,247,237,.88) !important;
  text-decoration: none !important;
  font-family: var(--cg-font, "Inter", "Helvetica Neue", Arial, sans-serif) !important;
  font-size: 11.5px !important;
  font-weight: 850 !important;
  letter-spacing: .01em !important;
  line-height: 1 !important;
  opacity: 1 !important;
  visibility: visible !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.66) !important;
  transition:
    color .14s ease,
    background .14s ease,
    border-color .14s ease,
    box-shadow .14s ease !important;
}

/* If template is patched, use icon + label and kill old glyph. */
html body .mfp-wrap.cart-modal .product.actions .action.delete.cg-cart-remove-template::before,
html body .mfp-wrap.cart-modal .product.actions .action.delete.cg-cart-remove-template::after {
  content: none !important;
  display: none !important;
}

/* If old empty anchor still renders, force readable text instead of the old mbicon glyph. */
html body .mfp-wrap.cart-modal .minicart-items .product.actions .action.delete:not(.cg-cart-remove-template)::before {
  content: "Remove" !important;
  display: inline-block !important;
  color: currentColor !important;
  font-family: var(--cg-font, "Inter", "Helvetica Neue", Arial, sans-serif) !important;
  font-size: 11.5px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
}

html body .mfp-wrap.cart-modal .minicart-items .product.actions .action.delete:not(.cg-cart-remove-template)::after {
  content: none !important;
  display: none !important;
}

html body .mfp-wrap.cart-modal .cg-cart-remove-icon {
  display: inline-grid !important;
  place-items: center !important;
  width: 14px !important;
  height: 14px !important;
  color: currentColor !important;
}

html body .mfp-wrap.cart-modal .cg-cart-remove-icon svg {
  display: block !important;
  width: 14px !important;
  height: 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html body .mfp-wrap.cart-modal .cg-cart-remove-label {
  display: inline-block !important;
  color: currentColor !important;
  line-height: 1 !important;
}

html body .mfp-wrap.cart-modal .product.actions .action.delete:hover,
html body .mfp-wrap.cart-modal .product.actions .action.delete:focus-visible {
  color: #7f1d1d !important;
  background: #fff7ed !important;
  border-color: rgba(180, 83, 9, .34) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.72),
    0 4px 12px rgba(127,29,29,.06) !important;
  transform: none !important;
  outline: none !important;
}

/* Mobile image/action sizing. */
@media (max-width: 767px) {
  html body .mfp-wrap.cart-modal .minicart-items .product {
    grid-template-columns: 90px minmax(0, 1fr) !important;
    gap: 12px !important;
  }

  html body .mfp-wrap.cart-modal .product-item-photo {
    width: 90px !important;
    min-width: 90px !important;
    max-width: 90px !important;
    height: 90px !important;
    min-height: 90px !important;
    max-height: 90px !important;
    padding: 8px !important;
    border-radius: 17px !important;
  }

  html body .mfp-wrap.cart-modal .product-image-photo,
  html body .mfp-wrap.cart-modal .product-image-photo[style] {
    max-width: 82px !important;
    max-height: 82px !important;
  }

  html body .mfp-wrap.cart-modal .product.actions {
    gap: 7px !important;
  }

  html body .mfp-wrap.cart-modal .product.actions .action.edit,
  html body .mfp-wrap.cart-modal .product.actions .action.delete {
    min-height: 30px !important;
    height: 30px !important;
    padding: 0 10px !important;
    font-size: 11px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body .mfp-wrap.cart-modal *,
  html body .mfp-wrap.cart-modal *::before,
  html body .mfp-wrap.cart-modal *::after {
    transition: none !important;
    animation: none !important;
    transform: none !important;
  }
}
/* CG_CART_FINAL_CONFLICT_FIX_END */