/** Shopify CDN: Minification failed

Line 335:0 Unexpected "{"
Line 335:1 Expected identifier but found "%"
Line 336:0 Unexpected "<"
Line 340:0 Unexpected "<"
Line 341:1 Expected identifier but found "%"

**/
/* #HeaderCartTrigger{
  display: none;
} */
.section-header__title{
  font-size: 30px;
}
.btn--full{
  /* border-radius:50px !important; */
}
@media(min-width:350px){
  #shopify-section-sections--21598575690056__footer #Email-sections--21598575690056__footer{
    font-size: 12px !important;
  }
}
/* For the header logo center and navigation left */
.header-layout[data-layout="center-left"] {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
}

.header-layout[data-layout="center-left"] .header-item--navigation {
  justify-self: start;
}

.header-layout[data-layout="center-left"] .header-item--logo {
  justify-self: center;
  text-align: center;
}

.header-layout[data-layout="center-left"] .header-item--icons {
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
/* Footer logo */
.footer__logo {
  text-align: center;
  margin-bottom: 2rem;
}
/* Footer email textfeild input */
#Email-sections--21598575690056__footer{
  background-color: #5d5d5f !important; 
  font-size: 12px;
  color: white !important;
}
#shopify-section-sections--21598575690056__footer .contact-form .btn {
  background: #050505 !important;
  border: 1px solid white;
}
/* Style change ONLY for product: the-mandala */
[data-product-handle="the-mandala"] .variant-input-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

[data-product-handle="the-mandala"] .variant-input-wrap legend.variant__label {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  font-weight: 500;
}

[data-product-handle="the-mandala"] .variant-input-wrap legend.variant__label::after {
  content: " -";
  margin: 0 4px;
}

[data-product-handle="the-mandala"] .variant-input-wrap .variant__button-label {
  display: inline !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  cursor: default !important;
  font-weight: 500;
}
@media only screen and (max-width: 768px) {
.footer__block--custom-newsletter{
  /* margin-left: 35px !important; */
  margin-right:0px !important;
}
}

#sub_title{
  font-size: 16px !important;
}

.yotpo-review-title{
  font-size:15px !important;
}
.yotpo-review-content{
  font-size:14px !important;
}
.note--success {
  color: var(--successGreen);
  background-color: #500b13 !important;
  border-color: #500b13 !important;
  font-size: 12px;

}
@media only screen and (max-width: 768px) {
.footer__block--custom-newsletter{
  /* margin-left: 35px !important; */
  margin-right:0px !important;
}
}
#sub_title{
  font-size: 16px !important;
}
.newsletter-popup__content>.h2 {
  color: white;
  font-size: 30px !important;
  font-family: Unbounded !important;
}
.newsletter-popup__content {
  padding-left: 25px !important;
  padding-right: 25px !important;
}
.enlarge-text > p {
  color: white;
  font-size: 12px !important;
  font-family: Unbounded Regular!important;
  padding-top: 15px !important;
}
#shopify-section-sections--21598575755592__newsletter-popup .input-group-field {
  font-size: 12px !important;
  color: grey !important;
}
.input-group-btn{
  background-color:#500b13 !important;
  font-size: 12px !important;
}

/* /Mobile responsive for Popup */

@media(max-width:450px){
  .newsletter-popup__content>.h2{
    font-size:25px !important;
  }
}

#shopify-section-sections--21598575690056__footer span{
  color:white !important;
}
 .hero__text-wrap {
  pointer-events: none; /* Let clicks pass through the overlay */
}

.hero__text-wrap .hero__link,
.hero__text-wrap .hero__title,
.hero__text-wrap .hero__subtitle,
.hero__text-wrap .hero__top-subtitle,
.hero__text-wrap .btn {
  pointer-events: auto; /* But keep buttons and text clickable */
}

/* Base styles (affect both desktop and mobile, but will be overridden on mobile) */
.header-layout {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* Desktop styles (applies above 768px) */
@media only screen and (min-width: 769px) {
  .header-layout {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
  }

  /* Hide the mobile‑only search icon on desktop */
  .header-item--search-mobile {
    display: none !important;
  }

  /* Ensure the right icons container includes the search icon */
  .header-item--icons {
    display: flex !important;
    align-items: center;
  }

  /* Reorder elements: navigation left, logo center, icons right */
  .header-item--navigation {
    order: 1;
    flex: 1 0 auto;
  }
  .header-item--logo {
    order: 2;
    text-align: center;
    margin: 0 auto;
  }
  .header-item--icons {
    order: 3;
    flex: 1 0 auto;
    justify-content: flex-end;
  }

  /* If the navigation and icons containers have different widths causing the logo to be off‑center, 
     you can use absolute positioning as a fallback, but the above should work if both side containers have equal flex‑basis. */
  /* Optional: Ensure logo stays centered even if side widths differ */
  .header-layout {
    position: relative;
  }
  .header-item--logo {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    max-width: 30%; /* adjust as needed */
    white-space: nowrap;
  }
  .header-item--navigation,
  .header-item--icons {
    width: auto;
    flex: 0 1 auto;
  }
}
/* ========== DESKTOP (≥769px) ========== */
@media only screen and (min-width: 769px) {
  /* Hide the mobile‑only search icon */
  .header-item--search-mobile {
    display: none !important;
  }

  /* Center the logo absolutely (perfect centering) */
  .header-layout {
    position: relative;
  }
  .header-item--logo {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    max-width: 30%; /* adjust as needed */
    white-space: nowrap;
    text-align: center;
    margin: 0;
  }

  /* Ensure navigation and icons don't interfere */
  .header-item--navigation,
  .header-item--icons {
    width: auto;
    flex: 0 1 auto;
  }
   .header-item--icons .js-search-header{
    display:flex!important;
  }
}

/* ========== MOBILE (≤768px) ========== */
@media only screen and (max-width: 768px) {
  /* Make header a flex container */
  .header-layout {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    position: relative;
  }

  /* Hide desktop navigation */
  .header-item--navigation {
    display: none !important;
  }

  /* Left: mobile search icon (already first child) */
  .header-item--search-mobile {
    /* stays left */
  }

  /* Center logo absolutely */
  .header-item--logo {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    max-width: 60%;
    white-space: nowrap;
    text-align: center;
    margin: 0;
    z-index: 2;
  }

  /* Right icons container */
  .header-item--icons {
    /* stays right */
  }
  .header-item--icons .js-search-header {
    display: none !important;
  }
  .header-item{
    flex:auto;
  }
   .header-item--logo {
    /* padding-right: 35px !important; */
  }

  /* Optional: give the side icons some extra margin from the edges */
  .header-item--search-mobile {
    margin-left: 0; /* adjust if needed, but usually 0 is fine */
  }
  .header-item--icons {
    margin-right: 0; /* adjust if needed */
  }

  /* If the logo still touches the side icons, reduce its max-width */
  .header-item--logo {
    max-width: 50%; /* decrease from 60% to create more gap */
  }
}

/* .cart__item-remove{
  display:none;
} */

._1fragemn7{
  display:none !important;
}
#reduction-tags{
  display:none !important;
}
{% if template == "map-our-journey" %}
<style>
.main-content{
  min-height:560px !important;
}
</style>
{% endif %}