.rev-campaign-popup-container .rev-fbt-grid-layout.rev-campaign-container {
  box-sizing: border-box;
  max-width: 1280px;
  width: fit-content;
  padding: var(--padding-1);
}

/* Gift Items */
.rev-fbt-locked {
  position: absolute;
  z-index: 99;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background-color: color-mix(in srgb, var(--base-1) 70%, transparent);
}

.rev-fbt-locked-message {
  line-height: 1.2;
  letter-spacing: -0.1px;
  font-size: var(--font-size-6);
  font-size: max(14px, var(--font-size-6));
  padding: var(--padding-4) var(--padding-2);
  border-radius: var(--border-radius-1);
  background-color: var(--base-3);
  color: var(--base-1);
  box-shadow: 0 12.4px 12.4px 0 color-mix(in srgb, var(--base-3) 20%, transparent);
}

.rev-fbt-grid-gifts > .rev-fbt-locked {
  inset: 0;
  width: auto;
  height: auto;
}

.rev-fbt-grid-gifts .rev-fbt-locked-message {
  max-width: 100%;
  box-sizing: border-box;
  text-align: center;
  overflow-wrap: anywhere;
}

.rev-fbt-gift-ribbon-clip {
  position: absolute;
  inset-block-start: 0;
  inset-inline-end: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 2;
  width: calc(var(--campaign-btn-size) + 40px);
  height: calc(var(--campaign-btn-size) + 40px);
}

.rev-fbt-gift-ribbon {
  position: absolute;
  inset-inline-start: auto;
  pointer-events: none;
  z-index: 2;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.1px;
  font-size: var(--font-size-6);
  font-size: max(14px, var(--font-size-6));
  padding: var(--gap-7) 0;
  inset-block-start: calc(var(--checkbox-mark) + 8px);
  inset-inline-end: calc(var(--min-qty) * -1 - 6px);
  width: calc(var(--min-qty) * 4 + 20px);
  color: var(--theme-fixed);
  background-color: var(--theme-color);
}

:where(html:not([dir="rtl"])) .rev-fbt-gift-ribbon {
  transform: rotate(45deg);
}

:where(html[dir="rtl"]) .rev-fbt-gift-ribbon {
  transform: rotate(-45deg);
}

/*
 * Gift layout follows the Mix Match gift presentation while remaining scoped
 * to Frequently Bought Together.
 */
.rev-fbt-gift-group {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
  border: 1px solid var(--base-5);
  border-radius: var(--border-radius-large);
  background-color: var(--base-1);
}

.rev-fbt-gift-group.rev-fbt-grid-gifts {
  flex: var(--rev-fbt-gift-count) 1 0%;
  min-width: 0;
  width: auto;
  border: 0;
  border-radius: 0;
  background-color: transparent;
}

.rev-fbt-gift-heading {
  line-height: 1;
  display: flex;
  align-items: center;
  gap: var(--gap-5);
  padding: var(--padding-3) var(--padding-2);
  font-size: var(--font-size-4);
  font-size: max(14px, var(--font-size-4));
  color: var(--theme-fixed);
  background-color: var(--theme-color);
}

.rev-fbt-gift-icon {
  line-height: 0;
  font-size: var(--font-size-3);
  font-size: max(14px, var(--font-size-3));
}

.rev-fbt-gift-list {
  display: flex;
  flex-direction: column;
  background-color: var(--theme-color-light);
}

.rev-fbt-gift-item {
  position: relative;
}

.rev-fbt-gift-item + .rev-fbt-gift-item {
  border-top: 1px solid var(--base-5);
}

/*
 * This is intentionally a visual lock only. It does not change FBT selection,
 * qualification, pricing, or cart behavior.
 */
.rev-fbt-gift-group-locked .rev-fbt-gift-item {
  opacity: 0.55;
}

.rev-fbt-gift-group-locked .rev-fbt-gift-item::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  background-color: color-mix(in srgb, var(--base-1) 35%, transparent);
}

.rev-fbt-gift-group-unlocked .rev-fbt-gift-item {
  opacity: 1;
}

.rev-fbt-grid-layout .rev-product-card {
  background-color: var(--theme-color-light);
}

/* Grid Style */
@container campaign (min-width: 624px) {
  .rev-campaign-popup-container .rev-fbt-grid-layout.rev-campaign-container > .rev-campaign-product-container,
  .rev-fbt-grid-layout.rev-fbt-narrow > .rev-campaign-product-container {
    width: calc(var(--rev-fbt-product-count) * var(--grid-product-width) + (var(--rev-fbt-product-count) - 1) * 1px + 2px + 220px + var(--gap-1));
    max-width: min(1220px, 92cqw - var(--padding-1) - var(--padding-1));
    grid-template-columns: minmax(0, 1fr) 220px;
  }

  .rev-fbt-grid-layout {
    --rev-fbt-width: 100%;
  }

  .rev-fbt-grid-layout.rev-campaign-container {
    gap: var(--fbt-gap-1);
    width: var(--rev-fbt-width, fit-content);
    padding-inline-end: calc(var(--fbt-padding-1) - 7px);
  }

  .rev-fbt-grid-layout.rev-fbt-narrow.rev-campaign-container {
    width: fit-content;
  }
  .rev-fbt-grid-layout {
    /* campaign header */
  }

  .rev-fbt-grid-layout .rev-campaign-header {
    gap: var(--fbt-gap-6);
  }

  .rev-fbt-grid-layout .rev-campaign-title {
    font-size: var(--fbt-font-size-2);
    font-size: max(14px, var(--fbt-font-size-2));
  }

  .rev-fbt-grid-layout .rev-campaign-subtitle {
    font-size: var(--fbt-font-size-4);
    font-size: max(14px, var(--fbt-font-size-4));
  }
  .rev-fbt-grid-layout {
    /* offer */
  }

  .rev-fbt-grid-layout .rev-campaign-offer-banner {
    gap: var(--fbt-gap-4);
  }

  .rev-fbt-grid-layout .rev-campaign-offer-card {
    gap: var(--fbt-gap-5);
    font-size: var(--fbt-font-size-3);
    font-size: max(14px, var(--fbt-font-size-3));
    padding: calc(var(--fbt-padding-2) / 2 + 2px) var(--fbt-padding-2);
    border-radius: var(--fbt-border-radius-large);
  }

  .rev-fbt-grid-layout .rev-campaign-offer-heading {
    gap: var(--fbt-gap-4);
  }

  .rev-fbt-grid-layout .rev-campaign-offer-icon {
    font-size: var(--fbt-font-size-1);
    font-size: max(14px, var(--fbt-font-size-1));
  }

  .rev-fbt-grid-layout .rev-product-wrapper {
    flex-direction: row;
  }

  .rev-fbt-grid-layout .rev-campaign-product-container {
    --rev-fbt-plus-size: clamp(10px, 2cqw, var(--fbt-plus-width));
    display: grid;
    grid-template-columns: var(--rev-fbt-columns, 2fr) 220px;
  }

  .rev-fbt-grid-layout.rev-fbt-narrow .rev-campaign-product-container {
    max-width: calc(var(--rev-fbt-product-count) * var(--grid-product-width) + (var(--rev-fbt-product-count) - 1) * 1px + 2px + 220px + var(--gap-1));
    grid-template-columns: minmax(0, 1fr) 220px;
  }

  .rev-fbt-grid-layout .rev-product-container {
    width: 100%;
    height: 100%;
  }

  .rev-fbt-grid-layout .rev-product-separator {
    width: 1px;
    height: 100%;
  }

  .rev-fbt-grid-layout .rev-product-separator-icon {
    font-size: var(--rev-fbt-plus-size);
  }

  .rev-fbt-grid-layout .rev-product-card {
    container-type: inline-size;
    container-name: fbt_grid_product;
    height: 100%;
    padding: var(--border-radius-1);
  }

  .rev-fbt-grid-layout .rev-product-content {
    flex-wrap: wrap;
    gap: var(--fbt-gap-2);
  }

  .rev-fbt-grid-layout .rev-product-selected-quantity {
    inset-inline-end: auto;
    inset-inline-start: -6px;
    height: var(--fbt-min-qty);
    width: var(--fbt-min-qty);
    font-size: var(--fbt-font-size-6);
    font-size: max(14px, var(--fbt-font-size-6));
  }

  .rev-fbt-grid-layout .rev-product-details {
    gap: var(--fbt-gap-6);
  }

  .rev-fbt-grid-layout .rev-product-title,
  .rev-fbt-grid-layout .rev-product-title a {
    font-size: var(--fbt-font-size-3);
    font-size: max(14px, var(--fbt-font-size-3));
  }

  .rev-fbt-grid-layout .rev-product-card .rev-price-wrapper {
    gap: calc(var(--fbt-gap-4) - 2px);
  }

  .rev-fbt-grid-layout .rev-product-card .rev-price-container,
  .rev-fbt-grid-layout .rev-product-card .rev-price-container span.amount {
    gap: var(--fbt-gap-7);
    font-size: var(--fbt-font-size-5);
    font-size: max(14px, var(--fbt-font-size-5));
  }

  .rev-fbt-grid-layout .rev-product-card .rev-price-discount {
    font-size: var(--fbt-font-size-6);
    font-size: max(14px, var(--fbt-font-size-6));
    padding: calc(var(--fbt-padding-4) / 2) var(--fbt-padding-4);
  }

  .rev-fbt-grid-layout .rev-quantity-selector {
    max-width: var(--fbt-qty-max-2);
  }

  .rev-fbt-grid-layout button.rev-quantity-selector-button {
    width: var(--fbt-product-btn);
    font-size: var(--fbt-font-size-3);
    font-size: max(14px, var(--fbt-font-size-3));
    height: calc(var(--fbt-product-btn) - 2px);
  }

  .rev-fbt-grid-layout .rev-quantity-selector input[type=number] {
    font-size: var(--fbt-font-size-5) !important;
    font-size: max(14px, var(--fbt-font-size-5)) !important;
  }

  .rev-fbt-grid-layout .rev-product-variation-wrapper {
    gap: var(--fbt-gap-5);
  }

  .rev-fbt-grid-layout .rev-product-variation-container {
    gap: var(--fbt-gap-6);
  }

  .rev-fbt-grid-layout .rev-product-variation-index {
    font-size: var(--fbt-font-size-6);
    font-size: max(14px, var(--fbt-font-size-6));
  }

  .rev-fbt-grid-layout select.rev-product-variation-select {
    border-radius: var(--fbt-border-radius-3) !important;
    padding: calc(var(--fbt-padding-4) / 2) calc(var(--fbt-padding-4) - 2px) !important;
    padding-inline-end: calc(var(--fbt-padding-4) + 7px) !important;
    font-size: var(--fbt-font-size-4) !important;
    font-size: max(14px, var(--fbt-font-size-4)) !important;
    width: var(--fbt-variation-width) !important;
  }

  .rev-fbt-grid-layout .rev-product-wrapper > .rev-product-container,
  .rev-fbt-grid-layout .rev-fbt-grid-gifts > .rev-product-container {
    flex: 1 1 0%;
    min-width: 0;
    width: 0;
  }

  .rev-fbt-grid-layout .rev-fbt-gift-group.rev-fbt-grid-gifts {
    display: flex;
    flex-direction: row;
    flex: var(--rev-fbt-gift-count) 1 0%;
    min-width: 0;
    width: auto;
    border: 0;
    border-radius: 0;
    background-color: transparent;
  }

  .rev-fbt-grid-layout input[type=checkbox].rev-product-checkbox {
    z-index: 999;
    position: absolute !important;
    inset-block-start: 0 !important;
    inset-inline-end: 0 !important;
    font-size: var(--fbt-font-size-5) !important;
    font-size: max(14px, var(--fbt-font-size-5)) !important;
    width: var(--fbt-checkbox-size) !important;
    height: var(--fbt-checkbox-size) !important;
  }

  .rev-fbt-grid-layout input[type=checkbox].rev-product-checkbox:checked::before {
    height: var(--fbt-checkbox-mark);
    width: calc(var(--fbt-checkbox-mark) / 2);
  }

  .rev-fbt-grid-layout .rev-fbt-locked-message {
    margin: 12px;
    font-size: var(--fbt-font-size-6);
    font-size: max(14px, var(--fbt-font-size-6));
    border-radius: var(--fbt-border-radius-3);
    padding: var(--fbt-gap-6);
  }

  .rev-fbt-grid-layout .rev-fbt-footer {
    width: 220px;
    max-width: 100%;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding: 0;
    border-top: none;
    border-bottom: none;
    gap: var(--fbt-gap-1);
  }

  .rev-fbt-grid-layout .rev-fbt-footer .rev-campaign-price-card {
    gap: var(--gap-5);
    padding: calc(var(--padding-4) - 2px) var(--padding-4);
  }

  .rev-fbt-grid-layout .rev-fbt-footer .rev-campaign-price-title {
    font-size: var(--font-size-6);
    font-size: max(14px, var(--font-size-6));
  }

  .rev-fbt-grid-layout .rev-fbt-footer .rev-price-container,
  .rev-fbt-grid-layout .rev-fbt-footer .rev-price-container span.amount {
    font-size: var(--font-size-5);
    font-size: max(14px, var(--font-size-5));
  }

  .rev-fbt-grid-layout .rev-fbt-footer-empty {
    font-size: var(--fbt-font-size-5);
    font-size: max(14px, var(--fbt-font-size-5));
  }

  .rev-fbt-grid-layout .rev-price-wrapper {
    gap: calc(var(--fbt-gap-4) - 2px);
  }

  .rev-fbt-grid-layout .rev-price-container,
  .rev-fbt-grid-layout .rev-price-container span.amount {
    gap: calc(var(--fbt-gap-6) - 2px);
    font-size: var(--fbt-font-size-3);
    font-size: max(14px, var(--fbt-font-size-3));
  }

  .rev-fbt-grid-layout .rev-price-old,
  .rev-fbt-grid-layout .rev-price-old span.amount {
    font-size: var(--fbt-font-size-6);
    font-size: max(14px, var(--fbt-font-size-6));
  }

  .rev-fbt-grid-layout button.rev-campaign-button {
    padding: 0 var(--fbt-padding-2) !important;
    font-size: var(--fbt-font-size-5) !important;
    font-size: max(14px, var(--fbt-font-size-5)) !important;
    height: var(--fbt-campaign-btn-size) !important;
    min-height: var(--fbt-campaign-btn-size) !important;
    border-radius: var(--fbt-border-radius-2) !important;
  }
  /* campaign product container override */
  .rev-fbt-grid-layout .rev-product-image-wrapper img,
  .woocommerce .rev-fbt-grid-layout .rev-product-image-wrapper img,
  .woocommerce-page .rev-fbt-grid-layout .rev-product-image-wrapper img {
    width: 100%;
    max-width: 100%;
    border-radius: 0;
  }
}

@container fbt_grid_product (max-width: 152px) {
  .rev-fbt-grid-layout .rev-product-selected-quantity {
    height: calc(var(--fbt-min-qty) - 6px * var(--responsive-factor-1));
    width: calc(var(--fbt-min-qty) - 6px * var(--responsive-factor-1));
    font-size: calc(var(--fbt-font-size-6) - 2px * var(--responsive-factor-1));
    font-size: max(14px, var(--fbt-font-size-6) - 2px * var(--responsive-factor-1));
  }

  .rev-fbt-grid-layout .rev-product-title,
  .rev-fbt-grid-layout .rev-product-title a {
    font-size: calc(var(--fbt-font-size-3) - 4px * var(--responsive-factor-1));
    font-size: max(14px, var(--fbt-font-size-3) - 4px * var(--responsive-factor-1));
  }

  .rev-fbt-grid-layout .rev-fbt-gift-ribbon-clip {
    width: calc(var(--fbt-campaign-btn-size) + 40px);
    height: calc(var(--fbt-campaign-btn-size) + 40px);
  }

  .rev-fbt-grid-layout .rev-fbt-gift-ribbon {
    line-height: 1;
    font-size: var(--fbt-font-size-6);
    font-size: max(12px, var(--fbt-font-size-6));
    padding: calc(var(--fbt-gap-6) - 3px) 0;
    inset-block-start: var(--fbt-checkbox-mark);
    inset-inline-end: calc(var(--fbt-min-qty) * -1);
    width: calc(var(--fbt-min-qty) * 4 + 4px);
  }

  .rev-fbt-grid-layout input[type=checkbox].rev-product-checkbox {
    font-size: calc(var(--fbt-font-size-5) - 2px * var(--responsive-factor-1)) !important;
    font-size: max(14px, var(--fbt-font-size-5) - 2px * var(--responsive-factor-1)) !important;
    width: calc(var(--fbt-checkbox-size) - 4px * var(--responsive-factor-1)) !important;
    height: calc(var(--fbt-checkbox-size) - 4px * var(--responsive-factor-1)) !important;
  }

  .rev-fbt-grid-layout input[type=checkbox].rev-product-checkbox:checked::before {
    height: calc(var(--fbt-checkbox-mark) - 4px);
    width: calc(var(--fbt-checkbox-mark) / 2 - 2px);
  }

  :where(html:not([dir="rtl"])) .rev-fbt-grid-layout input[type=checkbox].rev-product-checkbox:checked::before {
    border-width: 0 1px 1px 0;
  }

  :where(html[dir="rtl"]) .rev-fbt-grid-layout input[type=checkbox].rev-product-checkbox:checked::before {
    border-width: 0 0 1px 1px;
  }

  .rev-fbt-grid-layout .rev-product-card .rev-price-container,
  .rev-fbt-grid-layout .rev-product-card .rev-price-container span.amount {
    font-size: calc(var(--fbt-font-size-5) - 1px * var(--responsive-factor-1));
    font-size: max(14px, var(--fbt-font-size-5) - 1px * var(--responsive-factor-1));
  }

  .rev-fbt-grid-layout .rev-price-discount {
    padding: calc((var(--fbt-padding-4) - 6px * var(--responsive-factor-1)) / 2) calc(var(--fbt-padding-4) - 4px * var(--responsive-factor-1)) !important;
  }

  .rev-fbt-grid-layout .rev-quantity-selector {
    max-width: var(--fbt-qty-max-2);
    max-width: calc(var(--fbt-qty-max-2) - 12px * var(--responsive-factor-1));
  }

  .rev-fbt-grid-layout button.rev-quantity-selector-button {
    width: calc(var(--fbt-product-btn) - 4px * var(--responsive-factor-1));
    height: calc(var(--fbt-product-btn) - 4px * var(--responsive-factor-1) - 2px);
    font-size: calc(var(--fbt-font-size-3) - 4px * var(--responsive-factor-1));
    font-size: max(14px, var(--fbt-font-size-3) - 4px * var(--responsive-factor-1));
  }

  .rev-fbt-grid-layout select.rev-product-variation-select {
    font-size: var(--font-size-6) !important;
    font-size: max(14px, var(--font-size-6)) !important;
    padding: calc(var(--border-radius-1) / 2) calc(var(--border-radius-1) - 2px) !important;
    padding-inline-end: calc(var(--border-radius-1) + 7px) !important;
    width: 70cqw !important;
  }
}

@container fbt_grid_product (max-width: 116px) {
  .rev-fbt-grid-layout .rev-product-title,
  .rev-fbt-grid-layout .rev-product-title a {
    font-size: calc(var(--fbt-font-size-3) - 4px * var(--responsive-factor-2));
    font-size: max(14px, var(--fbt-font-size-3) - 4px * var(--responsive-factor-2));
  }

  .rev-fbt-grid-layout .rev-fbt-gift-ribbon-clip {
    width: calc(var(--fbt-campaign-btn-size) + 20px);
    height: calc(var(--fbt-campaign-btn-size) + 20px);
  }

  .rev-fbt-grid-layout .rev-fbt-gift-ribbon {
    inset-inline-end: calc(var(--fbt-min-qty) * -1.3);
    width: calc(var(--fbt-min-qty) * 4 + 6px);
  }

  .rev-fbt-grid-layout .rev-product-card .rev-price-container,
  .rev-fbt-grid-layout .rev-product-card .rev-price-container span.amount {
    font-size: calc(var(--fbt-font-size-5) - 1px * var(--responsive-factor-2));
    font-size: max(14px, var(--fbt-font-size-5) - 1px * var(--responsive-factor-2));
  }

  .rev-fbt-grid-layout .rev-quantity-selector {
    max-width: var(--fbt-qty-max-2);
    max-width: calc(var(--fbt-qty-max-2) - 12px * var(--responsive-factor-2));
  }

  .rev-fbt-grid-layout button.rev-quantity-selector-button {
    width: calc(var(--fbt-product-btn) - 4px * var(--responsive-factor-2));
    height: calc(var(--fbt-product-btn) - 4px * var(--responsive-factor-2) - 2px);
    font-size: calc(var(--fbt-font-size-3) - 2px * var(--responsive-factor-2));
    font-size: max(14px, var(--fbt-font-size-3) - 2px * var(--responsive-factor-2));
  }

  .rev-fbt-grid-layout select.rev-product-variation-select {
    width: 60cqw !important;
  }
}

@container campaign (max-width: 594px) {
  .rev-campaign-wrapper.rev-fbt-grid {
    width: 100%;
  }

  .rev-campaign-wrapper.rev-fbt-grid .rev-campaign-popup-container {
    width: 100%;
  }

  .rev-campaign-wrapper.rev-fbt-grid .rev-campaign-container.rev-fbt-grid-layout {
    width: 100%;
  }
}

/* Revenue Colibri compatibility layer */

html.colibri-wp-theme .rev-campaign-viewport .rev-campaign-popup-container .rev-fbt-grid-layout.rev-campaign-container {
  box-sizing: border-box;
  max-width: 1280px;
  width: fit-content;
  padding: var(--padding-1);
}

/* Gift Items */

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-locked {
  position: absolute;
  z-index: 99;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background-color: color-mix(in srgb, var(--base-1) 70%, transparent);
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-locked-message {
  line-height: 1.2;
  letter-spacing: -0.1px;
  font-size: var(--font-size-6);
  font-size: max(14px, var(--font-size-6));
  padding: var(--padding-4) var(--padding-2);
  border-radius: var(--border-radius-1);
  background-color: var(--base-3);
  color: var(--base-1);
  box-shadow: 0 12.4px 12.4px 0 color-mix(in srgb, var(--base-3) 20%, transparent);
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-gifts > .rev-fbt-locked {
  inset: 0;
  width: auto;
  height: auto;
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-gifts .rev-fbt-locked-message {
  max-width: 100%;
  box-sizing: border-box;
  text-align: center;
  overflow-wrap: anywhere;
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-gift-ribbon-clip {
  position: absolute;
  inset-block-start: 0;
  inset-inline-end: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 2;
  width: calc(var(--campaign-btn-size) + 40px);
  height: calc(var(--campaign-btn-size) + 40px);
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-gift-ribbon {
  position: absolute;
  inset-inline-start: auto;
  pointer-events: none;
  z-index: 2;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.1px;
  font-size: var(--font-size-6);
  font-size: max(14px, var(--font-size-6));
  padding: var(--gap-7) 0;
  inset-block-start: calc(var(--checkbox-mark) + 8px);
  inset-inline-end: calc(var(--min-qty) * -1 - 6px);
  width: calc(var(--min-qty) * 4 + 20px);
  color: var(--theme-fixed);
  background-color: var(--theme-color);
}

html.colibri-wp-theme .rev-campaign-viewport :where(html:not([dir="rtl"])) .rev-fbt-gift-ribbon {
  transform: rotate(45deg);
}

html.colibri-wp-theme .rev-campaign-viewport :where(html[dir="rtl"]) .rev-fbt-gift-ribbon {
  transform: rotate(-45deg);
}

/*
 * Gift layout follows the Mix Match gift presentation while remaining scoped
 * to Frequently Bought Together.
 */

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-gift-group {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
  border: 1px solid var(--base-5);
  border-radius: var(--border-radius-large);
  background-color: var(--base-1);
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-gift-group.rev-fbt-grid-gifts {
  flex: var(--rev-fbt-gift-count) 1 0%;
  min-width: 0;
  width: auto;
  border: 0;
  border-radius: 0;
  background-color: transparent;
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-gift-heading {
  line-height: 1;
  display: flex;
  align-items: center;
  gap: var(--gap-5);
  padding: var(--padding-3) var(--padding-2);
  font-size: var(--font-size-4);
  font-size: max(14px, var(--font-size-4));
  color: var(--theme-fixed);
  background-color: var(--theme-color);
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-gift-icon {
  line-height: 0;
  font-size: var(--font-size-3);
  font-size: max(14px, var(--font-size-3));
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-gift-list {
  display: flex;
  flex-direction: column;
  background-color: var(--theme-color-light);
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-gift-item {
  position: relative;
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-gift-item + .rev-fbt-gift-item {
  border-top: 1px solid var(--base-5);
}

/*
 * This is intentionally a visual lock only. It does not change FBT selection,
 * qualification, pricing, or cart behavior.
 */

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-gift-group-locked .rev-fbt-gift-item {
  opacity: 0.55;
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-gift-group-locked .rev-fbt-gift-item::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  background-color: color-mix(in srgb, var(--base-1) 35%, transparent);
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-gift-group-unlocked .rev-fbt-gift-item {
  opacity: 1;
}

html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-card {
  background-color: var(--theme-color-light);
}

/* Grid Style */

@container campaign (min-width: 624px) {
  html.colibri-wp-theme .rev-campaign-viewport .rev-campaign-popup-container .rev-fbt-grid-layout.rev-campaign-container > .rev-campaign-product-container, html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout.rev-fbt-narrow > .rev-campaign-product-container {
    width: calc(var(--rev-fbt-product-count) * var(--grid-product-width) + (var(--rev-fbt-product-count) - 1) * 1px + 2px + 220px + var(--gap-1));
    max-width: min(1220px, 92cqw - var(--padding-1) - var(--padding-1));
    grid-template-columns: minmax(0, 1fr) 220px;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout {
    --rev-fbt-width: 100%;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout.rev-campaign-container {
    gap: var(--fbt-gap-1);
    width: var(--rev-fbt-width, fit-content);
    padding-inline-end: calc(var(--fbt-padding-1) - 7px);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout.rev-fbt-narrow.rev-campaign-container {
    width: fit-content;
  }
  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout {
    /* campaign header */
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-campaign-header {
    gap: var(--fbt-gap-6);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-campaign-title {
    font-size: var(--fbt-font-size-2);
    font-size: max(14px, var(--fbt-font-size-2));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-campaign-subtitle {
    font-size: var(--fbt-font-size-4);
    font-size: max(14px, var(--fbt-font-size-4));
  }
  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout {
    /* offer */
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-campaign-offer-banner {
    gap: var(--fbt-gap-4);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-campaign-offer-card {
    gap: var(--fbt-gap-5);
    font-size: var(--fbt-font-size-3);
    font-size: max(14px, var(--fbt-font-size-3));
    padding: calc(var(--fbt-padding-2) / 2 + 2px) var(--fbt-padding-2);
    border-radius: var(--fbt-border-radius-large);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-campaign-offer-heading {
    gap: var(--fbt-gap-4);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-campaign-offer-icon {
    font-size: var(--fbt-font-size-1);
    font-size: max(14px, var(--fbt-font-size-1));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-wrapper {
    flex-direction: row;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-campaign-product-container {
    --rev-fbt-plus-size: clamp(10px, 2cqw, var(--fbt-plus-width));
    display: grid;
    grid-template-columns: var(--rev-fbt-columns, 2fr) 220px;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout.rev-fbt-narrow .rev-campaign-product-container {
    max-width: calc(var(--rev-fbt-product-count) * var(--grid-product-width) + (var(--rev-fbt-product-count) - 1) * 1px + 2px + 220px + var(--gap-1));
    grid-template-columns: minmax(0, 1fr) 220px;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-container {
    width: 100%;
    height: 100%;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-separator {
    width: 1px;
    height: 100%;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-separator-icon {
    font-size: var(--rev-fbt-plus-size);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-card {
    container-type: inline-size;
    container-name: fbt_grid_product;
    height: 100%;
    padding: var(--border-radius-1);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-content {
    flex-wrap: wrap;
    gap: var(--fbt-gap-2);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-selected-quantity {
    inset-inline-end: auto;
    inset-inline-start: -6px;
    height: var(--fbt-min-qty);
    width: var(--fbt-min-qty);
    font-size: var(--fbt-font-size-6);
    font-size: max(14px, var(--fbt-font-size-6));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-details {
    gap: var(--fbt-gap-6);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-title, html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-title a {
    font-size: var(--fbt-font-size-3);
    font-size: max(14px, var(--fbt-font-size-3));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-card .rev-price-wrapper {
    gap: calc(var(--fbt-gap-4) - 2px);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-card .rev-price-container, html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-card .rev-price-container span.amount {
    gap: var(--fbt-gap-7);
    font-size: var(--fbt-font-size-5);
    font-size: max(14px, var(--fbt-font-size-5));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-card .rev-price-discount {
    font-size: var(--fbt-font-size-6);
    font-size: max(14px, var(--fbt-font-size-6));
    padding: calc(var(--fbt-padding-4) / 2) var(--fbt-padding-4);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-quantity-selector {
    max-width: var(--fbt-qty-max-2);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout button.rev-quantity-selector-button {
    width: var(--fbt-product-btn);
    font-size: var(--fbt-font-size-3);
    font-size: max(14px, var(--fbt-font-size-3));
    height: calc(var(--fbt-product-btn) - 2px);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-quantity-selector input[type=number] {
    font-size: var(--fbt-font-size-5) !important;
    font-size: max(14px, var(--fbt-font-size-5)) !important;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-variation-wrapper {
    gap: var(--fbt-gap-5);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-variation-container {
    gap: var(--fbt-gap-6);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-variation-index {
    font-size: var(--fbt-font-size-6);
    font-size: max(14px, var(--fbt-font-size-6));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout select.rev-product-variation-select {
    border-radius: var(--fbt-border-radius-3) !important;
    padding: calc(var(--fbt-padding-4) / 2) calc(var(--fbt-padding-4) - 2px) !important;
    padding-inline-end: calc(var(--fbt-padding-4) + 7px) !important;
    font-size: var(--fbt-font-size-4) !important;
    font-size: max(14px, var(--fbt-font-size-4)) !important;
    width: var(--fbt-variation-width) !important;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-wrapper > .rev-product-container, html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-fbt-grid-gifts > .rev-product-container {
    flex: 1 1 0%;
    min-width: 0;
    width: 0;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-fbt-gift-group.rev-fbt-grid-gifts {
    display: flex;
    flex-direction: row;
    flex: var(--rev-fbt-gift-count) 1 0%;
    min-width: 0;
    width: auto;
    border: 0;
    border-radius: 0;
    background-color: transparent;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout input[type=checkbox].rev-product-checkbox {
    z-index: 999;
    position: absolute !important;
    inset-block-start: 0 !important;
    inset-inline-end: 0 !important;
    font-size: var(--fbt-font-size-5) !important;
    font-size: max(14px, var(--fbt-font-size-5)) !important;
    width: var(--fbt-checkbox-size) !important;
    height: var(--fbt-checkbox-size) !important;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout input[type=checkbox].rev-product-checkbox:checked::before {
    height: var(--fbt-checkbox-mark);
    width: calc(var(--fbt-checkbox-mark) / 2);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-fbt-locked-message {
    margin: 12px;
    font-size: var(--fbt-font-size-6);
    font-size: max(14px, var(--fbt-font-size-6));
    border-radius: var(--fbt-border-radius-3);
    padding: var(--fbt-gap-6);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-fbt-footer {
    width: 220px;
    max-width: 100%;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding: 0;
    border-top: none;
    border-bottom: none;
    gap: var(--fbt-gap-1);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-fbt-footer .rev-campaign-price-card {
    gap: var(--gap-5);
    padding: calc(var(--padding-4) - 2px) var(--padding-4);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-fbt-footer .rev-campaign-price-title {
    font-size: var(--font-size-6);
    font-size: max(14px, var(--font-size-6));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-fbt-footer .rev-price-container, html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-fbt-footer .rev-price-container span.amount {
    font-size: var(--font-size-5);
    font-size: max(14px, var(--font-size-5));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-fbt-footer-empty {
    font-size: var(--fbt-font-size-5);
    font-size: max(14px, var(--fbt-font-size-5));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-price-wrapper {
    gap: calc(var(--fbt-gap-4) - 2px);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-price-container, html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-price-container span.amount {
    gap: calc(var(--fbt-gap-6) - 2px);
    font-size: var(--fbt-font-size-3);
    font-size: max(14px, var(--fbt-font-size-3));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-price-old, html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-price-old span.amount {
    font-size: var(--fbt-font-size-6);
    font-size: max(14px, var(--fbt-font-size-6));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout button.rev-campaign-button {
    padding: 0 var(--fbt-padding-2) !important;
    font-size: var(--fbt-font-size-5) !important;
    font-size: max(14px, var(--fbt-font-size-5)) !important;
    height: var(--fbt-campaign-btn-size) !important;
    min-height: var(--fbt-campaign-btn-size) !important;
    border-radius: var(--fbt-border-radius-2) !important;
  }
  /* campaign product container override */
  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-image-wrapper img, html.colibri-wp-theme .rev-campaign-viewport .woocommerce .rev-fbt-grid-layout .rev-product-image-wrapper img, html.colibri-wp-theme .rev-campaign-viewport .woocommerce-page .rev-fbt-grid-layout .rev-product-image-wrapper img {
    width: 100%;
    max-width: 100%;
    border-radius: 0;
  }
}

@container fbt_grid_product (max-width: 152px) {
  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-selected-quantity {
    height: calc(var(--fbt-min-qty) - 6px * var(--responsive-factor-1));
    width: calc(var(--fbt-min-qty) - 6px * var(--responsive-factor-1));
    font-size: calc(var(--fbt-font-size-6) - 2px * var(--responsive-factor-1));
    font-size: max(14px, var(--fbt-font-size-6) - 2px * var(--responsive-factor-1));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-title, html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-title a {
    font-size: calc(var(--fbt-font-size-3) - 4px * var(--responsive-factor-1));
    font-size: max(14px, var(--fbt-font-size-3) - 4px * var(--responsive-factor-1));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-fbt-gift-ribbon-clip {
    width: calc(var(--fbt-campaign-btn-size) + 40px);
    height: calc(var(--fbt-campaign-btn-size) + 40px);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-fbt-gift-ribbon {
    line-height: 1;
    font-size: var(--fbt-font-size-6);
    font-size: max(12px, var(--fbt-font-size-6));
    padding: calc(var(--fbt-gap-6) - 3px) 0;
    inset-block-start: var(--fbt-checkbox-mark);
    inset-inline-end: calc(var(--fbt-min-qty) * -1);
    width: calc(var(--fbt-min-qty) * 4 + 4px);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout input[type=checkbox].rev-product-checkbox {
    font-size: calc(var(--fbt-font-size-5) - 2px * var(--responsive-factor-1)) !important;
    font-size: max(14px, var(--fbt-font-size-5) - 2px * var(--responsive-factor-1)) !important;
    width: calc(var(--fbt-checkbox-size) - 4px * var(--responsive-factor-1)) !important;
    height: calc(var(--fbt-checkbox-size) - 4px * var(--responsive-factor-1)) !important;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout input[type=checkbox].rev-product-checkbox:checked::before {
    height: calc(var(--fbt-checkbox-mark) - 4px);
    width: calc(var(--fbt-checkbox-mark) / 2 - 2px);
  }

  html.colibri-wp-theme .rev-campaign-viewport :where(html:not([dir="rtl"])) .rev-fbt-grid-layout input[type=checkbox].rev-product-checkbox:checked::before {
    border-width: 0 1px 1px 0;
  }

  html.colibri-wp-theme .rev-campaign-viewport :where(html[dir="rtl"]) .rev-fbt-grid-layout input[type=checkbox].rev-product-checkbox:checked::before {
    border-width: 0 0 1px 1px;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-card .rev-price-container, html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-card .rev-price-container span.amount {
    font-size: calc(var(--fbt-font-size-5) - 1px * var(--responsive-factor-1));
    font-size: max(14px, var(--fbt-font-size-5) - 1px * var(--responsive-factor-1));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-price-discount {
    padding: calc((var(--fbt-padding-4) - 6px * var(--responsive-factor-1)) / 2) calc(var(--fbt-padding-4) - 4px * var(--responsive-factor-1)) !important;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-quantity-selector {
    max-width: var(--fbt-qty-max-2);
    max-width: calc(var(--fbt-qty-max-2) - 12px * var(--responsive-factor-1));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout button.rev-quantity-selector-button {
    width: calc(var(--fbt-product-btn) - 4px * var(--responsive-factor-1));
    height: calc(var(--fbt-product-btn) - 4px * var(--responsive-factor-1) - 2px);
    font-size: calc(var(--fbt-font-size-3) - 4px * var(--responsive-factor-1));
    font-size: max(14px, var(--fbt-font-size-3) - 4px * var(--responsive-factor-1));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout select.rev-product-variation-select {
    font-size: var(--font-size-6) !important;
    font-size: max(14px, var(--font-size-6)) !important;
    padding: calc(var(--border-radius-1) / 2) calc(var(--border-radius-1) - 2px) !important;
    padding-inline-end: calc(var(--border-radius-1) + 7px) !important;
    width: 70cqw !important;
  }
}

@container fbt_grid_product (max-width: 116px) {
  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-title, html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-title a {
    font-size: calc(var(--fbt-font-size-3) - 4px * var(--responsive-factor-2));
    font-size: max(14px, var(--fbt-font-size-3) - 4px * var(--responsive-factor-2));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-fbt-gift-ribbon-clip {
    width: calc(var(--fbt-campaign-btn-size) + 20px);
    height: calc(var(--fbt-campaign-btn-size) + 20px);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-fbt-gift-ribbon {
    inset-inline-end: calc(var(--fbt-min-qty) * -1.3);
    width: calc(var(--fbt-min-qty) * 4 + 6px);
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-card .rev-price-container, html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-product-card .rev-price-container span.amount {
    font-size: calc(var(--fbt-font-size-5) - 1px * var(--responsive-factor-2));
    font-size: max(14px, var(--fbt-font-size-5) - 1px * var(--responsive-factor-2));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout .rev-quantity-selector {
    max-width: var(--fbt-qty-max-2);
    max-width: calc(var(--fbt-qty-max-2) - 12px * var(--responsive-factor-2));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout button.rev-quantity-selector-button {
    width: calc(var(--fbt-product-btn) - 4px * var(--responsive-factor-2));
    height: calc(var(--fbt-product-btn) - 4px * var(--responsive-factor-2) - 2px);
    font-size: calc(var(--fbt-font-size-3) - 2px * var(--responsive-factor-2));
    font-size: max(14px, var(--fbt-font-size-3) - 2px * var(--responsive-factor-2));
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-fbt-grid-layout select.rev-product-variation-select {
    width: 60cqw !important;
  }
}

@container campaign (max-width: 594px) {
  html.colibri-wp-theme .rev-campaign-viewport .rev-campaign-wrapper.rev-fbt-grid {
    width: 100%;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-campaign-wrapper.rev-fbt-grid .rev-campaign-popup-container {
    width: 100%;
  }

  html.colibri-wp-theme .rev-campaign-viewport .rev-campaign-wrapper.rev-fbt-grid .rev-campaign-container.rev-fbt-grid-layout {
    width: 100%;
  }
}