.snazzy-product {
  background-color: rgba(var(--color-background));
  color: rgba(var(--color-text));
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

.snazzy-product .page-width {
  max-width: none;
  padding-inline: 0;
  width: 100%;
  min-width: 0;
}

.snazzy-product .product-detail-wrapper,
.snazzy-product .product-detail {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.snazzy-product .product-detail-wrapper,
.snazzy-product .product-detail {
  background-color: rgba(var(--color-background));
}

.snazzy-product .product-detail {
  display: block;
  gap: 0;
}

.snazzy-product .product-detail__media-group,
.snazzy-product .product-detail__info {
  position: static;
  width: 100%;
  inset-block-start: auto;
  margin: auto;
}

.snazzy-product .product-detail__info {
  --info-row-gap: 0px;
}

.snazzy-product__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Flavor tabs */
.snazzy-product__flavor-bar {
  display: flex;
  align-items: stretch;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  border-block-end: 1px solid rgba(var(--color-entry-line));
  padding-inline: 52px;
  background-color: rgba(var(--color-background));
  position: sticky;
  top: 0;
  z-index: 9;
}

.snazzy-product__flavor-bar:not(:has(.snazzy-product__flavor-tab)) {
  display: none;
}

.snazzy-product__badge-marquee:not(:has(.snazzy-product__badge-img)) {
  display: none;
}

.snazzy-product__flavor-tab {
  flex-shrink: 0;
  padding: 14px 28px;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-decoration: none;
  color: rgba(var(--color-light-text));
  border: none;
  border-block-end: 2px solid transparent;
  background: transparent;
  transition:
    color 0.2s ease,
    border-color 0.2s ease;
}

.snazzy-product__flavor-tab:hover {
  color: rgba(var(--color-text));
}

.snazzy-product__flavor-tab.is-active {
  color: var(--snazzy-tab-accent, var(--snazzy-accent, #4a8c3f));
  border-block-end-color: var(
    --snazzy-tab-accent,
    var(--snazzy-accent, #4a8c3f)
  );
}

/* Hero grid */
.snazzy-product__hero {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 560px;
  border-block-end: 1px solid rgba(var(--color-entry-line));
}

.snazzy-product__hero > *,
.snazzy-product__story > * {
  min-width: 0;
}

.snazzy-product__gallery {
  border-inline-end: 1px solid rgba(var(--color-entry-line));
  background-color: var(--snazzy-gallery-bg, #060d06);
  overflow: hidden;
}

.snazzy-product__gallery .product-detail__media-gallery {
  --padding-inline-start: 0px;
  --padding-inline-end: 0px;
  height: 100%;
  min-height: 560px;
}

.snazzy-product__gallery
  .product-detail__media-gallery
  .media-gallery__content {
  flex-direction: row-reverse;
  align-items: stretch;
  gap: 0;
  height: 100%;
  min-height: 560px;
}

.snazzy-product__gallery
  .product-detail__media-gallery
  .media-gallery__list-wrapper {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
}

.snazzy-product__gallery
  .product-detail__media-gallery
  .media-gallery__list::before {
  display: none;
}

.snazzy-product__gallery .product-detail__media-gallery .media-gallery__list {
  width: 100%;
  max-width: 480px;
}

.snazzy-product__gallery .product-detail__media-gallery .media-gallery__media {
  width: 100%;
  height: 100%;
}

.snazzy-product__gallery .product-detail__media-gallery .media-gallery__image {
  object-fit: contain;
  width: 100%;
  height: 100%;
  max-height: 100%;
  margin-inline: auto;
}

/* Keep the media stage a fixed height so switching between images of
   different aspect ratios doesn't resize the gallery. The platform JS rewrites
   --aspect-ratio per selected image; we anchor to the static --min-aspect-ratio
   (tallest image) instead and letterbox every image inside it. */
@media (min-width: 960px) {
  .snazzy-product__gallery
    .product-detail__media-gallery[data-desktop-layout]
    .media-gallery__list {
    aspect-ratio: var(--min-aspect-ratio, 0.8);
  }

  .snazzy-product__gallery
    .product-detail__media-gallery[data-desktop-layout]
    .media-gallery__item {
    height: 100%;
  }
}

.snazzy-product__gallery
  .product-detail__media-gallery
  .media-gallery__thumbnails {
  width: 88px;
  min-width: 88px;
  flex-shrink: 0;
  padding: 2px;
  background: #111;
  border-inline-end: 1px solid rgba(255, 255, 255, 0.08);
}

.snazzy-product__gallery
  .product-detail__media-gallery
  .media-gallery__thumbnail-list {
  flex-direction: column;
  gap: 2px;
  max-height: 100%;
  overflow-y: auto;
}

.snazzy-product__gallery
  .product-detail__media-gallery
  .media-gallery__thumbnail {
  flex-shrink: 0;
  width: 100%;
  height: 108px;
  padding: 0;
  border: 2px solid transparent;
  background: #0d0908;
  overflow: hidden;
}

.snazzy-product__gallery
  .product-detail__media-gallery
  .media-gallery__thumbnail.is-active,
.snazzy-product__gallery
  .product-detail__media-gallery
  .media-gallery__thumbnail.is-select {
  border-color: var(--snazzy-gallery-border, var(--snazzy-accent, #4a8c3f));
}

.snazzy-product__gallery
  .product-detail__media-gallery
  .media-gallery__thumbnail-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.snazzy-product__gallery .product-detail__media-gallery .media-gallery__arrows,
.snazzy-product__gallery
  .product-detail__media-gallery
  .media-gallery__pagination,
.snazzy-product__gallery
  .product-detail__media-gallery
  .media-gallery__thumbnail-arrows {
  display: none !important;
}

.snazzy-product__gallery
  .product-detail__media-gallery
  .media-gallery__sticky-wrapper {
  display: none;
}

.snazzy-product__gallery .product-media-preview {
  display: none;
}

.snazzy-product__info {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 48px 52px 56px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.snazzy-product .product-detail__info {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.snazzy-product .product-detail__award-badges {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.snazzy-product__eyebrow {
  font-family: var(--font-display);
  font-size: 9px;
  letter-spacing: 0.4em;
  color: var(--snazzy-accent, #4a8c3f);
  margin-block-end: 16px;
}

.snazzy-product .product-detail__title {
  font-family: var(--font-display);
  font-size: clamp(32px, 4vw, 40px);
  font-weight: 700;
  line-height: 0.95;
  margin-block-end: 16px;
  color: rgba(var(--color-text));
}

.snazzy-product__subtitle {
  font-family: var(--font-display);
  font-size: 11px;
  letter-spacing: 0.18em;
  color: rgba(var(--color-light-text));
  margin-block-end: 24px;
}

.snazzy-product__quantity-label {
  font-family: var(--font-display);
  font-size: 9px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: #9a8560;
  margin-block-end: 14px;
  margin-bottom: -20px;
}

/* Native variant picker — pack selector styling */
.snazzy-product .product-detail__variant-picker {
  display: block;
  gap: 0;
  margin-block-end: 24px;
}

.snazzy-product .product-detail__variant-picker .variant-picker__group {
  padding: 0;
  margin: 0;
  border: none;
}

.snazzy-product .product-detail__variant-picker .product-detail__row {
  gap: 0;
}

.snazzy-product .product-detail__variant-picker .variant-picker__group-head {
  display: none;
}

.snazzy-product .product-detail__variant-picker .variant-picker__options {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  padding-block-start: 12px;
}

.snazzy-product .product-detail__variant-picker .variant-picker__option {
  position: relative;
  flex: 1;
  min-width: 0;
  padding: 0;
  margin: 0;
  border: 1px solid #e0dcd4;
  background: transparent;
  text-align: center;
  cursor: pointer;
  transition:
    border-color 0.2s ease,
    background-color 0.2s ease,
    color 0.2s ease;
  font-weight: inherit;
  line-height: inherit;
}

.snazzy-product
  .product-detail__variant-picker
  .variant-picker__option:hover:not(:has(input:checked)):not(.is-active) {
  border-color: #9a8560;
}

.snazzy-product .product-detail__variant-picker .variant-picker__option input {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
  pointer-events: none;
}

.snazzy-product .product-detail__variant-picker .variant-picker__button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 100%;
  border: none;
  background: transparent;
  padding: 12px 20px;
  text-align: center;
  cursor: pointer;
  transition: color 0.2s ease;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: rgba(var(--color-text));
  border-radius: 0;
  box-shadow: none;
}

.snazzy-product .product-detail__variant-picker .variant-picker__button::before,
.snazzy-product .product-detail__variant-picker .variant-picker__button::after {
  display: none;
  content: none;
}

.snazzy-product
  .product-detail__variant-picker
  .variant-picker__option
  input[type="radio"]:checked
  + .variant-picker__button,
.snazzy-product
  .product-detail__variant-picker
  .variant-picker__option
  input[type="radio"]:checked
  + theme-popover
  .variant-picker__button {
  --border-thickness: 0;
  --border-color: transparent;
}

.snazzy-product
  .product-detail__variant-picker
  .variant-picker__option:has(input:checked),
.snazzy-product
  .product-detail__variant-picker
  .variant-picker__option.is-active {
  border-color: var(--snazzy-variant-highlight, var(--snazzy-accent, #4a8c3f));
  background-color: var(
    --snazzy-variant-highlight,
    var(--snazzy-accent, #4a8c3f)
  );
}

.snazzy-product
  .product-detail__variant-picker
  .variant-picker__option:has(input:checked)
  .variant-picker__button,
.snazzy-product
  .product-detail__variant-picker
  .variant-picker__option.is-active
  .variant-picker__button {
  color: var(--snazzy-variant-highlight-text, #fafaf8);
}

.snazzy-product .product-detail__variant-picker .snazzy-product__pack-label {
  display: block;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.snazzy-product .product-detail__variant-picker .snazzy-product__pack-unit {
  display: block;
  margin-block-start: 4px;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: normal;
  color: #9a8560;
}

.snazzy-product
  .product-detail__variant-picker
  .variant-picker__option:has(input:checked)
  .snazzy-product__pack-unit,
.snazzy-product
  .product-detail__variant-picker
  .variant-picker__option.is-active
  .snazzy-product__pack-unit {
  color: rgba(255, 255, 255, 0.7);
}

.snazzy-product
  .product-detail__variant-picker
  .variant-picker__option.is-best-deal
  .snazzy-product__best-deal {
  display: block;
}

.snazzy-product__best-deal {
  display: none;
  position: absolute;
  inset-block-start: -10px;
  inset-inline-start: 50%;
  transform: translateX(-50%);
  font-family: var(--font-display);
  font-size: 7px;
  font-weight: 700;
  letter-spacing: 0.18em;
  background: var(
    --snazzy-best-deal-badge-bg,
    var(--snazzy-variant-highlight, var(--snazzy-accent, #4a8c3f))
  );
  color: var(--snazzy-best-deal-badge-text, #fafaf8);
  padding: 2px 8px;
  white-space: nowrap;
  line-height: 1.4;
  pointer-events: none;
}

/* Purchase row — native price block */
.snazzy-product .product-detail__price {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid #e0dcd4;
  padding: 14px 18px;
  margin-block-end: 24px;
}

.snazzy-product .product-detail__price::before {
  content: var(--snazzy-purchase-label, "ONE-TIME PURCHASE");
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: rgba(var(--color-text));
  flex-shrink: 0;
}

.snazzy-product .product-detail__price .hidden-empty {
  display: none;
}

.snazzy-product .product-detail__price .price {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 700;
  color: rgba(var(--color-text));
}

.snazzy-product .product-detail__quantity-selector,
.snazzy-product .product-detail__volume-pricing {
  display: none;
}

/* Add to cart — native buy buttons */
.snazzy-product .product-detail__buy-buttons .form__buttons {
  width: 100%;
}

.snazzy-product .product-detail__buy-buttons .button {
  width: 100%;
  padding: 18px;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.25em;
  background-color: #1c1c1c !important;
  color: #fff !important;
  border: none;
}

.snazzy-product .product-detail__buy-buttons .button:hover:not(:disabled) {
  opacity: 0.9;
}

/* Badge marquee */
.snazzy-product__badge-marquee {
  overflow: hidden;
  width: 100%;
  margin-block-start: 14px;
}

.snazzy-product__badge-track {
  display: flex;
  align-items: center;
  width: max-content;
  will-change: transform;
}

.snazzy-product__badge-set {
  display: flex;
  align-items: center;
  gap: 28px;
  flex-shrink: 0;
  padding-inline-end: 28px;
}

.snazzy-product__badge-img {
  height: 72px;
  width: auto;
  object-fit: contain;
  flex-shrink: 0;
}

/* Story section */
.snazzy-product__story {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  border-block-end: 1px solid rgba(var(--color-entry-line));
}

.snazzy-product__story-text {
  padding: 80px 52px;
  border-inline-end: 1px solid rgba(var(--color-entry-line));
}

.snazzy-product__story-eyebrow {
  font-family: var(--font-display);
  font-size: 9px;
  letter-spacing: 0.4em;
  color: rgba(var(--color-light-text));
  margin-block-end: 20px;
}

.snazzy-product__story-heading {
  font-family: var(--font-display);
  font-size: clamp(30px, 4vw, 40px);
  font-weight: 700;
  line-height: 0.95;
  margin-block-end: 24px;
}

.snazzy-product__story-body {
  font-size: 17px;
  font-style: italic;
  color: rgb(var(--color-paragraph-text));
  line-height: 1.82;
  margin-block-end: 24px;
}

.snazzy-product__story-body p {
  margin-block-end: 16px;
}

.snazzy-product__story-tagline {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 700;
  color: var(--snazzy-accent, #4a8c3f);
  letter-spacing: 0.12em;
}

.snazzy-product__features {
  padding: 80px 52px;
  background-color: #f5f0e8;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 32px;
}

.snazzy-product__feature {
  display: flex;
  align-items: center;
  gap: 32px;
}

.snazzy-product__feature-icon {
  width: 160px;
  height: 160px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.snazzy-product__feature-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.snazzy-product__feature-title {
  font-family: var(--font-display);
  font-size: 14px;
  letter-spacing: 0.12em;
  font-weight: 700;
  margin-block-end: 8px;
}

.snazzy-product__feature-desc {
  font-size: 14px;
  line-height: 1.7;
  color: rgb(var(--color-paragraph-text));
}

/* Mobile gallery overrides */
@media (max-width: 959px) {
  .snazzy-product__flavor-bar {
    padding-inline: 16px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .snazzy-product__flavor-bar::-webkit-scrollbar {
    display: none;
  }

  .snazzy-product__flavor-tab {
    padding: 12px 16px;
    white-space: nowrap;
  }

  .snazzy-product__hero {
    grid-template-columns: minmax(0, 1fr);
  }

  .snazzy-product__gallery {
    border-inline-end: none;
    border-block-end: 1px solid rgba(var(--color-entry-line));
  }

  .snazzy-product .product-detail__media-gallery {
    margin-inline: 0;
  }

  .snazzy-product__gallery .product-detail__media-gallery,
  .snazzy-product__gallery
    .product-detail__media-gallery
    .media-gallery__content {
    min-height: 420px;
  }

  .snazzy-product__gallery
    .product-detail__media-gallery
    .media-gallery__content {
    flex-direction: column;
    width: 100%;
    max-width: 100%;
  }

  .snazzy-product__gallery
    .product-detail__media-gallery
    .media-gallery__list-wrapper {
    padding: 24px 16px;
    min-width: 0;
  }

  .snazzy-product__gallery .product-detail__media-gallery .media-gallery__list {
    max-width: 100%;
  }

  .snazzy-product__gallery
    .product-detail__media-gallery
    .media-gallery__thumbnails {
    width: 100%;
    min-width: 0;
    padding: 0;
    border-inline-end: none;
    border-block-end: 1px solid rgba(255, 255, 255, 0.08);
  }

  .snazzy-product__gallery
    .product-detail__media-gallery
    .media-gallery__thumbnail-list {
    flex-direction: row;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    max-width: 100%;
  }

  .snazzy-product__gallery
    .product-detail__media-gallery
    .media-gallery__thumbnail-list::-webkit-scrollbar {
    display: none;
  }

  .snazzy-product__gallery
    .product-detail__media-gallery
    .media-gallery__thumbnail {
    flex-shrink: 0;
    width: 72px;
    min-width: 72px;
    height: 88px;
  }

  .snazzy-product__info {
    padding: 40px 24px 48px;
  }

  .snazzy-product .product-detail__variant-picker .variant-picker__options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    max-width: 100%;
    padding-block-start: 12px;
  }

  .snazzy-product .product-detail__variant-picker .variant-picker__option {
    flex: initial;
    min-width: 0;
    max-width: none;
    width: auto;
  }

  .snazzy-product
    .product-detail__variant-picker
    .variant-picker__option.is-best-deal {
    grid-column: 1 / -1;
  }

  .snazzy-product .product-detail__variant-picker .variant-picker__button {
    padding: 12px 10px;
  }

  .snazzy-product .product-detail__price {
    flex-wrap: wrap;
    gap: 8px 12px;
  }

  .snazzy-product .product-detail__price::before {
    font-size: 10px;
    letter-spacing: 0.06em;
    max-width: 100%;
  }

  .snazzy-product .product-detail__buy-buttons .button {
    letter-spacing: 0.16em;
    white-space: normal;
  }

  .snazzy-product__story {
    grid-template-columns: minmax(0, 1fr);
  }

  .snazzy-product__story-text {
    padding: 56px 24px;
    border-inline-end: none;
    border-block-end: 1px solid rgba(var(--color-entry-line));
  }

  .snazzy-product__story-heading,
  .snazzy-product__feature-title {
    overflow-wrap: anywhere;
  }

  .snazzy-product__features {
    padding: 56px 24px;
  }

  .snazzy-product__feature {
    flex-direction: column;
    text-align: center;
    gap: 16px;
  }

  .snazzy-product__feature-icon {
    width: 100px;
    height: 100px;
  }
}
