/* Preview switch: html[data-palette="maroon"] paints maroon chrome and type over the existing green page. */

.sx-palette-switch {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
  padding: 0.4rem 0.7rem;
  border-radius: 999px;
  border: 1px solid rgba(42, 31, 24, 0.14);
  background: #fffdfa;
  color: #2a1f18;
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.01em;
  cursor: pointer;
  flex: 0 0 auto;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.16);
}

.sx-palette-switch:hover {
  border-color: rgba(42, 31, 24, 0.28);
}

.sx-palette-switch:focus-visible {
  outline: 2px solid #b7e4c7;
  outline-offset: 2px;
}

.sx-palette-switch__swatches {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}

.sx-palette-switch__dot {
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 999px;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.18);
}

.sx-palette-switch__dot--green {
  background: #1a4846;
}

.sx-palette-switch__dot--maroon {
  background: #5c3028;
}

html:not([data-palette="maroon"]) .sx-palette-switch__dot--green,
html[data-palette="maroon"] .sx-palette-switch__dot--maroon {
  box-shadow: 0 0 0 2px #fffdfa, 0 0 0 3px #2a1f18;
}

/* Same page cloth, dyed maroon. Borders stay as their own layers. */
html[data-palette="maroon"] body.shiva-storefront:not(.shiva-auth-only),
html[data-palette="maroon"][data-theme="light"] body.shiva-storefront:not(.shiva-auth-only),
html[data-palette="maroon"] body.shiva-homepage,
html[data-palette="maroon"] body.shiva-pdp {
  background-color: #5c3028;
  background-blend-mode: normal, normal, luminosity;
}

html[data-palette="maroon"] body.shiva-homepage .sx-sec--products {
  background-color: transparent;
  background-image: none;
}

/* ——— Maroon bars over the page ——— */
html[data-palette="maroon"] body.shiva-homepage .sx-header,
html[data-palette="maroon"] .shiva-header,
html[data-palette="maroon"] .sx-pdp-header {
  background: linear-gradient(180deg, rgba(110, 48, 40, 0.98), rgba(58, 22, 20, 0.96));
  border-bottom-color: rgba(143, 196, 168, 0.7);
}

html[data-palette="maroon"] .sx-pdp-drawer {
  background: rgba(58, 22, 20, 0.72);
  border-top-color: rgba(143, 196, 168, 0.35);
}

html[data-palette="maroon"] body.shiva-homepage .sx-navstrip__list > .shop-nav__item > a:hover,
html[data-palette="maroon"] body.shiva-homepage .sx-navstrip__list > .shop-nav__item > .shop-nav__trigger > a:hover,
html[data-palette="maroon"] body.shiva-storefront:not(.shiva-auth-only) .shiva-header a:hover,
html[data-palette="maroon"] body.shiva-storefront:not(.shiva-auth-only) .shiva-nav a:hover,
html[data-palette="maroon"] .sx-pdp-nav__list a:hover {
  color: #b7e4c7;
}

html[data-palette="maroon"] body.shiva-homepage .sx-search__form,
html[data-palette="maroon"] .shiva-header-trust,
html[data-palette="maroon"] .sx-header-trust,
html[data-palette="maroon"] .sx-header__trust-mobile {
  border-color: #7dcea0;
}

html[data-palette="maroon"] .sx-search button,
html[data-palette="maroon"] .shiva-search button,
html[data-palette="maroon"] .sx-pdp-search button {
  background: #2f6e6b;
  color: #f5f0e8;
}

/* Gold type on green panels becomes a light maroon */
html[data-palette="maroon"] .sx-hero__brand-sub,
html[data-palette="maroon"] .sx-hero__tagline,
html[data-palette="maroon"] .sx-hero h1.sx-hero__tagline,
html[data-palette="maroon"] .sx-sec__head--center h2,
html[data-palette="maroon"] .sx-sec--products .sx-sec__head h2,
html[data-palette="maroon"] .sx-sec--products .sx-sec__link,
html[data-palette="maroon"] .sx-sec--offers .sx-sec__head h2,
html[data-palette="maroon"] .sx-sec--offers .sx-sec__link {
  color: #f3c7bc;
}

html[data-palette="maroon"] .sx-btn--primary,
html[data-palette="maroon"] body.shiva-catalog .cta-card,
html[data-palette="maroon"] body.shiva-catalog .cta-secondary {
  background: linear-gradient(135deg, #6e3a30, #3a1614);
  border-color: rgba(143, 196, 168, 0.75);
  box-shadow: 0 12px 28px rgba(58, 22, 20, 0.35);
}

html[data-palette="maroon"] body.shiva-homepage .sx-sec--products .sx-pcard__media,
html[data-palette="maroon"] body.shiva-homepage .sx-sec--offers .sx-pcard__media {
  border-color: rgba(143, 196, 168, 0.5);
}

html[data-palette="maroon"] body.shiva-homepage .sx-sec--products .sx-pcard__link:hover .sx-pcard__title,
html[data-palette="maroon"] body.shiva-homepage .sx-sec--products .sx-pcard__link:focus-visible .sx-pcard__title,
html[data-palette="maroon"] body.shiva-homepage .sx-sec--offers .sx-pcard__link:hover .sx-pcard__title,
html[data-palette="maroon"] body.shiva-homepage .sx-sec--offers .sx-pcard__link:focus-visible .sx-pcard__title,
html[data-palette="maroon"] a.sx-cat__label:hover {
  color: #b7e4c7;
}

html[data-palette="maroon"] .sx-story__inner {
  background: rgba(92, 48, 40, 0.9);
  border-color: rgba(143, 196, 168, 0.6);
}

html[data-palette="maroon"] .sx-story__media {
  border-color: #7dcea0;
}

html[data-palette="maroon"] .sx-pdp-gallery-card,
html[data-palette="maroon"] .sx-pdp-gallery-stage {
  border-color: #7dcea0;
}

html[data-palette="maroon"] .sx-pdp-gallery-card {
  background: rgba(92, 48, 40, 0.86);
}

html[data-palette="maroon"] .sx-pdp-gallery-stage {
  background: linear-gradient(165deg, #6e3a30 0%, #3a1614 100%);
}

html[data-palette="maroon"] .sx-footer {
  background-color: #3a1614;
  background-image:
    var(--sx-pattern-border),
    var(--sx-pattern-paisley),
    var(--sx-pattern-grain),
    linear-gradient(180deg, #5c3028 0%, #2a1210 100%);
}

html[data-palette="maroon"] .sx-footer a,
html[data-palette="maroon"] .sx-footer__h {
  color: #b7e4c7;
}

html[data-palette="maroon"] .shiva-footer {
  background: linear-gradient(180deg, #5c3028 0%, #2a1210 100%);
}

html[data-palette="maroon"] .sx-offer-feature__copy {
  border-color: #5c3028;
}
