/** Shopify CDN: Minification failed

Line 1364:0 Unexpected "}"

**/
.yotpo.yotpo-main-widget, .yotpo .yotpo-modal-dialog{
  margin-bottom: 30px;
}
#check-bullets-b ul {
    list-style: none;
}
#check-bullets-b ul li {
    margin-bottom: 0px;
    font-size: 12px;
    line-height: 22px;
}
.product {
  margin: 0;
}

.product.grid {
  gap: 0;
}

.product--no-media {
  max-width: 57rem;
  margin: 0 auto;
}

.product__media-wrapper {
  padding-left: 0;
}

@media screen and (min-width: 750px) {
  .product--thumbnail .product__media-gallery,
  .product--thumbnail_slider .product__media-gallery,
  .product--stacked .product__info-container--sticky,
  .product--columns .product__info-container--sticky {
    display: block;
    position: sticky;
    top: 3rem;
    z-index: 2;
  }

  .product--thumbnail .thumbnail-list {
    padding-right: var(--media-shadow-horizontal-offset);
  }

  .product__info-wrapper {
    padding: 0 0 0 5rem;
  }

  .product__info-wrapper--extra-padding {
    padding: 0 0 0 8rem;
  }

  .product--right .product__info-wrapper {
    padding: 0 5rem 0 0;
  }

  .product--right .product__info-wrapper--extra-padding {
    padding: 0 8rem 0 0;
  }

  .product--right .product__media-list {
    margin-bottom: 2rem;
  }

  .product__media-container .slider-buttons {
    display: none;
  }
}

@media screen and (min-width: 990px) {
  .product--large:not(.product--no-media) .product__media-wrapper {
    max-width: 65%;
    width: calc(65% - var(--grid-desktop-horizontal-spacing) / 2);
  }

  .product--large:not(.product--no-media) .product__info-wrapper {
    padding: 0 0 0 4rem;
    max-width: 35%;
    width: calc(35% - var(--grid-desktop-horizontal-spacing) / 2);
  }

  .product--large:not(.product--no-media).product--right .product__info-wrapper {
    padding: 0 4rem 0 0;
  }

  .product--medium:not(.product--no-media) .product__media-wrapper,
  .product--small:not(.product--no-media) .product__info-wrapper {
    max-width: 55%;
    width: calc(55% - var(--grid-desktop-horizontal-spacing) / 2);
  }

  .product--medium:not(.product--no-media) .product__info-wrapper,
  .product--small:not(.product--no-media) .product__media-wrapper {
    max-width: 45%;
    width: calc(45% - var(--grid-desktop-horizontal-spacing) / 2);
  }
}

/* Dynamic checkout */

.shopify-payment-button__button {
  font-family: inherit;
  min-height: 4.6rem;
}

.shopify-payment-button__button [role="button"].focused,
.no-js .shopify-payment-button__button [role="button"]:focus {
  outline: .2rem solid rgba(var(--color-foreground),.5) !important;
  outline-offset: 0.3rem;
  box-shadow: 0 0 0 .1rem rgba(var(--color-button),var(--alpha-button-border)),0 0 0 .3rem rgb(var(--color-background)),0 0 .5rem .4rem rgba(var(--color-foreground),.3) !important;
}

.shopify-payment-button__button [role="button"]:focus:not(:focus-visible) {
  outline: 0;
  box-shadow: none !important;
}

.shopify-payment-button__button [role="button"]:focus-visible {
  outline: .2rem solid rgba(var(--color-foreground),.5) !important;
  box-shadow: 0 0 0 .1rem rgba(var(--color-button),var(--alpha-button-border)),0 0 0 .3rem rgb(var(--color-background)),0 0 .5rem .4rem rgba(var(--color-foreground),.3) !important;
}

.shopify-payment-button__button--unbranded {
  background-color: rgba(var(--color-button), var(--alpha-button-background));
  color: rgb(var(--color-button-text));
  font-size: 1.4rem;
  line-height: calc(1 + 0.2 / var(--font-body-scale));
  letter-spacing: 0.07rem;
}

.shopify-payment-button__button--unbranded::selection {
  background-color: rgba(var(--color-button-text), 0.3);
}

.shopify-payment-button__button--unbranded:hover,
.shopify-payment-button__button--unbranded:hover:not([disabled]) {
  background-color: rgba(var(--color-button), var(--alpha-button-background));
}

.shopify-payment-button__more-options {
  margin: 1.6rem 0 1rem;
  font-size: 1.2rem;
  line-height: calc(1 + 0.5 / var(--font-body-scale));
  letter-spacing: 0.05rem;
  text-decoration: underline;
  text-underline-offset: 0.3rem;
}

.shopify-payment-button__button + .shopify-payment-button__button--hidden {
  display: none;
}

/* Product form */

.product-form {
  display: block;
}

.product-form__error-message-wrapper:not([hidden]) {
  display: flex;
  align-items: flex-start;
  font-size: 1.2rem;
  margin-bottom: 1.5rem;
}

.product-form__error-message-wrapper svg {
  flex-shrink: 0;
  width: 1.2rem;
  height: 1.2rem;
  margin-right: 0.7rem;
  margin-top: 0.5rem;
}

/* Form Elements */
.product-form__input {
  flex: 0 0 100%;
  padding: 0;
  margin: 0 0 1.2rem 0;
  max-width: 37rem;
  min-width: fit-content;
  border: none;
}

variant-radios,
variant-selects {
  display: block;
}

.product-form__input--dropdown {
  margin-bottom: 1.6rem;
}

.product-form__input .form__label {
  padding-left: 0;
  color: #1b1b1b;
  text-transform: uppercase;
  font-family: Gotham Bold,sans-serif;
  font-weight: 400;
}

fieldset.product-form__input .form__label {
  margin-bottom: 0.2rem;
}

.product-form__input input[type='radio'] {
  clip: rect(0, 0, 0, 0);
  overflow: hidden;
  position: absolute;
  height: 1px;
  width: 1px;
}

.product-form__input input[type='radio'] + label {
  border: var(--variant-pills-border-width) solid rgba(var(--color-foreground), var(--variant-pills-border-opacity));
  background-color: rgb(var(--color-background));
  color: rgba(var(--color-foreground));
  border-radius: var(--variant-pills-radius);
  color: rgb(var(--color-foreground));
  display: inline-block;
  margin: 0.7rem 0.5rem 0.2rem 0;
  padding: 1rem 2rem;
  font-size: 1.4rem;
  letter-spacing: 0.1rem;
  line-height: 1;
  text-align: center;
  transition: border var(--duration-short) ease;
  cursor: pointer;
  position: relative;
}

.product-form__input input[type='radio'] + label:before {
  content: '';
  position: absolute;
  top: calc(var(--variant-pills-border-width) * -1);
  right: calc(var(--variant-pills-border-width) * -1);
  bottom: calc(var(--variant-pills-border-width) * -1);
  left: calc(var(--variant-pills-border-width) * -1);
  z-index: -1;
  border-radius: var(--variant-pills-radius);
  box-shadow: var(--variant-pills-shadow-horizontal-offset) var(--variant-pills-shadow-vertical-offset) var(--variant-pills-shadow-blur-radius) rgba(var(--color-shadow), var(--variant-pills-shadow-opacity));
}

.product-form__input input[type='radio'] + label:hover {
  border-color: rgb(var(--color-foreground));
}

.product-form__input input[type='radio']:checked + label {
  background-color: rgb(var(--color-foreground));
  color: rgb(var(--color-background));
}

@media screen and (forced-colors: active) {
  .product-form__input input[type=radio]:checked + label {
    text-decoration: underline;
  }
}

.product-form__input input[type='radio']:checked + label::selection {
  background-color: rgba(var(--color-background), 0.3);
}

.product-form__input input[type='radio']:disabled + label {
  border-color: rgba(var(--color-foreground), 0.1);
  color: rgba(var(--color-foreground), 0.4);
  text-decoration: line-through;
}
.product-form__input input[type='radio']:focus-visible + label {
  box-shadow: 0 0 0 0.3rem rgb(var(--color-background)),
    0 0 0 0.5rem rgba(var(--color-foreground), 0.55);
}

/* Fallback */
.product-form__input input[type='radio'].focused + label,
.no-js .shopify-payment-button__button [role="button"]:focus + label {
  box-shadow: 0 0 0 0.3rem rgb(var(--color-background)),
    0 0 0 0.5rem rgba(var(--color-foreground), 0.55);
}

/* No outline when focus-visible is available in the browser */
.no-js .product-form__input input[type='radio']:focus:not(:focus-visible) + label {
  box-shadow: none;
}

.product-form__input .select {
  max-width: 25rem;
}

.product-form__submit {
  margin-bottom: 1rem;
  text-transform: uppercase;
}

.no-js .product-form__submit.button--secondary {
  --color-button: var(--color-base-accent-1);
  --color-button-text: var(--color-base-solid-button-labels);
  --alpha-button-background: 1;
}

.product-form__submit[aria-disabled="true"] + .shopify-payment-button .shopify-payment-button__button[disabled],
.product-form__submit[disabled] + .shopify-payment-button .shopify-payment-button__button[disabled] {
  cursor: not-allowed;
  opacity: 0.5;
}

@media screen and (forced-colors: active) {
  .product-form__submit[aria-disabled="true"] {
    color: Window;
  }
}

/* Overrides */
.shopify-payment-button__more-options {
  color: rgb(var(--color-foreground));
}

.shopify-payment-button__button {
  font-size: 1.5rem;
  letter-spacing: 0.1rem;
}

/* Product info */

.product__info-container > * + * {
  margin: 1.5rem 0;
}

.product__info-container iframe {
  max-width: 100%;
}

.product__info-container .product-form,
.product__info-container .product__description {
  margin: 2.5rem 0;
}

.product__info-container .product__description h3, .accordion__title {
  color: #1b1b1b;
  font-family: Open Sans,sans-serif;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-size: 16px;
}

.product__info-container .product__description p, .product__info-container .product__description li, .accordion__content, .accordion__content p, .accordion__content li {
  margin-bottom: 14px;
  font-size: 13px;
  color: #333;
  font-family: Gotham Book,sans-serif;
}

.product__info-container .product__description p strong, .product__info-container .product__description li strong {
  font-weight: normal;
}

.product__info-container .product__description li {
  margin-bottom: 5px;
}

.product__text {
  margin-bottom: 0;
}

a.product__text {
  display: block;
  text-decoration: none;
  color: rgba(var(--color-foreground), 0.75);
}

.product__text.caption-with-letter-spacing {
  text-transform: uppercase;
}

.product__title {
  word-break: break-word;
  margin-bottom: 1.5rem;
}

.product__title > * {
  margin: 0;
}

.product__title > a {
  display: none;
}

.product__title + .product__text.caption-with-letter-spacing {
  margin-top: -1.5rem;
}

.product__text.caption-with-letter-spacing + .product__title {
  margin-top: 0;
}

.product__accordion .accordion__content {
  padding: 0 1rem;
}

.product .price .badge {
  margin-bottom: 0.5rem;
}

.product .price__container {
  margin-bottom: 0.5rem;
}

.product .price dl {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.product .price--sold-out .price__badge-sold-out {
  background: transparent;
  color: rgb(var(--color-base-text));
  border-color: transparent;
}

.product .price--sold-out .price__badge-sale {
  display: none;
}

@media screen and (min-width: 750px) {
  .product__info-container {
    max-width: 60rem;
  }

  .product__info-container .price--on-sale .price-item--regular {
    font-size: 1.9rem;
  }

  .product__info-container > *:first-child {
    margin-top: 0;
  }
}

.product__description-title {
  font-weight: 600;
}

.product--no-media .product__title,
.product--no-media .product__text,
.product--no-media noscript .product-form__input,
.product--no-media .product__tax,
.product--no-media shopify-payment-terms {
  text-align: center;
}

.product--no-media .product__media-wrapper,
.product--no-media .product__info-wrapper {
  padding: 0;
}

.product__tax {
  margin-top: -1.4rem;
}

.product--no-media noscript .product-form__input,
.product--no-media .share-button {
  max-width: 100%;
}

.product--no-media fieldset.product-form__input,
.product--no-media .product-form__quantity,
.product--no-media .product-form__input--dropdown,
.product--no-media .share-button,
.product--no-media .product__view-details,
.product--no-media .product__pickup-availabilities,
.product--no-media .product-form {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.product--no-media .product-form {
  flex-direction: column;
}

.product--no-media .product-form > .form {
  max-width: 30rem;
  width: 100%;
}

.product--no-media .product-form__quantity,
.product--no-media .product-form__input--dropdown {
  flex-direction: column;
  max-width: 100%;
}

.product-form__quantity .form__label {
  margin-bottom: 0.6rem;
}

.product-form__quantity-top .form__label {
  margin-bottom: 1.2rem;
}


.product--no-media fieldset.product-form__input {
  flex-wrap: wrap;
  margin: 0 auto 1.2rem auto;
}

.product-form__buttons {
  max-width: 32rem;
}

.product--no-media .product__info-container > modal-opener {
  display: block;
  text-align: center;
}

.product--no-media .product-popup-modal__button {
  padding-right: 0;
}

.product--no-media .price {
  text-align: center;
}

/* Product media */
.product__media-list video {
  border-radius: calc(var(--media-radius) - var(--media-border-width));
}

@media screen and (max-width: 749px) {
  .product__media-list {
    margin-left: -2.5rem;
    margin-bottom: 3rem;
    width: calc(100% + 4rem);
  }

  .product__media-wrapper slider-component:not(.thumbnail-slider--no-slide) {
    margin-left: 0;
    margin-right: 0;
  }

  .slider.product__media-list::-webkit-scrollbar {
    height: 0.2rem;
    width: 0.2rem;
  }

  .product__media-list::-webkit-scrollbar-thumb {
    background-color: rgb(var(--color-foreground));
  }

  .product__media-list::-webkit-scrollbar-track {
    background-color: rgba(var(--color-foreground), 0.2);
  }

  .product__media-list .product__media-item {
    width: 100%
  }

  .product--mobile-columns .product__media-item {
    width: calc(50% - 1.5rem - var(--grid-mobile-horizontal-spacing));
  }
}

@media screen and (min-width: 740px){
  .product-form__submit{
    width: 320px;
  }
}
@media screen and (min-width: 750px) {
  .product--thumbnail .product__media-list,
  .product--thumbnail_slider .product__media-list {
    padding-bottom: calc(var(--media-shadow-vertical-offset) * var(--media-shadow-visible));
  }

  .product__media-list {
    padding-right: calc(var(--media-shadow-horizontal-offset) * var(--media-shadow-visible));
  }

  .product--thumbnail .product__media-item:not(.is-active),
  .product--thumbnail_slider .product__media-item:not(.is-active) {
    display: none;
  }

  .product-media-modal__content > .product__media-item--variant.product__media-item--variant {
    display: none;
  }

  .product-media-modal__content > .product__media-item--variant:first-child {
    display: block;
  }
}

.product__media-item.product__media-item--variant {
  display: none;
}

.product__media-item--variant:first-child {
  display: block;
}

@media screen and (min-width: 750px) and (max-width: 989px) {
  .product__media-list .product__media-item:first-child {
    padding-left: 0;
  }

  .product--thumbnail_slider .product__media-list {
    margin-left: 0;
  }

  .product__media-list .product__media-item {
    width: 100%;
  }
}

.product__media-icon .icon {
  width: 1.2rem;
  height: 1.4rem;
}

.product__media-icon,
.thumbnail__badge {
  background-color: rgb(var(--color-background));
  border-radius: 50%;
  border: 0.1rem solid rgba(var(--color-foreground), 0.1);
  color: rgb(var(--color-foreground));
  display: flex;
  align-items: center;
  justify-content: center;
  height: 3rem;
  width: 3rem;
  position: absolute;
  left: calc(1.2rem + var(--media-border-width));
  top: calc(1.2rem + var(--media-border-width));
  z-index: 1;
  transition: color var(--duration-short) ease,
    opacity var(--duration-short) ease;
}

.product__media-video .product__media-icon {
  opacity: 1;
}

.product__modal-opener--image .product__media-toggle:hover {
  cursor: zoom-in;
}

.product__modal-opener:hover .product__media-icon {
  border: 0.1rem solid rgba(var(--color-foreground), 0.1);
}

@media screen and (min-width: 750px) {
  .grid__item.product__media-item--full {
    width: 100%;
  }

  .product--columns .product__media-item:not(.product__media-item--single):not(:only-child) {
    max-width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
  }

  .product--large.product--columns .product__media-item--full .deferred-media__poster-button {
    height: 5rem;
    width: 5rem;
  }

  .product--medium.product--columns .product__media-item--full .deferred-media__poster-button {
    height: 4.2rem;
    width: 4.2rem;
  }

  .product--medium.product--columns .product__media-item--full .deferred-media__poster-button .icon {
    width: 1.8rem;
    height: 1.8rem;
  }

  .product--small.product--columns .product__media-item--full .deferred-media__poster-button {
    height: 3.6rem;
    width: 3.6rem;
  }

  .product--small.product--columns .product__media-item--full .deferred-media__poster-button .icon {
    width: 1.6rem;
    height: 1.6rem;
  }
}

@media screen and (min-width: 990px) {
  .product--stacked .product__media-item {
    max-width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
  }

  .product:not(.product--columns) .product__media-list .product__media-item:first-child,
  .product:not(.product--columns) .product__media-list .product__media-item--full {
    width: 100%;
    max-width: 100%;
  }

  .product__modal-opener .product__media-icon {
    opacity: 0;
  }

  .product__modal-opener:hover .product__media-icon,
  .product__modal-opener:focus .product__media-icon {
    opacity: 1;
  }
}

.product__media-item > * {
  display: block;
  position: relative;
}

.product__media-toggle {
  display: flex;
  border: none;
  background-color: transparent;
  color: currentColor;
  padding: 0;
}

.product__media-toggle::after {
  content: '';
  cursor: pointer;
  display: block;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  height: 100%;
  width: 100%;
}

.product__media-toggle:focus-visible {
  outline: 0;
  box-shadow: none;
}

/* outline styling for Windows High Contrast Mode */
@media (forced-colors: active) {
  .product__media-toggle:focus-visible,
  .product__media-toggle:focus-visible:after,
  .product-form__input input[type="radio"]:focus-visible + label {
    outline: transparent solid 1px;
    outline-offset: 2px;
  }
}
.product__media-toggle.focused {
  outline: 0;
  box-shadow: none;
}

.product__media-toggle:focus-visible:after {
  box-shadow: 0 0 0 0.3rem rgb(var(--color-background)), 0 0 0rem 0.5rem rgba(var(--color-foreground), 0.5);
  border-radius: var(--media-radius);
}

.product__media-toggle.focused:after {
  box-shadow: 0 0 0 0.3rem rgb(var(--color-background)), 0 0 0rem 0.5rem rgba(var(--color-foreground), 0.5);
  border-radius: var(--media-radius);
}

.product-media-modal {
  background-color: rgb(var(--color-background));
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  visibility: hidden;
  opacity: 0;
  z-index: -1;
}

.product-media-modal[open] {
  visibility: visible;
  opacity: 1;
  z-index: 101;
}

.product-media-modal__dialog {
  display: flex;
  align-items: center;
  height: 100vh;
}

.product-media-modal__content {
  max-height: 100vh;
  width: 100%;
  overflow: auto;
}

.product-media-modal__content > *:not(.active),
.product__media-list .deferred-media {
  display: none;
}

@media screen and (min-width: 750px) {
  .product-media-modal__content {
    padding-bottom: 2rem;
  }

  .product-media-modal__content > *:not(.active) {
    display: block;
  }

  .product__modal-opener:not(.product__modal-opener--image) {
    display: none;
  }

  .product__media-list .deferred-media {
    display: block;
  }
}

@media screen and (max-width: 749px) {
  .product--thumbnail .is-active > .product__modal-opener:not(.product__modal-opener--image),
  .product--thumbnail_slider .is-active > .product__modal-opener:not(.product__modal-opener--image) {
    display: none;
  }

  .product--thumbnail .is-active .deferred-media,
  .product--thumbnail_slider .is-active .deferred-media {
    display: block;
    width: 100%;
  }
}

.product-media-modal__content > * {
  display: block;
  height: auto;
  margin: auto;
}

.product-media-modal__content .media {
  background: none;
}

.product-media-modal__model {
  width: 100%;
}

.product-media-modal__toggle {
  background-color: rgb(var(--color-background));
  border: 0.1rem solid rgba(var(--color-foreground), 0.1);
  border-radius: 50%;
  color: rgba(var(--color-foreground), 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  right: 2rem;
  padding: 1.2rem;
  position: fixed;
  z-index: 2;
  top: 2rem;
  width: 4rem;
}

.product-media-modal__content .deferred-media {
  width: 100%;
}

@media screen and (min-width: 750px) {
  .product-media-modal__content {
    padding: 2rem 11rem;
  }

  .product-media-modal__content > * {
    width: 100%;
  }

  .product-media-modal__content > * + * {
    margin-top: 2rem;
  }

  .product-media-modal__toggle {
    right: 5rem;
    top: 2.2rem;
  }
}

@media screen and (min-width: 990px) {
  .product-media-modal__content {
    padding: 2rem 11rem;
  }

  .product-media-modal__content > * + * {
    margin-top: 1.5rem;
  }

  .product-media-modal__content {
    padding-bottom: 1.5rem;
  }

  .product-media-modal__toggle {
    right: 5rem;
  }
}

.product-media-modal__toggle:hover {
  color: rgba(var(--color-foreground), 0.75);
}

.product-media-modal__toggle .icon {
  height: auto;
  margin: 0;
  width: 2.2rem;
}

/* Product popup */

.product-popup-modal {
  box-sizing: border-box;
  opacity: 0;
  position: fixed;
  visibility: hidden;
  z-index: -1;
  margin: 0 auto;
  top: 0;
  left: 0;
  overflow: auto;
  width: 100%;
  background: rgba(var(--color-foreground), 0.2);
  height: 100%;
}

.product-popup-modal[open] {
  opacity: 1;
  visibility: visible;
  z-index: 101;
}

.product-popup-modal__content {
  border-radius: var(--popup-corner-radius);
  background-color: rgb(var(--color-background));
  overflow: auto;
  height: 80%;
  margin: 0 auto;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 5rem;
  width: 92%;
  position: absolute;
  top: 0;
  padding: 0 1.5rem 0 3rem;
  border-color: rgba(var(--color-foreground), var(--popup-border-opacity));
  border-style: solid;
  border-width: var(--popup-border-width);
  box-shadow: var(--popup-shadow-horizontal-offset) var(--popup-shadow-vertical-offset) var(--popup-shadow-blur-radius) rgba(var(--color-shadow), var(--popup-shadow-opacity));
}

.product-popup-modal__content.focused {
  box-shadow: 0 0 0 0.3rem rgb(var(--color-background)),
  0 0 0.5rem 0.4rem rgba(var(--color-foreground), 0.3),
  var(--popup-shadow-horizontal-offset) var(--popup-shadow-vertical-offset) var(--popup-shadow-blur-radius) rgba(var(--color-shadow), var(--popup-shadow-opacity));
}

.product-popup-modal__content:focus-visible{
  box-shadow: 0 0 0 0.3rem rgb(var(--color-background)),
  0 0 0.5rem 0.4rem rgba(var(--color-foreground), 0.3),
  var(--popup-shadow-horizontal-offset) var(--popup-shadow-vertical-offset) var(--popup-shadow-blur-radius) rgba(var(--color-shadow), var(--popup-shadow-opacity));
}

@media screen and (min-width: 750px) {
  .product-popup-modal__content {
    padding-right: 1.5rem;
    margin-top: 10rem;
    width: 70%;
    padding: 0 3rem;
  }

  .product-media-modal__dialog .global-media-settings--no-shadow {
    overflow: visible !important;
  }
}

.product-popup-modal__content img {
  max-width: 100%;
}

@media screen and (max-width: 749px) {
  .product-popup-modal__content table {
    display: block;
    max-width: fit-content;
    overflow-x: auto;
    white-space: nowrap;
    margin: 0;
  }

  .product-media-modal__dialog .global-media-settings,
  .product-media-modal__dialog .global-media-settings video,
  .product-media-modal__dialog .global-media-settings model-viewer,
  .product-media-modal__dialog .global-media-settings iframe,
  .product-media-modal__dialog .global-media-settings img {
    border: none;
    border-radius: 0;
  }
}

.product-popup-modal__opener {
  display: inline-block;
}

.product-popup-modal__button {
  font-size: 1.6rem;
  padding-right: 1.3rem;
  padding-left: 0;
  height: 4.4rem;
  text-underline-offset: 0.3rem;
  text-decoration-thickness: 0.1rem;
  transition: text-decoration-thickness var(--duration-short) ease;
}

.product-popup-modal__button:hover {
  text-decoration-thickness: 0.2rem;
}

.product-popup-modal__content-info {
  padding-right: 4.4rem;
}

.product-popup-modal__content-info > * {
  height: auto;
  margin: 0 auto;
  max-width: 100%;
  width: 100%;
}

@media screen and (max-width: 749px) {
  .product-popup-modal__content-info > * {
    max-height: 100%;
  }
}

.product-popup-modal__toggle {
  background-color: rgb(var(--color-background));
  border: 0.1rem solid rgba(var(--color-foreground), 0.1);
  border-radius: 50%;
  color: rgba(var(--color-foreground), 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  position: sticky;
  padding: 1.2rem;
  z-index: 2;
  top: 1.5rem;
  width: 4rem;
  margin: 0 0 0 auto;
}

.product-popup-modal__toggle:hover {
  color: rgba(var(--color-foreground), 0.75);
}

.product-popup-modal__toggle .icon {
  height: auto;
  margin: 0;
  width: 2.2rem;
}

.product__media-list .media > * {
  overflow: hidden;
}

.thumbnail-list {
  flex-wrap: wrap;
  grid-gap: 1rem;
}

/* Fix to show some space at the end of our sliders in all browsers to be applied on thumbnails */
.slider--mobile.thumbnail-list:after {
  content: none;
}

@media screen and (min-width: 750px) {
  .product--stacked .thumbnail-list {
    display: none;
  }

  .thumbnail-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
  }
}

.thumbnail-list_item--variant:not(:first-child) {
  display: none;
}

@media screen and (min-width: 990px) {
  .thumbnail-list {
    grid-template-columns: repeat(4, 1fr);
  }

  .product--medium .thumbnail-list {
    grid-template-columns: repeat(5, 1fr);
  }

  .product--large .thumbnail-list {
    grid-template-columns: repeat(6, 1fr);
  }
}

@media screen and (max-width: 749px) {
  .product__media-item {
    display: flex;
    align-items: center;
  }

  .product__modal-opener {
    width: 100%;
    height: 100%;
  }

  .thumbnail-slider {
    display: flex;
    align-items: center;
  }

  .thumbnail-slider .thumbnail-list.slider {
    display: flex;
    padding: 0.5rem;
    flex: 1;
    scroll-padding-left: 0.5rem;
  }

  .thumbnail-list__item.slider__slide {
    width: calc(33% - 0.6rem);
  }
}

@media screen and (min-width: 750px) {
  .product--thumbnail_slider .thumbnail-slider {
    display: flex;
    align-items: center;
  }

  .thumbnail-slider .thumbnail-list.slider--tablet-up {
    display: flex;
    padding: 0.5rem;
    flex: 1;
    scroll-padding-left: 0.5rem;
  }

  .product__media-wrapper .slider-mobile-gutter .slider-button {
    display: none;
  }

  .thumbnail-list.slider--tablet-up .thumbnail-list__item.slider__slide {
    width: calc(25% - 0.8rem);
  }

  .product--thumbnail_slider .slider-mobile-gutter .slider-button {
    display: flex;
  }
}

@media screen and (min-width: 900px) {
  .product--small .thumbnail-list.slider--tablet-up .thumbnail-list__item.slider__slide {
    width: calc(25% - 0.8rem);
  }

  .thumbnail-list.slider--tablet-up .thumbnail-list__item.slider__slide {
    width: calc(20% - 0.8rem);
  }
}

.thumbnail {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  height: 100%;
  width: 100%;
  padding: 0;
  color: rgb(var(--color-base-text));
  cursor: pointer;
  background-color: transparent;
}

.thumbnail:hover {
  opacity: 0.7;
}

.thumbnail.global-media-settings img {
  border-radius: 0;
}

.thumbnail[aria-current] {
  box-shadow: 0 0 0rem 0.1rem rgb(var(--color-foreground));
  border-color: rgb(var(--color-foreground));
}

.thumbnail[aria-current]:focus-visible {
  box-shadow: 0 0 0 0.3rem rgb(var(--color-background)),0 0 0rem 0.5rem rgba(var(--color-foreground), 0.5);
}

.thumbnail[aria-current]:focus,
.thumbnail.focused {
  outline: 0;
  box-shadow: 0 0 0 0.3rem rgb(var(--color-background)),0 0 0rem 0.5rem rgba(var(--color-foreground), 0.5);
}

/* outline styling for Windows High Contrast Mode */
@media (forced-colors: active) {
  .thumbnail[aria-current]:focus,
  .thumbnail.focused {
    outline: transparent solid 1px;
  }
}
.thumbnail[aria-current]:focus:not(:focus-visible) {
  outline: 0;
  box-shadow: 0 0 0 0.1rem rgb(var(--color-foreground));
}

.thumbnail img {
  pointer-events: none;
}

.thumbnail--narrow img {
  height: 100%;
  width: auto;
  max-width: 100%;
}

.thumbnail--wide img {
  height: auto;
  width: 100%;
}

.thumbnail__badge .icon {
  width: 1rem;
  height: 1rem;
}

.thumbnail__badge .icon-3d-model {
  width: 1.2rem;
  height: 1.2rem;
}

.thumbnail__badge {
  color: rgb(var(--color-foreground), 0.6);
  height: 2rem;
  width: 2rem;
  left: auto;
  right: calc(0.4rem + var(--media-border-width));
  top: calc(0.4rem + var(--media-border-width));
}

@media screen and (min-width: 750px) {
  .product:not(.product--small) .thumbnail__badge {
    height: 3rem;
    width: 3rem;
  }

  .product:not(.product--small) .thumbnail__badge .icon {
    width: 1.2rem;
    height: 1.2rem;
  }

  .product:not(.product--small) .thumbnail__badge .icon-3d-model {
    width: 1.4rem;
    height: 1.4rem;
  }
}

.thumbnail-list__item {
  position: relative;
}

.thumbnail-list__item::before {
  content: "";
  display: block;
  padding-bottom: 100%;
}

.product:not(.featured-product) .product__view-details {
  display: none;
}

.product__view-details {
  display: block;
  text-decoration: none;
}

.product__view-details:hover {
  text-decoration: underline;
  text-underline-offset: 0.3rem;
}

.product__view-details .icon {
  width: 1.2rem;
  margin-left: 1.2rem;
  flex-shrink: 0;
}
@media screen and (max-width: 739px){
  .afterpay-paragraph{
    text-align: left!important;
    position: relative;
    z-index: 0;
  }
}

/* COUNTDOWN TIMER CSS STARTS */
.product-daily-timer {
  background: transparent; /* removes grey background / color: var(--text); padding: 0; / removes bar-like vertical padding / display: inline-flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px; font-size: 16px; font-weight: 600; max-width: 100%; width: auto; / prevents full-width strip */ opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease; }

.product-daily-timer.is-loaded {
  opacity: 1;
  visibility: visible;
}

span.timer-unit small {
    font-size: 13px;
    color: var(--text);
}

.product-daily-timer span[data-seconds] {
    min-width: 2.8rem;
    display: inline-block;
    text-align: center;
    color: var(--number);
}
.product-daily-timer span[data-minutes] {
    min-width: 2.8rem;
    display: inline-block;
    text-align: center;
    color: var(--number);
}
.product-daily-timer span[data-hours] {
    min-width: 2.8rem;
    display: inline-block;
    text-align: center;
    color: var(--number);
}
.product-daily-timer .timer-label {  
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text);
}

.product-daily-timer .timer-time {
  font-size: 18px;
  letter-spacing: 1px;
}

/* Hide seconds from countdown */
.product-daily-timer .timer-unit:last-child {
  display: none;            /* hide the seconds number + "secs" label */
}

/* Hide all separators by default */
.product-daily-timer .timer-time .timer-separator {
  display: none;
}

/* Re‑show only the first separator (between hours and minutes) */
.product-daily-timer .timer-time .timer-unit:first-child + .timer-separator {
  display: inline-block;
}
}

@media screen and (max-width: 450px) {
  .product-daily-timer span[data-seconds] {
    min-width: 2.4rem;
    display: inline-block;
    text-align: center;
}
.product-daily-timer span[data-minutes] {
    min-width: 2.4rem;
    display: inline-block;
    text-align: center;
}
.product-daily-timer span[data-hours] {
    min-width: 2.4rem;
    display: inline-block;
    text-align: center;
}
}

@media screen and (max-width: 370px) {
  .product-daily-timer {
    justify-content: center;
   align-items: center !important; 
    grid-gap: 0;
}
}
@media screen and (max-width: 399px) {
  .product-daily-timer {
    padding-inline: 12px;
    align-items: baseline;
  }

}
/* COUNTDOWN TIMER CSS ENDS */
/* ==========================================================================
   SPEED4 / W3 (Task C, defect 2) -- Yotpo review TITLE -> BODY gap is ~1.5-2x
   oversized. This file is PDP-only: its single loader is
   sections/main-product.liquid:6, and it is served on both PDP captures and on
   none of home-d / coll-std-d / cart-d.

   MECHANISM -- the theme forces its own 10px block rhythm onto plain tags that
   Yotpo injects. Established from file:line, not from assumptions about Yotpo's CSS:

     assets/stylesheet.scss.liquid:157  * { margin: 0; }
     assets/stylesheet.scss.liquid:169  h1,h2,h3,h4,h5,h6 { ... margin-top: 0;
                                          margin-bottom: 10px; ... }
     assets/stylesheet.scss.liquid:178  h1,h2,h3,h4,h5,h6,p,dl,hr,ol,ul,pre,table,
                                          address,fieldset { margin-bottom: 10px; }
     assets/stylesheet.scss.liquid:180  p { font-size: ...; margin-bottom: 10px; }

   So margin-TOP is already 0 everywhere -- zeroed twice, by the universal reset at
   :157 and again explicitly for headings at :169. The operative declaration is
   margin-BOTTOM: 10px, applied through BARE TAG selectors at (0,0,1), which therefore
   lands on every <p> and every <hN> inside Yotpo's client-injected review card.

   Modern widgets normalise their own margins to 0 and space children with a flex
   `gap`. Where Yotpo does that, the theme's 10px is ADDED to the gap rather than
   replacing it, which is what turns an intended ~4-6px title/body separation into
   ~14-16px -- the reported 1.5x-2x.

   THE FIX neutralises the theme's bare-tag margin inside the widget only, so Yotpo's
   own spacing governs again. `margin-bottom` is the declaration that actually does the
   work here; `margin-top: 0` is belt-and-braces (already 0 via :157 and :169) and is
   stated explicitly so a future edit to stylesheet.scss.liquid cannot silently
   reintroduce the problem from the other side.

   The block is anchored on `.yotpo-widget-instance` -- the ONLY Yotpo class name
   confirmed present in the captured DOM (speed4-served/pdp-rated-d.html bytes 387,646
   and 491,150). Everything to the right of it is a plain HTML tag. No Yotpo-internal
   class name is guessed anywhere in this block.

   Specificity is (0,1,1). That is what it has to be: it must beat the bare-tag
   (0,0,1) rules above, and it does. It is still low enough that a Yotpo rule using an
   id or !important wins.

   RESIDUAL RISK, logged as UNVERIFIED -- OWNER QC in findings/speed4/W3.md: if Yotpo
   sets its own margin on one of these elements through a single class -- (0,1,0) --
   this rule out-specifies it and would flatten that spacing to 0. The reported symptom
   is a gap that is too LARGE, which is consistent with the theme's 10px being additive
   on top of a flex gap, but the widget body is client-injected so the capture cannot
   settle it. If the gap ends up too TIGHT after this change, the correct next step is
   to narrow the tag list rather than to delete the rule.

   RELATED LEAK, reported but deliberately NOT fixed here (out of the three reported
   defects): assets/stylesheet.scss.liquid:169 also forces `letter-spacing: 2px`,
   `font-family: {{ settings.headings_font }}` and `color: {{ settings['header-color'] }}`
   onto every <hN> Yotpo injects, again at bare-tag specificity. That is a typography
   leak into a third-party widget, not a spacing bug, and changing it needs owner intent.
   ========================================================================== */
.yotpo-widget-instance h1,
.yotpo-widget-instance h2,
.yotpo-widget-instance h3,
.yotpo-widget-instance h4,
.yotpo-widget-instance h5,
.yotpo-widget-instance h6,
.yotpo-widget-instance p {
  margin-top: 0;
  margin-bottom: 0;
}

/* ==========================================================================
   ROUND 7 / L3 -- server-rendered PDP star row (.iedm-pdp-stars)
   ==========================================================================
   Replaces the Yotpo Reviews Star Ratings widget (instance 434687), which is no
   longer rendered. Every number below is the USED value of that widget, read off
   the merchant css-overrides file, the widget's own inline styles and this
   theme's own rules -- not invented:

     star box        24 x 15px   .star-container svg {width:24px;height:15px}
                                 in ReviewsStarRatingsWidget/.../css-overrides.css
     star box <=640  20 x 15px   sections/main-product.liquid sets
                                 .star-container svg {width:20px!important} inside
                                 its max-width:640px block; the theme's style block
                                 is in the BODY and Yotpo's sheet is injected into
                                 document.head, so the theme wins that tie
     star gap        1px / 3px   .star-container {margin-right:1px} (3px at <=640)
                                 in the same overrides file
     stars -> text   10px        inline margin-right on the widget's stars div
     count type      Gotham Book / 400 / 15px  (overrides file, !important)
     count leading   18px        INLINE line-height on
                                 .yotpo-sr-bottom-line-text--right-panel; a px
                                 line-height, so it is immune to the font-size
                                 override above. Row height = max(15,18) = 18px.
     count colour    #000        view-text-color-product = rgba(0,0,0,1)
     nudge           -1px / +1px sections/main-product.liquid :888 (min-width:750)
                                 and :921 (max-width:749) on the right panel
     left nudge      -3px / -2px sections/main-product.liquid :755 and its
                                 max-width:640px counterpart
     bottom margin   15px        layout/theme.liquid:1693,
                                 .yotpo-reviews-star-ratings-widget{margin-bottom:
                                 15px!important}, unscoped and LAST in document
                                 order, so it beat both the 20px (this file's 640
                                 block) and Yotpo's own 25px. That rule now matches
                                 nothing and is dead; the 15px is restated here.

   The 18px content row plus the 15px bottom margin is exactly the 33px that round
   6 reserved with min-height. The reserve is gone because the row is static.

   MARGIN: the shorthand is load-bearing. section-main-product.css ships
   `.product__info-container > * + * { margin: 1.5rem 0 }` at the same specificity
   (0,1,0), so this rule wins on source order only -- it must stay AFTER it in this
   file. 15px bottom then collapses with the price div's 1.5rem top to 15px, which
   is what the page does today; margin-top is 0 because the .shopify-app-block
   wrapper's 5px top margin collapsed into the title's larger bottom margin and
   never reached layout.
   ========================================================================== */
.iedm-pdp-stars {
  display: flex;
  align-items: flex-start;
  margin: 0 0 15px;
  margin-left: -3px;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

.iedm-pdp-stars:hover,
.iedm-pdp-stars:focus {
  text-decoration: none;
  color: inherit;
}

.iedm-pdp-stars__stars {
  display: flex;
  align-items: center;
  margin-right: 10px;
  flex: none;
}

.iedm-pdp-stars__star {
  display: block;
  flex: none;
  width: 24px;
  height: 15px;
  margin-right: 1px;
}

.iedm-pdp-stars__count {
  font-family: 'Gotham Book', sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 18px;
  letter-spacing: normal;
  text-transform: none;
  color: #000;
  white-space: nowrap;
  text-align: start;
  position: relative;
  top: -1px;
}

@media screen and (max-width: 749px) {
  .iedm-pdp-stars__count {
    top: 1px;
  }
}

@media screen and (max-width: 640px) {
  /* the merchant overrides switch the row to align-items:center at this width */
  .iedm-pdp-stars {
    align-items: center;
    margin-left: -2px;
  }

  .iedm-pdp-stars__star {
    width: 20px;
    margin-right: 3px;
  }
}

/* YOTPO LIVE STARS (2026-09-21) -- the PDP reserve wrapper. Full derivation in
   findings/yotpo-stars/BUILD-VERIFY.md; kept short here because THIS STYLESHEET
   IS SERVED UNMINIFIED, so every byte of comment ships on every PDP view.
   18px = max(star 15px, count line-height 18px); 15px = the margin
   layout/theme.liquid:1823 won unscoped and !important. 18 + 15 = the 33px round
   6 reserved. The margin is paid ONCE: the injected .iedm-pdp-stars carries its
   own 15px, which min-height stops collapsing out, so it is zeroed below.
   The selector MUST key on [data-ystar='pdp'], never on a bare .ystar:
   component-card.css is loaded by this section too and gives .ystar the 2rem
   CARD box, and the complementary-slider cards live inside
   .product__info-container. display:block neutralises that flex context. */
.product__info-container [data-ystar='pdp'] {
  display: block;
  width: auto;
  height: auto;
  min-height: 18px;
  margin: 0 0 15px;
}

.product__info-container [data-ystar='pdp'] > .iedm-pdp-stars {
  margin-bottom: 0;
}

/* R23 -- COLLAPSE THE RESERVE ONCE WE KNOW THERE IS NOTHING TO SHOW.
   yotpo-stars.js sets data-ystar-state only AFTER the fetch resolves, so the
   33px above still holds for the whole in-flight window; this rule fires only
   on a resolved-and-empty slot (0 reviews, failed fetch, malformed body).
   Cards carry the same attribute with no rule attached, so their band stays.

   CASCADE, and a correction worth reading: layout/theme.liquid's
   `.yotpo-reviews-star-ratings-widget{margin-bottom:15px!important}` CANNOT
   reach this element -- the slot is `div.ystar`, it never carries that class,
   and that rule has matched nothing since round 7 deleted the widget. It is the
   PROVENANCE of the 15px value, not a competitor for it. The 15px being
   collapsed here is the one on the base rule above, which is ours, and it is
   not !important. A theme-wide scan (findings/yotpo-stars/cascade-pdp-slot.py)
   finds NO !important rule anywhere that can select this element.

   Two rules that CAN reach it, and why this one still wins:
     .product__info-container [data-ystar='pdp']   (0,2,0)  the base reserve
     base.css `div:empty{display:none}`            (0,1,1)  globally loaded
   The selector is deliberately NOT the bare `[data-ystar='pdp'][data-ystar-state=
   'empty']` (0,2,0): that TIES with the base rule and would depend on source
   order inside this file. Keeping `.product__info-container` makes it (0,3,0),
   so it wins on specificity and cannot be broken by a later reordering. */
.product__info-container [data-ystar='pdp'][data-ystar-state='empty'] {
  min-height: 0;
  height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

/* R25/R27 -- THE REVIEWS-LIST APP BLOCK IS FULL WIDTH AT EVERY BREAKPOINT.
   Full derivation and the arithmetic table in findings/yotpo-stars/BUILD-VERIFY.md;
   short here because THIS STYLESHEET IS SERVED UNMINIFIED.

   THE ONLY INSET IS MOBILE, AND IT IS DOUBLY GATED. sections/apps.liquid:65-69:
       @media screen and (max-width: 640px) {
       {% if template contains 'product' %}
         .shopify-app-block { width: 85%; margin: auto; }
   A theme-wide scan finds exactly THREE rules that set a width on this block, and
   all three sit inside that same max-width:640px block. Above 640px nothing sets a
   width, so the block already computes `width: auto` and already fills the
   .page-width content box -- the same box as the Afterpay banner (round 25).

   R27 therefore drops the media gate. That is BEHAVIOUR-NEUTRAL by construction:
   at <=640px the rule already applied and its value is unchanged, and above 640px
   it merely states the value the block already computes. It is kept because it
   makes the invariant explicit instead of accidental -- if apps.liquid's gate ever
   widens, this rule already holds the line.

   At 375px the 85% is what mattered: a 335px content box narrowed to 284.75px,
   25.125px of extra inset per side on top of .page-width's 20px, against the 20px
   the PDP title/price column uses. `width: auto` is the whole fix -- per CSS 2.1
   10.3.3 an auto width makes an auto horizontal margin compute to 0, so
   apps.liquid's `margin: auto` needs no override at any width.

   SCOPE. The selector keys on the block's STABLE UUID with `$=`, because Shopify
   prefixes app-block ids per context (round 7). It reaches this one block and
   nothing else: not the PDP star block, not any other app, and not Yotpo's media
   modal, which is not a .shopify-app-block at all. At (0,3,0) it beats
   apps.liquid's `.shopify-app-block` (0,1,0) on SPECIFICITY -- which matters,
   because that inline <style> is emitted later in the body than this stylesheet
   and would win on order. No !important.

   sections/apps.liquid is NOT touched: it is in the round-16 do-not-regress set
   and its 85% is right for every other app block on the page. */
.page-width > .shopify-app-block[id$='__c6378cf0-9253-418b-b8b8-9a965ef6d50f'] {
  width: auto;
}

/* R29: Yotpo sets width:90% as an INLINE style on .yotpo-base-layout (reactive :style bind), so only !important wins. Desktop only. */
@media screen and (min-width: 750px) {
  .yotpo-widget-instance[data-yotpo-instance-id='428233'] .yotpo-base-layout { width: 100% !important; }
}

/* R30+R31: headline text flush left. Yotpo sets margin-left:25% AND flex-basis:50% at (0,4,0) on .yotpo-display-l .yotpo-main-layout .yotpo-head .yotpo-headline, and text-align:center is INHERITED from .yotpo-reviews-main-widget — so the 540px box sat at the left edge but its text did not. Ours is (0,5,0), and a declared text-align always beats an inherited one, so no !important. space-between keeps the yotpo badge on the right edge. Desktop only. */
@media screen and (min-width: 750px) {
  .yotpo-widget-instance[data-yotpo-instance-id='428233'] .yotpo-main-layout .yotpo-head { justify-content: space-between; }
  .yotpo-widget-instance[data-yotpo-instance-id='428233'] .yotpo-main-layout .yotpo-head .yotpo-headline { margin-left: 0; text-align: left; flex: 0 1 auto; }
}

/* R26 -- THE DESKTOP HEADER ROW REACHES THE CONTAINER EDGES.
   Six-rule table, DOM tree and arithmetic in findings/yotpo-stars/BUILD-VERIFY.md;
   short here because THIS STYLESHEET IS SERVED UNMINIFIED.

   THE LIMITER IS NOT A max-width. All six max-widths Yotpo ships bind to
   COMPONENTS, never to a layout wrapper: the free-search filter (x2), the media
   and score filter dropdowns, the review-card thumbnail container and the media
   modal. The two layout wrappers that carry the list's width --
   .yotpo-main-layout and .yotpo-reviews-container -- are already width:100% with
   no max-width, so the reviews list already spans .page-width. Review rows do
   too: left 18% + centre 63% + right 11% with flex-grow:2 on the right = 100%.

   What holds the header row in is one declaration, from
       .yotpo-main-layout .yotpo-layout-header-wrapper[data-v-0554779c]
           { display:flex; justify-content:center }
   The row is full width; its two children -- the score block and the WRITE A
   REVIEW button -- are CENTRED inside it, so free space sits half on the left and
   half on the right instead of between them. Yotpo's own bold layout uses
   justify-content:space-between here; the standard layout (this store:
   "view-layout":"standardLayout", and the root render hard-codes
   is-bold-layout:!1) centres instead.

   space-between puts the score block's left edge on the container's left edge and
   the button's right edge on its right edge. .yotpo-bottom-line's margin-right:40px
   is deliberately left alone: with two flex items, space-between still flushes the
   second one right, so that margin only widens the middle gap.

   CASCADE. Yotpo's rule is (0,3,0). This is (0,4,0) -- class + attribute + class +
   class -- so it wins on SPECIFICITY and needs no !important and no assumption
   about where Yotpo injects its <style>. Yotpo's CSS contains ZERO @media, so
   .yotpo-display-l/m are JS device classes on a different axis from this media
   query; the rule is written to apply at every width >= 750px regardless.

   MODAL SAFETY IS STRUCTURAL, not selector-based: `class:"yotpo-layout-header-wrapper"`
   occurs exactly ONCE in the bundle, and the component that emits it
   (HeaderContainer) is referenced exactly once, from the widget root render --
   never from ModalsContainer. The wrapper therefore cannot exist inside
   .yotpo-modal or .yotpo-media-modal, and the review form and media lightbox are
   untouched. */
@media screen and (min-width: 750px) {
  .yotpo-widget-instance[data-yotpo-instance-id='428233'] .yotpo-main-layout .yotpo-layout-header-wrapper {
    justify-content: space-between;
  }
}

/* ==========================================================================
   ROUND 7 / L4 -- static Afterpay instalment line
   ==========================================================================
   The markup reuses the vendor's class names, so every rule the owner already
   tuned for p.afterpay-paragraph still applies untouched. Only two things need
   new rules, both because the wordmark is now an inline <svg> rather than the
   vendor's <img>:

     * `.product img.afterpay-logo { width: 8rem }` (sections/main-product.liquid
       :441 top level and :1084 inside max-width:640px) is an IMG selector and
       cannot reach an <svg>. 8rem is restated here; root font-size on this store
       is 10px, so that is 80px, against the vendor's inline max-width of 100px.
     * the vendor's own link carried inline `text-decoration:none` and
       `display:inline-block`; those are restated so the help icon keeps its box.
   ========================================================================== */
.afterpay-paragraph--static .afterpay-logo {
  width: 8rem;
  height: auto;
  max-width: 100%;
  vertical-align: middle;
}

.afterpay-paragraph--static .afterpay-link {
  display: inline-block;
  text-decoration: none;
  color: inherit;
}

/* SPEED4 R9, amended R11 — PDP black. R9 shipped the popup CHECKOUT's off-black here;
   R11 took all three surfaces to TRUE BLACK #000000 (hover #222222) on owner instruction,
   as a LIVE write. The measured value R9 replaced was #121212, not pure black.
   PDP-scoped by construction: this file is loaded only by sections/main-product.liquid:6.
   Replaces #121212 (rgb 18,18,18), not pure black: the pill fill and the ADD TO CART fill
   both resolved to --color-foreground / --color-base-accent-1 = 18,18,18.
   Out of scope and untouched: unselected + hover + disabled pills; the .unavailable and
   .sold_out checked rules (main-product.liquid:198,202, #000 !important); the cart
   CHECKOUT; header; footer; collection tiles. (R9 also listed the un_reactive guard here; round 10 removed that
   guard entirely, so there is nothing left to be out of scope.) */

/* Selected variant pill. Same selector and specificity as :246, later in the file, so it
   wins on source order. border-color is set explicitly because :246 sets only the fill and
   the base label rule (:213) borders with rgba(--color-foreground, .55) -- leaving that
   would paint a lighter 55%-alpha edge over the new fill, i.e. the two-tone edge. */
.product-form__input input[type='radio']:checked + label {
  background-color: #000000;
  border-color: #000000;
}

/* ADD TO CART. Override the TOKEN rather than the background: Dawn draws this button's
   border as a box-shadow ring on .button:after from rgba(var(--color-button), ...) -- the
   same token as the fill -- so moving the token moves both together and no two-tone edge
   is possible. :not([disabled]) keeps the disabled/sold-out/loading treatment as-is. */
.product-form__submit.button--primary:not([disabled]) {
  --color-button: 0, 0, 0;
}

.product-form__submit.button--primary:not([disabled]):hover,
.product-form__submit.button--primary:not([disabled]):active {
  --color-button: 34, 34, 34;
}

/* MOBILE ADD TO CART -- 20% TALLER. No rule anywhere declares `height` on this button and
   its vertical padding is zero (base.css:1332 `padding: 0 3rem`, border: 0), so the box is
   driven solely by Dawn's `.button { min-height: calc(4.5rem + var(--buttons-border-width)
   * 2) }` (base.css:1315) = 47px at 1rem=10px; the 15px/1.2 label line box is 18px, so
   min-height is what is used. x1.2 = 56.4px, and scaling that same expression keeps the
   --buttons-border-width link. (0,2,0) beats `.button` (0,1,0), so this does not rely on
   file order. align-items is a RESTATEMENT, not a change: the label is the sole flex item,
   centred on the flex line, so it re-centres at any height with no baseline drift. */
@media screen and (max-width: 749px) {
  .product-form__buttons .product-form__submit {
    min-height: calc((4.5rem + var(--buttons-border-width) * 2) * 1.2);
    align-items: center;
  }
}
