/** Shopify CDN: Minification failed

Line 719:0 Unexpected "}"

**/
/* Custom Product Styles */

/* Breadcrumbs */
.custom-product__breadcrumbs {
  padding: 1rem 0;
  margin-bottom: 1rem;
}

/* Main layout */
.custom-product__container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  align-items: start;
}

.custom-product__media {
  position: relative;
}

/* Ensure product media container can hold overlays */
.product-media {
  position: relative;
}

.custom-product__info {
  padding-left: 1rem;
}

.custom-product__details {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.custom-product__block--sm {
  margin-bottom: 0.5rem;
}

/* Typography */
.custom-product__title-block {
  margin-bottom: 1rem;
}

.custom-product__title-wrapper {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
}

.custom-product__title {
  margin: 0;
  flex: 1 1 auto;
  font-weight: bold;
}

.custom-product__title-stars {
  flex: 0 0 auto;
}

.custom-product__vendor-type {
  font-size: 0.875rem;
  color: #666;
}

.custom-product__brand a,
.custom-product__type a {
  text-decoration: none;
  color: inherit;
}

.custom-product__brand a:hover,
.custom-product__type a:hover {
  text-decoration: underline;
}

/* Price with shield */
.custom-product__price-wrapper {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.custom-product__price-shield {
  flex: 1;
}

.custom-product__price {
  margin-bottom: 0.5rem;
}

.custom-product__current-price {
  font-size: 1.5rem;
  font-weight: bold;
}

.custom-product__was-price {
  font-size: 1.25rem;
  text-decoration: line-through;
  color: #666;
  margin-left: 0.5rem;
}

.custom-product__price--on-sale .custom-product__current-price {
  color: #d63384;
}

/* Price display with delivery fee - Force inline layout with exact selectors from DOM */
.product-info__block .product-info__price {
  display: flex !important;
  align-items: baseline !important;
  gap: 0.5rem !important;
  flex-wrap: nowrap !important;
  flex-direction: row !important;
  width: 100% !important;
}

.product-info__block .product-info__price .price {
  display: inline-block !important;
  margin-bottom: 0 !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  flex-shrink: 0 !important;
  width: auto !important;
  float: none !important;
}

.product-info__block .custom-product__total-cost,
.product-info__block .js-delivery-total {
  font-size: 1.2rem !important;
  font-style: italic !important;
  white-space: nowrap !important;
  color: #666666 !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  float: none !important;
}

/* Mobile: stack vertically */
@media (max-width: 768px) {
  .product-info__price {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
  }

  .custom-product__total-cost {
    font-size: 0.8rem;
  }
}

.custom-product__policies {
  font-size: 0.875rem;
  color: #666;
  margin-top: 0.5rem;
}

/* Tooltip */
.custom-product__tooltip {
  position: relative;
  display: inline-block;
  z-index: 1000;
}

.custom-product__tooltiptext {
  visibility: hidden;
  min-width: 170px;
  max-width: 265px;
  width: max-content;
  background-color: #EFEFEF;
  color: black;
  text-align: center;
  padding: 9px;
  position: absolute;
  z-index: 1;
  left: 131%;
  opacity: 0;
  transition: opacity 1s;
}

.custom-product__tooltiptext::after {
  content: " ";
  position: absolute;
  top: 50%;
  right: 100%;
  margin-top: -49px;
  border-width: 10px;
  border-style: solid;
  border-color: transparent #EFEFEF transparent transparent;
}

.custom-product__tooltip:hover .custom-product__tooltiptext {
  visibility: visible;
  opacity: 1;
}

.custom-product__tooltip-heading {
  font-size: 18px;
  font-weight: bold;
  padding-bottom: 7px;
}

.custom-product__tooltip-heading svg {
  min-width: 35px !important;
  min-height: 27px !important;
  margin-left: -41px;
  margin-top: -1px !important;
}

.custom-product__tooltip-text {
  font-size: 12px;
  color: rgb(109, 118, 135);
  text-align: left;
  left: 131%;
}

/* Custom Variant Picker */
.custom-product__variant-picker {
  margin: 1rem 0;
}

.custom-product__option-group {
  margin-bottom: 15px;
}

.custom-product__option-group label {
  font-size: 16px;
  font-weight: bold;
  display: block;
  margin-bottom: 10px;
}

.custom-product__size-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.custom-product__size-option {
  border: 1px solid #d3dbe2;
  padding: 9px 15px;
  cursor: pointer;
  background: #ffffff;
  transition: all 0.2s;
  min-width: 80px;
  text-align: center;
}

.custom-product__size-option--active,
.custom-product__size-option:hover {
  background: #123D44 !important;
  border-color: #123D44 !important;
  color: white;
}


.custom-product__select {
  width: 100%;
  padding: 10px;
  border: 1px solid #d3dbe2;
}

.custom-product__inventory-notice {
  font-size: 0.875rem;
  color: #d63384;
  margin-top: 0.5rem;
}

.custom-product__inventory-notice--hidden {
  display: none;
}

/* Vase Picker */
.custom-product__vase-selection {
  display: flex;
  gap: 10px;
  margin: 1rem 0;
}

.custom-product__vase-swatch {
  width: 110px;
  height: 140px;
  border: 2px solid #000000;
  background-color: #ffffff;
  overflow: hidden;
  cursor: pointer;
  position: relative;
  transition: all 0.3s ease;
}

.custom-product__vase-swatch--selected {
  background-color: #123D44;
  box-shadow: 0 0 0 2px #2196F3;
}

.custom-product__vase-swatch--selected::after {
  content: '✓';
  position: absolute;
  top: 5px;
  right: 5px;
  width: 20px;
  height: 20px;
  background-color: #2196F3;
  color: #ffffff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
}

.custom-product__vase-img {
  width: 100%;
  height: 100px;
  object-fit: cover;
}

.custom-product__vase-text {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: #000000;
  transition: all 0.3s ease;
}

.custom-product__vase-swatch--selected .custom-product__vase-text {
  color: #ffffff;
}


/* Buy Buttons */
.custom-product__buy-buttons {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin: 1.5rem 0;
}

.custom-product__quantity {
  display: flex;
  align-items: center;
}

.custom-product__qty-adjuster {
  display: flex;
  border: 1px solid #ddd;
  border-radius: 4px;
  overflow: hidden;
}

.custom-product__qty-adjuster-inner {
  display: flex;
}

.custom-product__qty-down,
.custom-product__qty-up {
  background: #f8f9fa;
  border: none;
  padding: 0.5rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
}

.custom-product__qty-down:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.custom-product__qty-value {
  border: none;
  text-align: center;
  width: 60px;
  padding: 0.5rem;
}

.custom-product__add-button {
  width: 100%;
}

.custom-product__add-btn {
  width: 100%;
  padding: 1rem 2rem;
  font-size: 1.1rem;
  font-weight: 500;
}

.custom-product__hidden-submit {
  display: none;
}

.custom-product__dynamic-checkout {
  margin-top: 1rem;
}

.custom-product__unavailable {
  background-color: #f8d7da;
  color: #721c24;
  padding: 1rem;
  border-radius: 4px;
}

/* Payment Display */
.custom-product__payment-display {
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  font-size: 11px;
  gap: 0.5rem;
}

.custom-product__payment-icons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.custom-product__payment-icon {
  width: 35px;
  height: 30px;
}

.custom-product__payment-text {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.75rem;
}

/* Payflex */
.custom-product__payflex {
  margin: 1rem 0;
}

.custom-product__payflex-span {
  display: inline-flex !important;
}

.custom-product__payflex-cost-text {
  font-weight: bold;
}

.custom-product__payflex-img {
  max-width: 101px;
  max-height: 50px;
  display: block;
  margin-top: -5px;
  margin-bottom: 9px;
}

.custom-product__payflex-text-style {
  width: -webkit-fill-available;
}

/* Time Box */
.custom-product__time-box {
  display: flex;
  flex-direction: column;
  font-size: 1em;
  margin: 1rem 0;
  border: solid 1px #8EA787;
  background-color: #F4F2F3;
  padding: 10px;
  text-align: center;
}

.custom-product__time-box-content {
  display: flex;
  align-items: center;
  justify-content: center;
}

.custom-product__time-box-truck {
  width: auto;
  padding-right: 20px;
  display: flex;
  align-items: center;
}

.custom-product__time-box-truck svg {
  width: var(--icon-size, 70px);
  height: auto;
  max-height: var(--icon-size, 70px);
  min-width: var(--icon-size, 70px);
  min-height: calc(var(--icon-size, 70px) * 0.57); /* Maintain aspect ratio */
}

/* Support for custom icon colors using actual HTML classes */
.svg_truck svg {
  width: var(--icon-size, 70px);
  height: auto;
  max-height: var(--icon-size, 70px);
  min-width: var(--icon-size, 70px);
  min-height: calc(var(--icon-size, 70px) * 0.57); /* Maintain aspect ratio */
}

.svg_truck svg path {
  fill: var(--icon-color, #123d44);
}

.svg_truck svg [fill="#123d44"] {
  fill: var(--icon-color, #123d44);
}

.svg_truck svg [fill="#b2c9aa"] {
  fill: var(--icon-color, #123d44);
}

.custom-product__time-box-divider {
  margin: 10px 0;
  border: none;
  border-top: 1px solid #ccc;
}

.custom-product__time-box-delivery-text {
  margin-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2.5em;
}

.custom-product__time-box-text {
  display: flex;
  align-items: center;
  text-align: left;
}

.custom-product__time-box-text p {
  margin: 0;
}

/* Collapsible Sections with Schema-Driven Styling */
.custom-product__collapsible-section {
  margin-bottom: var(--blm-fc-section-margin-bottom, 20px);
  border: 1px solid var(--blm-fc-border-color, #ddd);
  border-radius: var(--blm-fc-border-radius, 4px);
  overflow: hidden;
}

.custom-product__collapsible-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  padding: var(--blm-fc-header-padding-vertical, 10px) var(--blm-fc-header-padding-horizontal, 15px);
  background-color: var(--blm-fc-header-bg, #f8f9fa);
  transition: background-color 0.2s ease;
}

.custom-product__collapsible-header:hover {
  background-color: color-mix(in srgb, var(--blm-fc-header-bg, #f8f9fa) 90%, var(--blm-fc-title-color, #123D44) 10%);
}

.custom-product__collapsible-title {
  font-weight: var(--blm-fc-title-font-weight, 600);
  font-size: var(--blm-fc-title-font-size, 20px);
  margin: 0;
  color: var(--blm-fc-title-color, #123D44);
  font-family: var(--blm-fc-title-font-family, playfair-display, serif);
  line-height: 1.2;
}

.custom-product__collapsible-content {
  display: none;
  padding: var(--blm-fc-content-padding, 15px);
  background-color: var(--blm-fc-content-bg, #ffffff);
  transition: padding 0.3s ease;
}

.custom-product__collapsible--open .custom-product__collapsible-content {
  display: block;
  animation: slideDown 0.3s ease-out;
}

.custom-product__collapsible-icon {
  stroke: var(--blm-fc-chevron-color, #123D44);
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
  flex-shrink: 0;
}

.custom-product__collapsible--open .custom-product__collapsible-icon {
  transform: rotate(180deg);
}

/* Slide down animation */
@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Flower Components */
.custom-product__flower-components-list {
  list-style-type: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--blm-fc-component-spacing, 15px);
}

.custom-product__flower-component {
  display: flex;
  align-items: flex-start;
  padding: var(--blm-fc-component-padding, 10px);
  background-color: var(--blm-fc-content-bg, white);
  border-radius: calc(var(--blm-fc-border-radius, 4px) * 0.5);
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.custom-product__flower-component:hover {
  background-color: color-mix(in srgb, var(--blm-fc-content-bg, white) 95%, var(--blm-fc-component-title-color, #333) 5%);
  transform: translateY(-1px);
}

.custom-product__flower-component-icon {
  width: var(--blm-fc-icon-size, 50px);
  height: var(--blm-fc-icon-size, 50px);
  margin-right: var(--blm-fc-icon-margin-right, 20px);
  object-fit: cover;
  border-radius: calc(var(--blm-fc-border-radius, 4px) * 0.5);
  flex-shrink: 0;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.custom-product__flower-component-content {
  flex: 1;
  min-width: 0; /* Prevents flex item from overflowing */
}

.custom-product__flower-component-title {
  margin: 0 0 5px 0;
  font-size: var(--blm-fc-component-title-font-size, 18px);
  font-weight: var(--blm-fc-component-title-font-weight, 600);
  color: var(--blm-fc-component-title-color, #333333);
  line-height: 1.3;
}

.custom-product__flower-component-description {
  margin: 0;
  font-size: var(--blm-fc-component-description-font-size, 16px);
  color: var(--blm-fc-component-description-color, #666666);
  line-height: 1.4;
}

/* Responsive Design */
@media (max-width: 768px) {
  .custom-product__collapsible-header {
    padding: calc(var(--blm-fc-header-padding-vertical, 10px) * 0.8) calc(var(--blm-fc-header-padding-horizontal, 15px) * 0.8);
  }
  
  .custom-product__collapsible-title {
    font-size: calc(var(--blm-fc-title-font-size, 20px) * 0.9);
  }
  
  .custom-product__flower-component {
    padding: calc(var(--blm-fc-component-padding, 10px) * 0.8);
  }
  
  .custom-product__flower-component-icon {
    width: calc(var(--blm-fc-icon-size, 50px) * 0.8);
    height: calc(var(--blm-fc-icon-size, 50px) * 0.8);
    margin-right: calc(var(--blm-fc-icon-margin-right, 20px) * 0.8);
  }
  
  .custom-product__flower-component-title {
    font-size: calc(var(--blm-fc-component-title-font-size, 18px) * 0.9);
  }
  
  .custom-product__flower-component-description {
    font-size: calc(var(--blm-fc-component-description-font-size, 16px) * 0.9);
  }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
  .custom-product__collapsible-section {
    border-width: 2px;
  }
  
  .custom-product__collapsible-header {
    border-bottom: 1px solid var(--blm-fc-border-color, #ddd);
  }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
  .custom-product__collapsible-icon,
  .custom-product__flower-component {
    transition: none;
  }
  
  .custom-product__collapsible--open .custom-product__collapsible-content {
    animation: none;
  }
}
}

/* Flower Care */
.custom-product__flower-care-content ul {
  list-style-type: none;
  padding-left: 0;
  margin-top: 0;
}

.custom-product__flower-care-content ul li {
  padding-left: 40px;
  position: relative;
  margin-bottom: 10px;
}

.custom-product__flower-care-content ul li:before {
  content: " ";
  display: inline-block;
  height: 28px;
  width: 28px;
  background-size: 28px;
  background-image: url("/cdn/shop/files/Group_7294.svg?v=1722332346");
  background-repeat: no-repeat;
  position: absolute;
  left: 0;
  top: 2px;
}

/* Gift Message Modal */
.custom-product__gift-modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1000;
  justify-content: center;
  align-items: center;
}

.custom-product__gift-content {
  background: white;
  padding: 2rem;
  max-width: 500px;
  width: 90%;
  position: relative;
  text-align: center;
  border-radius: 8px;
}

.custom-product__modal-close {
  position: absolute;
  right: 1rem;
  top: 1rem;
  background: none;
  border: none;
  font-size: 1.5rem;
  cursor: pointer;
  color: #6D7687;
}

.custom-product__modal-close:hover {
  color: #333;
}

.custom-product__gift-step1,
.custom-product__gift-step2 {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.custom-product__gift-step1 h2,
.custom-product__gift-step2 h2 {
  color: #123D44;
  font-size: 1.5rem;
  margin-bottom: 0;
}

.custom-product__envelope-icon {
  margin: 1.5rem 0;
}

.custom-product__input-group {
  margin-bottom: 1.5rem;
  text-align: left;
}

.custom-product__input-group label {
  display: block;
  margin-bottom: 0.5rem;
  color: #123D44;
  font-weight: 500;
}

.custom-product__occasion-select {
  width: 100%;
  padding: 0.75rem;
  border: 1px solid #ddd;
  font-size: 1rem;
  border-radius: 4px;
}

.custom-product__textarea {
  width: 100%;
  height: 120px;
  padding: 0.75rem;
  border: 1px solid #ddd;
  font-size: 1rem;
  resize: none;
  margin-bottom: 0.5rem;
  border-radius: 4px;
}

.custom-product__char-count {
  text-align: right;
  color: #6D7687;
  font-size: 0.875rem;
}

.custom-product__btn-primary {
  background: #8EA787;
  color: white;
  border: none;
  padding: 0.75rem 2rem;
  width: 100%;
  font-size: 1.2rem;
  font-weight: 500;
  cursor: pointer;
  margin-bottom: 10px;
  border-radius: 4px;
}

.custom-product__btn-secondary {
  background: white;
  color: #6D7687;
  border: 1px solid #ddd;
  padding: 0.75rem 2rem;
  width: 100%;
  font-size: 1.2rem;
  font-weight: 500;
  cursor: pointer;
  border-radius: 4px;
}

.custom-product__btn-back {
  background: none;
  border: none;
  color: #6D7687;
  width: 100%;
  font-size: 1rem;
  cursor: pointer;
  padding: 0.5rem 0;
  margin-top: 0.5rem;
}

.custom-product__btn-back:hover {
  color: #333;
}

/* Warning Message */
.custom-product__warning-message {
  text-align: left;
  padding: 12px 8px 12px 48px;
  background-color: #CA4C62;
  font-size: 15px;
  line-height: 20px;
  font-style: italic;
  color: #fff;
  margin: 10px 0;
  border-radius: 4px;
}

/* Rating */
.custom-product__rating {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.custom-product__rating-caption {
  font-size: 0.875rem;
  color: #666;
}

/* Description */
.custom-product__description {
  margin: 1rem 0;
}

/* Placeholder */
.custom-product__placeholder {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  align-items: start;
}

.custom-product__placeholder-media {
  background-color: #f8f9fa;
  padding: 2rem;
  text-align: center;
}

.custom-product__placeholder-image svg {
  width: 100%;
  height: 300px;
  color: #ddd;
}

.custom-product__placeholder-info {
  padding: 2rem 0;
}

/* Description Below */
.custom-product__description-below {
  margin-top: 3rem;
  max-width: 800px;
}

/* Reviews */
.custom-product__reviews {
  margin-top: 2rem;
  background-color: rgba(109, 118, 135, 0.1);
  padding: 1rem;
  border-radius: 4px;
}

.custom-product__reviews #shopify-product-reviews {
  background-color: #fff;
  padding: 5px;
}

/* Collection Links */
.custom-product__collection-links {
  margin-top: 2rem;
  padding-top: 1rem;
  border-top: 1px solid #ddd;
}

.custom-product__back-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  text-decoration: none;
  color: #666;
  font-size: 0.875rem;
}

.custom-product__back-link:hover {
  color: #333;
  text-decoration: underline;
}

.custom-product__back-text {
  text-decoration: underline;
}

/* Mobile Styles */
@media (max-width: 767px) {
  .custom-product__container {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .custom-product__info {
    padding-left: 0;
  }

  .custom-product__title-wrapper {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }

  .custom-product__title {
    margin-bottom: 0;
  }

  .custom-product__tooltiptext {
    left: 131%;
    min-width: 170px;
    max-width: 265px;
  }

  .custom-product__vase-selection {
    justify-content: center;
  }

  .custom-product__payment-display {
    font-size: 10px;
  }

  .custom-product__payment-icon {
    width: 30px;
    height: 25px;
  }

  .custom-product__time-box-content {
    flex-direction: column;
    gap: 1rem;
  }

  .custom-product__time-box-truck {
    padding-right: 0;
  }

  .custom-product__gift-content {
    width: 95%;
    padding: 1.5rem;
  }

  .custom-product__placeholder {
    grid-template-columns: 1fr;
  }

  .custom-product__placeholder-image svg {
    height: 200px;
  }
}

@media (min-width: 768px) {
  .custom-product__media.sticky__scroll {
    position: sticky;
    top: 100px;
  }

  .custom-product__payment-display {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  .custom-product__payment-icons {
    order: 2;
  }

  .custom-product__payment-text {
    order: 1;
  }
}

@media (min-width: 768px) and (max-width: 900px) {
  .custom-product__payflex-text-style {
    width: -webkit-fill-available;
  }

  .custom-product__payflex-text-style p {
    margin-bottom: 0px;
  }
}

@media (min-width: 901px) {
  .custom-product__payflex-text-style {
    width: -webkit-fill-available;
  }
}

@media only screen and (max-width: 820px) {
  .custom-product__size-options {
    gap: 5px;
  }

  .custom-product__size-option {
    padding: 6px 10px;
    min-width: 60px;
    font-size: 0.875rem;
  }
}

/* Product Badges and Pills */
.product-badge {
  position: absolute;
  z-index: 10;
  max-width: calc(100% - 20px);
  overflow: hidden;
  background: transparent;
  border: none;
  outline: none;
  box-shadow: none;
  font-weight: normal;
  font-size: inherit;
  line-height: normal;
  padding: 0;
  color: inherit;
  text-overflow: initial;
  white-space: normal;
}

.product-badge img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: var(--badge-border-radius, 4px);
  border: var(--badge-border-width, 0px) solid var(--badge-border-color, transparent);
  background: transparent;
  outline: none;
  box-shadow: none !important;
  font-weight: normal;
  font-size: inherit;
  line-height: normal;
  padding: 0;
  color: inherit;
}

/* Responsive badge sizing - multiple breakpoints */
@media (max-width: 480px) {
  .product-badge img {
    max-width: calc(var(--badge-size-desktop, 100px) * 0.4) !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .product-badge img {
    max-width: calc(var(--badge-size-desktop, 100px) * 0.6) !important;
  }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .product-badge img {
    max-width: calc(var(--badge-size-desktop, 100px) * 0.8) !important;
  }
}

@media (min-width: 1025px) {
  .product-badge img {
    max-width: var(--badge-size-desktop, 100px) !important;
  }
}

.product-pill {
  position: absolute;
  z-index: 10;
  font-weight: 600;
  font-size: var(--pill-size, 12px);
  line-height: 1.2;
  border-radius: 12px;
  padding: var(--pill-padding-v, 4px) var(--pill-padding-h, 8px);
  color: var(--pill-text, #FFFFFF);
  background-color: var(--pill-bg, #4CAF50);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  white-space: nowrap;
  max-width: calc(100% - 20px);
  overflow: hidden;
  text-overflow: ellipsis;
  border: none;
  outline: none;
}

/* Ensure pill styles don't affect badges */
.product-badge .product-pill,
.product-pill .product-badge {
  display: none;
}

/* Position variants */
.product-badge--top-left {
  top: var(--badge-offset-y, 10px);
  left: var(--badge-offset-x, 10px);
}

.product-badge--top-right {
  top: var(--badge-offset-y, 10px);
  right: var(--badge-offset-x, 10px);
}

.product-badge--bottom-left {
  bottom: var(--badge-offset-y, 10px);
  left: var(--badge-offset-x, 10px);
}

.product-badge--bottom-right {
  bottom: var(--badge-offset-y, 10px);
  right: var(--badge-offset-x, 10px);
}

.product-pill--top-left {
  top: var(--pill-offset-y, 10px);
  left: var(--pill-offset-x, 10px);
}

.product-pill--top-right {
  top: var(--pill-offset-y, 10px);
  right: var(--pill-offset-x, 10px);
}

.product-pill--bottom-left {
  bottom: var(--pill-offset-y, 10px);
  left: var(--pill-offset-x, 10px);
}

.product-pill--bottom-right {
  bottom: var(--pill-offset-y, 10px);
  right: var(--pill-offset-x, 10px);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .product-badge img {
    max-width: calc(var(--badge-size, 50px) * 0.8);
  }
  
  .product-pill {
    font-size: calc(var(--pill-size, 12px) * 0.9);
    padding: calc(var(--pill-padding-v, 4px) * 0.8) calc(var(--pill-padding-h, 8px) * 0.8);
  }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
  .product-badge img {
    border: 2px solid currentColor;
  }
  
  .product-pill {
    border: 2px solid currentColor;
  }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
  .product-badge,
  .product-pill {
    transition: none;
  }
}

/* ==========================================================================
   PDP REFINEMENT PASS
   Goals:
   - Move per-option inline styles to CSS via custom properties on wrappers
   - Unify upsell cards (vase + extras) + clean hover
   - Brand-aligned seasonal availability message
   - ATC trust sub-line
   - "What's Included" de-fuss (sharp corners, hairline dividers)
   - Consistent block rhythm via --pdp-block-gap token
   ========================================================================== */

/* --------------------------------------------------------------------------
   Block rhythm token — single source of truth for gaps between PDP blocks.
   Anything that wants the canonical spacing uses var(--pdp-block-gap).
   -------------------------------------------------------------------------- */
.product-info {
  --pdp-block-gap: calc(6 * var(--space-unit));
  --pdp-block-gap-tight: calc(3 * var(--space-unit));
}

/* Normalise the BLM custom block spacing to match native blocks */
.product-info .blm-variant-selection,
.product-info .vase-selection,
.product-info .time_box {
  margin-top: var(--pdp-block-gap);
  margin-bottom: var(--pdp-block-gap);
}

/* --------------------------------------------------------------------------
   BLM Size selector — CSS-var driven (no per-option inline styles)
   Wrapper sets --size-* vars from schema; options consume them.
   -------------------------------------------------------------------------- */
.blm-variant-selection {
  /* Defaults — overridden by wrapper inline style-vars from schema */
  --size-bg: #ffffff;
  --size-border: #dddddd;
  --size-text: #333333;
  --size-border-width: 2px;
  --size-radius: 0;
  --size-padding: 16px 12px;
  --size-min-width: 80px;
  --size-gap: 8px;
  --size-selected-bg: #123d44;
  --size-selected-text: #ffffff;
  --size-selected-description: #ffffff;
  --size-main-font: inherit;
  --size-main-size: 14px;
  --size-main-weight: normal;
  --size-description-color: #666666;
  --size-description-size: 12px;
  --size-description-weight: 300;
}

.blm-variant-selection .blm-variant-option {
  background-color: var(--size-bg);
  border: var(--size-border-width) solid var(--size-border);
  color: var(--size-text);
  border-radius: var(--size-radius);
  padding: var(--size-padding);
  min-width: var(--size-min-width);
  gap: var(--size-gap);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.blm-variant-selection[data-hover-lift="true"] .blm-variant-option:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(18, 61, 68, 0.15);
}

.blm-variant-selection .blm-variant-option.selected {
  background-color: var(--size-selected-bg) !important;
  color: var(--size-selected-text) !important;
  border-color: var(--size-selected-bg) !important;
  box-shadow: inset 0 0 0 2px var(--size-selected-bg), inset 0 0 0 4px #ffffff !important;
}

.blm-variant-selection .blm-variant-option .blm-variant-text {
  font-family: var(--size-main-font);
  font-size: var(--size-main-size);
  font-weight: var(--size-main-weight);
}

.blm-variant-selection .blm-variant-option .blm-variant-description {
  font-family: var(--size-main-font);
  font-size: var(--size-description-size);
  font-weight: var(--size-description-weight);
  color: var(--size-description-color);
  margin: 4px 0 0 0;
  line-height: 1.4;
}

.blm-variant-selection .blm-variant-option.selected .blm-variant-description {
  color: var(--size-selected-description);
}

/* --------------------------------------------------------------------------
   Upsell cards (vase + extras) — unified treatment
   Both cards: same white background, sharper teal-tinted border,
   border thickens on hover (no lift/shadow translate).
   Icons stay exactly as they are (brand assets).
   -------------------------------------------------------------------------- */
.vase-selection {
  /* Defaults — wrapper inline style-vars override from schema */
  --vase-bg: #ffffff;
  --vase-border: rgba(18, 61, 68, 0.2);
  --vase-border-hover: rgba(18, 61, 68, 0.6);
  --vase-text: #333333;
  --vase-subtitle: #666666;
  --vase-selected-bg: #123d44;
  --vase-selected-text: #ffffff;
  --vase-selected-subtitle: #ffffff;
  --vase-selected-border: #123d44;
  --vase-border-width: 1.5px;
  --vase-radius: 0;
  --vase-padding: 12px;
  --vase-min-width: 110px;
  --vase-max-height: 160px;
  --vase-main-font: inherit;
  --vase-main-size: 15px;
  --vase-main-weight: 500;
  --vase-subtitle-size: 12px;
  --vase-subtitle-weight: 300;
}

.vase-selection .vase-checkbox-option,
.vase-selection .upsell-modal-button {
  /* Both cards share: white bg, same border, same radius, same padding */
  background-color: var(--vase-bg) !important;
  border: var(--vase-border-width) solid var(--vase-border) !important;
  border-radius: var(--vase-radius) !important;
  padding: var(--vase-padding) !important;
  min-width: var(--vase-min-width);
  max-height: var(--vase-max-height);
  transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease !important;
  /* Remove any lift/shadow transforms — cleaner hover */
  transform: none !important;
  box-shadow: none !important;
}

.vase-selection .vase-checkbox-option:hover,
.vase-selection .upsell-modal-button:hover {
  border-color: var(--vase-border-hover) !important;
  background-color: var(--vase-bg) !important;
  transform: none !important;
  box-shadow: none !important;
}

/* Typography harmonisation */
.vase-selection .vase-swatch-text,
.vase-selection .upsell-text {
  color: var(--vase-text);
  font-family: var(--vase-main-font);
  font-size: var(--vase-main-size);
  font-weight: var(--vase-main-weight);
}

.vase-selection .vase-swatch-subtitle,
.vase-selection .upsell-subtitle {
  color: var(--vase-subtitle);
  font-family: var(--vase-main-font);
  font-size: var(--vase-subtitle-size);
  font-weight: var(--vase-subtitle-weight);
}

/* Selected state — vase only (upsell uses .has-selections, already styled inline) */
.vase-selection .vase-checkbox-option.selected {
  background-color: var(--vase-selected-bg) !important;
  border-color: var(--vase-selected-border) !important;
  box-shadow: inset 0 0 0 2px var(--vase-selected-bg), inset 0 0 0 4px #ffffff !important;
}

.vase-selection .vase-checkbox-option.selected .vase-swatch-text {
  color: var(--vase-selected-text);
}

.vase-selection .vase-checkbox-option.selected .vase-swatch-subtitle {
  color: var(--vase-selected-subtitle);
}

/* --------------------------------------------------------------------------
   Vase / upsell card LAYOUT — migrated from the old inline <style> block.
   Layout-only rules (flex, gaps, text wrapping, icon sizing). Visual tokens
   (colors, borders, radius, padding, typography) are driven by the CSS
   variables set on .vase-selection above.
   -------------------------------------------------------------------------- */
.vase-selection .vase-options-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  width: 100%;
}

.vase-selection .vase-checkbox-option,
.vase-selection .upsell-modal-button {
  flex: 1 1 0;
  min-width: max(250px, 45%);
  box-sizing: border-box;
  position: relative;
  cursor: pointer;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Content wrapper — layout switches via icon-layout modifier class */
.vase-selection .vase-content,
.vase-selection .upsell-content {
  width: 100%;
  height: 100%;
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  padding: 12px;
}

.vase-selection .vase-content--top {
  flex-direction: column;
}

.vase-selection .vase-content--left {
  flex-direction: row;
  gap: var(--vase-icon-gap, 16px);
  justify-content: flex-start;
}

.vase-selection .vase-content--right {
  flex-direction: row-reverse;
  gap: var(--vase-icon-gap, 16px);
  justify-content: flex-start;
}

.vase-selection .vase-content--no-icon {
  /* No icon → always centered */
  flex-direction: column;
}

/* Icon containers */
.vase-selection .vase-icon-container,
.vase-selection .upsell-icon-container {
  flex: 0 0 auto;
  flex-shrink: 1;
}

.vase-selection .vase-content--top .vase-icon-container,
.vase-selection .vase-content--top .upsell-icon-container {
  margin-bottom: var(--vase-icon-margin, 12px);
}

.vase-selection .vase-content--left .vase-icon-container,
.vase-selection .vase-content--left .upsell-icon-container {
  margin-right: var(--vase-icon-margin, 12px);
}

/* Icon sizing */
.vase-selection .vase-icon-container img,
.vase-selection .upsell-icon-container img {
  width: var(--vase-icon-size, 60px);
  height: var(--vase-icon-size, 60px);
  max-width: 100%;
  object-fit: var(--vase-icon-fit, contain);
  min-width: var(--vase-min-icon-size, 40px);
  min-height: var(--vase-min-icon-size, 40px);
}

.vase-selection .vase-image-selected,
.vase-selection .upsell-image-selected {
  display: none;
}

/* Text containers */
.vase-selection .vase-text-container,
.vase-selection .upsell-text-container {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  max-width: max-content;
  min-width: 0;
}

/* Side-by-side icon layouts left-align text */
.vase-selection .vase-content--left .vase-text-container,
.vase-selection .vase-content--left .upsell-text-container,
.vase-selection .vase-content--right .vase-text-container,
.vase-selection .vase-content--right .upsell-text-container {
  align-items: flex-start;
  text-align: left;
}

/* Rich-text margin reset + deterministic title/subtitle spacing.
   Flex column with a fixed gap so the vase and upsell cards have IDENTICAL
   title-to-subtitle spacing regardless of any residual element margins/heights. */
.vase-selection .vase-text-content,
.vase-selection .upsell-text-content {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}

/* Kill any residual fixed/min height on the title rows so they're content-height
   (the old swatch-style rules set height:40px which left empty space below). */
.vase-selection .vase-swatch-text,
.vase-selection .upsell-text {
  height: auto;
  min-height: 0;
}

.vase-selection .vase-swatch-text,
.vase-selection .upsell-text,
.vase-selection .vase-swatch-subtitle,
.vase-selection .upsell-subtitle {
  word-wrap: break-word;
  overflow-wrap: break-word;
  min-width: 0;
  margin: 0;
  line-height: 1.2;
}

.vase-selection .vase-swatch-subtitle,
.vase-selection .upsell-subtitle {
  margin-top: 4px;
  line-height: 1.4;
}

.vase-selection .vase-swatch-text p,
.vase-selection .upsell-text p,
.vase-selection .vase-swatch-subtitle p,
.vase-selection .upsell-subtitle p {
  margin: 0;
  padding: 0;
}

.vase-selection .vase-swatch-price {
  color: var(--vase-subtitle);
  font-size: var(--vase-subtitle-size);
  margin-left: 4px;
}

/* Upsell 'has-selections' state — schema-driven via CSS vars */
.vase-selection .upsell-modal-button.has-selections {
  background-color: var(--upsell-selected-bg) !important;
  border-color: var(--upsell-selected-bg) !important;
  color: var(--upsell-selected-text) !important;
  box-shadow: inset 0 0 0 2px var(--upsell-selected-bg), inset 0 0 0 4px #ffffff !important;
}

.vase-selection .upsell-modal-button.has-selections .upsell-text,
.vase-selection .upsell-modal-button.has-selections .upsell-subtitle {
  color: var(--upsell-selected-text);
}

.vase-selection .upsell-modal-button.has-selections::after {
  content: "\2713"; /* ✓ */
  position: absolute;
  top: 8px;
  right: 8px;
  width: 20px;
  height: 20px;
  background-color: #fff;
  color: var(--vase-tick-color, #123d44);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: bold;
  z-index: 2;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);
  border: 2px solid var(--vase-tick-color, #123d44);
}

/* Upsell-specific typography using upsell vars */
.vase-selection .upsell-text {
  color: var(--upsell-text);
}

.vase-selection .upsell-subtitle {
  color: var(--upsell-subtitle);
}

/* Responsive: tighter icon gutters on narrow screens */
@media (max-width: 768px) {
  .vase-selection .vase-options-wrapper {
    gap: 16px;
  }
}

@media (max-width: 600px) {
  .vase-selection .vase-content--left .vase-icon-container,
  .vase-selection .vase-content--left .upsell-icon-container,
  .vase-selection .vase-content--right .vase-icon-container,
  .vase-selection .vase-content--right .upsell-icon-container {
    margin-right: calc(var(--vase-icon-margin, 12px) / 1.5);
    margin-left: calc(var(--vase-icon-margin, 12px) / 1.5);
  }
}

/* --------------------------------------------------------------------------
   BLM variant section label → slightly stronger typographic treatment
   Not an editorial kicker — just a clear, readable section label
   -------------------------------------------------------------------------- */
.product-info .blm-variant-label {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 10px;
}

/* --------------------------------------------------------------------------
   Seasonal availability message — brand-aligned refinement
   Scoped to .product-info so it doesn't affect toast popups elsewhere.
   Zero radius (brand sharp); schema bg-color rendered as a light wash.
   -------------------------------------------------------------------------- */
.product-info .product-message {
  border-radius: 0;
  /* Soft 45/55 wash of the schema bg-color — preserves user's color choice
     but as a tint rather than a full fill */
  background-color: color-mix(in srgb, var(--bg-color) 45%, #ffffff 55%);
}

/* --------------------------------------------------------------------------
   ATC trust line — small, centered copy directly under Add to cart.
   Schema-editable via block.settings.atc_trust_text (richtext).
   -------------------------------------------------------------------------- */
.pdp-trust-text {
  margin-top: calc(2 * var(--space-unit));
  font-size: 0.85em;
  line-height: 1.5;
  color: rgba(var(--text-color) / 0.7);
  text-align: center;
}

.pdp-trust-text p {
  margin: 0;
}

.pdp-trust-text p + p {
  margin-top: 2px;
}

/* --------------------------------------------------------------------------
   "What's Included" — full typographic rework
   Goal: make this section feel like part of the product description, not
   a walled-off data table. Kill the container chrome, harmonise the type
   scale with surrounding copy, and let whitespace do the separating.

   Strategy:
   - Container: no border, no header fill. A single top hairline acts as a
     section break, the clickable area reads as a subtle row.
   - Header title: quieter serif treatment that matches other block labels
     (not the big 20px bold).
   - Component rows: name + description flow as a single paragraph pair.
     Name in teal at body size with a slightly stronger weight; description
     is body copy, inherits the normal reading color. No dividers at all —
     generous vertical rhythm via `gap`.
   - Icons (when present): small, flush, no card-stamp shadow.
   -------------------------------------------------------------------------- */

/* Container — no card chrome. Single top hairline, section-style */
.product-info .custom-product__collapsible-section {
  border: 0;
  border-top: 1px solid rgba(var(--text-color) / 0.12);
  border-radius: 0;
  background: transparent;
  margin-top: var(--pdp-block-gap, calc(6 * var(--space-unit)));
  margin-bottom: 0;
}

/* Header — no fill, generous hit area with room for the display heading.
   Reads as a section divider with a chevron rather than a "button" */
.product-info .custom-product__collapsible-header {
  background-color: transparent !important;
  padding: calc(4 * var(--space-unit)) 0 !important;
  transition: color 0.2s ease;
}

.product-info .custom-product__collapsible-header:hover {
  background-color: transparent !important;
  color: rgba(var(--text-color) / 0.7);
}

/* Header title — matches the visual weight of sibling section headings
   on the PDP (e.g. partner showcase). Full serif display treatment:
   large, bold, teal. The list items below are quiet so the heading can
   carry the section weight alone. */
.product-info .custom-product__collapsible-title {
  font-size: 1.6em !important;
  font-weight: 700 !important;
  letter-spacing: -0.005em;
  line-height: 1.2;
  color: rgb(var(--text-color)) !important;
}

@media (min-width: 769px) {
  .product-info .custom-product__collapsible-title {
    font-size: 1.75em !important;
  }
}

/* Content area — no extra padding, flush with the header rhythm */
.product-info .custom-product__collapsible-content {
  padding: 0 0 calc(4 * var(--space-unit)) !important;
  background-color: transparent !important;
}

/* Components list — generous whitespace replaces dividers */
.product-info .custom-product__flower-components-list {
  display: flex;
  flex-direction: column;
  gap: calc(3 * var(--space-unit));
  padding: 0;
  margin: 0;
}

/* Each component: flat, no chrome, no hover effects */
.product-info .custom-product__flower-component {
  padding: 0 !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  transform: none !important;
  align-items: flex-start;
}

.product-info .custom-product__flower-component:hover {
  background-color: transparent !important;
  transform: none !important;
}

/* Flower name — body size, teal, slightly stronger weight. Reads as the
   start of the sentence, not a heading that dominates the row. */
.product-info .custom-product__flower-component-title {
  font-size: 1em !important;
  font-weight: 600 !important;
  color: rgb(var(--text-color)) !important;
  font-family: inherit !important;
  letter-spacing: 0;
  margin: 0 0 2px 0 !important;
  line-height: 1.5 !important;
}

/* Description — flows directly below the name. Same size, normal weight,
   body color at slight opacity so the name leads the eye. */
.product-info .custom-product__flower-component-description {
  font-size: 1em !important;
  font-weight: 400 !important;
  color: rgba(var(--text-color) / 0.75) !important;
  line-height: 1.55 !important;
  margin: 0 !important;
}

/* Icon — if present, small and subtle. No shadow, no rounding, slight
   opacity so it feels like a decorative mark rather than a product stamp. */
.product-info .custom-product__flower-component-icon {
  width: 40px !important;
  height: 40px !important;
  margin-right: calc(2.5 * var(--space-unit)) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  opacity: 0.9;
  flex-shrink: 0;
}

/* Chevron — quieter, smaller */
.product-info .custom-product__collapsible-icon {
  width: 16px;
  height: 16px;
  opacity: 0.6;
  transition: transform 0.3s ease, opacity 0.2s ease;
}

.product-info .custom-product__collapsible-header:hover .custom-product__collapsible-icon {
  opacity: 1;
}

/* Mobile — the display heading stays confident; just tighten icon gutter
   and component spacing */
@media (max-width: 768px) {
  .product-info .custom-product__flower-component-icon {
    width: 36px !important;
    height: 36px !important;
    margin-right: calc(2 * var(--space-unit)) !important;
  }

  .product-info .custom-product__flower-components-list {
    gap: calc(2.5 * var(--space-unit));
  }
}