.product-variant-value.is-color:not(.is-tooltip-only) > span,
.product-variant-value.is-image:not(.is-tooltip-only) > span {
  color: var(--product-variant-name-color, #064e3b);
  background: var(--product-variant-name-background, #ecfdf5);
}

.product-variant-value.is-color:not(.is-tooltip-only) > span {
  min-block-size: 2.7rem;
  gap: .55rem;
  overflow: hidden;
  padding: 0 .8rem 0 0;
}

.product-variant-value.is-color:not(.is-tooltip-only) .product-variant-swatch {
  align-self: stretch;
  inline-size: 2.7rem;
  block-size: 2.7rem;
  margin: -1px 0 -1px -1px;
  filter: none;
}

.product-variant-value.is-tooltip-only.is-color > span {
  overflow: hidden;
  padding: 0;
}

.product-variant-value.is-tooltip-only.is-color .product-variant-swatch {
  inline-size: 100%;
  block-size: 100%;
  filter: none;
}

.product-variant-value.is-tooltip-only .store-tooltip {
  border-color: color-mix(in srgb, #d1fae5 32%, transparent);
  color: #ecfdf5 !important;
  background: #064e3b !important;
}

html[data-color-mode="dark"] .product-variant-value.is-color:not(.is-tooltip-only) > span,
html[data-color-mode="dark"] .product-variant-value.is-image:not(.is-tooltip-only) > span {
  color: var(--product-variant-name-dark-color, #d1fae5);
  background: var(--product-variant-name-dark-background, #064e3b);
}

html[data-color-mode="dark"] .product-variant-value.is-tooltip-only .store-tooltip {
  border-color: color-mix(in srgb, #064e3b 28%, transparent);
  color: #064e3b !important;
  background: #d1fae5 !important;
}