/** Shopify CDN: Minification failed

Line 116:0 Unexpected "{"

**/
@font-face {
  font-family: "Promenade-Regular";
  src: url("/cdn/shop/files/Promenade-Regular.eot?v=1699867169");
  src: url("/cdn/shop/files/Promenade-Regular.eot?v=1699867169?#iefix")
      format("embedded-opentype"),
    url("/cdn/shop/files/Promenade-Regular.woff2?v=1699867169")
      format("woff2"),
    url("/cdn/shop/files/Promenade-Regular.woff?v=1699867169")
      format("woff"),
    url("/cdn/shop/files/Promenade-Regular.ttf?v=1699867169")
      format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Promenade-Italic";
  src: url("/cdn/shop/files/Promenade-Italic.eot?v=1699867169");
  src: url("/cdn/shop/files/Promenade-Italic.eot?v=1699867169?#iefix")
      format("embedded-opentype"),
    url("/cdn/shop/files/Promenade-Italic.woff2?v=1699867169")
      format("woff2"),
    url("/cdn/shop/files/Promenade-Italic.woff?v=1699867169")
      format("woff"),
    url("/cdn/shop/files/Promenade-Italic.ttf?v=1699867169")
      format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "SackersGothic-Medium";
  src: url("/cdn/shop/files/SackersGothicStd-Medium.eot?v=1699867169");
  src: url("/cdn/shop/files/SackersGothicStd-Medium.eot?v=1699867169?#iefix")
      format("embedded-opentype"),
    url("/cdn/shop/files/SackersGothicStd-Medium.woff2?v=1699867169")
      format("woff2"),
    url("/cdn/shop/files/SackersGothicStd-Medium.woff?v=1699867169")
      format("woff"),
    url("/cdn/shop/files/SackersGothicStd-Medium.ttf?v=1699867169")
      format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  --white: #ffffff;
  --creamhalf: #FAF9F5;
  --cream: #f5f3eb;
  --beige: #e1dfd9;
  --brown: #a19686;
  --darkbrown: #7C705F;
  --black: #1d1d1d;
  --ls: 0.1em;
  --baa-header-height: 128px;
  --baa-sticky-gap: 30px;
}

/* Code to update upon updating/duplicating theme*/
/*pdp main section*/
section#MainProduct-template--26263295394158__main {
  position: relative;
}

      .discount-active .nav-bar-wrap,
      .discount-active .baa-footer {
        display: none !important;
  }

main#MainContent {
  padding-top: var(--baa-header-height);
}

body {
  font-size: 15px;
  letter-spacing: 0.03rem;
  font-family: "Poppins";
}

.header-wrapper {
  background: var(--brown);
  border-top: 4px solid var(--black);
}

.page-width {
  max-width: 95%;
}

h1 {
  font-family: "Promenade-Regular" !important;
  text-transform: uppercase;
  font-weight: 400 !important;
  line-height: 1.1 !important;
}

/* sackers gothic 12px standard ls*/
.price,
.button,
.shopify-payment-button__button,
a.link.underlined-link {
  font-family: "SackersGothic-Medium";
  font-size: 13px !important;
  letter-spacing: var(--ls);
  font-weight: 400 !important;
  text-transform: uppercase;
}

/* sackers gothic 10px standard ls*/
{
  font-family: "SackersGothic-Medium";
  font-size: 10px !important;
  letter-spacing: var(--ls);
  font-weight: 400 !important;
  text-transform: uppercase;
}

/* poppins bold uppercase */

p.product__text.inline-richtext, label.quantity__label.form__label, legend.form__label, fieldset.product-form__input, .appstle_widget_title,
span.appstle_tooltip_title,
label.appstle_select_label, button#ShowPickupAvailabilityDrawer, .baa-shipping-note  {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 13px;
}

span.baa-sticky-atc__price {
    text-transform: uppercase;
    font-weight: 500;
}

.caption-with-letter-spacing  {
    text-transform: none;
    font-weight: 500;
    font-size: 11px;
    letter-spacing: .03em !important;
    color: var(--darkbrown) !important;
    opacity: 1 !important;
}


.product-form__input input[type="radio"] + label {
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0px;
}

.product-form__input input[type="radio"] + label {
  border-radius: 0px;
}

.product-form__input input[type="radio"]:checked + label {
  background-color: var(--beige);
  color: var(--black);
}

.price__sale {
  font-family: "Poppins";
  font-size: 12px !important;
  letter-spacing: 0px;
  font-weight: 400 !important;
  text-transform: none;
  color: var(--darkbrown);
}

.product-single__meta shopify-payment-terms {
  display: none;
}

body,
.color-background-1,
.color-background-2,
.color-inverse,
.color-accent-1,
.color-accent-2 {
  color: var(--black);
}

.badge {
  background: var(--beige);
  text-transform: uppercase;
  font-family: "SackersGothic-Medium";
  font-size: 11px;
  padding-top: 8px;
}

.accordion__title {
  font-size: 17px;
}

h2.image-with-text__heading.inline-richtext.h1 {
  font-family: "Promenade-Regular" !important;
  text-transform: uppercase;
  font-weight: 400 !important;
  line-height: 1.1 !important;
  font-size: 56px;
}

a.button.button--primary {
  background: none;
  color: var(--black);
}

h2.title.inline-richtext.h1.scroll-trigger.animate--slide-in,
h2.related-products__heading.inline-richtext.h2 {
  font-family: "Promenade-Regular" !important;
  text-transform: uppercase;
  font-weight: 400 !important;
  line-height: 1.1 !important;
  text-align: center;
}

.card__heading {
  font-family: "SackersGothic-Medium";
  text-transform: uppercase;
  font-size: 12px;
  margin-bottom: 10px;
}

span.price-item.price-item--regular {
  font-family: "Poppins";
  letter-spacing: 0px;
  text-transform: none;
  color: var(--darkbrown);
}

.card__inner.ratio {
  mix-blend-mode: multiply;
}

.section-header {
  margin-bottom: 0px;
}

.swym-popup-nudge-zindex {
  display: none;
}

a.nav-link {
  font-family: "SackersGothic-Medium";
}

.baa-footer-column-header {
  font-family: Promenade-Italic;
}

.baa-footer-paragraph {
  font-family: "Promenade-Italic";
}

.baa-footer-subtext {
  font-weight: 900;
}

.section-template--15732592738357__main-padding {
  padding-bottom: 80px;
}

.baa-mega-menu-title {
  font-family: SackersGothic-Medium;
  text-decoration: none;
}

/* Floating contact box — black card, phone image anchored to the bottom edge.
   Editable via Theme settings > Floating contact box. */
.floatingbox {
  position: fixed;
  right: 15px;
  bottom: 15px;
  z-index: 3;
  width: 300px;
  max-width: calc(100vw - 60px);
  min-height: 100px;
  padding: 8px 8px 8px 68px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--black);
  border-radius: 6px;
  overflow: hidden;
  text-decoration: none;
  box-shadow: none;
}

.floatingbox__media {
  position: absolute;
  left: 12px;
  top: 13px;
  bottom: 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.floatingbox__img {
  display: block;
  height: 100%;
  width: auto;
  max-width: none;
}

.floatingbox__body {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.floatingbox__heading {
  font-family: Poppins;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 16px;
  line-height: 1.03;
  letter-spacing: -0.01em;
  color: var(--white);
}

.floatingbox__text {
  font-size: 12px;
  line-height: 1.25;
  color: var(--white);
}

.floatingbox__cta {
  align-self: flex-start;
  margin-top: 4px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--white);
  color: var(--black);
  border-radius: 999px;
  padding: 6px;
  font-weight: 700;
  font-size: 13px;
  line-height: 1;
  transition: background-color 0.25s ease;
}

.floatingbox:hover .floatingbox__cta {
  background: var(--beige);
}

.floatingbox__phone {
  width: 14px;
  height: 14px;
  fill: currentColor;
  flex: 0 0 auto;
}

.floatingbox__arrow {
  margin-left: -2px;
}

.social-icons-div {
  margin-top: -10px;
}

.cart-count-bubble {
  background-color: var(--beige);
  color: var(--black);
}

.cart-mobile-wrapper {
  width: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.header__icon,
.header__icon--cart .icon {
  width: 27px;
}

.header__icon,
.header__icon--cart .icon {
  margin-right: -12px;
}

.cart-count-bubble {
  background-color: var(--beige);
  color: var(--black);
  width: auto;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  font-size: 11px;
  font-weight: 500;
}

a#cart-icon-bubble {
  margin-right: 5px;
}

cart-items .title-wrapper-with-link {
  margin-top: 60px;
}

.cart__note label,
a.underlined-link {
  color: var(--black);
  text-transform: uppercase;
  font-family: "SackersGothic-Medium";
  font-size: 11px;
}

thead {
  font-family: "SackersGothic-Medium";
  color: var(--black);
  letter-spacing: var(--ls) !important;
}

a.legal {
  text-decoration: none;
  color: var(--cream);
}

.collection-hero__title {
  margin: 2.5rem 0;
  text-align: center;
}

a.baa-menu-mobile-header {
  font-family: Promenade-Italic;
  font-size: 32px;
  margin-bottom: 20px;
}
a.baa-menu-mobile-link {
  text-transform: uppercase;
  font-family: "SackersGothic-Medium";
  letter-spacing: var(--ls);
  font-size: 12px;
  margin-bottom: 8px;
}
.swym-wishlist-container-title-bar.swym-bg-1.swym-bg-2.swym-color-4 {
  background: var(--darkbrown) !important;
}
h2.swym-wishlist-main-title.swym-heading.swym-heading-1.swym-is-heading {
  font-family: "Promenade-Regular" !important;
  text-transform: uppercase !important;
  letter-spacing: 0px !important;
  font-size: 36px !important;
}
span.swym-user-text.swym-value.swym-value-1 {
  font-family: "Poppins" !important;
  letter-spacing: 0px !important;
  font-size: 12px !important;
}
h3.swym-title.swym-title-1 {
  color: var(--black);
  font-family: "Poppins" !important;
  font-weight: 300 !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
}
.swym-variant-title.swym-text.swym-title-2 {
  color: var(--black) !important;
  font-size: 11px !important;
  font-family: "Poppins" !important;
  letter-spacing: 0px !important;
}
button.swym-add-to-cart-btn.swym-button.swym-button-1.swym-is-button.swym-bg-2.swym-color-4.swym-is-button {
  background: var(--beige) !important;
  font-family: "SackersGothic-Medium" !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  letter-spacing: var(--ls) !important;
  padding-top: 15px !important;
  padding-bottom: 15px !important;
  color: var(--black) !important;
}
.swym-product-final-price.swym-value {
  color: var(--black) !important;
  font-family: "Poppins" !important;
  font-weight: 300 !important;
  font-size: 12px !important;
}
.swym-product-original-price.swym-value {
  font-weight: 300 !important;
  font-family: "Poppins" !important;
  color: var(--darkbrown) !important;
}
img.phoneicon {
  height: 20px;
}
.swym-popup-nudge-zindex {
  display: none !important;
}
.baa-testimonials-caption,
.baa-testimonials-captio-right,
.baa-testimonials-read-all {
  font-family: "SackersGothic-Medium";
  letter-spacing: var(--ls);
  font-size: 12px;
}
.baa-testimonials-headline {
  font-size: 54px;
  line-height: 1;
  text-transform: uppercase;
  font-family: "Promenade-Regular";
}
.baa-testimonials-name {
  font-size: 22px;
  font-family: "Promenade-Italic";
}
.baa-testimonials-testimonial {
  font-size: 15px;
  line-height: 1.5;
}

span.appstle_one_time_text,
span.appstle_subscription_amount.transcy-money,
span.appstle_subscribe_save_text,
span.appstle_subscription_compare_amount.transcy-money,
.afterpay-paragraph,
span.sellingplan,
.span.as-label {
  font-size: 13px !important;
  font-weight: 400 !important;
  letter-spacing: 0px;
}
#appstle_subscription_widget0 .appstle_subscription_wrapper {
  border: 1.5px solid var(--beige);
  border-radius: 0px;
}
.prepaidPlansDropdownWrapper,
.appstle_subscription_wrapper_option + .payAsYouGoPlansDropdownWrapper {
  border-top: 1.5px solid var(--beige);
}
#appstle_subscription_widget0 .appstle_subscription_wrapper_option {
  padding: 12px 14px 12px 14px;
}
.appstle-customer-portal {
  font-family: "Poppins" !important;
}
#revy-bundle-wrapper
  .revy-bundle-wrapper-inner
  .revy-bundle-products
  .revy-bundle-product
  .revy-bundle-info-container
  .revy-bundle-sale-container
  .revy-bundle-price-green
  .money {
  color: black;
  font-weight: 600;
}
.italic-text {
  letter-spacing: -0.008em;
}
.baa-footer-paragraph {
  max-width: 26ch;
  color: #fff;
  text-align: center;
  font-size: 26px;
  line-height: 30px;
  letter-spacing: -0.004em;
}
img.logo-gif {
  max-width: 250px;
}
.utility-bar.color-background-2.gradient.utility-bar--bottom-border {
  background: var(--black);
}
p.announcement-bar__message.h5 {
  color: var(--white);
  font-weight: 300 !important;
  font-family: "SackersGothic-Medium";
  font-size: 9px;
}
.nav-bar {
  border-top: none;
}
.announcement-bar__message {
  min-height: unset;
}
.announcement-bar {
  position: fixed;
}
.announcement {
  background: var(--black);
  color: var(--white);
  font-family: "SackersGothic-Medium";
  text-transform: uppercase;
  font-size: 9px;
  text-align: center;
  padding: 8px;
}
.nav-bar-wrap {
  position: fixed;
  width: 100%;
  z-index: 20;
}
.baa-mega-menu {
  margin-top: var(--baa-header-height);
  z-index: 15;
  transform: translateY(-100%);
  visibility: hidden;
  pointer-events: none;
  transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 0.28s;
}
.baa-mega-menu.is-open {
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
  transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s;
}
@media (prefers-reduced-motion: reduce) {
  .baa-mega-menu,
  .baa-mega-menu.is-open {
    transition: none;
  }
}
.cart-div {
  display: flex;
  align-items: center;
  justify-content: center;
  grid-column-gap: 7px;
}
.cart-div-mobile {
  display: flex;
  align-items: center;
  justify-content: center;
  grid-column-gap: 7px;
}
.nav-bar-wrap {
  background: var(--black);
}
a.announcement {
  text-decoration: none;
}
.announcement {
  display: block;
}
img.loginuser {
  height: 20px;
  margin-right: 10px;
}
.customer:not(.account):not(.order) {
  padding-top: 100px;
}

.modal-content-custom {
    max-width: 400px;
    padding: 40px;
}

@media screen and (min-width: 767px) {
  .floatingboxmobile {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .floatingbox {
    display: none;
  }
  .baa-footer-paragraph {
    max-width: 29ch;
  }
  .nav-bar-wrap {
    position: static;
  }

  .floatingboxmobile {
    position: fixed;
    right: 16px;
    bottom: 10px;
    z-index: 3;
    width: 160px;
    min-height: 45px;
    padding: 5px 5px 5px 38px;
    display: flex;
    align-items: center;
    background: var(--beige);
    border-radius: 6px;
    overflow: hidden;
    text-decoration: none;
    box-shadow: none;
    border: 1px solid var(--black);
  }

  .floatingboxmobile__media {
    position: absolute;
    left: 8px;
    top: 9px;
    bottom: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
  }

  .floatingboxmobile__img {
    display: block;
    height: 100%;
    width: auto;
    max-width: none;
  }

  .floatingboxmobile__text {
    font-family: Poppins;
    font-weight: 500;
    font-size: 11px;
    line-height: 1.15;
    color: var(--black);
  }

  .floatingboxmobile__arrow {
    white-space: nowrap;
  }

  main#MainContent {
    padding-top: 0px;
  }

  .baa-mega-menu {
    display: none;
  }

  .baa-testimonials-headline {
    font-size: 35px;
  }

  .baa-testimonials-testimonial {
    font-size: 13px;
    line-height: 1.4;
  }
  .ab-tier-title-font-style {
    line-height: 1 !important;
}
.ab-tier-sub-title-font-style {
    line-height: 1.2 !important;
    margin-top: 6px !important;
}
.ab-save-badge-font-style {
    line-height: 1 !important;
}
.ab-px-5 {
    padding-left: 10px!important;
    padding-right: 10px!important;
}
}

/* 2026 */

.product-form__quantity {
    display: flex;
    align-items: center;
    gap: 20px;
}

.product-form__quantity-top .form__label {
    margin-bottom: 0 !important;
}

square-placement,
afterpay-placement {
    letter-spacing: 0px !important;
    line-height: 1 !important;
}

.price--large,
.price--large .price-item {
    line-height: 1 !important;
}

.product {
    border: 1px solid black;
}

.product__info-wrapper {
    border-right: 1px solid black;
    padding: 40px !important;
    background: var(--creamhalf);
}

.product-form__input input[type=radio]:checked+label {
    background-color: var(--darkbrown) !important;
        border: 1px solid var(--darkbrown) !important;
}

div#price-template--28655245361518__main {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
}

.product__column-sticky {
    display: flex;
    flex-direction: column;
}

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

.product-form__buttons {
    max-width: unset !important;
    margin-top: 20px !important;
}

.appstle_subscription_wrapper_option {
    border: 1px solid !important;
    border-radius: 0px !important;
}

.appstle_subscription_wrapper {
    border-radius: 0px !important;
}

.appstle_sub_widget.WIDGET_TYPE_1 .appstle_subscription_wrapper {
    border-radius: 0px !important;
}

button#ShowPickupAvailabilityDrawer {
    background: var(--beige);
    padding: 5px 10px;
    text-decoration: none;
    justify-self: flex-start;
}

#appstle_subscription_widget0 .appstle_subscription_wrapper_option {
    padding: 12px 16px !important;
}

.product .price .badge, .product .price__container {
    margin-bottom: 0 !important;
}

h2.h4.accordion__title.inline-richtext {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 500;
}

.product-form__quantity .quantity {
    width: fit-content;
    min-height: 44px;
}

.product-form__quantity .quantity__button {
    width: 44px;
}

.product-form__quantity .quantity__input {
    width: 30px;
    flex-grow: 0;
    padding: 0;
    font-size: 16px;
}

.product-form__quantity .quantity:before {
    background: var(--creamhalf);
}

.product-form__quantity .quantity__button:focus,
.product-form__quantity .quantity__button:focus-visible,
.product-form__quantity .quantity__input:focus,
.product-form__quantity .quantity__input:focus-visible {
    background-color: var(--creamhalf);
}

.product-form__input input[type=radio]+label {
    border: 1px solid black;
    background: var(--creamhalf);
}

@media screen and (min-width: 768px) {
    .product-form__quantity .quantity {
        min-height: 36px;
    }

    .product-form__quantity .quantity__button {
        width: 30px;
    }

    .product-form__quantity .quantity__button svg {
        width: 8px;
    }

    .product-form__quantity .quantity__input {
        width: 32px;
        font-size: 13px;
    }
}


.product-form__input input[type=radio]+label {
    border: 1px solid black !important;
    background-color: var(--creamhalf) !important;
    padding: 1rem !important;
}

.product-form__submit {
    min-height: 60px;
}

.button {
  line-height: 1 !important;
}

.product__info-wrapper {
    position: relative;
}

.product__info-wrapper .swym-button-bar.swym-wishlist-button-bar {
    position: absolute;
    top: 0px;
    right: 0px;
    margin: 0;
    line-height: 0;
    z-index: 2;
}

.product__info-wrapper .swym-btn-container .swym-button.swym-add-to-wishlist {
    display: block;
    height: 22px;
    width: 22px;
}

.product__info-wrapper .swym-btn-container .swym-button.swym-add-to-wishlist:after {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: auto;
    height: auto;
    font-size: 22px;
    line-height: 22px;
    text-align: center;
    text-indent: 0;
}

.pickup-availability-info {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: start;
    align-items: baseline;
    column-gap: 10px;
    row-gap: 5px;
}

.pickup-availability-info > p {
    margin: 0;
}

.pickup-availability-info > .pickup-availability-button {
    grid-column: 1 / -1;
    justify-self: start;
    margin: 0;
}

@media screen and (max-width: 767px) {
    .pickup-availability-info {
        grid-template-columns: auto;
    }

    .pickup-availability-info > .pickup-availability-button {
        grid-column: 1;
    }
}

.product__accordion .accordion__content {
  font-size: 14px !important;
}

.product__description {
    font-size: 14px;
    line-height: 1.6;
}

.product__description ul {
    margin-bottom: 20px;
}

.product__info-container .product-form, .product__info-container .product__description, .product__info-container .icon-with-text {
    margin: 0 !important;
}

.product__info-container>*+* {
    margin: 0 !important;
}

.product__column-sticky {
    display: flex !important;
    gap: 15px !important;
}

.product-form__input {
    margin: 0 !important;
}

.accordion summary {
    padding: 0 0 15px 0 !important;
}

.accordion {
    border-bottom: 1px solid black !important;
    border-top: none !important;
}

.product__description.rte.quick-add-hidden {
    margin-bottom: 15px !important;
}

.product__accordion > details > summary .icon-caret {
    position: static;
    align-self: center;
    top: auto;
    right: auto;
    margin-right: 1.5rem;
    height: calc(var(--font-heading-scale) * 0.9rem);
    color: var(--black);
    opacity: 1;
    transition: transform 320ms cubic-bezier(0.33, 1, 0.68, 1);
}

.product__accordion > details > summary {
    cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
    .product__accordion > details > summary .icon-caret {
        transition: none;
    }
}

@media screen and (min-width: 750px) {
    .product .product__column-sticky {
        top: calc(var(--baa-header-height) + var(--baa-sticky-gap));
    }
}

.baa-shipping-note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 12px;
    margin-bottom: 20px;
    line-height: 1;
    color: var(--black);
}

.baa-shipping-note__icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.baa-shipping-note {
    text-transform: none;
}

pickup-availability-preview.pickup-availability-preview {
    padding: 15px;
    border: 1px solid;
}

.pickup-availability-button {
    color: var(--black) !important;
}

[id^="MainProduct-"] > .page-width {
    max-width: 97.5%;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

section[id^="MainProduct-"] {
    padding-top: calc(1.25% + 0.75rem);
    padding-bottom: calc(1.25% + 0.75rem);
}

@media screen and (min-width: 750px) {
    [id^="MainProduct-"] > .page-width {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
    }

    section[id^="MainProduct-"] {
        padding-top: calc(1.25% + 2.5rem);
        padding-bottom: calc(1.25% + 2.5rem);
    }
}

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

.appstle-save-badge {
    display: none !important;
}

#appstle_subscription_widget0 .appstle-tootltip-parent {
    pointer-events: none !important;
}

#appstle_subscription_widget0 .appstle-tootltip-parent .appstle_tooltip_wrapper {
    display: inline-flex !important;
    width: auto !important;
    pointer-events: auto !important;
}

#appstle_subscription_widget0 .appstle-tootltip-parent .appstle_tooltip {
    pointer-events: none !important;
    top: auto !important;
    bottom: calc(100% + 6px) !important;
    transform: scaleY(1) !important;
    transform-origin: bottom center;
}

#appstle_subscription_widget0 .appstle-tootltip-parent .appstle_tooltip,
#appstle_subscription_widget0 .appstle-tootltip-parent .appstle_tooltip::before,
#appstle_subscription_widget0 .appstle-tootltip-parent .appstle_tooltip::after,
#appstle_subscription_widget0 .appstle-tootltip-parent .appstle_tooltip_content {
    background: var(--black) !important;
}

/* variant swatches */

.product-form__input--swatch .form__label-value {
    text-transform: none;
    letter-spacing: 0;
    color: var(--darkbrown);
    opacity: 1;
}

.product-form__input--swatch .form__label-value:before {
    content: ": ";
}

.swatch {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    background: var(--swatch--background) center / cover no-repeat;
    border-radius: inherit;
}

.product-form__input--swatch input[type='radio'] + label.swatch-input__label {
    --swatch-size: 34px;
    display: inline-block;
    width: var(--swatch-size);
    height: var(--swatch-size);
    min-width: 0;
    padding: 0 !important;
    margin: 0.7rem 0.8rem 0.2rem 0;
    border: 1px solid rgba(var(--color-foreground), 0.2) !important;
    background-color: transparent !important;
    overflow: hidden;
    text-decoration: none !important;
    transition: border-color var(--duration-short) ease;
}

.product-form__input--swatch input[type='radio'] + label.swatch-input__label--circle {
    border-radius: 50%;
}

.product-form__input--swatch input[type='radio'] + label.swatch-input__label--square {
    border-radius: 2px;
}

.product-form__input--swatch input[type='radio'] + label.swatch-input__label:before {
    box-shadow: none;
}

.product-form__input--swatch input[type='radio'] + label.swatch-input__label:hover {
    border-color: rgba(var(--color-foreground), 0.55) !important;
}

.product-form__input--swatch input[type='radio']:checked + label.swatch-input__label {
    background-color: transparent !important;
    border-color: rgb(var(--color-foreground)) !important;
    outline: 1px solid rgb(var(--color-foreground));
    outline-offset: 3px;
}

.product-form__input--swatch input[type='radio'].disabled + label.swatch-input__label,
.product-form__input--swatch input[type='radio']:disabled + label.swatch-input__label {
    opacity: 0.5;
}

.product-form__input--swatch input[type='radio'].disabled + label.swatch-input__label .swatch:after,
.product-form__input--swatch input[type='radio']:disabled + label.swatch-input__label .swatch:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(
        to top left,
        transparent calc(50% - 1px),
        rgba(var(--color-foreground), 0.75) calc(50% - 1px),
        rgba(var(--color-foreground), 0.75) calc(50% + 1px),
        transparent calc(50% + 1px)
    );
}

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

/* collapsible row lists */

.product__accordion .accordion__content ul,
.product__accordion .accordion__content ol {
    list-style-position: outside;
    padding-left: 1.4em;
    margin: 0 0 1.2em;
}

.product__accordion .accordion__content ul {
    list-style-type: disc;
}

.product__accordion .accordion__content li {
    padding-left: 0.3em;
    margin-bottom: 0.8em;
    line-height: 1.6;
}

.product__accordion .accordion__content li:last-child {
    margin-bottom: 0;
}

.product__accordion .accordion__content > *:last-child {
    margin-bottom: 0;
}

.product-media-container {
    padding: 40px;
}

/* pdp mobile fold */

@media screen and (max-width: 749px) {
    .product__media-wrapper .product-media-container {
        padding: 20px;
    }

    .product .product__info-wrapper {
        padding: 20px !important;
    }

    .product__media-wrapper .product-media-container .product__modal-opener {
        flex: 1 1 auto;
        width: 100%;
        height: 35vh;
        height: 35svh;
    }

    .product__media-wrapper .product-media-container .media {
        padding-top: 0;
        height: 100%;
    }

    .product__media-wrapper .product-media-container .media > img {
        object-fit: contain;
        object-position: center center;
    }

    .product__info-container.product__column-sticky {
        gap: 10px !important;
    }

    .product__info-container .baa-shipping-note {
        margin-top: 4px;
        margin-bottom: 0;
    }

    .product__info-wrapper .swym-button-bar.swym-wishlist-button-bar {
        position: absolute;
        top: 20px;
        right: 20px;
        margin: 0;
        line-height: 0;
        z-index: 2;
    }
}

/* pdp mobile — contain the ~3px media-slider gutter overflow that let the page scroll sideways */

@media screen and (max-width: 749px) {
    html:has(.product),
    html:has(.product) body {
        overflow-x: clip;
    }
}

/* pdp mobile sticky add to cart */

.baa-sticky-atc {
    --baa-sticky-atc-height: 66px;
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 4;
    display: none;
    background: var(--creamhalf);
    border-top: 1px solid var(--black);
    padding: 10px 15px calc(10px + env(safe-area-inset-bottom));
    transform: translateY(100%);
    transition: transform 260ms cubic-bezier(0.33, 1, 0.68, 1);
}

.baa-sticky-atc.is-visible {
    transform: translateY(0);
}

/* Hide the sticky add-to-cart bar while the mobile menu is open — the menu is a
   full-screen overlay, and the ATB sits in its own stacking context, so it
   can't be covered by raising the menu's z-index. theme-custom.js sets
   body.baa-menu-open. */
body.baa-menu-open .baa-sticky-atc {
    display: none !important;
}

.baa-sticky-atc__inner {
    display: flex;
    align-items: center;
    gap: 12px;
}

.baa-sticky-atc__text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1 1 auto;
}

.baa-sticky-atc__title {
    font-size: 11px;
    line-height: 1.2;
    color: var(--darkbrown);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.baa-sticky-atc__price {
    font-size: 16px;
    color: var(--black);
}

.baa-sticky-atc__button {
    flex: 0 0 auto;
    min-width: 150px;
    margin: 0;
}

.baa-sticky-atc__button[disabled] {
    opacity: 0.5;
}

@media screen and (max-width: 749px) {
    .baa-sticky-atc {
        display: block;
    }

    body.baa-sticky-atc-visible .floatingboxmobile {
        bottom: calc(10px + var(--baa-sticky-atc-height, 66px));
    }

    body.baa-sticky-atc-visible #MainContent {
        padding-bottom: var(--baa-sticky-atc-height, 66px);
    }

    div#price-template--28655245361518__main {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    margin-bottom: 20px;
    flex-direction: column;
}
.product-form__buttons {
    margin-top: 0px !important;
}
.product__info-wrapper {
    border-right: none;
    padding: 40px !important;
    background: var(--creamhalf);
}
.baa-shipping-note {
    margin-bottom: 20px !important;
}
.accordion summary {
    padding: 0 0 10px 0 !important;
}

#swym-plugin #swym-anchor[data-position=bottom-left], #swym-hosted-plugin #swym-anchor[data-position=bottom-left] {
    left: 10px;
    bottom: 80px;
    right: initial;
    opacity: 1;
    display: none;
}
}



@media (prefers-reduced-motion: reduce) {
    .baa-sticky-atc {
        transition: none;
    }
}

.product__text {
    margin-bottom: 0;
    margin-top: 0;
}

/* description lists */

.product__description ul,
.product__description ol {
    list-style-position: outside;
    padding-left: 1.4em;
    margin: 0 0 20px;
}

.product__description ul {
    list-style-type: disc;
}

.product__description li {
    padding-left: 0.3em;
    margin-bottom: 0.8em;
    line-height: 1.6;
}

.product__description li:last-child {
    margin-bottom: 0;
}

/* buttons — optically center all-caps label (SackersGothic ink sits ~2.7px high in its line box) */

.button {
    padding-top: 0.2em;
}

/* appstle bundle swatches — theme-custom.js swaps the app's plain-text shade
   dropdown for these; the app's picker stays in the DOM and still drives the
   selection, so it is hidden rather than removed */

.baa-bundle-swatches-on .ab-fixed-pricing-variant-select {
    display: none !important;
}

/* the app hard-caps this wrapper at 200px for its dropdown, which wraps 6+
   swatches onto a second line; the column it sits in is over twice that, and
   the dropdown inside it is hidden, so take the full width */
.baa-bundle-swatches-on .ab-fixed-pricing-child-row-variant-select-wrapper {
    width: 100% !important;
    max-width: 100% !important;
}

/* Appstle's build-a-box.css ships `body,html{font-family:Inter var,sans-serif}`
   with no scoping at all, and it loads after this file. Same specificity as the
   body rule near the top, so source order alone hands the whole page to Inter
   wherever the bundle widget renders — that is the flash of Poppins turning
   into Inter. Only bundle pages are affected; collections and ordinary product
   pages never load that sheet. Reported to Appstle. */
html,
body {
    font-family: "Poppins", sans-serif !important;
}

/* bundle card — strip the app's own chrome. the hero title and thumbnail repeat
   the product title and image already on the page; dropping the thumbnail is
   what pulls the eyebrow and price left, since the hero is a flex row and the
   image was the first item. "add a note" sits directly in the card's flex
   column, so hiding it takes its gap with it */
/* The whole hero goes: its title, thumbnail and price all repeat the product
   page around it. Its trailing rule goes with it. The discount framing is kept
   and re-sited beside the total by theme-custom.js.
   Two classes deep on purpose: these carry an ab-flex utility that is itself
   !important and loads after this file, so an equal-specificity rule loses */
.ab-fixed-pricing-bundle .ab-fixed-pricing-parent-hero,
.ab-fixed-pricing-bundle .ab-fixed-pricing-section-divider,
.ab-fixed-pricing-bundle .ab-fixed-pricing-order-notes-toggle {
    display: none !important;
}

/* line thumbnails — square, unframed, no fill */
.ab-fixed-pricing-child-row .ab-fixed-pricing-child-row-image-wrapper {
    border: 0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
}

/* the rule between lines is an absolutely positioned 1px block, not a border.
   the app insets it 54px to clear its own 42px thumbnail; flush left instead */
.ab-fixed-pricing-bundle .ab-fixed-pricing-child-row-divider {
    left: 0 !important;
    background-color: var(--brown) !important;
}

/* compare-at and the savings note sit inline after the total; the group is
   already a baseline-aligned flex row, so they need nothing else */

/* bundle card — no frame, no fill. padding and background are css vars the app's
   utility classes read, so zero the vars rather than fight the classes; the 1px
   border width is hard-coded in their utility, so that one has to be overridden
   directly.
   --fp-card-bg defaults to white and is set per bundle in the Appstle admin, so
   every new bundle would otherwise arrive as a white slab on the cream info
   column. transparent rather than a cream literal: the card then takes whatever
   is behind it and cannot drift out of sync with the column's background */
.ab-fixed-pricing-bundle {
    --fp-card-padding: 0px !important;
    --fp-card-bg: transparent !important;
}

.ab-fixed-pricing-bundle .ab-fixed-pricing-card {
    border: 0 !important;
}

/* deferred bundle assembly (theme-custom.js) — lines are added all at once by a
   clone of the app's own checkout button, so everything belonging to the
   add-each-line-by-hand flow comes off the page. the app re-shows all of it if
   the assembly ever fails */
.baa-bundle-deferred .ab-fixed-pricing-bundle-contents-header,
.baa-bundle-deferred .ab-fixed-pricing-bundle-contents-progress-bar,
.baa-bundle-deferred .ab-fixed-pricing-bundle-contents-progress-row,
.baa-bundle-deferred .ab-fixed-pricing-child-row-add-button,
.baa-bundle-deferred .ab-fixed-pricing-stepper,
.baa-bundle-deferred .ab-fixed-pricing-price-footer-validation,
.baa-bundle-deferred .ab-fixed-pricing-price-footer-checkout-button {
    display: none !important;
}

/* ours is a theme button, so it needs no styling here beyond the busy state */
.baa-bundle-deferred [data-baa-cta][aria-busy='true'] {
    opacity: 0.6;
    cursor: wait;
}

/* line thumbnails at 2x the app's 42px — the inner img is w-full/h-full, so the
   wrapper is the only thing to size; needs the extra class to outrank their
   arbitrary-value utility, which is !important and loads after this file */
.ab-fixed-pricing-child-row .ab-fixed-pricing-child-row-image-wrapper {
    width: 84px !important;
    height: 84px !important;
}

.baa-bundle-swatches {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    width: 100%;
}

.baa-bundle-swatch {
    --swatch-size: 30px;
    display: block;
    width: var(--swatch-size);
    height: var(--swatch-size);
    padding: 0;
    border: 1px solid rgba(var(--color-foreground), 0.2);
    border-radius: 50%;
    background: transparent;
    overflow: hidden;
    cursor: pointer;
    transition: border-color var(--duration-short) ease;
}

.baa-bundle-swatch:hover {
    border-color: rgba(var(--color-foreground), 0.55);
}

.baa-bundle-swatch[aria-checked='true'] {
    border-color: rgb(var(--color-foreground));
    outline: 1px solid rgb(var(--color-foreground));
    outline-offset: 3px;
}

.baa-bundle-swatch--unavailable {
    opacity: 0.5;
}

.baa-bundle-swatch--unavailable .swatch:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(
        to top left,
        transparent calc(50% - 1px),
        rgba(var(--color-foreground), 0.75) calc(50% - 1px),
        rgba(var(--color-foreground), 0.75) calc(50% + 1px),
        transparent calc(50% + 1px)
    );
}

/* swatches grow on touch rather than shrink, with a wider gap so neighbouring
   shades are harder to mis-tap; 8 shades wrap to a second line on a phone */
@media screen and (max-width: 749px) {
    .baa-bundle-swatches {
        gap: 10px;
    }

    .baa-bundle-swatch {
        --swatch-size: 40px;
    }
}

/* bundle typography — the app ships its own Inter stack, so everything in the
   widget is put back onto the site's body font. SackersGothic is reserved for
   the checkout label alone, matching .button above; that rule is two classes
   deep so it outranks this one-class sweep no matter the order. the shade name
   follows the pdp swatch legend (sentence case, --darkbrown) and the savings
   note the .product__text label treatment. the app ships the shade name as a
   translucent black — the only alpha text in the widget — solid here. the
   checkout label stays white because it sits on the black button */

.ab-fixed-pricing-bundle,
.ab-fixed-pricing-bundle * {
    font-family: var(--font-body-family, "Poppins"), sans-serif !important;
}

.ab-fixed-pricing-bundle .ab-fixed-pricing-child-row-variant {
    font-size: 13px !important;
    font-weight: 400 !important;
    text-transform: uppercase !important;
    color: var(--darkbrown) !important;
    opacity: 1 !important;
}

/* our add-to-cart carries the theme's button classes, but the app's scoped
   reset flattens buttons inside the widget — background, padding and casing all
   come back off, and the Poppins sweep above takes the SackersGothic with them.
   so the product page button's resolved values are restated here: 60px tall,
   square, black on white type, 30px sides with the 0.2em optical nudge that
   .button gets above. colours are the brand tokens, which are what the pdp
   button's colour-scheme vars resolve to */
.ab-fixed-pricing-bundle [data-baa-cta],
.ab-fixed-pricing-bundle [data-baa-cta] span {
    font-family: "SackersGothic-Medium" !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    letter-spacing: var(--ls) !important;
    text-transform: uppercase !important;
    color: var(--white) !important;
}

.ab-fixed-pricing-bundle [data-baa-cta] {
    min-height: 60px !important;
    padding: 0.2em 30px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-color: var(--black) !important;
    cursor: pointer !important;
}

/* the app's own label, which only shows again if the deferred flow surrenders */
.ab-fixed-pricing-bundle .ab-fixed-pricing-price-footer-checkout-label {
    font-family: "SackersGothic-Medium" !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    letter-spacing: var(--ls) !important;
    text-transform: uppercase !important;
    opacity: 1 !important;
}

.ab-fixed-pricing-bundle .ab-fixed-pricing-child-row-price {
    font-size: 13px !important;
    font-weight: 400 !important;
    color: var(--darkbrown) !important;
    opacity: 1 !important;
}

.ab-fixed-pricing-bundle .ab-fixed-pricing-price-footer-total {
    font-size: 18px !important;
    font-weight: 500 !important;
    color: var(--black) !important;
    opacity: 1 !important;
}

.ab-fixed-pricing-bundle [data-baa-price='compare'] {
    font-size: 13px !important;
    font-weight: 400 !important;
    color: var(--darkbrown) !important;
    opacity: 1 !important;
}

/* savings note takes the site's small-label treatment (.product__text) */
.ab-fixed-pricing-bundle [data-baa-price='note'] {
    font-size: 13px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    color: var(--black) !important;
    opacity: 1 !important;
}

.ab-fixed-pricing-bundle .ab-fixed-pricing-child-row-title {
    color: var(--black) !important;
    opacity: 1 !important;
    font-size: 15px !important;
}

.ab-leading-none {
    line-height: 1 !important;
    margin-bottom: 5px;
}

/* purchase options — the app labels this at 9px in translucent black and rounds
   every control; both come onto the site system here. the dropdown value and
   the heading carry `ab-leading-none`, so the 5px bottom margin that rule adds
   was pushing the trigger text 2.5px above centre inside its flex row — zeroed
   on the value only, leaving that rule's spacing intact everywhere else */

.ab-fixed-pricing-bundle .ab-fixed-pricing-purchase-options-heading {
    font-size: 13px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    color: var(--darkbrown) !important;
    opacity: 1 !important;
}

.ab-fixed-pricing-bundle .ab-fixed-pricing-purchase-options-dropdown-trigger,
.ab-fixed-pricing-bundle .ab-fixed-pricing-purchase-options-dropdown-list,
.ab-fixed-pricing-bundle .ab-fixed-pricing-purchase-options-dropdown-option {
    border-radius: 0 !important;
}

.ab-fixed-pricing-bundle .ab-fixed-pricing-purchase-options-dropdown-trigger,
.ab-fixed-pricing-bundle .ab-fixed-pricing-purchase-options-dropdown-list {
    border-color: var(--brown) !important;
}

/* the open dropdown is position:absolute and drops down over the CTA button, but
   the app leaves the list container and every non-selected option transparent —
   so with no backdrop the black button shows straight through the menu, reading
   as the button stacked in the middle of the options. give the list an opaque
   background and a soft shadow so it masks whatever it opens over and reads as a
   floating menu. (Only the SPF Foundational 5 bundle renders these options — its
   parent is the only bundle parent carrying selling plans.) */
.ab-fixed-pricing-bundle .ab-fixed-pricing-purchase-options-dropdown-list {
    background-color: var(--white) !important;
    box-shadow: 0 6px 20px rgba(29, 29, 29, 0.12) !important;
}

.ab-fixed-pricing-bundle .ab-fixed-pricing-purchase-options-dropdown-value,
.ab-fixed-pricing-bundle .ab-fixed-pricing-purchase-options-dropdown-option-label {
    font-size: 13px !important;
    color: var(--black) !important;
    opacity: 1 !important;
}

.ab-fixed-pricing-bundle .ab-fixed-pricing-purchase-options-dropdown-value {
    margin-bottom: 0 !important;
}

.ab-fixed-pricing-bundle .ab-fixed-pricing-purchase-options-dropdown-option-selected {
    background-color: var(--cream) !important;
}

/* ── Magen Method bundle cards ───────────────────────────────────────────────
   Everything below is scoped to .product-the-magen-method — the handle class
   added to the main-product section wrapper (sections/main-product.liquid) — so
   the separate SPF bundle product keeps the app's stock look (capped scroll,
   scroll-down hint, divider list) while this product gets the two-up card grid.

   Scroll uncap: a short bundle's lines render into a plain contents list, but
   past a product count the app swaps in a max-height:330px / overflow-y:auto
   scroll wrapper — which would otherwise trap the card grid in a 330px scroller.
   Uncap it (all viewports; this was the original scrollbar fix). The mr:-12/pr:12
   the app adds to tuck the scrollbar into a gutter is zeroed so the block stays
   flush. Three classes deep to outrank the app's single-class ab-max-h-[330px] /
   ab-overflow-y-auto utilities, which are !important and load after this file */
.product-the-magen-method .ab-fixed-pricing-bundle .ab-fixed-pricing-bundle-product-page-scroll,
.product-the-magen-method .ab-fixed-pricing-bundle .ab-fixed-pricing-bundle-contents-scroll {
    max-height: none !important;
    overflow: visible !important;
    margin-right: 0 !important;
    padding-right: 0 !important;
}

/* the scroll-down hint — a white fade with a bouncing arrow (the arrow a child
   of the fade) — has nothing to fade against once the list is uncapped, so it
   would sit there at full opacity forever. hide it (gradient and arrow together) */
.product-the-magen-method .ab-fixed-pricing-bundle .ab-fixed-pricing-bundle-contents-scroll-fade {
    display: none !important;
}

/* two-up card grid, desktop only, all three bundles. the row-container class
   varies by bundle size (-contents-list when short, -contents-scroll when tall),
   so match whichever -contents* element directly holds the rows via :has, and
   let the last row — the Face Shield Flex, always last — span both columns.
   mobile keeps the app's stacked single column */
@media screen and (min-width: 750px) {
    .product-the-magen-method .ab-fixed-pricing-bundle [class*="ab-fixed-pricing-bundle-contents"]:has(> .ab-fixed-pricing-child-row) {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        column-gap: 12px !important;
        row-gap: 12px !important;
        align-items: stretch !important;
    }

    .product-the-magen-method .ab-fixed-pricing-bundle [class*="ab-fixed-pricing-bundle-contents"]:has(> .ab-fixed-pricing-child-row) > .ab-fixed-pricing-child-row:last-child {
        grid-column: 1 / -1 !important;
    }

    /* each row becomes a white card. the app's per-row divider line is dropped
       here (kept on the SPF bundle product via the unscoped divider rule above);
       the white fills behind the line thumbnail too, since that wrapper is
       transparent, so the background wraps the image as well as the text */
    .product-the-magen-method .ab-fixed-pricing-bundle .ab-fixed-pricing-child-row {
        background: var(--white) !important;
        border-radius: 12px !important;
        padding: 12px 16px !important;
    }

    .product-the-magen-method .ab-fixed-pricing-bundle .ab-fixed-pricing-child-row-divider {
        display: none !important;
    }
}

/* hide the app's price "Breakdown" toggle — it renders only on the larger
   bundles' footer and duplicates what the line list already shows */
.product-the-magen-method .ab-fixed-pricing-bundle .ab-fixed-pricing-price-breakdown {
    display: none !important;
}

/* hide each line's struck compare-at price (e.g. "$50" under Gentle Cleanser) -
   the app renders the per-item price with its own line-through. kept in the DOM
   (display only) because theme-custom.js still sums these for the synthesised
   footer "was" price. the 3px separator dot between the variant label and
   the price goes with it */
.product-the-magen-method .ab-fixed-pricing-bundle .ab-fixed-pricing-child-row-price,
.product-the-magen-method .ab-fixed-pricing-bundle .ab-fixed-pricing-child-row-meta-dot {
    display: none !important;
}

/* synthesised strikethrough "was" price. the app renders its own
   .ab-fixed-pricing-price-footer-original on the larger bundles but not on the
   short one, so theme-custom.js injects [data-baa-price="original"] (sum of the
   line prices) wherever the app rendered none. styled to match the app's native
   original on the other bundles — 12px, 50% black, struck */
.product-the-magen-method .ab-fixed-pricing-bundle [data-baa-price="original"] {
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    text-decoration: line-through !important;
    color: rgba(29, 29, 29, 0.5) !important;
    font-variant-numeric: tabular-nums;
    opacity: 1 !important;
}

/* lock the footer price-group order so every variant reads the same: bundle
   price, then the struck full price, then the "Your bundle" note. the group is a
   wrap flex and React reorders its children (and our copied note) unpredictably
   across re-renders, so pin it rather than rely on DOM order. covers the app's
   native original on the larger bundles and the injected one on the short bundle */
.product-the-magen-method .ab-fixed-pricing-bundle .ab-fixed-pricing-price-footer-total {
    order: 1 !important;
}

.product-the-magen-method .ab-fixed-pricing-bundle .ab-fixed-pricing-price-footer-original,
.product-the-magen-method .ab-fixed-pricing-bundle [data-baa-price="original"] {
    order: 2 !important;
}

.product-the-magen-method .ab-fixed-pricing-bundle [data-baa-price="note"] {
    order: 3 !important;
}

/* ── SPF Foundational 5 bundle footer cleanup ───────────────────────────────
   Adding the bundle to cart makes the app reveal two footer extras it doesn't
   need here: its native strikethrough "was" price (a second $270 after the note,
   a duplicate of the compare copy theme-custom.js already sites next to the
   total) and a "Breakdown" price-detail toggle (the card list already itemises
   every line). Hide both, SPF-scoped, so the added state reads as cleanly as the
   footer does before the add. */
.product-spf-foundational-5 .ab-fixed-pricing-bundle .ab-fixed-pricing-price-footer-original,
.product-spf-foundational-5 .ab-fixed-pricing-bundle .ab-fixed-pricing-price-breakdown {
    display: none !important;
}

/* the app makes each line title a role=button that opens a single-product
   lightbox; theme-custom.js blocks the activation, so drop the clickable cursor */
.product-the-magen-method .ab-fixed-pricing-bundle .ab-fixed-pricing-child-row-title {
    cursor: default !important;
}

/* "Added to cart" confirmation — shared by the Magen Method and SPF Foundational 5
   bundles (both go through the deferred assembler in theme-custom.js, which inserts
   .baa-bundle-added on the CTA regardless of product). The app's own toast (Sonner)
   can't be reliably repositioned — its fixed container is trapped by the column's
   scroll-in transform and Sonner rewrites its transform every frame — so hide it and
   show .baa-bundle-added as a flow sibling just above the CTA instead. Scoped to the
   two bundle products so ordinary Appstle toasts elsewhere are untouched. */
.product-the-magen-method .ab-toast-container,
.product-spf-foundational-5 .ab-toast-container {
    display: none !important;
}

.product-the-magen-method .baa-bundle-added,
.product-spf-foundational-5 .baa-bundle-added {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: var(--beige);
    font-size: 14px;
    font-weight: 600;
    color: var(--black);
    opacity: 0;
    max-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    overflow: hidden;
    transform: translateY(6px);
    transition: opacity 240ms ease, transform 240ms cubic-bezier(0.33, 1, 0.68, 1),
        max-height 240ms cubic-bezier(0.33, 1, 0.68, 1), padding 240ms cubic-bezier(0.33, 1, 0.68, 1);
}

.product-the-magen-method .baa-bundle-added.is-visible,
.product-spf-foundational-5 .baa-bundle-added.is-visible {
    opacity: 1;
    max-height: 120px;
    padding-top: 12px;
    padding-bottom: 12px;
    transform: none;
}

.product-the-magen-method .baa-bundle-added__icon,
.product-spf-foundational-5 .baa-bundle-added__icon {
    position: relative;
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--black);
}

.product-the-magen-method .baa-bundle-added__icon::after,
.product-spf-foundational-5 .baa-bundle-added__icon::after {
    content: "";
    position: absolute;
    left: 7px;
    top: 4px;
    width: 4px;
    height: 8px;
    border: solid var(--white);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.product-the-magen-method .baa-bundle-added__text,
.product-spf-foundational-5 .baa-bundle-added__text {
    flex: 1 1 auto;
    min-width: 0;
}

.product-the-magen-method .baa-bundle-added__close,
.product-spf-foundational-5 .baa-bundle-added__close {
    flex: 0 0 auto;
    margin-left: auto;
    padding: 0 0 0 8px;
    border: 0;
    background: none;
    font-size: 20px;
    line-height: 1;
    color: var(--darkbrown);
    cursor: pointer;
}

/* Magen Method — per-bundle description swap (theme-custom.js).
   The shared intro description stays up top; the selected bundle's copy renders
   into a [data-baa-variant-desc] cream box directly below the variant selector. */
.product-the-magen-method [data-baa-variant-desc] {
    margin-top: 16px;
    padding: 20px;
    background: var(--darkbrown);
    color: var(--white);
    border-radius: 0;
}
.product-the-magen-method [data-baa-variant-desc] p:first-child {
    font-weight: 700;
}

/* Xtresse Hair Growth Gummies — per-bag price framing on the Appstle
   volume-discount tiers (theme-custom.js injects .baa-perbag). Where per-bag is
   injected, hide the app's native total/original price; One-Time has no
   .baa-perbag, so it keeps its plain $89.00. Inherits the app's own
   --tier-*-font/color vars so it blends with Julia's widget settings. */
.product-xtresse-hair-growth-gummies .ab-volume-discount-item-price-info:has(.baa-perbag) .ab-volume-discount-item-discount-price,
.product-xtresse-hair-growth-gummies .ab-volume-discount-item-price-info:has(.baa-perbag) .ab-volume-discount-item-original-price {
    display: none !important;
}

.ab-fixed-pricing-bundle .ab-fixed-pricing-stock-badge-wrapper {
    display: none !important;
}

.product-xtresse-hair-growth-gummies .baa-perbag {
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 3px;
    line-height: 1;
}
.product-xtresse-hair-growth-gummies .baa-perbag__was {
    text-decoration: line-through;
    color: var(--tier-full-price-color, var(--brown));
    font-size: var(--tier-full-price-font-size, 13px);
}
.product-xtresse-hair-growth-gummies .baa-perbag__now {
    font-weight: var(--tier-price-font-weight, 700);
    color: var(--tier-price-color, var(--black));
    font-size: var(--tier-price-font-size, 16px);
}
.product-xtresse-hair-growth-gummies .baa-perbag__unit {
    color: var(--tier-full-price-color, var(--brown));
    font-size: var(--tier-full-price-font-size, 12px);
}
