/** Shopify CDN: Minification failed

Line 1461:1 Unexpected "/"

**/
cart-drawer-items {
    display: flex !important;
    flex-direction: column-reverse !important;
}

/*----Mastodon BGs-------*/
main,
.color-background-1.isolate.gradient,
.collection-list-wrapper,
div#shopify-section-footer,
.newsletter.center,
.collection-hero.color-background-1.gradient,
.menu-drawer__utility-links,
ul.children-list,
main#MainContent,
footer.footer.color-background-1.gradient.section-footer-padding,
ul.mega-menu__list,
ul.children-list,
header.header.header--middle-left.page-width.header--has-menu,
.hero-outer,
nav.menu-drawer__navigation,
.card.card--card.card--media.color-background-1.gradient,
div#MegaMenu-Content-1,
sticky-header.header-wrapper,
.color-background-1.gradient,
ul.menu-drawer__menu.has-submenu.list-menu,
ul.children-list {
   /* RESKIN: dark dust texture removed so white background shows */
   background-image: none !important;
   background-color: transparent !important;
}

.color-background-1.gradient.collections, .collection-list-wrapper.page-width.isolate.no-heading.no-mobile-link {
   /* RESKIN: red background removed */
   background-image: none !important;
   background-color: transparent !important;
}

/*-------- Collection list: transparent card backgrounds so section BG shows through transparent PNGs --------*/
.section-collection-list .card--standard .card__inner,
.section-collection-list .card--standard .card__inner.gradient {
   background: transparent !important;
}

/*-------Recommendations BG--------*/
.color-background-1.gradient.recommendations,
.color-background-1.gradient.recommendations .card.card--card.card--media.color-background-1.gradient {
   /* RESKIN: red background removed */
   background-image: none !important;
   background-color: transparent !important;
  }

.color-background-1.gradient.recommendations {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}



.newsletter__wrapper.color-background-1.gradient.content-container.isolate {
  /* RESKIN: solid dark purple (background image removed). */
  background-color: #35153d !important;
  background-image: none !important;
}

/* Newsletter heading */
.newsletter__wrapper h2 {
  /* Fluid size: scales with the viewport so "Mailing List Sign Up" stays on one
     line as the window narrows (down to the mobile breakpoint), capped at 60px
     on wide screens and floored at 24px so it can wrap on small phones. */
  font-size: clamp(24px, 6vw, 60px) !important;
  line-height: 1.1 !important;
}
/*.newsletter__wrapper h2.h1 {
  text-transform: none !important;
} */

/* Newsletter copy sits on the dark background → make it white (incl. links) */
.newsletter__wrapper h2,
.newsletter__wrapper .newsletter__subheading,
.newsletter__wrapper .newsletter__subheading.rte,
.newsletter__wrapper .newsletter-form__message,
.newsletter__wrapper a,
.newsletter__wrapper .rte a {
  color: #ffffff !important;
}

/* Email field: purple background with light text + label */
.newsletter__wrapper .field__input {
  background: #35153d !important;
  color: #f2e9f7 !important;
  border: 1px solid #d2a7dc !important;
}
.newsletter__wrapper .field__label {
  color: #d2a7dc !important;
}
.newsletter__wrapper .field__input:focus,
.newsletter__wrapper .field__input:focus-visible {
  /* Dawn draws the focus ring as a box-shadow in --color-foreground; recolor it */
  box-shadow: 0 0 0 0.2rem #f5b8d8 !important;
  border-color: #f5b8d8 !important;
}
/* Submit button (arrow) sits on the purple input → light */
.newsletter__wrapper .newsletter-form__button {
  color: #f2e9f7 !important;
}

.product__media.media.media--transparent.gradient.global-media-settings {
    /* RESKIN: transparent so the page background shows through */
    background-color: transparent !important;
}
.card__inner,
.card__inner.color-background-2,
.card__inner.color-background-2.gradient {
    background: transparent !important;
    background-color: transparent !important;
}

/* Product cards: rounded panel (mastodonrocks.com style). The whole card
   blends (hard-light) with the marble background via the wrapper. */
/* Collection page: reduce the gap below the page heading (banner → product grid).
   Only the banner + product-grid render on collection templates, so scoping to
   .template-collection tightens just that gap without touching global spacing. */
.template-collection .shopify-section.section + .shopify-section.section {
  margin-top: 16px !important;
}

/* NOTE: mix-blend-mode is deliberately NOT on .card-wrapper. Blending the whole
   wrapper flattens all descendants into one group and blends them together, so
   .card__content (title/price) can't opt out. Instead the blend is applied only
   to the layers that should be washed — the background panel and the image —
   which leaves .card__content rendering normally on top. */
.card-wrapper .card {
    position: relative !important;
    border-radius: 50px !important;
    padding: 14px !important;
    overflow: hidden !important;
}
/* Translucent panel: a light tint blended (hard-light) over the page's marble so
   you see through the card to the fixed page background — which shifts as you
   scroll. (Not self-contained, so the marble behind moves with the viewport.) */
.card-wrapper .card::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    background-color: rgba(225, 223, 217, 0.7) !important;
    mix-blend-mode: hard-light !important;
    border-radius: inherit !important;
    pointer-events: none !important;
}
/* Product image blends too; .card__content (a sibling) is untouched.
.card-wrapper .card > .card__inner {
    mix-blend-mode: hard-light !important;
} */
 
.card-wrapper .card .card__media,
.card-wrapper .card .card__inner .media {
    border-radius: 34px !important;
}
/* The card panel is now a light 0.6 white → dark text so it reads */
.card-wrapper .card .card__content,
.card-wrapper .card .card__information,
.card-wrapper .card .card__heading,
.card-wrapper .card .card__heading a,
.card-wrapper .card .price,
.card-wrapper .card .price .price-item,
.card-wrapper .card .price .money {
    color: #35153d !important;
}
/* Sale price: vibrant hot-pink (theme trim gradient) — pops on the light panel */
.card-wrapper .card span.price-item.price-item--sale.price-item--last {
    color: #e5389d !important;
}
/* Tighten the gap between product cards (was 24px / 20px). Set the spacing
   VARIABLES too — Dawn uses them for the card width calc, not just the gap, so
   overriding only the gap left the cards sized for 24px gaps and short by
   ~48px, pooling as extra space on the right. Matching them makes cards fill the
   row so left/right margins are equal. */
.product-grid.grid,
ul.grid.product-grid {
    --grid-desktop-horizontal-spacing: 8px !important;
    --grid-desktop-vertical-spacing: 8px !important;
    --grid-mobile-horizontal-spacing: 8px !important;
    --grid-mobile-vertical-spacing: 8px !important;
    column-gap: 8px !important;
    row-gap: 8px !important;
}

/* Collection sections with full_width on but the desktop slider off still carry
   .slider-component-full-width, which strips the .page-width max-width and lets
   the product grid run full-bleed. Constrain those back to the page width. */
.slider-component-full-width.page-width {
    max-width: var(--page-width) !important;
    margin-inline: auto !important;
}


/*----Mobile Klaviyo popup fix-----*/
.drawer {z-index: 90020 !important;}
/*----End klaviyo popup fix----*/

/*---------BOLD UPSELL STYLES-----------------*/
button.button.button--full-width.bold-upsell__add_to_cart.add-to-cart.bold-product__control.bold-product__button.bold-product__button--primary.standard_primary {
    margin-top: 20px !important;
}


#bold-modal__window,
.bold-product {
    background-color: #16272F !important;
}

button.button.button--full-width.bold-upsell__add_to_cart.add-to-cart.bold-product__control.bold-product__button.bold-product__button--primary.standard_primary {
    padding: 10px;
    background-color: black !important;
    border: 1px solid white !important;
}

.bold-upsell__intro-heading,
p.bold-upsell__intro-content,
.bold-product__title {
  color: white !important;
}

.bold-upsell__intro-heading{
  font-size: 24px !important;
}

.bold-product {
  border: none !important;
}


.bold-product__variant-selector {
    background-color: black !important;
}


.bold-control-group__item .quantity {
    background-color: black !important;
    min-width: 100% !important;
}

.bold-modal .flickity-button,
.bold-modal__slider .flickity-prev-next-button {
    border-radius: 50px !important;
    background-color: black !important;
    border: 1px solid white !important;
}

p.bold-upsell__intro-content {
    font-size: 14px !important;
    text-transform: uppercase !important;
    font-family: 'Baskerville No 2' !important;
}

button.button.button--secondary.bold-upsell__button.bold-upsell__button--secondary {
    background-color: transparent !important;
    border: none !important;
    text-decoration: underline !important;
    text-underline-offset: 4px !important;
    color: #9C8B2B !important;
}

img.bold-product__image {
    background-color: #466c7e !important;
  margin-bottom: 20px !important;
}

.bold-modal__slider .previous {
    left: -15px !important;
}

.bold-modal__slider .next {
    right: 15px !important;
}

.bold-upsell__actions {
    text-align: center !important;
}

button.button.button--secondary.bold-upsell__button.bold-upsell__button--secondary {
    margin-right: 0 !important;
}

/*---------END BOLD UPSELL STYLES-----------------*/

.card-wrapper.underline-links-hover:hover {
    border: none !important;
}

span.badge.price__badge-sold-out.color-inverse {
  background-color: white !important;
}

.product-form__input input[type=radio]+label {
    margin: 3px 1px !important;
    height: 50px !important;
    min-width: 80px !important;
    max-width: 80px !important;
    font-size: 1.5rem !important;
    font-weight: 500 !important;
    letter-spacing: .1rem !important;
    line-height: 2rem !important;
    /* RESKIN: match button corner styling */
    border-radius: 16px 0 16px 0 !important;
    /* RESKIN: unselected swatch — transparent, dark-purple border + text */
    background: transparent !important;
    border: 1.5px solid #35153d !important;
    color: #35153d !important;
    box-shadow: none !important;
}

/* Product accordion + share heading match the "You May Also Like" upsell
   heading: light pink, 18px, capitalized. */
button.share-button__button,
.accordion__title {
  font-size: 18px !important;
  color: #f5b8d8 !important;
  text-transform: capitalize !important;
}
/* Accordion + share icons (return, chevron, share) match the pink heading */
.product__accordion summary .icon,
.product__accordion summary svg,
.product__accordion .accordion__title .icon,
.product__accordion .accordion__title svg,
.share-button__button .icon,
.share-button__button svg {
  color: #f5b8d8 !important;
  fill: #f5b8d8 !important;
}
/* Share label: same heading font as "Returns & Exchanges"; bold; no hover underline */
button.share-button__button {
  font-family: var(--font-heading-family) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
button.share-button__button:hover,
button.share-button__button:hover > span,
.share-button__button:hover .share-button__button-text {
  text-decoration: none !important;
}
/* Share icon → same size as the Returns & Exchanges (return) icon (2rem = 22px) */
.share-button__button .icon,
.share-button__button svg {
  width: 2rem !important;
  height: 2rem !important;
}

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

fieldset.js.product-form__input {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
}

/*------Sale Badges -------*/

.badge {
    /* RESKIN: dark purple text, no border, rounded corners, tighter side padding */
    border: none !important;
    color: #35153d !important;
    border-radius: 10px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
}

.card__badge {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    max-width: 100%;
}
/* Keep each badge's label on one line; stack badges to a new row when tight */
.card__badge .badge {
    white-space: nowrap;
    flex: 0 0 auto;
}
/* Right-positioned badge stacks: align them to the right edge */
.card__badge.right {
    justify-content: flex-end;
}
/* Mobile: smaller badges so they fit the narrower cards */
@media screen and (max-width: 749px) {
  .card__badge {
    gap: 4px;
  }
  .card__badge .badge {
    font-size: 1rem !important;
    padding: 0.3rem 0.6rem !important;
    letter-spacing: normal !important;
  }
}


/*
.card__badge.top.right {
    border-top: 150px solid #8D91CB !important;
    border-top-width: 100px !important;
    border-top-style: solid !important;
    border-top-color: #8D91CB !important;
    border-left: 150px solid transparent !important;
    background-color: transparent !important;
    border-radius: 0 !important;
}

.badge {
    border: 1px solid transparent !important;
    border-radius: none !important;
    display: block !important;
    position: absolute !important;
    right: 10px !important;
    top: 40px !important;
}
*/

/*--------Price Section----------*/




/*--------Hide Variant titles "size" etc.. -----------*/
legend.form__label {
    display: none !important;
}

/*-----End----*/


.cart-count-bubble,
.cart-count-bubble span {
  /* Dark-purple count on the light-purple bubble */
  color: #35153d !important;
}

.header__menu-item:hover {
  text-decoration: none !important;
  color: #9C8B2B!important;
}

.header__menu-item {
  border-bottom: none !important;
}

.header__menu-item::after {
  display: none !important;
}

/*--------Product hovers------
.card.card--card.card--media.color-background-1.gradient:hover {
    background-image: url('https://cdn.shopify.com/s/files/1/0795/2659/files/BG.png?v=1743614336') !important;
    background-size: cover !important; 
    background-position: center !important;
    background-attachment: static !important;
    border: none !important;
} */

.card__heading a:hover,
.card__heading .price:hover {
  text-decoration: none !important;
}

.size-chart {
  font-family: 'Baskerville No 2', serif !important;
}


/*----Tighter footer spacing------*/
ul.footer__list-social.list-unstyled.list-social {
    margin: 0 auto !important;
}

.text-center.store-wrapper {
    margin-bottom: 20px !important;
}

.footer__copyright {
    margin-top: 0 !important;
}

ul.footer__list-partners.list-unstyled.list-partners {
    margin-top: 0 !important;
}

/*---Smaller size charts--------*/
.product__description tr,
.product__description table {
  margin: 3rem auto !important;
  border-color: #f5b8d8 !important;
  max-width: 500px !important;
}

.product__description tr,
.product__description th,
.product__description td {
    padding: 4px !important;
    border: .5px solid #f5b8d8 !important;
    text-align: center !important;
}

.product__description table:not([class]) {
    box-shadow: 0 0 0 .1rem #f5b8d8;
}


 .size-chart,
  .size-chart th,
  .size-chart td,
  .size-chart th {
    background-color: transparent !important;
  }


/*---Product Page Centering--------*/

.product__title,
.price.price--large.price--show-badge {
    text-align: center !important;
}


legend.form__label {
    width: 100% !important;
    text-align: center !important;
}

.product-form__buttons {
    margin: 0 auto !important;
}


/*--- End Product Page Centering--------*/

/*--------Button Styles-------*/

.cart-drawer .cart__checkout-button,
.button--secondary,
.product-form__submit,
.collection__view-all a.button,
a.button.button--primary.store.button.button--secondary.store, a.button.button--primary.store {
    /* RESKIN: light purple buttons with dark purple text + matching light purple outline */
    background-color: #d2a7dc !important;
    color: #35153d !important;
    border: 1.5px solid #d2a7dc !important;
    --color-button-text: none !important;
}

.cart-drawer .cart__checkout-button:hover,
.button--secondary:hover,
.product-form__submit:hover,
.collection__view-all a.button:hover {
    /* RESKIN: hover — medium purple bg, dark purple text */
    background-color: #ad8bba !important;
    color: #35153d !important;
    border: 1.5px solid #ad8bba !important;
   --color-button-text: none !important;
}

/* Swatch hover stays dark purple with white text (both selected & unselected) */
.product-form__input input[type=radio]+label:hover,
.product-form__input input[type=radio]:checked+label:hover {
    background: #35153d !important;
    color: #ffffff !important;
    border: 1.5px solid #35153d !important;
}

/* Selected swatch: dark purple bg + border, white text (same on hover) */
.product-form__input input[type=radio]:checked+label,
.product-form__input input[type=radio]:checked+label:hover {
    background: #35153d !important;
    border: 1.5px solid #35153d !important;
    color: #ffffff !important;
}


.price.price--large.price--show-badge {
    font-size: 2.5rem !important;
}

/*-------Site Collection Grid Borders-----*/

.product-form__input input[type=radio]+label:hover {
  font-weight: bold !important;
}

.price--large {
  font-size: 1.7rem !important;
}


/*
.grid .product-grid {
    border: 1px solid #8e91c7 !important;
}

.card--card, .card--standard .card__inner {
    border: .5px solid #8e91c7 !important;
}
*/

.badge {
  font-weight: bold !important;
  letter-spacing: normal !important;
}

.collection__view-all{
    width: 100% !important;
}
.collection__view-all a.button {
    width: 250px !important;
    margin-top: 40px !important;
}

/*--------------CUSTOM CURSOR-----------*/
/*
.header__menu-item,
a.header__menu-item.header__menu-item.list-menu__item.link.link--text.focus-inset,
a.header__menu-item.header__menu-item.list-menu__item.link.link--text.focus-inset span,
.accordion summary,
a.link.list-social__link,
.header__icons,
.header__icon:not(.header__icon--summary), 
.header__icon span,
variant-radios, 
variant-selects,
ul.list-unstyled,
a.mega-menu__link.mega-menu__link--level-2.link,
a.mega-menu__link.link {
   cursor: pointer !important;
}

body,
img.skeleta-desktop,
p {
      cursor: url('https://cdn.shopify.com/s/files/1/0795/2659/files/Layer_1_3.png?v=1743715404') -10 -10, auto !important;
}


.summary__title,
.product--thumbnail .product__media-list, 
.product--thumbnail_slider .product__media-list,
a,
a:hover,
label,
form,
main,
button,
.button,
.accordion .icon-accordion,
.product__modal-opener--image .product__media-toggle:hover,
.global-media-settings,
modal-opener,
h2.h4.accordion__title,
img.header__heading-logo,
slider-component,
.product__media.media.media--transparent.gradient.global-media-settings,
button.product__media-toggle.quick-add-hidden::after,
.product-form__input,
a.mega-menu__link.mega-menu__link--level-2.link,
a.mega-menu__link.mega-menu__link--level-2.link img
 {
    cursor: url('https://cdn.shopify.com/s/files/1/0795/2659/files/2_538be170-45cd-451e-a0d0-1aca6d1bbd3c.png?v=1743716007') -10 -10, auto !important;
}
/*



/*-----------------Hero Image----------------*/

@media screen and (max-width: 600px) {
img.skeleta-mobile {
  display: block;
}
  img.skeleta-desktop {
  display: none !important;
}
}

@media screen and (min-width: 600px) {
img.skeleta-desktop {
  display: block;
}
  img.skeleta-mobile {
  display: none !important;
}
}
  


.footer {
    border-top: none !important;
}

div#MegaMenu-Content-1 {
    padding-bottom: 0px !important;
}


.rte a, .locksmith-resource-form a {
    /* RESKIN: body links use dark purple link colour (#35153d) */
    color: rgb(var(--color-link))!important;
}
  .newsletter__wrapper h2.h1 {
  text-shadow: #000 1px 0 10px !important;
}

.store {
    font-size: 16px !important;
}

h2.product-recommendations__heading.h2 {
    font-size: 2rem !important;
}

legend.form__label {
    font-size: 1.2rem !important;
    text-transform: uppercase !important;
}

.global-media-settings {
    border: none !important;
    background-color: transparent !important;
}



ul.children-list {
  border-bottom: 1px solid #9C8B2B !important;
}


.mega-menu[open] .mega-menu__content {
  z-index: 2 !important;
}

.caret {
width: 100% !important;
}

.js .menu-drawer__menu-item .icon-caret {
    display: block !important;
    max-width: 15px !important;
    margin-left: 10px !important;
}

.menu-drawer__navigation {
   padding: 3rem 0 0 0 !important;
}


.notify-me-text {
  /* Match the "Sold out" line above it in the same badge */
  font-size: inherit;
}

/*-------- Notify Me button: small gap below it on product page --------*/
.product-form__buttons .klaviyo-bis-trigger {
  margin-bottom: 1rem;
}

.collection-hero__title {
    text-align: center !important;
    font-size: 40px !important;
    padding-top: 50px !important;
    margin: 0 !important;
}

/* Home carousel headings match the collection hero title size (font family,
   weight, letter-spacing and uppercase already match). */
.collection__title .title {
    font-size: 40px !important;
}

/* Tablet and below: center the carousel heading (desktop keeps it left,
   across from the view-all button). */
@media screen and (max-width: 989px) {
  .collection__title,
  .collection__title .title {
    text-align: center !important;
  }
  .collection__view-all a.button {
    margin-top: 0 !important;
  }
}


.collection-list-wrapper.page-width.isolate.no-heading.no-mobile-link.section-template--24170123264293__collection_list_CETJGX-padding {
    margin-bottom: 0 !important;
}


.color-background-1.gradient.recommendations {
    border-top: 0 !important;
}

span.price-item.price-item--sale.price-item--last {
  color: #9C8B2B !important;
  font-size: 1.5rem !important;

}

/* Product price + SALE badge sit on one line, vertically centered */
.price.price--show-badge {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap;
  gap: 0.4rem 1rem;
}
.price.price--show-badge .badge {
  margin: 0 !important;
}


div#MegaMenu-Content-1 {
    padding-top: 0 !important;
}

a.mega-menu__link.link {
    font-size: 13px !important;
    font-weight: 100 !important;
}

@media screen and (max-width: 600px) {
.store-buttons {
    display: flex;
    flex-direction: column;
}
  h1.collection-hero__title {
    font-size: 2.2rem !important;
}
  .collection__title .title {
    font-size: 2.2rem !important;
}
}

@media screen and (min-width: 600px) {
.store-buttons {
    flex-direction: row !important;
}
}

a.child.menu-drawer__menu-item.link.link--text.list-menu__item.focus-inset {
    padding-right: 0 !important;
    font-size: 1.5rem !important;
}

ul.children-list {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    justify-items: start !important;
    padding-left: 0 !important;
}

div#menu-drawer {
    width: 100% !important;
}

li.children-mobile::marker,
li.grandchildren-mobile::marker{
  color: transparent !important;
}

ul.grandchildren-list {
    padding: 1rem 0 3rem 0 !important;
}


ul.mega-menu__list {
    padding-right: 40px !important;
    max-width: none;
    margin: 0 auto;
}


a.parent.menu-drawer__menu-item.list-menu__item.link.link--text.focus-inset {
    border-bottom: 1px solid #9C8B2B !important;
}

summary.header__menu-item.list-menu__item.link.focus-inset span{
    text-decoration: none !important;
}

ul.list-menu.list-menu--inline {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.header-wrapper--border-bottom {
    border-bottom: none !important;
}

a.button.button--primary {
  /* RESKIN: dark purple label on light purple button */
  color: #35153d !important;
}

/*

.collection-list-wrapper,
.color-background-1.gradient.collections {
    background-image: url('https://cdn.shopify.com/s/files/1/0795/2659/files/painting-BG.png?v=1741201691') !important;
    background-repeat: no-repeat !important;
    background-size: 100%;
    background-position: center !important;
    background-attachment: fixed !important;
}

*/

/*
.collection-list-wrapper,
.product-recommendations {
   min-width: 100% !important;
    margin: 0 !important;
}
   

/*----MAST Typography------*/


/*
@font-face {
  font-family: 'AkuraPopo';
    src: url('https://cdn.shopify.com/s/files/1/0795/2659/files/Akura_Popo.otf?v=1740430697') format("opentype"),
       url('https://cdn.shopify.com/s/files/1/0795/2659/files/Akura_Popo.ttf?v=1740430696') format("truetype");
   }
@font-face {
  font-family: 'Moria';
    src: url('https://cdn.shopify.com/s/files/1/0795/2659/files/Moria_DF.TTF?v=1741046814') format("truetype");
   }


h1, h2, h3, h4, h5, .h0, ohl, .h2, .h3, .h4, .h5,
.header__menu-item span,
.product-form__submit,
button.product-form__submit.button.button--full-width.button--primary,
.button--full-width,
a.mega-menu__link.mega-menu__link--level-2.link,
.global-media-settings,
a.parent.menu-drawer__menu-item.list-menu__item.link.link--text.focus-inset,
.rich-text__buttons,
a.button.button--primary.store.button.button--secondary.store,
a.button.button--primary.store,
button.share-button__button,
.cart-drawer .cart__checkout-button,
.customer button,
a.link.link--text.list-menu__item.list-menu__item--link {
  font-family: 'Moria', 'Inknut Antiqua', serif !important;
  text-decoration: uppercase !important;
}


a.mega-menu__link.mega-menu__link--level-2.link {
  color: #8D91CB !important;
  margin-top: 40px !important;
}


.mega-menu__link {
  font-size: 1.5 !important;
}

a.grandchild.menu-drawer__menu-item.link.link--text.list-menu__item.focus-inset {
    font-size: 1.2rem !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

.newsletter__wrapper {
    background-color: transparent !important;
}


@media screen and (max-width: 500px) {
.newsletter__wrapper {
    border: none !important;
    background-image: none !important;
}
    .content-container:after {
    border:  none !important;
}
}

.list-menu__item {
    text-align: left !important;
}

.share-button__button {
  color: white !important;
}
*/

/*------header links font size ------*/

.list-menu__item {
    font-size: 1.5rem !important;
}

ul.list-menu.list-menu--inline {
  font-size: 1rem !important;
  /* RESKIN: normal weight nav links */
  font-weight: 400 !important;
}

/*----2 span fix ------*/

li.grid__item.twospan .promo-image {
    margin: 0 !important;
    width: calc(133% - 2 * var(--card-image-padding)) !important;
}

.price,
.price__sale {
    font-weight: 700 !important;
}

.product__accordion .accordion__content p,
.accordion__content,
.product__accordion .accordion__content,
.product__description.rte.quick-add-hidden {
    line-height: 20px !important;
    font-size: 16px !important;
}

.title-wrapper-with-link.title-wrapper--self-padded-mobile.title-wrapper--no-top-margin {
    display: flex !important;
    justify-content: center !important;
}

button.product-form__submit.button.button--full-width.button--primary,
.badge {
  text-transform: uppercase !important;
}


button, .button{
  /* RESKIN: rounded top-left & bottom-right; top-right & bottom-left squared */
  border-radius: 16px 0 16px 0 !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
}
/* Dawn draws the button outline ring on ::after with a square radius, so it
   pokes out past the button's rounded corners (visible as an "extra border",
   e.g. the cart drawer). Match the ring radius to the button's. */
button::after,
.button::after {
  border-radius: 16px 0 16px 0 !important;
}

h1, .h1 {
    font-size: calc(var(--font-heading-scale) * 2.5rem) !important;
    font-weight: 500 !important;
}


h2.title.h2 {
  display: flex;
  justify-content: center;
}

/* -----------PROMO-------*/

.grid--3-col-desktop .grid__item.twospan .promo-container,
.grid--4-col-desktop .grid__item.twospan .promo-container{
    width: calc(202%) !important;
}

li.grid__item.twospan .promo-image {
    margin: 0 !important;
    width: calc(39% - 2 * var(--card-image-padding)) !important;
}

li.grid__item.twospan {
    height: 50% !important;
}

.blank-grid-item {
  z-index: -1 !important;
}
li.grid__item.twospan {
    z-index: 100 !important;
}


/*---------PROMO Featured Grid STYLES--------*/
.promo-container {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

.promo-image-container {
    display: flex !important;
    justify-content: center !important;
}

@media screen and (max-width: 500px) {
	.promo-image-container {
		margin: 3px !important;
	}
}


.promo-container a{
    text-decoration: none;
  margin: 20px;
  min-height: calc(4.5rem + var(--buttons-border-width) * 2);
  font: inherit;
}

.promo-image-container {
    margin: 0rem 4rem 1rem;
}

.promo-image {
    margin: var(--card-image-padding);
    width: calc(100% - 2 * var(--card-image-padding));
}

h2.promo-title {
    text-align: center;
    margin-top: 0 !important;
    color: white !important;
} 

.button,
a.button.button--primary.promo-button {
    font-weight: 400 !important;
    text-transform: uppercase;
    text-align: center;
    padding: 0.8rem;
    line-height: 1.7rem;
}


/* ------------------HIDE/Reveal the Mega Menu images--------------------------------*/

a.mega-menu__link.mega-menu__link--level-2.link img {
  display: block !important;
}

/* --------------Mega Menu Styles------------------ */

.shop-the-collection-link {
  padding: 1.1rem 3.2rem !important;
  display: flex;
}

ul.list-unstyled {
    margin-left: 3px !important;
}

.shop-the-collection-link a{
  text-align: left !important;
  text-decoration: none;
  color: white !important;
  font-size: 1.8rem;
}

.card-information>.price {
    font-size: 1.5rem !important;
}
  
ul.menu-drawer__menu.list-menu img {
    width: 80%;
    margin: 30px 36px 0 36px;
}

.menu-drawer .link--text {
    color: white !important;
}

.menu-drawer__inner-submenu {
    height: 100vh !important;
}

summary .icon-caret {
    position: relative !important;
    height: 0.7rem !important;
    right: -5px !important;
    top: auto !important;
}

a.grandchild.menu-drawer__menu-item.link.link--text.list-menu__item.focus-inset {
    text-align: left !important;
}

a.mega-menu__link.mega-menu__link--level-2.link img {
    width: 100% !important;
    margin-bottom: 12px !important;
}

a.mega-menu__link.mega-menu__link--level-2.link {
    text-align: left !important;
    font-size: 1.7rem !important;
    font-family: 'Crimson Text'!important;
     color: #9C8B2B !important;
}

a.child.menu-drawer__menu-item.link.link--text.list-menu__item.focus-inset {
      font-family: 'Crimson Text'!important;
      color: #9C8B2B !important;
      font-size: 2rem !important;
}

a.mega-menu__link.mega-menu__link--level-2.link:hover {
    scale: 102% !important;
}
  
.mega-menu__list {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
}

.mega-menu__link {
    color: white !important;
    text-align: left !important;
}

.collection-image img {
    width: 100%;
}


/* collection list titles on HP*/
.multicolumn-card__image-wrapper.multicolumn-card__image-wrapper--full-width {
    opacity: .5 !important;
}
.multicolumn-card__image-wrapper.multicolumn-card__image-wrapper--full-width:hover {
    opacity: .9 !important;
}



.multicolumn-card__info .link {
    text-decoration: uppercase;
    font-size: 2rem !important;
  font-weight: 500 !important;
  color: white !important;
}

.multicolumn.background-primary .multicolumn-card {
    background: black !important;
}

.multicolumn-card__info {
  position: absolute  !important;
  top: 50%  !important;
  left: 50%  !important;
  transform: translate(-50%, -50%)  !important;
}

.slider-button {
    display: none !important;
}

/*------ADA-----*/
a.hidethelink span {
    display: none!important;
}

/*----------------INFINITY SCROLL, hide pagination count-------------------*/
.pagination__list {
    display: none !important;
}
/*----------------HEADER-------------------*/
/* Center nav items*/
/* Content max-width: 1440px on normal screens, but scales up proportionally on
   wide monitors (keeps ~9% margin each side) and caps at 2400px on ultrawides.
   (page_width setting is capped to 100px steps, so we set the variable directly.)
   Header nav below inherits this same value. */
:root {
  --page-width: clamp(1440px, 82vw, 2400px) !important;
}

.header.header--middle-left.page-width.header--has-menu {
  text-align: center !important;
  max-width: var(--page-width) !important;
  margin-inline: auto !important;
}

.header.header--top-left.page-width.header--has-menu {
  text-align: center !important;
  max-width: var(--page-width) !important;
  margin-inline: auto !important;
}


/*----------------HOMEPAGE-------------------*/
/* product title size on HP*/
.h5 {
    font-size: calc(var(--font-heading-scale) * 2rem) !important;
}

/* collection list titles on HP*/
.collection-list-wrapper h3.card__heading {
    color: rgb(var(--color-link))!important;
    border: 2px solid rgb(var(--color-link));
    padding: 20px;
    width: fit-content;
    margin: 0 auto;
    background-color: #000 !important;
}

.collection-list-wrapper {
  margin-bottom: 80px !important;
}

.collection-list-wrapper .card__content {
  position: absolute !important;
  top: 30%;
}

/*-------- Collection list: full-width bottom CTA button (toggle via section setting "show_bottom_cta") --------*/
.collections.cl-bottom-cta .card > .card__content {
  position: absolute !important;
  top: auto !important;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  padding: 0 !important;
  opacity: 0.4;
  transition: opacity 0.25s ease;
}

.collections.cl-bottom-cta .card__information {
  padding: 0 !important;
}

.collections.cl-bottom-cta .card-wrapper:hover .card > .card__content,
.collections.cl-bottom-cta .card-wrapper:focus-within .card > .card__content {
  opacity: 1;
}

.collections.cl-bottom-cta h3.card__heading {
  width: 100% !important;
  margin: 0 !important;
  border: 2px solid rgb(var(--color-link)) !important;
  background-color: rgba(0, 0, 0, 0.85) !important;
  padding: 16px 20px !important;
  box-sizing: border-box;
  text-align: center;
}

@media screen and (max-width: 749px) {
  .collections.cl-bottom-cta .card > .card__content {
    opacity: 1 !important;
  }
}

.slider-button {
    display: none !important;
}

/*----------Slideshow ----------*/
/*----------------MOBILE SLIDER ISSUE FIX-------------------*/
slideshow-component .slideshow.banner {
    touch-action: auto pan-x !important;
    overflow-y: hidden !important;
}

.slider-button {
    display: none !important;
}

@media screen and (min-width: 749px) {
	.slideshow__media.banner__media.media-mobile {
		display: none !important;
	}
}

@media screen and (max-width: 749px) {
	.slideshow__media.banner__media.media.banner__media-mobile {
		display: block !important;
	}
  /*.slideshow__media.banner__media.media {
    display: none;
}*/
}

/*-------------------------Banner Image ------------------------*/
.banner__media.media.banner__media-mobile {
  display: none !important;
}

@media screen and (max-width: 749px) {
.banner__media.media.banner__media-desktop {
    display: none !important;
}
  .banner__media.media.banner__media-mobile {
  display: block !important;
}
}

/* Slideshow banner: solid dark backing (was a transparent/light-tinted
   background letting the site pattern + Dawn's light placeholder show through). */
.slideshow__media.banner__media,
.banner__media.media,
.slideshow.banner,
.slideshow__slide {
  background-color: #0b0510 !important;
}

/*----------------EMAIL SIGN UP / "NEWSLETTER"-------------------*/

.newsletter__subheading {
    max-width: 40rem !important;
    font-size: 1rem;
    color: rgb(var(--color-link))!important;
}

.newsletter-form__field-wrapper .field .field__label {
  color: rgb(var(--color-link))!important;
}
/*.newsletter__subheading.rte {
    color: rgb(var(--color-link))!important;
}*/

.field__input {
    border: 2px solid rgb(var(--color-foreground))!important;
    background: none !important;
}



.newsletter-form__button {
    color: rgb(var(--color-link))!important;
}

.newsletter__wrapper>* {
  color: rgb(var(--color-link))!important;
}

.newsletter__wrapper {
  /* RESKIN: doubled top/bottom padding (was 40px) */
  padding: 80px 40px !important;
  margin: 0 auto !important;
  border-color: #e2e2e2!important;
}



.newsletter-wrapper .newsletter-form__field-wrapper .field {
  color: rgb(var(--color-link))!important;
}

.newsletter input[type="email"] {
  border: 2px solid rgb(var(--color-link)) !important;
}
*/

/*----------------FOOTER-------------------*/
ul.footer-block__details-content.list-unstyled {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

ul.footer-block__details-content.list-unstyled .link{
font-size: 1.3rem !important;
    text-transform: uppercase !important;
}

@media only screen and (max-width: 750px) {
.footer .list-menu__item {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
 }
}

.list-social {
    justify-content: center !important;
}
.list-unstyled {
    margin: 15px !important;
}

.list-partners__item .icon {
    height: 2.6rem;
    color: rgb(var(--color-foreground))!important;
}

ul.footer__list-partners.list-unstyled.list-partners {
    display: flex !important;
}

li.list-partners__item {
    margin: 10px !important;
}

.list-social__item .icon {
    fill: rgb(var(--color-foreground));
}

.footer__content-top {
   padding-bottom: 0 !important;
}

.footer__content-bottom {
   border-top: none !important;
}

/* currency switcher styles and positioning  */
.wsscc-dropdown {
    position: relative !important;
}

.wsscc-dropdown.has-search.bottomLeft {
    max-width: 114px !important;
    bottom: 200px !important;
    left: 45vw !important;
}

div#wssccSelected {
    background: none !important;
}

@media only screen and (max-width: 750px) {
  .wsscc-dropdown.has-search.bottomLeft {
     left: 38vw !important;
     bottom: 180px !important;
  }
}

@media only screen and (max-width: 500px) {
  .wsscc-dropdown.has-search.bottomLeft {
     bottom: 200px !important;
  }
}

.wsscc-dropdown.wsscc-dropdownundefined.has-search.bottomLeft {
    display: flex !important;
    justify-content: center !important;
}


/*--------Store Selector Styles----------*/
.rich-text__buttons.rich-text__buttons--multiple.store-button {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}


  .text-center {
    display: flex;
    justify-content: center;
    text-transform: uppercase;
    margin-bottom: 70px;
}
  
a.button.button--primary.button.button--secondary{
  /* RESKIN: outline store button — dark purple text, light purple outline */
  color: #35153d !important;
  border: 1px solid #d2a7dc !important;
  background-color: #ffffff !important;
}

a.button.button--primary.button.button--secondary:hover{
  background-color: #d2a7dc !important;
  border: 2px solid #35153d !important;
}

a.button.button--primary {
  /* RESKIN: light purple primary button */
  background-color: #d2a7dc !important;
  --alpha-button-background: 1 !important;
}

a.button.button--primary:hover {
  background-color: #ad8bba !important;
  color: #35153d !important;
  border: 2px solid #ad8bba !important;
  transform: scale(1.02) !important;
}

/* rich text store selector buttons */
.button[aria-disabled=true] {
    opacity: 1 !important;
}


/*----------------PRODUCT AND COLLECTION PAGES-------------------*/
/* link color in returns */
.product__accordion a {
    /* RESKIN: dark purple links */
    color: rgb(var(--color-link))!important;
}

/*shipping and returns copy size */
.product__accordion p {
    font-size: smaller !important;
}

/* center page titles */
.main-page-title {
    text-align: center !important;
}

.collection-hero__title {
    text-align: center !important;
}

/*----------------PAGE TITLE STYLE OVERIDES-------------------*/

.header {
    text-transform: uppercase;
}
.header__menu-item {
    padding: 5px 1.2rem;
}

.header__menu-item {
    padding: 0.5rem 1.2rem !important;
}

.list-menu--inline {
    padding-left: 25px !important;
}

h2.h1 {
    text-transform: uppercase !important;
}
h1 {
    text-transform: uppercase;
}

h3.card__heading {
    text-transform: uppercase !important;

}

.locksmith-passcode {
    height: 50px !important;
    background-color: black;
    border: 2px solid rgb(var(--color-link))!important;
    padding-left: 15px !important;
    color: white !important;
}
/* Above Nav Banner*/
p.announcement-bar__message.h5 {
    font-size: 16px !important;
  font-family: 'Roboto Mono' !important;
    font-weight:400 !important;
}

/*----------------SOLD OUT SWATCH STYLE-------------------*/
.product-form__input input[type='radio'].disabled + label,
.product-form__input input[type='radio']:disabled + label,
.product-form__input input[type='radio'].uanvailable + label,
.product-form__input input[type='radio'].unavailable + label {
  border-color: rgba(var(--color-foreground), 0.3) !important;
  color: rgba(var(--color-foreground), 0.4) !important;
  cursor: not-allowed !important;
  /* Diagonal strike-through across the whole swatch (corner to corner) */
  text-decoration: none !important;
  background-image: linear-gradient(
    to top left,
    transparent calc(50% - 1px),
    rgba(var(--color-foreground), 0.45) calc(50% - 1px),
    rgba(var(--color-foreground), 0.45) calc(50% + 1px),
    transparent calc(50% + 1px)
  ) !important;
}
/* Disabled swatch: no hover change (keep the sold-out look) — re-assert the
   diagonal strike-through on hover so it isn't cleared by the general hover fill */
.product-form__input input[type='radio'].disabled + label:hover,
.product-form__input input[type='radio']:disabled + label:hover,
.product-form__input input[type='radio'].uanvailable + label:hover,
.product-form__input input[type='radio'].unavailable + label:hover {
  background-color: transparent !important;
  background-image: linear-gradient(
    to top left,
    transparent calc(50% - 1px),
    rgba(var(--color-foreground), 0.45) calc(50% - 1px),
    rgba(var(--color-foreground), 0.45) calc(50% + 1px),
    transparent calc(50% + 1px)
  ) !important;
  color: rgba(var(--color-foreground), 0.4) !important;
  border-color: rgba(var(--color-foreground), 0.3) !important;
  font-weight: 500 !important;
  cursor: not-allowed !important;
}
.product-form__input input[type='radio'].disabled:checked + label,
.product-form__input input[type='radio'].unavailable:checked + label {
  color: rgb(var(--color-background));
}

/*-------MOBILE----------*/
@media screen and (max-width: 600px) {
.card__information {
  padding: 0 !important;
}
.card__content {
    padding: 1rem 0 !important;
}

  .menu-drawer__navigation {
    padding: 0 !important;
  }
  
  .js .menu-drawer__menu li {
    margin-bottom: 0 !important;
}
  .product-form__input {
    width: fit-content !important;
  }
  /*.product-form__input {
    flex: none !important;
  }*/
}

/*-------- Side by Side Sweeps: large heading --------*/
h2.sbs-sweeps__heading.h0 {
    font-size: 4.5rem;
    text-transform: uppercase;
}

@media screen and (max-width: 749px) {
  h2.sbs-sweeps__heading.h0 {
    font-size: 3.2rem;
  }
}

/* =====================================================================
   RESKIN OVERRIDES — white background / dark-purple links / album-art
   gradient accents. Loads last so it wins over the older dark styling.
   Palette: dark purple #35153d · light purple #d2a7dc · magenta #9400b1
   Album-art gradient: purple → magenta → orange → yellow.
   ===================================================================== */
:root {
  --mastodon-gradient: linear-gradient(90deg, #35153d 0%, #9400b1 22%, #e5389d 46%, #f6902d 72%, #f4d13a 100%);
}

/* Seamless looping palette for the animated trims (mirrored so it wraps) */
:root {
  --mastodon-gradient-loop: linear-gradient(90deg, #35153d, #9400b1, #e5389d, #f6902d, #f4d13a, #f6902d, #e5389d, #9400b1, #35153d);
}
@keyframes gradientTrimShift {
  from { background-position: 0% 50%; }
  to   { background-position: 200% 50%; }
}

/* --- Gradient trim: thin animated bar pinned to the very top of every page --- */
body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: var(--mastodon-gradient-loop);
  background-size: 200% 100%;
  animation: gradientTrimShift 6s linear infinite;
  z-index: 100000;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  body::before { animation: none; }
}

/* --- Solid white navigation with dark-purple links/icons --- */
.section-header,
.header-wrapper.color-background-1.gradient,
sticky-header.header-wrapper.color-background-1.gradient,
header.header.header--middle-left.page-width.header--has-menu {
  background-color: #ffffff !important;
}
.section-header .header__menu-item,
.section-header .header__menu-item span,
.section-header .header__active-menu-item,
.header .list-menu__item.link,
.header__icon,
.header__icon .icon,
.header__icon--cart .icon {
  color: #35153d !important;
}
.header__icon .icon { stroke: #35153d !important; }

/* --- Animated gradient trim under the header (pseudo-element so the gradient
       can actually shift; border-image can't be animated). --- */
.header-wrapper {
  border-bottom: none !important;
  position: relative;
}
.header-wrapper::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: var(--mastodon-gradient-loop);
  background-size: 200% 100%;
  animation: gradientTrimShift 6s linear infinite;
  z-index: 1;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .header-wrapper::after { animation: none; }
}
/* Keep dropdown/mega panels above the animated trim line */
.header__submenu,
ul.header__submenu,
.mega-menu__content,
.mega-menu[open] .mega-menu__content {
  z-index: 50 !important;
}

/* --- Footer: solid dark purple with light-pink links/text --- */
footer.footer.color-background-1.gradient.section-footer-padding,
footer.footer.color-background-1.gradient {
  background-color: #35153d !important;
  background-image: none !important;
  border-top: none !important;
}
.footer,
.footer a,
.footer .link,
.footer p,
.footer h2,
.footer .list-menu__item,
.footer .footer__copyright,
.footer .footer__copyright a,
.footer small,
.footer .rte {
  color: #f5b8d8 !important;
}
/* Social icons: the marble-blob palette flows across the row, staggered so it
   reads like the gradient drifting through the icons. Target the inner <path>s
   (they carry their own fill) as well as the <svg>. */
.footer .list-social__item .icon,
.footer .list-social__item .icon path,
.footer .list-social__link .icon,
.footer .list-social__link .icon path {
  fill: #f5b8d8;
  animation: socialBlobShift 12s ease-in-out infinite;
}
.footer .list-social__item:nth-child(2) .icon,
.footer .list-social__item:nth-child(2) .icon path { animation-delay: -2.4s; }
.footer .list-social__item:nth-child(3) .icon,
.footer .list-social__item:nth-child(3) .icon path { animation-delay: -4.8s; }
.footer .list-social__item:nth-child(4) .icon,
.footer .list-social__item:nth-child(4) .icon path { animation-delay: -7.2s; }
.footer .list-social__item:nth-child(5) .icon,
.footer .list-social__item:nth-child(5) .icon path { animation-delay: -9.6s; }
.footer .list-social__item:nth-child(6) .icon,
.footer .list-social__item:nth-child(6) .icon path { animation-delay: -12s; }
.footer .list-social__item:nth-child(7) .icon,
.footer .list-social__item:nth-child(7) .icon path { animation-delay: -14.4s; }
/* Same palette as the main marble drift blobs */
@keyframes socialBlobShift {
  0%   { fill: #b6e84f; }
  20%  { fill: #ff3d8a; }
  40%  { fill: #e5245a; }
  60%  { fill: #c3e85f; }
  80%  { fill: #ffa6d4; }
  100% { fill: #b6e84f; }
}
@media (prefers-reduced-motion: reduce) {
  .footer .list-social__item .icon,
  .footer .list-social__item .icon path,
  .footer .list-social__link .icon path { animation: none; fill: #f5b8d8; }
}

/* Mobile nav social icons: same animated gradient as the footer */
.menu-drawer .list-social__item .icon,
.menu-drawer .list-social__item .icon path,
.menu-drawer .list-social__link .icon,
.menu-drawer .list-social__link .icon path {
  fill: #f5b8d8;
  animation: socialBlobShift 12s ease-in-out infinite;
}
.menu-drawer .list-social__item:nth-child(2) .icon,
.menu-drawer .list-social__item:nth-child(2) .icon path { animation-delay: -2.4s; }
.menu-drawer .list-social__item:nth-child(3) .icon,
.menu-drawer .list-social__item:nth-child(3) .icon path { animation-delay: -4.8s; }
.menu-drawer .list-social__item:nth-child(4) .icon,
.menu-drawer .list-social__item:nth-child(4) .icon path { animation-delay: -7.2s; }
.menu-drawer .list-social__item:nth-child(5) .icon,
.menu-drawer .list-social__item:nth-child(5) .icon path { animation-delay: -9.6s; }
.menu-drawer .list-social__item:nth-child(6) .icon,
.menu-drawer .list-social__item:nth-child(6) .icon path { animation-delay: -12s; }
.menu-drawer .list-social__item:nth-child(7) .icon,
.menu-drawer .list-social__item:nth-child(7) .icon path { animation-delay: -14.4s; }
@media (prefers-reduced-motion: reduce) {
  .menu-drawer .list-social__item .icon,
  .menu-drawer .list-social__item .icon path,
  .menu-drawer .list-social__link .icon path { animation: none; fill: #f5b8d8 !important; }
}

.footer .list-partners__item .icon { color: #f5b8d8 !important; }
/* Global / Sparkart partner logos turn white on hover */
.footer .list-partners__link:hover .icon,
.footer .list-partners__link:hover .icon path,
.footer .list-partners__item:hover .icon,
.footer .list-partners__item:hover .icon path {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* --- Animated neon-marble as the background for MAIN only (faster drift).
       Fixed backdrop so it stays viewport-consistent; shows through the now
       transparent product cards. --- */
main#MainContent,
main {
  position: relative;
  isolation: isolate;
  /* DARK VERSION: fluid-marble pattern image as the background
     (replaces the generated gradient blobs + grain). */
  background-color: #0b0510 !important;
  background-image: url('bg-pattern.jpg') !important;
  background-size: cover !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  /* Static, centered — no drift. */
  background-position: center !important;
}
/* Light black wash over the marble pattern so text stays legible while the
   pattern still shows through. */
main#MainContent::before,
main::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35));
}
/* Same fixed, veiled marble on the root AND body so areas OUTSIDE main (e.g. the
   gap the curved divider sits in above the footer on non-home pages) show the
   texture instead of a flat dark block. body must be included because it has its
   own opaque dark background-color that would otherwise cover html's marble.
   Fixed + cover + center makes it align seamlessly with main's marble. */
html,
body {
  background-color: #0b0510 !important;
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)),
    url('bg-pattern.jpg') !important;
  background-size: cover, cover !important;
  background-attachment: fixed, fixed !important;
  background-repeat: no-repeat, no-repeat !important;
  background-position: center, center !important;
}
@keyframes mainDrift {
  0%   { background-position: 15% 20%; }
  100% { background-position: 85% 80%; }
}
@media (prefers-reduced-motion: reduce) {
  main#MainContent, main { animation: none; }
}

/* --- Store selector: Americas (current, url "/") solid; Europe hollow --- */
.store-buttons a.button.button--primary.store.button.button--secondary.store {
  background-color: #f5b8d8 !important;
  color: #35153d !important;
  border: 1.5px solid #f5b8d8 !important;
  box-shadow: none !important;
}
.store-buttons a.button.button--primary.store:not(.button--secondary) {
  background-color: transparent !important;
  color: #f5b8d8 !important;
  border: 1.5px solid #d2a7dc !important;
}
/* Store buttons: no scale-up on hover */
.store-buttons a.button.button--primary.store:hover {
  transform: none !important;
}
/* Americas hover = same as resting (light pink, no change) */
.store-buttons a.button.button--primary.store.button.button--secondary.store:hover {
  background-color: #f5b8d8 !important;
  border-color: #f5b8d8 !important;
  box-shadow: none !important;
  color: #35153d !important;
}
/* Europe (hollow) hover: light-pink fill + border, dark-purple text */
.store-buttons a.button.button--primary.store:not(.button--secondary):hover {
  background-color: #f5b8d8 !important;
  border-color: #f5b8d8 !important;
  color: #35153d !important;
}

/* --- Retire gold (#9C8B2B) accents in favour of dark purple --- */
.header__menu-item:hover { color: #35153d !important; }
ul.children-list { border-bottom: 2px solid rgba(var(--color-foreground), 0.08) !important; }
a.parent.menu-drawer__menu-item.list-menu__item.link.link--text.focus-inset { border-bottom: 2px solid rgba(var(--color-foreground), 0.08) !important; }
a.mega-menu__link.mega-menu__link--level-2.link { color: #35153d !important; }
a.child.menu-drawer__menu-item.link.link--text.list-menu__item.focus-inset { color: #f5b8d8 !important; }
span.price-item.price-item--sale.price-item--last { color: #f5b8d8 !important; }

/* --- Fix forced white text that would vanish on the white background --- */
.menu-drawer .link--text { color: #f2e9f7 !important; }
.mega-menu__link { color: #35153d !important; }
.shop-the-collection-link a { color: #35153d !important; }
h2.promo-title { color: #35153d !important; }

/* --- Collection-list titles: white boxes with dark-purple text/border
       (were black boxes with dark text = unreadable) --- */
.collection-list-wrapper h3.card__heading { background-color: #ffffff !important; }
.collections.cl-bottom-cta h3.card__heading { background-color: rgba(255, 255, 255, 0.9) !important; }

/* --- Reveal the slider prev/next arrows (were hidden by earlier rules) --- */
.slider-button { display: inline-flex !important; }

/* --- Video section poster button: keep it square (no rounded corners) --- */
.video-section__poster,
.video-section__poster.button { border-radius: 0 !important; }

/* --- Collection carousels: prev/next arrows flanking the row.
       The desktop slider wrapper is <slider-component class="slider-component-desktop">. --- */
.slider-component-desktop { position: relative !important; }
.slider-component-desktop .slider-buttons {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}
.slider-component-desktop .slider-counter { display: none !important; }
.slider-component-desktop .slider-button {
  display: flex !important;
  position: absolute !important;
  top: 42%;
  transform: translateY(-50%);
  z-index: 4;
  width: 46px;
  height: 46px;
  padding: 0 !important;
  border-radius: 50% !important;
  background: #d2a7dc !important;
  color: #35153d !important;
  border: none !important;
  box-shadow: 0 2px 10px rgba(53, 21, 61, 0.25);
  opacity: 1 !important;
  visibility: visible !important;
  cursor: pointer !important;
  align-items: center;
  justify-content: center;
}
.slider-component-desktop .slider-button--prev { left: 6px; }
.slider-component-desktop .slider-button--next { right: 6px; }
.slider-component-desktop .slider-button .icon { width: 1.3rem; height: 1.3rem; color: #35153d !important; }
.slider-component-desktop .slider-button--prev .icon { transform: rotate(90deg); }
.slider-component-desktop .slider-button--next .icon { transform: rotate(-90deg); }
.slider-component-desktop .slider-button:hover:not([disabled]) { background: #35153d !important; color: #ffffff !important; }
.slider-component-desktop .slider-button:hover:not([disabled]) .icon { color: #ffffff !important; }
.slider-component-desktop .slider-button[disabled] { display: none !important; }

/* --- Desktop drag-to-swipe: grab cursor on the carousel track --- */
/* Little "loading" fade on the products as the row eases to the next/prev page */
.slider-component-desktop .slider__slide { transition: opacity 0.3s ease; }
.slider-component-desktop .slider--desktop.is-paging .slider__slide { opacity: 0.45 !important; }
@media (prefers-reduced-motion: reduce) {
  .slider-component-desktop .slider__slide { transition: none; }
  .slider-component-desktop .slider--desktop.is-paging .slider__slide { opacity: 1 !important; }
}

/* Desktop: "View all" moves up into the heading row, top-right across from the title */
@media screen and (min-width: 990px) {
  .collection__title--desktop-slider {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 1rem;
  }
  .collection__title--desktop-slider .collection__view-all {
    margin: 0 !important;
    width: auto !important;
    flex: 0 0 auto;
  }
  .collection__title--desktop-slider .collection__view-all a.button {
    margin: 0 !important;
    width: auto !important;
  }
}

/* --- Mega menu dropdown panel: solid white (not transparent).
       Uses ID specificity to beat the older `div#MegaMenu-Content-1` rule. --- */
.mega-menu__content,
div#MegaMenu-Content-1,
div#MegaMenu-Content-2,
div#MegaMenu-Content-3,
div#MegaMenu-Content-4,
div#MegaMenu-Content-5,
div#MegaMenu-Content-6 {
  background-color: #ffffff !important;
  background-image: none !important;
}
/* Remove the light 1px border that sat below the gradient trim */
.mega-menu__content { border-bottom: none !important; }
/* Full-width animated gradient trim at the very bottom of the open mega menu.
   (.mega-menu__content is already position:absolute, so the ::after anchors to
   it — do NOT set position on it or the dropdown placement breaks.) */
.mega-menu__content::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 4px;
  background: var(--mastodon-gradient-loop);
  background-size: 200% 100%;
  animation: gradientTrimShift 6s linear infinite;
  z-index: 10;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .mega-menu__content::after { animation: none; }
}


/* =====================================================================
   Essential Upsell app widget — override the app's gold/black styling
   to match the reskin. Targets the app's data-essential-upsell-element
   hooks so we don't depend on its hashed class names.
   ===================================================================== */
/* Heading + product titles → dark purple */
[data-essential-upsell-element="title"] { color: #35153d !important; }
/* Heading → Title Case */
[data-essential-upsell-element="header"] [data-essential-upsell-element="title"] {
  text-transform: capitalize !important;
}
/* Product bars: transparent with a dark-purple outline (was gold gradient) */
[data-essential-upsell-element="product"] {
  background: transparent !important;
  border: 1.5px solid #35153d !important;
  border-radius: 16px 0 16px 0 !important;
}
/* Prices / variant text */
[data-essential-upsell-element="value"] { color: #35153d !important; }
/* Price area: sale price matches the site's purple sale color (#9400b1);
   the struck compare/"regular" price stays dark purple. This overrides the
   app's default orange sale color, whatever child element it lands on. */
[data-essential-upsell-element="price"],
[data-essential-upsell-element="price"] * { color: #9400b1 !important; }
[data-essential-upsell-element="regular-price"],
[data-essential-upsell-element="regular-price"] * { color: #35153d !important; }
/* Add-to-cart button: light purple bg, dark-purple text + "+", uppercase;
   #ad8bba bg on hover (like the boxed buttons). */
[data-essential-upsell-element="add-to-cart-button"] {
  background: #d2a7dc !important;
  color: #35153d !important;
  text-transform: uppercase !important;
  border-radius: 16px 0 16px 0 !important;
}
[data-essential-upsell-element="add-to-cart-button"] *,
[data-essential-upsell-element="add-to-cart-button"] svg,
[data-essential-upsell-element="add-to-cart-button"] [data-essential-upsell-element="icon"] {
  color: #35153d !important;
  fill: #35153d !important;
  text-transform: uppercase !important;
}
[data-essential-upsell-element="add-to-cart-button"]:hover {
  background: #ad8bba !important;
  color: #35153d !important;
}
[data-essential-upsell-element="add-to-cart-button"]:hover *,
[data-essential-upsell-element="add-to-cart-button"]:hover svg {
  color: #35153d !important;
  fill: #35153d !important;
}
/* Prev/next nav arrows → light pink so they read on the dark background */
[data-essential-upsell-element="button-left"],
[data-essential-upsell-element="button-right"],
[data-essential-upsell-element="button-left"] [data-essential-upsell-element="icon"],
[data-essential-upsell-element="button-right"] [data-essential-upsell-element="icon"],
[data-essential-upsell-element="button-left"] svg,
[data-essential-upsell-element="button-right"] svg,
[data-essential-upsell-element="button-left"] svg path,
[data-essential-upsell-element="button-right"] svg path {
  color: #f5b8d8 !important;
  fill: #f5b8d8 !important;
}
/* Variant-select dropdown caret (defaults to black) → light pink */
[data-essential-upsell-element="variant-select"] svg,
[data-essential-upsell-element="variant-select"] svg path,
[data-essential-upsell-element="variant-select"] svg polyline {
  color: #f5b8d8 !important;
  fill: #f5b8d8 !important;
  stroke: #f5b8d8 !important;
}

/* ============================================================
   DARK VERSION — black-based background overrides.
   Appended last so these beat the light-theme rules above.
   ============================================================ */

/* Header: dark bar with light links/icons (was forced white) */
.section-header,
.header-wrapper.color-background-1.gradient,
sticky-header.header-wrapper.color-background-1.gradient,
header.header.header--middle-left.page-width.header--has-menu {
  background-color: #0b0510 !important;
}
.section-header .header__menu-item,
.section-header .header__menu-item span,
.section-header .header__active-menu-item,
.header .list-menu__item.link,
.header__icon,
.header__icon .icon,
.header__icon--cart .icon {
  color: #f2e9f7 !important;
}
.header__icon .icon { stroke: #f2e9f7 !important; }

/* Mega menu + submenus: dark panels with light text */
.header__submenu,
ul.header__submenu,
.mega-menu__content,
.mega-menu[open] .mega-menu__content,
div#MegaMenu-Content-1,
div#MegaMenu-Content-2,
div#MegaMenu-Content-3,
div#MegaMenu-Content-4,
div#MegaMenu-Content-5,
div#MegaMenu-Content-6 {
  background-color: #171021 !important;
  background-image: none !important;
}
.mega-menu__content a,
.mega-menu__content .mega-menu__link,
.mega-menu__content .mega-menu__link--level-2,
a.mega-menu__link.link,
.header__submenu a,
.header__submenu .header__menu-item,
div#MegaMenu-Content-1 a,
div#MegaMenu-Content-2 a,
div#MegaMenu-Content-3 a,
div#MegaMenu-Content-4 a,
div#MegaMenu-Content-5 a,
div#MegaMenu-Content-6 a {
  color: #f5b8d8 !important;
}

/* Collection-list title cards: dark instead of white */
.collection-list-wrapper h3.card__heading {
  background-color: #171021 !important;
  color: #f2e9f7 !important;
}
.collections.cl-bottom-cta h3.card__heading {
  background-color: rgba(23, 16, 33, 0.9) !important;
}

/* Outline / store buttons: drop the white fill so they read on dark */
a.button.button--primary.button.button--secondary {
  background-color: transparent !important;
  color: #f2e9f7 !important;
}

/* Product variant swatches: light border/text on dark; light-purple when selected */
.product-form__input input[type=radio]+label {
  border-color: #d2a7dc !important;
  color: #f2e9f7 !important;
}
.product-form__input input[type=radio]:checked+label,
.product-form__input input[type=radio]:checked+label:hover {
  background: #d2a7dc !important;
  border-color: #d2a7dc !important;
  color: #0b0510 !important;
}
/* Swatch hover → same #ad8bba as the other buttons (was too-dark #35153d) */
.product-form__input input[type=radio]+label:hover,
.product-form__input input[type=radio]:checked+label:hover {
  background: #ad8bba !important;
  border-color: #ad8bba !important;
  color: #35153d !important;
}

/* Product description / rich-text table borders (e.g. size chart) → light pink
   on dark. Includes the outer <table> border and .rte tables in collapsible tabs. */
.product__description table,
.product__description tr,
.product__description th,
.product__description td,
.rte table,
.rte tr,
.rte th,
.rte td {
  border-color: #f5b8d8 !important;
}
/* Also recolor a bordered wrapper element around a size-chart table */
.product__description :has(> table),
.rte :has(> table) {
  border-color: #f5b8d8 !important;
}

/* Essential Upsell widget sits on the dark background → light-pink text/border
   so it reads (the add-to-cart button keeps its dark label on the light fill). */
[data-essential-upsell-element="title"],
[data-essential-upsell-element="value"],
[data-essential-upsell-element="regular-price"],
[data-essential-upsell-element="price"],
[data-essential-upsell-element="price"] * {
  color: #f5b8d8 !important;
}
[data-essential-upsell-element="product"] {
  border-color: #f5b8d8 !important;
}

/* Home page: remove the gap above the "Sale" featured collection (the space
   below Accessories). Matched by the section's stable key, not the template hash. */
.shopify-section[id$="__featured_collection_dTQy86"] {
  margin-top: 0 !important;
}

/* Mobile: remove the section-spacing gap directly below the slideshow banner
   so it flows straight into the content below. */
@media screen and (max-width: 749px) {
  .shopify-section[id$="__slideshow_pqjTjr"] + .shopify-section {
    margin-top: 0 !important;
  }
}

/* Full-width featured collections: make the heading row span full width (no
   max-width cap) while keeping the page-width gutter, so the heading + View all
   line up with the header's logo/cart spacing at every viewport width. */
.collection--full-width .collection__title {
  max-width: none !important;
}

/* Overlays / backdrops → black instead of the light --color-foreground.
   Covers the product-media modal, the cart drawer, the mobile menu drawer,
   the mobile-menu backdrop, and the facet (filter) drawer. */
details[open] .modal-overlay::after,
.drawer,
.js menu-drawer > details > summary::before,
.js menu-drawer > details[open]:not(.menu-opening) > summary::before,
.header__icon--menu[aria-expanded="true"]::before,
.facets__overlay,
facet-filters-form .facets__overlay {
  background-color: rgba(0, 0, 0, 0.5) !important;
}

/* Product accordion divider rules → 2px (matches the 2px mobile-menu rules) */
.product__accordion {
  border-top-width: 2px !important;
  border-bottom-width: 2px !important;
}

/* Upsell: drop the header/product-row side padding so the "You May Also Like"
   heading sits flush with the bordered product cards below. */
[data-essential-upsell-element="header"],
[data-essential-upsell-element="products"] {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Product image hover "zoom" button → match the home carousel buttons:
   light-purple fill, no border, dark-purple icon. */
.product__media-icon {
  background-color: #d2a7dc !important;
  border: none !important;
  box-shadow: none !important;
}
.product__media-icon,
.product__media-icon .icon,
.product__media-icon svg,
.product__media-icon svg path {
  color: #35153d !important;
  stroke: #35153d !important;
}

/* Zoom modal close button → same round light-purple button, dark-purple X icon */
.product-media-modal__toggle {
  background-color: #d2a7dc !important;
  border: none !important;
  border-radius: 50% !important;
}
.product-media-modal__toggle,
.product-media-modal__toggle .icon,
.product-media-modal__toggle svg,
.product-media-modal__toggle svg path {
  color: #35153d !important;
  fill: #35153d !important;
}

/* NEW ARRIVALS heading: centered + reference section-heading scale (~56px) */
.shopify-section[id$="__featured_collection_zWFRGe"] .collection__title {
  text-align: center !important;
  justify-content: center !important;
}
.shopify-section[id$="__featured_collection_zWFRGe"] .collection__title .title {
  /* Fluid: scales with the viewport (like the mailing list heading), capped at
     50px on wide screens and floored at 22px on small phones. */
  font-size: clamp(22px, 6vw, 50px) !important;
  text-align: center !important;
  width: 100% !important;
}

/* ---- Curved divider: before mailing list (home) / before footer (other pages) ---- */
/* Deep concave dark-purple sweep (#35153d) that sits in its own space above the
   section (via margin-top) so it never paints over the content above it. */
.newsletter__wrapper,
.footer {
  position: relative;
  margin-top: 200px !important;
}
.newsletter__wrapper::before,
.footer::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 100%;
  height: 200px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 200' preserveAspectRatio='none'%3E%3Cpath d='M0,0 C 480,220 960,220 1440,0 L1440,200 L0,200 Z' fill='%2335153d'/%3E%3C/svg%3E");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 2;
}
/* Home page: the mailing list carries the curve, so suppress the footer's copy */
.template-index .footer::before {
  display: none !important;
}
.template-index .footer {
  margin-top: 0 !important;
}
/* Mobile & tablet: gentler, shallower arch (less aggressive dip + shorter).
   margin-top is larger than the arch height, so the extra (130 - 70 = 60px)
   becomes clear breathing room ABOVE the arch. */
@media screen and (max-width: 989px) {
  .newsletter__wrapper,
  .footer {
    margin-top: 130px !important;
  }
  .newsletter__wrapper::before,
  .footer::before {
    height: 70px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0,0 C 480,50 960,50 1440,0 L1440,100 L0,100 Z' fill='%2335153d'/%3E%3C/svg%3E") !important;
  }
  .template-index .footer {
    margin-top: 0 !important;
  }
}

/* ---- Drawers & modals: dark purple (#35153d, like the footer) not near-black ---- */
/* Cart slideout panel */
.cart-drawer .drawer__inner,
cart-drawer .drawer__inner,
.cart-drawer .drawer__header,
.cart-drawer .cart-drawer__footer,
.cart-drawer .drawer__footer,
.cart-drawer .totals,
/* Mobile navigation tray */
.menu-drawer,
#menu-drawer,
.menu-drawer .menu-drawer__submenu,
/* Search modal + predictive results */
.search-modal,
.search-modal.modal__content,
.predictive-search {
  background-color: #35153d !important;
}

/* Cart drawer & cart page: recolor the color-scheme background variable from
   near-black (11,5,16) to the dark purple (53,21,61) so the PRODUCT/TOTAL header
   row, quantity boxes and totals match the panel instead of showing as black. */
.cart-drawer,
cart-drawer,
.cart-drawer .drawer__inner,
#main-cart-items,
.cart-items,
cart-items,
.cart__footer,
.cart__contents {
  --color-background: 53, 21, 61 !important;
  --color-base-background-1: 53, 21, 61 !important;
}
/* PRODUCT/TOTAL header row uses --color-base-background-1 directly */
.cart-drawer thead,
.cart-items thead {
  background-color: #35153d !important;
}
/* Quantity stepper: transparent with a light border so it reads as a control on
   both the marble (cart page) and the purple drawer — no filled purple box.
   Dawn paints the fill on a ::before pseudo, so clear that too. */
.cart-drawer .quantity,
.cart-items .quantity {
  background-color: transparent !important;
  border: 1px solid rgba(242, 233, 247, 0.4) !important;
}
.cart-drawer .quantity::before,
.cart-items .quantity::before {
  background-color: transparent !important;
}

/* Product description size-chart table: backgroundless header, white text.
   The white band was on the thead / thead tr, so force those transparent too. */
.rte table thead,
.rte table thead tr,
.rte table thead th,
.rte table thead td,
.product__description table thead,
.product__description table thead tr,
.product__description table thead th,
.product__description table thead td {
  background-color: transparent !important;
  color: #f2e9f7 !important;
}

/* Mobile: vertical spacing between the stacked AMERICAS / EUROPE store buttons */
@media screen and (max-width: 749px) {
  .store-buttons {
    row-gap: 14px !important;
  }
}

/* Fix: the broad ".list-unstyled { margin }" rules above leak onto the product
   media slider (a ul.list-unstyled), shoving it ~3px past the viewport and
   creating a horizontal scrollbar on tablet & down. Reset it — the
   .slider-mobile-gutter parent already handles the edge-to-edge breakout. */
.product__media-list.list-unstyled {
  margin: 0 !important;
}

/* Mobile: breathing room above the NEW ARRIVALS heading (it sits flush under the
   banner otherwise). */
@media screen and (max-width: 749px) {
  .shopify-section[id$="__featured_collection_zWFRGe"] .collection__title {
    padding-top: 28px !important;
  }
}

/* Mobile: fixed backgrounds fall back to scroll on phones, so "cover" stretches
   the marble across the whole (very tall) page and blows the texture up huge.
   Scale it to the viewport width and tile it down so it reads at a normal size. */
@media screen and (max-width: 749px) {
  main#MainContent,
  main {
    background-attachment: scroll !important;
    background-size: 100% auto !important;
    background-repeat: repeat !important;
    background-position: top center !important;
  }
}

/* Mobile: smaller card corner radius */
@media screen and (max-width: 749px) {
  .card-wrapper .card {
    border-radius: 30px !important;
  }
}

/* Mobile: smaller product-card titles */
@media screen and (max-width: 749px) {
  h3.card__heading,
  .card-wrapper .card .card__heading,
  .card-wrapper .card .card__heading a {
    font-size: 15px !important;
  }
}

/* Mobile: match html/body marble to main's (tiled, viewport-width) so the texture
   is continuous through the footer arch cut-out (no scale seam at the arch). The
   veil layer still covers uniformly. */
@media screen and (max-width: 749px) {
  html,
  body {
    background-attachment: scroll, scroll !important;
    background-size: cover, 100% auto !important;
    background-repeat: no-repeat, repeat !important;
    background-position: center, top center !important;
  }
}

/* Mobile: smaller nav category items (APPAREL / ACCESSORIES etc.) so long words
   don't run into the edge of the phone. */
@media screen and (max-width: 749px) {
  .menu-drawer a.child.menu-drawer__menu-item.link.link--text.list-menu__item.focus-inset {
    font-size: 17px !important;
  }
}

/* Sold-out card: the "Notify Me" badge (its own .badge) — cycles through the same
   animated multicolour palette as the social icons (socialBlobShift). */
.badge--notify {
  color: #35153d !important;
  background-color: #f5b8d8;
  animation: notifyBadgeShift 12s ease-in-out infinite;
}
@keyframes notifyBadgeShift {
  0%   { background-color: #b6e84f; }
  20%  { background-color: #ff3d8a; }
  40%  { background-color: #e5245a; }
  60%  { background-color: #c3e85f; }
  80%  { background-color: #ffa6d4; }
  100% { background-color: #b6e84f; }
}
@media (prefers-reduced-motion: reduce) {
  .badge--notify { animation: none; background-color: #f5b8d8; }
}

/* Cart header row (PRODUCT / QUANTITY / TOTAL) sits on the dark purple band, but
   the caption is muted (0.75 colour alpha + 0.85 element opacity) so it washes
   out. Make it full-strength light for legibility. */
.cart-items thead th,
.cart-items thead th .caption-with-letter-spacing,
.cart-items thead .caption-with-letter-spacing {
  color: #f2e9f7 !important;
  opacity: 1 !important;
}

/* Cart PAGE (not the drawer): drop the dark purple block backgrounds on the
   header row and the quantity stepper so they show the page marble instead. */
#main-cart-items thead,
#main-cart-items .quantity {
  background-color: transparent !important;
}

/* Help page (/pages/help): remove the curved arch above the footer and its space,
   and close the gap below the FAQ iframe (content wrapper padding + the inline
   descender gap under the iframe) so the footer sits flush with the content. */
.page-help .footer::before {
  display: none !important;
}
.page-help .footer {
  margin-top: 0 !important;
}
.page-help main .page-width--narrow {
  padding-bottom: 0 !important;
}
.page-help main iframe {
  display: block !important;
}
