/** Shopify CDN: Minification failed

Line 894:10 Unexpected "{"
Line 894:19 Expected ":"

**/
/*
 * bmm-pdp.css
 * Aaranya PDP Brand Skin — CSS Override Layer
 * Scoped entirely to .main-product-template
 * Beats Platina's section-main-product.css without touching core files
 * Version: 1.0.0 · March 2026 · BMM Development Team
 */

/* ─── Page background ─────────────────────────────────── */
.main-product-template {
  background-color: var(--bmm-parchment, #F5F0E8);
}

/* ─── Section padding ─────────────────────────────────── */
.main-product-template .section-padding {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}

/* ─── Breadcrumbs ──────────────────────────────────────── */
.main-product-template .breadcrumbs,
.main-product-template .breadcrumbs a {
  font-family: var(--font-body-family);
  font-size: 11px;
  letter-spacing: 0.06em;
  color: var(--bmm-warm-taupe, #8C7B5E);
  transition: color 0.2s ease;
}
.main-product-template .breadcrumbs a:hover {
  color: var(--bmm-warm-black, #1C1C1A);
}

/* ─── Global: kill italic heading style variable on PDP ─── */
/* Platina's --font-heading-style may be 'italic' if the merchant
   selected an italic variant in Theme Editor typography settings.
   We override it to normal scoped to our section only. */
.main-product-template {
  --font-heading-style: normal;
}

/* ─── Product title h1 ─────────────────────────────────── */
/* Platina issues:
   1. base.css h1 uses calc(var(--font-heading-scale)*4rem) — large and inherits
   2. base.css .h1 uses font-style: var(--font-heading-style) — may be italic
   3. section-main-product.css line 1760: font-weight:600
   Fix: high specificity + !important on every property + explicit font-style:normal */
.main-product-template .product__info-container .product__title h1,
.main-product-template .product__info-container .product__title .h1 {
  font-family: var(--font-heading-family) !important;
  font-size: 36px !important;
  font-weight: 300 !important;
  font-style: normal !important;
  line-height: 1.08 !important;
  letter-spacing: -0.01em !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  text-transform: none !important;
  word-break: normal !important;
}
/* Hide the duplicate h2.h1 link Platina renders inside .product__title */
.main-product-template .product__title > a {
  display: none !important;
}

/* ─── PDP tag row ──────────────────────────────────────── */
.main-product-template .bmm-pdp-tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 8px;
  margin-bottom: 12px;
  max-height: 58px;
  overflow: hidden;
  position: relative;
  transition: max-height 0.28s ease;
}
.main-product-template .bmm-pdp-tag-row.bmm-pdp-tag-row--expanded {
  max-height: none;
}
.main-product-template .bmm-pdp-tag-row:empty {
  display: none;
}
/* overflow toggle button */
.main-product-template .bmm-pdp-tag-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 1px solid var(--bmm-warm-stone, #D8D0C0);
  background: transparent;
  cursor: pointer;
  flex-shrink: 0;
  align-self: center;
  transition: border-color 0.2s, background 0.2s;
}
.main-product-template .bmm-pdp-tag-toggle--visible {
  display: flex;
}
.main-product-template .bmm-pdp-tag-toggle svg {
  width: 10px;
  height: 10px;
  stroke: var(--bmm-warm-taupe, #8C7B5E);
  fill: none;
  stroke-width: 2;
  transition: transform 0.25s ease;
}
.main-product-template .bmm-pdp-tag-row--expanded .bmm-pdp-tag-toggle svg {
  transform: rotate(180deg);
}
@media screen and (min-width: 750px) {
  .main-product-template .bmm-pdp-tag-toggle:hover {
    border-color: var(--bmm-gold, #C9A84C);
    background: rgba(201, 168, 76, 0.08);
  }
}

/* ─── Price — regular ──────────────────────────────────── */
/* Platina: .product__info-container .price__regular .price-item--regular
   specificity 0,3,0 — we add .product__info-container to win with 0,4,0 */
.main-product-template .product__info-container .price__regular .price-item--regular,
.main-product-template .product__info-container .price--large .price-item {
  font-family: var(--font-heading-family) !important;
  font-size: 28px !important;
  font-weight: 300 !important;
  font-style: normal !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

/* ─── Price — compare-at (sale) ────────────────────────── */
.main-product-template .price--on-sale .price-item--regular,
.main-product-template .price--on-sale .price__sale s {
  font-family: var(--font-heading-family) !important;
  font-size: 20px !important;
  font-weight: 300 !important;
  color: var(--bmm-warm-taupe, #8C7B5E) !important;
}

/* ─── Sale / discount price ────────────────────────────── */
.main-product-template .price-item--sale,
.main-product-template .price__sale .price-item {
  color: var(--bmm-terracotta, #C4473A) !important;
}

/* ─── Sale badge ───────────────────────────────────────── */
.main-product-template .badge--sale,
.main-product-template .product__badge.badge--sale {
  background: var(--bmm-terracotta, #C4473A) !important;
  color: var(--bmm-parchment, #F5F0E8) !important;
  font-family: var(--font-body-family) !important;
  font-size: 9px !important;
  letter-spacing: 0.14em !important;
  border-radius: 100px !important;
}

/* ─── Variant picker — label ───────────────────────────── */
.main-product-template .product-form__input .form__label,
.main-product-template .product-form__input > label {
  font-family: var(--font-body-family) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
}

/* ─── Variant buttons — unselected ──────────────────────
   BMM 20APR2026: Scoped these rules to :not(.swatch-variant-color)
   so the palette fallback colors (from custom.css) can paint the
   color swatch circles. Without the exclusion, "background: transparent
   !important" here overrode every color rule everywhere, causing the
   three hollow circles on color products. Size pills and non-color
   variant buttons still get this styling as intended.
   ─────────────────────────────────────────────────────── */
.main-product-template .swatch-element input + label:not(.swatch-variant-color),
.main-product-template variant-radios .swatch:not(.swatch-variant-color),
.main-product-template variant-selects .swatch:not(.swatch-variant-color),
.main-product-template .product-form__input .color-swatch,
.main-product-template .product-form__input label[for]:not(.swatch-variant-color) {
  border: 1.5px solid var(--bmm-warm-stone, #D8D0C0) !important;
  background: transparent !important;
  font-family: var(--font-body-family) !important;
  font-size: 11px !important;
  min-height: 40px !important;
  min-width: 44px !important;
  transition: border-color 0.15s ease !important;
}

/* ─── Variant buttons — selected ───────────────────────── */
.main-product-template .swatch-element input:checked + label:not(.swatch-variant-color),
.main-product-template variant-radios input:checked ~ label:not(.swatch-variant-color),
.main-product-template .product-form__input label.active:not(.swatch-variant-color) {
  border: 2px solid var(--bmm-gold, #C9A84C) !important;
  background: var(--bmm-card-ivory, #F0ECE4) !important;
}

@media screen and (min-width: 750px) {
  .main-product-template .swatch-element input + label:hover,
  .main-product-template variant-radios .swatch:hover {
    border-color: var(--bmm-gold, #C9A84C) !important;
  }
}

/* ─── ATC button ───────────────────────────────────────── */
/* Beats: .product__info-container button.product-form__submit
   .button.button--full-width.button--secondary { !important rules } */
.main-product-template .product-form__submit,
.main-product-template button.product-form__submit {
  background: var(--bmm-forest-green, #3D4A3A) !important;
  color: var(--bmm-parchment, #F5F0E8) !important;
  border: none !important;
  font-family: var(--font-body-family) !important;
  font-size: 11px !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  min-height: 52px !important;
  width: 100% !important;
  transition: background-color 0.2s ease !important;
  border-radius: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  text-align: center !important;
}
@media screen and (min-width: 750px) {
  .main-product-template .product-form__submit:hover,
  .main-product-template button.product-form__submit:hover {
    background: var(--bmm-footer-green, #2C3128) !important;
  }
}

/* ─── Dynamic checkout button ──────────────────────────── */
.main-product-template .shopify-payment-button__button {
  border-radius: 0 !important;
  min-height: 48px !important;
  width: 100% !important;
  font-family: var(--font-body-family) !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  margin-top: 8px !important;
}
/* Unbranded button (Buy Now / Shop Pay text fallback) —
   forces a visible outlined style on parchment background */
.main-product-template .shopify-payment-button__button--unbranded {
  background: transparent !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  border: 1.5px solid var(--bmm-warm-stone, #D8D0C0) !important;
  transition: border-color 0.2s ease, background-color 0.2s ease !important;
}
@media screen and (min-width: 750px) {
  .main-product-template .shopify-payment-button__button--unbranded:hover {
    border-color: var(--bmm-warm-black, #1C1C1A) !important;
    background: rgba(28, 28, 26, 0.04) !important;
  }
}
/* Branded button (Shop Pay, PayPal, Apple Pay) —
   these have their own brand colours — just remove radius and fix size */
.main-product-template .shopify-payment-button__button--branded {
  border-radius: 0 !important;
  overflow: hidden !important;
}
/* Separator line between ATC and dynamic checkout */
.main-product-template .shopify-payment-button {
  margin-top: 0 !important;
}
.main-product-template .shopify-payment-button [data-shopify="payment-button"] {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

/* ─── Accordion (tabs right, toggle style) ─────────────── */
/* Beats: .accordion .summary__title { font-family:var(--font-heading-family) } (line 16) */
.main-product-template .accordion summary,
.main-product-template .accordion .accordion__button,
.main-product-template .accordion .summary__title {
  font-family: var(--font-body-family) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  min-height: 52px !important;
}
.main-product-template .accordion {
  border-bottom: 1px solid var(--bmm-warm-stone, #D8D0C0) !important;
}
.main-product-template .accordion + .accordion {
  border-top: none !important;
}
/* Accordion caret — gold when open */
.main-product-template .accordion details[open] .icon-caret path,
.main-product-template .accordion details[open] summary .icon-caret path {
  stroke: var(--bmm-gold, #C9A84C) !important;
}
.main-product-template .accordion .icon-caret,
.main-product-template .accordion summary .icon-caret {
  stroke: var(--bmm-warm-taupe, #8C7B5E);
  transition: stroke 0.2s ease, transform 0.25s ease;
}
/* Accordion body */
.main-product-template .accordion__content,
.main-product-template details .accordion__content {
  font-family: var(--font-body-family) !important;
  font-size: 13px !important;
  color: var(--bmm-warm-taupe, #8C7B5E) !important;
  line-height: 1.8 !important;
}

/* ─── Delivery / Shipping Html_c SVG strokes ───────────── */
/* Overrides hardcoded stroke="#333" on both Html_c blocks */
.main-product-template .delivery svg path,
.main-product-template .delivery svg line,
.main-product-template .delivery svg circle,
.main-product-template .delivery svg rect,
.main-product-template .shipping svg path,
.main-product-template .shipping svg line,
.main-product-template .shipping svg circle,
.main-product-template .shipping svg rect {
  stroke: var(--bmm-warm-taupe, #8C7B5E) !important;
}
.main-product-template .delivery,
.main-product-template .shipping {
  font-family: var(--font-body-family) !important;
  font-size: 12px !important;
  color: var(--bmm-warm-taupe, #8C7B5E) !important;
  line-height: 1.6 !important;
}
.main-product-template .delivery span,
.main-product-template .shipping span,
.main-product-template .delivery strong,
.main-product-template .shipping strong {
  color: var(--bmm-warm-black, #1C1C1A) !important;
}
.main-product-template .delivery {
  margin-bottom: 12px;
}

/* ─── Judge.me star colour ──────────────────────────────── */
.main-product-template .jdgm-star,
.main-product-template .jdgm-prev-badge__stars {
  color: var(--bmm-gold, #C9A84C) !important;
}

/* ─── Gallery thumbnail active border ─────────────────── */
.main-product-template .thumbnail-list .thumbnail:is(.is-active, [aria-current]) {
  border-color: var(--bmm-gold, #C9A84C) !important;
}
.main-product-template .thumbnail-list .thumbnail {
  border-color: transparent;
  transition: border-color 0.2s ease;
}

/* ─── Gallery column ↔ info column gap ─────────────────── */
.main-product-template .main-product_info {
  padding-top: 0 !important;
}
@media screen and (min-width: 990px) {
  .main-product-template .row.facets-vertical.no-sidebar {
    gap: 48px !important;
  }
}

/* ─── Spacing rhythm — info column blocks ──────────────── */
.main-product-template .product__title {
  margin-bottom: 12px !important;
}
.main-product-template #price-section {
  margin-bottom: 20px !important;
}

/* ─── Horizontal rule between price and variants ──────── */
.main-product-template .product__info-container .price {
  padding-bottom: 20px !important;
  border-bottom: 1px solid var(--bmm-warm-stone, #D8D0C0) !important;
  margin-bottom: 20px !important;
}

/* ─── Mobile overrides ─────────────────────────────────── */
@media screen and (max-width: 749px) {
  .main-product-template .product__title h1 {
    font-size: 28px !important;
    line-height: 1.15 !important;
  }
  .main-product-template .price__regular .price-item--regular,
  .main-product-template .price--large .price-item {
    font-size: 24px !important;
  }
  .main-product-template .price--on-sale .price-item--regular {
    font-size: 18px !important;
  }
  .main-product-template .product-form__submit,
  .main-product-template button.product-form__submit {
    width: 100% !important;
    min-height: 52px !important;
  }
  .main-product-template .shopify-payment-button__button {
    width: 100% !important;
    min-height: 48px !important;
  }
  .main-product-template .swatch-element input + label,
  .main-product-template variant-radios .swatch {
    min-height: 44px !important;
    min-width: 44px !important;
  }
  .main-product-template .accordion summary,
  .main-product-template .accordion .summary__title {
    min-height: 52px !important;
  }
}

/* ─── Touch tap highlight ──────────────────────────────── */
.main-product-template button,
.main-product-template a,
.main-product-template [role="button"],
.main-product-template label,
.main-product-template summary {
  -webkit-tap-highlight-color: transparent;
}

/* ─── Explicit transitions on all <a> tags ─────────────── */
/* Platina clash rule: a { transition: all } — always override explicitly */
.main-product-template a {
  transition: color 0.2s ease !important;
}

/* ─── prefers-reduced-motion ───────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .main-product-template * {
    transition: none !important;
    animation: none !important;
  }
}

/* ─── Quantity selector ──────────────────────────────────── */
.main-product-template .quantity {
  border: 1.5px solid var(--bmm-warm-stone, #D8D0C0) !important;
  border-radius: 0 !important;
  display: flex !important;
  align-items: center !important;
  overflow: hidden !important;
  width: fit-content !important;
  background: transparent !important;
}
.main-product-template .quantity__button {
  width: 44px !important;
  height: 44px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  font-family: var(--font-body-family) !important;
  font-size: 18px !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background-color 0.15s ease !important;
  -webkit-tap-highlight-color: transparent !important;
}
.main-product-template .quantity__input {
  width: 48px !important;
  height: 44px !important;
  border: none !important;
  border-left: 1.5px solid var(--bmm-warm-stone, #D8D0C0) !important;
  border-right: 1.5px solid var(--bmm-warm-stone, #D8D0C0) !important;
  border-radius: 0 !important;
  background: transparent !important;
  text-align: center !important;
  font-family: var(--font-body-family) !important;
  font-size: 13px !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  -moz-appearance: textfield !important;
}
.main-product-template .quantity__input::-webkit-inner-spin-button,
.main-product-template .quantity__input::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}
/* Quantity container after pseudo — Platina adds border-radius, remove it */
.main-product-template .product__info-container .quantity:after {
  border-radius: 0 !important;
}
@media screen and (min-width: 750px) {
  .main-product-template .quantity__button:hover {
    background: var(--bmm-warm-linen, #EDE8DC) !important;
  }
}

/* ════════════════════════════════════════════════════════════
   SECTION: BUTTONS, QUANTITY & BUY NOW — COMPLETE RESET
   Source of problems identified in section-main-product.css:
   Line 325: .shopify-payment-button__button { font-style:italic;
             font-family:var(--font-additional-family); font-size:2rem;
             text-transform:capitalize; letter-spacing:0.2rem }
   Line 1801: button.product-form__submit { width:calc(68%); margin-left:12px }
   Line 1827: button.product-form__submit { width:calc(100% - 155px) }
   Line 1803: .product-form__buttons { max-width:49rem; border-bottom:2px solid #d4d4d4 }
   Line 1316: .product-form__buttons .shopify-payment-button { width:calc(100%+50px) }
════════════════════════════════════════════════════════════ */

/* ── 1. Remove the grey divider line Platina puts below button area ── */
.main-product-template .product__info-container .product-form__buttons {
  max-width: 100% !important;
  border-bottom: none !important;
  padding-bottom: 0 !important;
  display: block !important;
  margin: 0 0 0 0 !important;
}

/* ── 2. ATC button — full width, correct position, no left margin ─── */
/* Beats line 1801: width:calc(68%); margin-left:12px
   Beats line 1827: width:calc(100% - 155px)
   Our selector has more classes so wins without !important on most,
   but Platina uses !important on some so we match */
.main-product-template .product__info-container
  button.product-form__submit.button.button--full-width.button--secondary {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 10px !important;
  background: var(--bmm-forest-green, #3D4A3A) !important;
  color: var(--bmm-parchment, #F5F0E8) !important;
  border: none !important;
  font-family: var(--font-body-family) !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  min-height: 52px !important;
  border-radius: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
@media screen and (min-width: 750px) {
  .main-product-template .product__info-container
    button.product-form__submit.button.button--full-width.button--secondary:hover {
    background: var(--bmm-footer-green, #2C3128) !important;
  }
}

/* ── 3. Buy Now — kill italic, fix font, fix size, add border ──────── */
/* Beats line 325: font-style:italic; font-family:var(--font-additional-family);
   font-size:2rem; text-transform:capitalize; letter-spacing:0.2rem */
.main-product-template .shopify-payment-button__button {
  font-family: var(--font-body-family) !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  min-height: 48px !important;
  width: 100% !important;
}
/* Unbranded (plain Buy It Now text button) */
.main-product-template .shopify-payment-button__button--unbranded {
  background: transparent !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  border: 1.5px solid var(--bmm-warm-stone, #D8D0C0) !important;
  font-family: var(--font-body-family) !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
}
@media screen and (min-width: 750px) {
  .main-product-template .shopify-payment-button__button--unbranded:hover,
  .main-product-template .shopify-payment-button__button--unbranded:hover:not([disabled]) {
    background-color: rgba(28, 28, 26, 0.04) !important;
    color: var(--bmm-warm-black, #1C1C1A) !important;
    border-color: var(--bmm-warm-black, #1C1C1A) !important;
  }
}

/* ── 4. Buy Now payment button container — full width, no offset ───── */
/* Beats line 1316: .product-form__buttons .shopify-payment-button { width:calc(100%+50px) } */
.main-product-template .product-form__buttons .shopify-payment-button,
.main-product-template .product-form__buttons .shopify-payment-button > div {
  width: 100% !important;
  margin: 0 !important;
}

/* ── 5. Remove form max-width constraint ────────────────────────────── */
/* Beats line 1802: .product-form form { max-width:490px } */
.main-product-template .product__info-container .product-form form {
  max-width: 100% !important;
}

/* ════════════════════════════════════════════════════════════
   QTY LABEL — injected via CSS ::before on quantity container
   Mockup: "Qty" text label left of the quantity control
   Platina renders no label — we inject it via ::before
════════════════════════════════════════════════════════════ */
.main-product-template .product-form__quantity {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  margin-bottom: 16px !important;
  flex-direction: row !important;
}
.main-product-template .product-form__quantity::before {
  content: 'Qty';
  font-family: var(--font-body-family);
  font-size: 11px;
  font-style: normal;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bmm-warm-black, #1C1C1A);
  white-space: nowrap;
  flex-shrink: 0;
}

/* ════════════════════════════════════════════════════════════
   ATC BUTTON — bag SVG icon via CSS ::before
   Mockup: shopping bag SVG left of "ADD TO CART" text
   Platina renders text only — we inject icon via ::before
════════════════════════════════════════════════════════════ */
/* ════════════════════════════════════════════════════════════
   ATC BUTTON — bag icon (inline SVG injected in Liquid span)
   Platina's .button::before is position:absolute for shadows —
   our ::before conflicts. Icon is inline SVG instead.
════════════════════════════════════════════════════════════ */

/* Inner span — flex row, icon + text centred together */
.main-product-template .product-form__submit .bmm-atc-inner {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  position: relative !important;
  z-index: 2 !important;
}

/* Bag SVG icon */
.main-product-template .product-form__submit .bmm-atc-icon {
  width: 18px !important;
  height: 18px !important;
  flex-shrink: 0 !important;
  display: block !important;
  stroke: var(--bmm-parchment, #F5F0E8) !important;
  fill: none !important;
}
/* Hide icon when sold out */
.main-product-template .product-form__submit[disabled] .bmm-atc-icon,
.main-product-template .product-form__submit[aria-disabled="true"] .bmm-atc-icon {
  display: none !important;
}


/* ════════════════════════════════════════════════════════════
   WISHLIST / COMPARE / SHARE — Brand redesign
   Spec: Tenor Sans 11px · Warm Taupe · SVG icons · Warm Stone
   separators · Hover → Warm Black · Heart fills Terracotta when active
════════════════════════════════════════════════════════════ */

/* ── Container row — top + bottom Warm Stone border ─────── */
.main-product-template .dT_VProdWishList,
.main-product-template .dT_VProdCompareList {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

/* ── Shared link style ───────────────────────────────────── */
.main-product-template .dT_VProdWishList a,
.main-product-template .dT_VProdWishList a.add-wishlist,
.main-product-template .dT_VProdCompareList a,
.main-product-template .dT_VProdCompareList a.add-compare {
  font-family: var(--font-body-family) !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  color: var(--bmm-warm-taupe, #8C7B5E) !important;
  text-decoration: none !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 0 16px !important;
  min-height: 40px !important;
  cursor: pointer !important;
  transition: color 0.2s ease !important;
  position: static !important;
}
@media screen and (min-width: 750px) {
  .main-product-template .dT_VProdWishList a:hover,
  .main-product-template .dT_VProdWishList a.add-wishlist:hover,
  .main-product-template .dT_VProdCompareList a:hover,
  .main-product-template .dT_VProdCompareList a.add-compare:hover {
    color: var(--bmm-warm-black, #1C1C1A) !important;
  }
}

/* ── Kill Platina's ::after pseudo text content ─────────── */
/* Platina renders link text via ::after content: "Wishlist" etc. */
/* We hide the ::after and keep the text if any, or just the icon */
.main-product-template .dT_VProdWishList a::after,
.main-product-template .dT_VProdWishList a.add-wishlist::after {
  content: 'Wishlist' !important;
  position: static !important;
  left: auto !important;
  font-family: var(--font-body-family) !important;
  font-size: 11px !important;
  font-style: normal !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  color: inherit !important;
}
.main-product-template .dT_VProdCompareList a::after,
.main-product-template .dT_VProdCompareList a.add-compare::after {
  content: 'Compare' !important;
  position: static !important;
  left: auto !important;
  font-family: var(--font-body-family) !important;
  font-size: 11px !important;
  font-style: normal !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  color: inherit !important;
}

/* ── Wishlist icon — heart via ::before ─────────────────── */
.main-product-template .dT_VProdWishList a::before,
.main-product-template .dT_VProdWishList a.add-wishlist::before {
  content: '' !important;
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238C7B5E' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  flex-shrink: 0 !important;
}

/* ── Compare icon — checklist via ::before ──────────────── */
.main-product-template .dT_VProdCompareList a::before,
.main-product-template .dT_VProdCompareList a.add-compare::before {
  content: '' !important;
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238C7B5E' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 11 12 14 22 4'/%3E%3Cpath d='M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  flex-shrink: 0 !important;
}

/* ── Wrapper row — Warm Stone borders + flex ────────────── */
.main-product-template .product__info-wrapper .icon-with-text {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  padding: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 20px !important;
  border-top: 1px solid var(--bmm-warm-stone, #D8D0C0) !important;
  border-bottom: 1px solid var(--bmm-warm-stone, #D8D0C0) !important;
  max-width: 100% !important;
  width: 100% !important;
}

/* ── Form below icon-with-text must be block, not inline ── */
.main-product-template .product__info-wrapper form.form,
.main-product-template .product__info-wrapper .product-form {
  display: block !important;
  width: 100% !important;
  clear: both !important;
}

/* ── Separator between wishlist and compare ─────────────── */
.main-product-template .dT_VProdWishList {
  border-right: 1px solid var(--bmm-warm-stone, #D8D0C0) !important;
}
.main-product-template .dT_VProdWishList a {
  padding-left: 0 !important;
}

/* ── Share button — same brand style ────────────────────── */
.main-product-template .share-button__button,
.main-product-template .share-button {
  font-family: var(--font-body-family) !important;
  font-size: 11px !important;
  font-style: normal !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  color: var(--bmm-warm-taupe, #8C7B5E) !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 0 0 0 16px !important;
  min-height: 40px !important;
  transition: color 0.2s ease !important;
}
.main-product-template .share-button details,
.main-product-template .share-button summary {
  list-style: none !important;
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE QC FIXES — 26 MAR 2026
════════════════════════════════════════════════════════════ */

/* ── MOB: Wishlist row — prevent overflow at 320px ─────── */
@media screen and (max-width: 374px) {
  .main-product-template .product__info-wrapper .icon-with-text {
    flex-wrap: wrap !important;
  }
  .main-product-template .dT_VProdWishList a,
  .main-product-template .dT_VProdWishList a.add-wishlist,
  .main-product-template .dT_VProdCompareList a,
  .main-product-template .dT_VProdCompareList a.add-compare {
    font-size: 10px !important;
    padding: 0 10px !important;
  }
  .main-product-template .share-button__button {
    padding-left: 10px !important;
  }
}

/* ── iOS: Safe area inset for cart toast ───────────────── */
/* Applies to all fixed elements — covers Dynamic Island + home indicator */
.bmm-psr__toast,
#BmmPsrToast,
[id^="BmmPsrToast"] {
  padding-bottom: max(10px, env(safe-area-inset-bottom)) !important;
  bottom: max(28px, calc(28px + env(safe-area-inset-bottom))) !important;
}

/* ── AND: Prevent input zoom on Android (quantity) ─────── */
/* Font-size must be ≥ 16px to prevent zoom on Android Chrome */
/* We set 16px on the input and scale it down visually */
.main-product-template .quantity__input {
  font-size: 16px !important;
  transform: scale(0.8125) !important; /* 13/16 = 0.8125 — appears as 13px */
  transform-origin: center !important;
}

/* ── INT: Focus-visible outline on all custom elements ─── */
/* Ensures keyboard users can see focus on our overridden elements */
.main-product-template .quantity__button:focus-visible,
.main-product-template .product-form__submit:focus-visible,
.main-product-template .shopify-payment-button__button:focus-visible {
  outline: 2px solid var(--bmm-gold, #C9A84C) !important;
  outline-offset: 2px !important;
}
.main-product-template .bmm-gw__check-wrap:focus-within .bmm-gw__visual {
  outline: 2px solid var(--bmm-gold, #C9A84C) !important;
  outline-offset: 2px !important;
}
.main-product-template .dT_VProdWishList a:focus-visible,
.main-product-template .dT_VProdCompareList a:focus-visible,
.main-product-template .share-button__button:focus-visible {
  outline: 2px solid var(--bmm-gold, #C9A84C) !important;
  outline-offset: 3px !important;
}

/* ── INT: ATC disabled — reduced opacity, no icon ──────── */
.main-product-template .product-form__submit[disabled],
.main-product-template .product-form__submit[aria-disabled="true"] {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
}
.main-product-template .product-form__submit[disabled]::before,
.main-product-template .product-form__submit[aria-disabled="true"]::before {
  display: none !important;
}

/* ── LARGE: Trust strip icons scale on large screens ───── */
@media screen and (min-width: 1440px) {
  #BmmTs-{{ section.id }} .bmm-ts__icon svg {
    width: 36px !important;
    height: 36px !important;
  }
}

/* ── DESK: Info column max-width on ultra-wide screens ─── */
@media screen and (min-width: 1600px) {
  .main-product-template .product__info-container {
    max-width: 640px !important;
  }
}

/* ════════════════════════════════════════════════════════════
   TAX / SHIPPING TEXT — Fix font, size, weight, link hover
   Platina issues:
   1. .caption class sets font-weight:700, text-transform:uppercase
   2. gradient-base-accent-2 hover makes shipping link invisible
      (accent-2 = Parchment #F5F0E8 = same as bg)
   3. font-family inheriting heading font in some contexts
════════════════════════════════════════════════════════════ */

/* ── Tax included / Shipping calculated line ────────────── */
.main-product-template .product__tax,
.main-product-template .product__tax.caption,
.main-product-template .product__tax.rte {
  font-family: var(--font-body-family) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  color: var(--bmm-warm-taupe, #8C7B5E) !important;
  line-height: 1.6 !important;
  margin-top: 4px !important;
  margin-bottom: 12px !important;
}

/* ── "Shipping calculated at checkout" link ─────────────── */
/* Platina sets .button--secondary:hover { color: accent-2 = Parchment } */
/* We override to keep the link always visible */
.main-product-template .product__tax a,
.main-product-template .product__tax .rte a,
.main-product-template .product__tax a.link {
  font-family: var(--font-body-family) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  text-transform: none !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--bmm-warm-stone, #D8D0C0) !important;
  text-underline-offset: 2px !important;
  transition: color 0.2s ease, text-decoration-color 0.2s ease !important;
}
/* Override Platina's invisible hover */
.main-product-template .product__tax a:hover,
.main-product-template .product__tax a.link:hover,
.main-product-template .product__info-wrapper .product__tax a.button--secondary:hover {
  color: var(--bmm-warm-black, #1C1C1A) !important;
  text-decoration-color: var(--bmm-warm-black, #1C1C1A) !important;
}

/* ── Delivery / Shipping Html_c blocks — fix font-family ── */
/* Platina line 1806–1807 forces font-heading-family on these */
.main-product-template .product__info-container .html-sections-product p.delivery,
.main-product-template .product__info-container .html-sections-product p.shipping {
  font-family: var(--font-body-family) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  font-style: normal !important;
}
.main-product-template .product__info-container .html-sections-product span {
  font-family: var(--font-body-family) !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
}

/* ── Hide "About your query" enquiry link ───────────────── */
/* Misaligned Platina app element — hidden per client request */
.main-product-template .dt-sc-enquiry-form {
  display: none !important;
}

/* ════════════════════════════════════════════════════════════
   ACCORDION — Match approved mockup exactly
   Spec: Tenor Sans 12px · 0.08em · uppercase · Warm Black
   Trigger: 16px padding top/bottom · chevron rotates 180° on open
   Body: 13px · Warm Taupe · 1.8 line-height
   Borders: 1px Warm Stone top + bottom on each item
════════════════════════════════════════════════════════════ */

/* ── Container reset ────────────────────────────────────── */
.main-product-template .accordion {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  border-top: 1px solid var(--bmm-warm-stone, #D8D0C0) !important;
  border-bottom: 1px solid var(--bmm-warm-stone, #D8D0C0) !important;
  border-left: none !important;
  border-right: none !important;
}
.main-product-template .accordion + .accordion {
  border-top: none !important;
  margin-top: 0 !important;
}

/* ── Summary / trigger row ──────────────────────────────── */
.main-product-template .accordion summary,
.main-product-template .accordion details > summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 0 !important;
  cursor: pointer !important;
  list-style: none !important;
  background: transparent !important;
  border: none !important;
}
/* Hide default browser marker */
.main-product-template .accordion summary::-webkit-details-marker,
.main-product-template .accordion summary::marker {
  display: none !important;
}

/* ── Title text ─────────────────────────────────────────── */
.main-product-template .accordion .summary__title,
.main-product-template .accordion summary .summary__title {
  font-family: var(--font-body-family) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  line-height: 1.3 !important;
  flex: 1 !important;
}

/* ── Accordion title (h-tag inside summary) ─────────────── */
/* Platina: .accordion__title { font-size:2.4rem; font-weight:600 } */
.main-product-template .accordion__title,
.main-product-template .accordion .accordion__title {
  font-family: var(--font-body-family) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  max-width: calc(100% - 28px) !important;
  word-break: normal !important;
}

/* ── Caret icon — fix rotation direction ───────────────── */
/* Platina default: rotate(270deg) = points left → wrong
   Mockup: should point DOWN (0deg closed, 180deg open) */
.main-product-template .accordion summary .icon-caret,
.main-product-template .accordion .icon-caret {
  width: 16px !important;
  height: 16px !important;
  stroke: var(--bmm-warm-taupe, #8C7B5E) !important;
  fill: none !important;
  stroke-width: 1.5 !important;
  transform: rotate(0deg) !important;
  transition: transform 0.25s ease, stroke 0.2s ease !important;
  flex-shrink: 0 !important;
}
/* Override Platina's wrong open rotation (rotate 90° → points right) */
.main-product-template .accordion details[open] > summary .icon-caret,
.main-product-template .accordion details[open] .icon-caret {
  transform: rotate(180deg) !important;
  stroke: var(--bmm-gold, #C9A84C) !important;
}

/* ── Body / content ─────────────────────────────────────── */
.main-product-template .accordion .accordion__content,
.main-product-template .accordion details .accordion__content {
  font-family: var(--font-body-family) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  color: var(--bmm-warm-taupe, #8C7B5E) !important;
  line-height: 1.8 !important;
  margin-bottom: 0 !important;
  padding-bottom: 20px !important;
  word-break: normal !important;
  overflow-x: visible !important;
}

/* ── Hover — desktop only ───────────────────────────────── */
@media screen and (min-width: 750px) {
  .main-product-template .accordion summary:hover .summary__title,
  .main-product-template .accordion summary:hover .accordion__title {
    color: var(--bmm-warm-taupe, #8C7B5E) !important;
  }
  .main-product-template .accordion summary:hover .icon-caret {
    stroke: var(--bmm-gold, #C9A84C) !important;
  }
}

/* ════════════════════════════════════════════════════════════
   DELIVERY / SHIPPING ROWS — Match approved mockup
   Spec: 12px · Warm Taupe · SVG 20×20px · strong = Warm Black
   border-top: 1px Warm Stone · gap 12px between rows
   Padding: 16px top/bottom
════════════════════════════════════════════════════════════ */

/* ── Delivery / shipping wrapper ─────────────────────────── */
.main-product-template .product__info-container .html-sections-product {
  border-top: 1px solid var(--bmm-warm-stone, #D8D0C0) !important;
  padding-top: 16px !important;
  padding-bottom: 4px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

/* ── Each delivery/shipping row ──────────────────────────── */
.main-product-template .product__info-container .html-sections-product p.delivery,
.main-product-template .product__info-container .html-sections-product p.shipping {
  font-family: var(--font-body-family) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  color: var(--bmm-warm-taupe, #8C7B5E) !important;
  line-height: 1.6 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
}

/* ── SVG icons ───────────────────────────────────────────── */
.main-product-template .html-sections-product p.delivery svg,
.main-product-template .html-sections-product p.shipping svg {
  width: 20px !important;
  height: 20px !important;
  flex-shrink: 0 !important;
  stroke: var(--bmm-warm-taupe, #8C7B5E) !important;
  fill: none !important;
  stroke-width: 1.5 !important;
  margin-top: 1px !important;
}

/* ── Strong labels — Warm Black ───────────────────────────── */
.main-product-template .html-sections-product p.delivery span,
.main-product-template .html-sections-product p.shipping span,
.main-product-template .html-sections-product p.delivery strong,
.main-product-template .html-sections-product p.shipping strong {
  font-family: var(--font-body-family) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  font-style: normal !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  padding-left: 0 !important;
}

/* ════════════════════════════════════════════════════════════
   TYPOGRAPHY SCALE FIX — BRD Compliance
   BRD: Body/UI = Tenor Sans 13–14px
   Bumping all 12px body elements to 13px, body content to 14px
════════════════════════════════════════════════════════════ */

/* ── Accordion body — BRD max body 14px ────────────────── */
.main-product-template .accordion .accordion__content,
.main-product-template .accordion details .accordion__content {
  font-size: 14px !important;
  line-height: 1.8 !important;
}

/* ── Accordion trigger — 13px (was 12px) ───────────────── */
/* Uppercase 12px reads small on screen — bump to 13px */
.main-product-template .accordion .summary__title,
.main-product-template .accordion summary .summary__title,
.main-product-template .accordion__title,
.main-product-template .accordion .accordion__title {
  font-size: 13px !important;
}

/* ── Delivery rows — 13px (was 12px) ───────────────────── */
.main-product-template .product__info-container .html-sections-product p.delivery,
.main-product-template .product__info-container .html-sections-product p.shipping {
  font-size: 13px !important;
}
.main-product-template .html-sections-product p.delivery span,
.main-product-template .html-sections-product p.shipping span,
.main-product-template .html-sections-product p.delivery strong,
.main-product-template .html-sections-product p.shipping strong {
  font-size: 13px !important;
}

/* ── Tax / shipping calculated line — confirm 13px ─────── */
.main-product-template .product__tax,
.main-product-template .product__tax.caption,
.main-product-template .product__tax.rte {
  font-size: 13px !important;
}

/* ── Variant picker / option labels ("COLOR", "SIZE") ──── */
/* Platina form__label = 1.6rem = 16px — too big for a label */
/* BRD says labels are 11px uppercase */
.main-product-template .product-form__input .form__label,
.main-product-template .product-form__input > label,
.main-product-template .product-form__input fieldset legend {
  font-family: var(--font-body-family) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  margin-bottom: 10px !important;
}

/* ── Variant option values shown beside label ("Gold Plated") ── */
.main-product-template .product-form__input .form__label span,
.main-product-template .product-form__input legend span {
  font-size: 11px !important;
  color: var(--bmm-warm-taupe, #8C7B5E) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  margin-left: 6px !important;
}

/* ── Judge.me / review count below title ────────────────── */
.main-product-template .jdgm-prev-badge,
.main-product-template .jdgm-prev-badge__text,
.main-product-template .jdgm-prev-badge__count {
  font-family: var(--font-body-family) !important;
  font-size: 12px !important;
  font-style: normal !important;
  color: var(--bmm-warm-taupe, #8C7B5E) !important;
}
.main-product-template .jdgm-prev-badge__stars {
  font-size: 13px !important;
  color: var(--bmm-gold, #C9A84C) !important;
}

/* ── Wishlist / Compare — bump to 12px (was 11px) ──────── */
/* 11px uppercase was hard to read — nudge to 12px */
.main-product-template .dT_VProdWishList a,
.main-product-template .dT_VProdWishList a.add-wishlist,
.main-product-template .dT_VProdCompareList a,
.main-product-template .dT_VProdCompareList a.add-compare {
  font-size: 12px !important;
  letter-spacing: 0.10em !important;
}
.main-product-template .dT_VProdWishList a::after,
.main-product-template .dT_VProdWishList a.add-wishlist::after,
.main-product-template .dT_VProdCompareList a::after,
.main-product-template .dT_VProdCompareList a.add-compare::after {
  font-size: 12px !important;
}

/* ── Share button label ─────────────────────────────────── */
.main-product-template .share-button__button {
  font-size: 12px !important;
}

/* ── Qty label ::before ─────────────────────────────────── */
/* 11px uppercase is correct for a small UI label — keep */
.main-product-template .product-form__quantity::before {
  font-size: 11px !important;
}

/* ── Breadcrumbs ────────────────────────────────────────── */
.main-product-template .breadcrumbs,
.main-product-template .breadcrumbs a,
.main-product-template .breadcrumbs span {
  font-size: 12px !important;
  letter-spacing: 0.04em !important;
}

/* ── Mobile — scale down gracefully ────────────────────── */
@media screen and (max-width: 749px) {
  .main-product-template .accordion .summary__title,
  .main-product-template .accordion__title {
    font-size: 12px !important;
  }
  .main-product-template .accordion .accordion__content,
  .main-product-template .accordion details .accordion__content {
    font-size: 13px !important;
  }
  .main-product-template .product__info-container .html-sections-product p.delivery,
  .main-product-template .product__info-container .html-sections-product p.shipping {
    font-size: 12px !important;
  }
}


/* ════════════════════════════════════════════════════════════
   FLOATING ATC BAR v3 — Correct selectors, all conflicts fixed
   Confirmed HTML structure from sticky-cart-bar.liquid:
   product-form.sticky-bar-form
     └─ div.sticky-bar  [inline style="display:none" — overridden by JS]
        ├─ div.product-title-sticky
        │  ├─ ul.product__media-list.grid.grid--peek.slider.slider--mobile
        │  │  └─ li.product__media-item.grid__item.slider__slide.is-active
        │  │     └─ img
        │  └─ div.sticky-bar-title > span.sticky-title
        └─ div.sticky-bar-price  [variant wrapper — misnamed]
           └─ div.variant-drop-down
              ├─ div.product-form__quantity  [hidden]
              ├─ span.sticky-bar-price > .price  [price, no-variant products]
              ├─ variant-selects > div.product-form__input--dropdown
              │  ├─ label.form__label
              │  └─ div.select > select.select__select
              └─ div.product-form__buttons > button#sticky-bar-button
   span.sticky-bar-close  [OUTSIDE .sticky-bar — sibling of form]

   PLATINA CONFLICTS (all overridden here):
   sticky-cart.css:   white bg, black shadow, z-index:3, display:none at 950px,
                      font-weight:700, 2rem title, heading font, margin:26px on buttons,
                      translateY(14px) on close, 70px/80px img with 5px 15px margin
   section-main-product.css: variant-selects{display:block},
                      product-form__input--dropdown{margin-bottom:1.6rem},
                      variant-selects label{font-size:2.2rem;font-weight:700}
   base.css:          .grid{flex-wrap:wrap;column-gap:var(--grid-spacing)}
════════════════════════════════════════════════════════════ */

/* ── Platina 950px hide override ──────────────────────────── */
@media screen and (max-width: 950px) {
  #MainContent .sticky-bar { display: flex !important; }
  .sticky-bar-form .sticky-bar { display: flex !important; }
}
/* ── Reduced motion ───────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  #MainContent .sticky-bar,
  .sticky-bar-form .sticky-bar { transition: none !important; }
}

/* ═══════════════════════════════════════════════════════════
   BASE BAR
═══════════════════════════════════════════════════════════ */
#MainContent .sticky-bar {
  position: fixed !important;
  bottom: 0 !important; left: 0 !important; right: 0 !important;
  z-index: 200 !important;
  width: 100% !important;
  height: 64px !important;
  min-height: 0 !important;
  display: flex !important;
  align-items: stretch !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  padding: 0 !important;
  gap: 0 !important;
  background: var(--bmm-parchment, #F5F0E8) !important;
  border-top: 2px solid var(--bmm-gold, #C9A84C) !important;
  border-bottom: none !important;
  box-shadow: 0 -4px 24px rgba(28,28,26,.08) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

/* ═══════════════════════════════════════════════════════════
   THUMBNAIL + TITLE GROUP   div.product-title-sticky
═══════════════════════════════════════════════════════════ */
.sticky-bar .product-title-sticky {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
  height: 64px !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
}
/* Right divider */
.sticky-bar .product-title-sticky::after {
  content: '' !important;
  display: block !important;
  width: 1px !important;
  height: 32px !important;
  background: var(--bmm-warm-stone, #D8D0C0) !important;
  flex-shrink: 0 !important;
  align-self: center !important;
}

/* ul.product__media-list — kill grid/slider classes */
.sticky-bar .product__media-list {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  max-width: 52px !important;
  flex-shrink: 0 !important;
  margin: 0 12px 0 16px !important;
  padding: 0 !important;
  border: 1px solid var(--bmm-warm-stone, #D8D0C0) !important;
  overflow: hidden !important;
  list-style: none !important;
  /* kill .grid flex-wrap + gap */
  flex-wrap: nowrap !important;
  gap: 0 !important;
  column-gap: 0 !important;
  row-gap: 0 !important;
  margin-bottom: 0 !important;
}

/* li.product__media-item.grid__item.slider__slide */
.sticky-bar .product__media-list li,
.sticky-bar .product__media-list .product__media-item {
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  max-width: 52px !important;
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* img — kill Platina: width:70px; height:80px; margin:5px 15px */
.sticky-bar .product__media-list img,
.sticky-bar-form .sticky-bar img:not([class*="spinner"]) {
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  max-width: 52px !important;
  min-height: 52px !important;
  max-height: 52px !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
}

/* div.sticky-bar-title + span.sticky-title */
.sticky-bar .sticky-bar-title {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  padding: 0 16px 0 12px !important;
  margin: 0 !important;
}
.sticky-bar .sticky-title {
  font-family: var(--font-heading-family) !important;
  font-size: 15px !important;
  font-weight: 300 !important;
  font-style: normal !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 220px !important;
  display: block !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* ═══════════════════════════════════════════════════════════
   VARIANT WRAPPER   div.sticky-bar-price
═══════════════════════════════════════════════════════════ */
.sticky-bar div.sticky-bar-price {
  display: flex !important;
  align-items: stretch !important;
  flex: 1 !important;
  height: 64px !important;
  gap: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
}
.sticky-bar .variant-drop-down {
  display: flex !important;
  align-items: stretch !important;
  flex: 1 !important;
  height: 64px !important;
  gap: 0 !important;
  padding: 0 !important;
}

/* Hide quantity — not in spec */
.sticky-bar .product-form__quantity,
.sticky-bar .product-form__input:not(.product-form__input--dropdown) {
  display: none !important;
}

/* Price for single-variant products span.sticky-bar-price */
.sticky-bar span.sticky-bar-price {
  display: flex !important;
  align-items: center !important;
  padding: 0 14px !important;
  flex-shrink: 0 !important;
  border-left: 1px solid var(--bmm-warm-stone, #D8D0C0) !important;
  height: 64px !important;
}
.sticky-bar span.sticky-bar-price .price,
.sticky-bar span.sticky-bar-price .price-item,
.sticky-bar span.sticky-bar-price .price-item--regular,
.sticky-bar span.sticky-bar-price .price-item--sale {
  font-family: var(--font-heading-family) !important;
  font-size: 13px !important;
  font-weight: 300 !important;
  font-style: normal !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  white-space: nowrap !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.sticky-bar span.sticky-bar-price .price.product-price-current { display: block !important; }
.sticky-bar span.sticky-bar-price .price--on-sale .price-item--regular { display: none !important; }

/* variant-selects wrapper — Platina sets display:block, kills flex */
.sticky-bar variant-selects {
  display: flex !important;
  align-items: stretch !important;
  flex-shrink: 0 !important;
  height: 64px !important;
  gap: 0 !important;
}

/* div.product-form__input--dropdown — each variant option */
/* Platina sets margin-bottom:1.6rem — kills bar height alignment */
.sticky-bar .product-form__input--dropdown {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 14px !important;
  margin: 0 !important;
  border-left: 1px solid var(--bmm-warm-stone, #D8D0C0) !important;
  height: 64px !important;
  flex-shrink: 0 !important;
  min-width: 0 !important;
  /* Kill Platina */
  margin-bottom: 0 !important;
  margin-right: 0 !important;
}

/* label.form__label — Platina: font-size:2.2rem; font-weight:700 */
.sticky-bar .product-form__input--dropdown .form__label,
.sticky-bar variant-selects .product-form__input .form__label {
  font-family: var(--font-body-family) !important;
  font-size: 10px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  color: var(--bmm-warm-taupe, #8C7B5E) !important;
  margin: 0 !important;
  padding: 0 !important;
  white-space: nowrap !important;
  display: block !important;
  min-width: 0 !important;
  min-width: auto !important;
}

/* div.select wrapper */
.sticky-bar .select {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}
.sticky-bar .select::before,
.sticky-bar .select::after { display: none !important; }

/* select.select__select — Platina: padding:0 3rem; font-size:1.6rem; font-weight:700 */
.sticky-bar .select__select {
  font-family: var(--font-body-family) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  color: var(--bmm-warm-black, #1C1C1A) !important;
  background-color: transparent !important;
  border: 1.5px solid var(--bmm-warm-stone, #D8D0C0) !important;
  border-radius: 0 !important;
  padding: 6px 28px 6px 10px !important;
  min-width: 100px !important;
  height: 36px !important;
  cursor: pointer !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238C7B5E' stroke-width='1.5'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 7px center !important;
  background-size: 12px !important;
}

/* icon-caret inside select — hide Platina's SVG caret (we use bg-image) */
.sticky-bar .select .icon-caret { display: none !important; }

/* ═══════════════════════════════════════════════════════════
   ATC BUTTON   div.product-form__buttons > button#sticky-bar-button
═══════════════════════════════════════════════════════════ */
/* Kill Platina: margin:26px 0 0; min-height:40px; clear:both; flex-wrap:wrap */
.sticky-bar .product-form__buttons {
  display: flex !important;
  align-items: stretch !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 64px !important;
  flex-shrink: 0 !important;
  border: none !important;
  border-bottom: none !important;
  clear: none !important;
  min-height: 0 !important;
  flex-wrap: nowrap !important;
  line-height: normal !important;
}
#sticky-bar-button,
.sticky-bar #sticky-bar-button {
  height: 64px !important;
  min-height: 0 !important;
  padding: 0 28px !important;
  margin: 0 !important;
  background: var(--bmm-forest-green, #3D4A3A) !important;
  color: var(--bmm-parchment, #F5F0E8) !important;
  border: none !important;
  border-radius: 0 !important;
  font-family: var(--font-body-family) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  white-space: nowrap !important;
  min-width: 150px !important;
  width: auto !important;
  flex-shrink: 0 !important;
  transition: background 0.2s ease !important;
  box-shadow: none !important;
  outline: none !important;
}
#sticky-bar-button::before {
  content: '' !important;
  width: 14px !important;
  height: 14px !important;
  flex-shrink: 0 !important;
  display: block !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5F0E8' stroke-width='1.5'%3E%3Cpath d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z'/%3E%3Cline x1='3' y1='6' x2='21' y2='6'/%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
}
@media screen and (min-width: 750px) {
  #sticky-bar-button:hover { background: var(--bmm-footer-green, #2C3128) !important; }
}
#sticky-bar-button[disabled] { opacity: 0.6 !important; cursor: not-allowed !important; }
#sticky-bar-button[disabled]::before { display: none !important; }
/* Spinner inside ATC — hide text */
#sticky-bar-button .loading-overlay__spinner { display: none !important; }

/* ═══════════════════════════════════════════════════════════
   CLOSE BUTTON   span.sticky-bar-close
   OUTSIDE .sticky-bar — needs position:fixed to align with bar
═══════════════════════════════════════════════════════════ */
span.sticky-bar-close {
  position: fixed !important;
  bottom: 0 !important;
  right: 0 !important;
  z-index: 201 !important;
  width: 44px !important;
  height: 64px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--bmm-parchment, #F5F0E8) !important;
  border-top: 2px solid var(--bmm-gold, #C9A84C) !important;
  border-left: 1px solid var(--bmm-warm-stone, #D8D0C0) !important;
  cursor: pointer !important;
  color: var(--bmm-warm-taupe, #8C7B5E) !important;
  transform: none !important;
  margin: 0 !important;
  transition: color 0.2s ease !important;
  visibility: hidden !important; /* JS controls visibility */
  box-sizing: border-box !important;
}
span.sticky-bar-close svg.icon.icon-close {
  width: 13px !important;
  height: 13px !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 1.5px !important;
}
@media screen and (min-width: 750px) {
  span.sticky-bar-close:hover { color: var(--bmm-warm-black, #1C1C1A) !important; }
}

/* ═══════════════════════════════════════════════════════════
   TABLET  750px – 1023px
═══════════════════════════════════════════════════════════ */
@media screen and (max-width: 1023px) {
  #MainContent .sticky-bar { height: 60px !important; overflow: visible !important; }
  .sticky-bar .product-title-sticky { height: 60px !important; }
  /* No thumbnail on tablet */
  .sticky-bar .product__media-list { display: none !important; }
  .sticky-bar .sticky-title { max-width: 180px !important; font-size: 13px !important; }
  .sticky-bar div.sticky-bar-price { height: 60px !important; }
  .sticky-bar .variant-drop-down { height: 60px !important; }
  .sticky-bar variant-selects { height: 60px !important; }
  .sticky-bar .product-form__input--dropdown { height: 60px !important; padding: 0 12px !important; }
  .sticky-bar .product-form__buttons { height: 60px !important; }
  #sticky-bar-button { height: 60px !important; padding: 0 20px !important; min-width: 120px !important; }
  span.sticky-bar-close { height: 60px !important; width: 40px !important; }
}

/* ═══════════════════════════════════════════════════════════
   MOBILE  ≤749px
═══════════════════════════════════════════════════════════ */
@media screen and (max-width: 749px) {
  #MainContent .sticky-bar {
    height: 56px !important;
    padding: 0 16px !important;
    padding-bottom: max(0px, env(safe-area-inset-bottom)) !important;
    align-items: center !important;
    gap: 12px !important;
    justify-content: space-between !important;
    overflow: visible !important;
  }
  /* ── Hide thumbnail + title group ───── */
  .sticky-bar .product-title-sticky { display: none !important; }

  /* ── div.sticky-bar-price wraps variant-drop-down + buttons ─
     We CANNOT hide the whole div — it contains the ATC button.
     Instead: show div as flex, hide only the variant parts inside  */
  .sticky-bar div.sticky-bar-price {
    display: flex !important;
    align-items: center !important;
    flex: 1 !important;
    height: 56px !important;
    padding: 0 !important;
    gap: 0 !important;
  }
  /* Hide variant-drop-down except the buttons */
  .sticky-bar .variant-drop-down {
    display: flex !important;
    align-items: center !important;
    flex: 1 !important;
    height: 56px !important;
    gap: 0 !important;
  }
  /* Hide quantity + variant selects + price span */
  .sticky-bar .product-form__quantity,
  .sticky-bar span.sticky-bar-price,
  .sticky-bar variant-selects,
  .sticky-bar .product-form__input--dropdown { display: none !important; }

  /* ATC fills remaining space */
  .sticky-bar .product-form__buttons {
    display: flex !important;
    align-items: center !important;
    flex: 1 !important;
    width: auto !important;
    height: 56px !important;
    gap: 12px !important;
    min-height: 0 !important;
    padding: 0 !important;
  }
  /* Price injected via ::before */
  .sticky-bar .product-form__buttons::before {
    content: attr(data-price) !important;
    font-family: var(--font-heading-family) !important;
    font-size: 18px !important;
    font-weight: 300 !important;
    font-style: normal !important;
    color: var(--bmm-warm-black, #1C1C1A) !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
  }
  #sticky-bar-button {
    flex: 1 !important;
    height: 44px !important;
    min-width: 0 !important;
    padding: 0 12px !important;
    letter-spacing: 0.16em !important;
    font-size: 10px !important;
    width: auto !important;
    margin: 0 !important;
  }
  span.sticky-bar-close { display: none !important; }
}

/* ═══════════════════════════════════════════════════════════
   DESKTOP  1024px+
═══════════════════════════════════════════════════════════ */
@media screen and (min-width: 1024px) {
  .sticky-bar .product__media-list { display: flex !important; }
  .sticky-bar .sticky-bar-title { display: flex !important; }
}

/* ════════════════════════════════════════════════════════════
   FLOATING BAR — Post-v3 fixes
════════════════════════════════════════════════════════════ */

/* ── Hide variant label ("COLOR", "SIZE") — per client request ── */
.sticky-bar .product-form__input--dropdown .form__label,
.sticky-bar variant-selects .product-form__input .form__label {
  display: none !important;
}

/* ── Scroll-to-top button — lift above bar when bar is visible ── */
/* Platina: a#to-top.show { bottom: 20px } — overlaps 64px bar  */
a#to-top.dt-sc-to-top.show {
  bottom: 84px !important; /* 64px bar + 20px gap */
}
/* Mobile — bar is 56px */
@media screen and (max-width: 749px) {
  a#to-top.dt-sc-to-top.show {
    bottom: 76px !important; /* 56px bar + 20px gap */
  }
}

/* ── ATC button — padding-right reserves space for close btn ─── */
/* Desktop/tablet: 44px for the fixed close button               */
/* Mobile: 16px only — no close button                           */
@media screen and (min-width: 750px) {
  #MainContent .sticky-bar {
    padding-right: 44px !important;
  }
}

/* ── Share button — align with Wishlist + Compare on mobile ── */
/* share-button is a custom element wrapping <details> — both   */
/* are block-level, breaking out of the flex icon-with-text row */
.main-product-template .product__info-wrapper .share-button,
.main-product-template .product__info-wrapper share-button {
  display: inline-flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}
/* Only style the visible share button — NOT the .hidden one */
/* .hidden button is shown only when Web Share API is available */
/* Without this guard, both buttons show simultaneously        */
.main-product-template .product__info-wrapper .share-button__button:not(.hidden),
.main-product-template .product__info-wrapper share-button details:not([hidden]) > summary.share-button__button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  font-family: var(--font-body-family) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  color: var(--bmm-warm-taupe, #8C7B5E) !important;
  background: transparent !important;
  border: none !important;
  padding: 0 16px !important;
  min-height: 40px !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  list-style: none !important;
}
/* Keep hidden button actually hidden
   BMM 20APR2026: Broadened selector to catch share-button instances
   inside .icon-with-text (the wrapper that holds wishlist/compare/share
   on this PDP). Without this, the native-share <button class="hidden">
   was rendering visibly alongside the <summary>, producing two SHARE
   buttons side by side. The .hidden class alone has no browser effect
   — theme CSS must explicitly display:none it. */
.main-product-template .product__info-wrapper .share-button__button.hidden,
.main-product-template .icon-with-text .share-button__button.hidden,
.main-product-template share-button .share-button__button.hidden {
  display: none !important;
}

/* BMM 20APR2026 (FINAL FIX for duplicate SHARE):
   share.js hides the <details> via hidden="" attribute when Web Share
   API is available (desktop Chrome, mobile Safari, etc). The browser
   SHOULD then make <details> and all its children display:none.
   BUT base.css line 1861 has ".share-button__button { display: flex }"
   which forces the inner <summary class="share-button__button"> to
   render visibly even when its parent <details> is hidden="".
   This rule explicitly hides the summary in that case, matching the
   browser's intent. */
.main-product-template share-button details[hidden],
.main-product-template share-button details[hidden] summary {
  display: none !important;
}
/* Share icon */
.main-product-template .share-button__button .icon,
.main-product-template .share-button__button svg {
  width: 14px !important;
  height: 14px !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 1.5 !important;
  flex-shrink: 0 !important;
}
/* Hide the fallback copy-link dropdown on mobile */
@media screen and (max-width: 749px) {
  .main-product-template .share-button__fallback {
    display: none !important;
  }
}
/* details element inside share-button — must also be inline
   BMM 20APR2026: Added :not([hidden]) so this rule only paints visible
   details elements. Previously this rule forced display:inline-flex on
   ALL details inside share-button — including ones with hidden=""
   attribute set by share.js when Web Share API is available — which
   kept the fallback dropdown rendering alongside the native button,
   producing two SHARE labels side by side. The :not([hidden]) guard
   lets the browser's default hidden-attribute behavior work as intended. */
.main-product-template .product__info-wrapper share-button details:not([hidden]) {
  display: inline-flex !important;
  align-items: center !important;
}

/* ── Hide Share button on mobile only ───────────────────── */
@media screen and (max-width: 749px) {
  .main-product-template .product__info-wrapper .share-button,
  .main-product-template .product__info-wrapper share-button {
    display: none !important;
  }
}

/* ── Hide Wishlist + Compare on mobile only ─────────────── */
@media screen and (max-width: 749px) {
  .main-product-template .dT_VProdWishList,
  .main-product-template .dT_VProdCompareList {
    display: none !important;
  }
}

/* ════════════════════════════════════════════════════════════
   ATC BUTTON — Gentle Shake Animation
   Behaviour: auto-loops (shake → 2s pause → shake → repeat)
   Re-triggers on hover · stops while cart loading (disabled)
   prefers-reduced-motion: disabled
════════════════════════════════════════════════════════════ */

@keyframes bmm-atc-shake {
  0%,100% { transform: translateX(0) rotate(0deg); }
  10%     { transform: translateX(-3px) rotate(-.6deg); }
  20%     { transform: translateX(3px) rotate(.6deg); }
  30%     { transform: translateX(-2px) rotate(-.4deg); }
  40%     { transform: translateX(2px) rotate(.4deg); }
  50%     { transform: translateX(-1px) rotate(-.2deg); }
  60%     { transform: translateX(0) rotate(0deg); }
}

/* Class toggled by JS — active shake state */
.main-product-template .product-form__submit.bmm-atc-shaking {
  animation: bmm-atc-shake 1s ease-in-out forwards !important;
}

/* Stop animation when button is disabled (loading/sold out) */
.main-product-template .product-form__submit[disabled].bmm-atc-shaking,
.main-product-template .product-form__submit[aria-disabled="true"].bmm-atc-shaking {
  animation: none !important;
}
/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .main-product-template .product-form__submit.bmm-atc-shaking {
    animation: none !important;
  }
}