/**
 * @file
 * Add-to-cart consolidated styles — bar, sticky stack, AJAX messages.
 * Canonical owner: frontend/add_to_cart_bar.
 */

/**
 * @file
 * Add-to-cart bar base component — layout, tokens, quantity controls, visibility.
 * Canonical owner: frontend/add_to_cart_bar.
 */

.add-to-cart-bar {
  --color-dark-1: #111111;
  --color-dark-2: #262626;
  --color-dark-3: #333333;
  --color-light-1: #eeece6;
  --color-light-2: #f2f1ed;
  --color-light-4: #f1e9db;
  --color-gray-1: #888888;
  --color-gray-2: #cccccc;
  --atc-surface-1: var(--color-light-2);
  --atc-surface-2: var(--color-light-1);
  --atc-surface-3: rgba(255, 255, 255, 0.34);
  --atc-ink: var(--color-dark-2);
  --atc-ink-strong: var(--color-dark-1);
  --atc-muted: var(--color-gray-1);
  --atc-line: rgba(38, 38, 38, 0.16);
  --atc-line-strong: rgba(38, 38, 38, 0.28);
  --atc-shadow: 0 28px 80px rgba(17, 17, 17, 0.16);
  --atc-shadow-soft: 0 12px 28px rgba(17, 17, 17, 0.12);
  --atc-control-bg: rgba(255, 255, 255, 0.44);
  --atc-control-border: rgba(38, 38, 38, 0.18);
  --atc-button-bg: var(--color-dark-1);
  --atc-button-text: var(--color-light-1);
  --atc-button-border: var(--color-dark-1);
  --atc-highlight: var(--color-light-4);
  --atc-radius: 24px;
  --atc-control-radius: 16px;
  --atc-button-radius: 64px;
  --atc-height: 2.75rem;
  --atc-media-size: 36px;
  --atc-gap: clamp(0.35rem, 0.9vw, 0.6rem);
  --atc-gap-tight: clamp(0.25rem, 0.7vw, 0.45rem);
  --atc-padding-inline: clamp(0.45rem, 1.4vw, 0.75rem);
  --atc-padding-block: clamp(0.5rem, 1vw, 0.7rem);
  --atc-offset-x: clamp(10px, 2.5vw, 18px);
  --atc-offset-y: clamp(10px, 2vh, 18px);
  --atc-width: min(calc(100vw - (var(--atc-offset-x) * 2)), 1320px);
  --atc-col-product: minmax(0, 1.35fr);
  --atc-col-price: clamp(3.4rem, 12vw, 4.5rem);
  --atc-col-select: clamp(4.9rem, 17vw, 6rem);
  --atc-col-cta: clamp(7.75rem, 25vw, 9rem);
  --atc-qty-width: clamp(3.75rem, 12vw, 4.5rem);
  --atc-ease: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  --atc-reveal-delay: 180ms;
  --atc-utility-letter-spacing: 0.14em;
  --atc-button-letter-spacing: 0.12em;
  --atc-top-rule-width: clamp(40px, 10vw, 88px);
  position: fixed;
  left: 50%;
  bottom: var(--atc-offset-y);
  z-index: 70;
  width: var(--atc-width);
  color: var(--atc-ink);
  font-family: var(--font-primary);
  background: linear-gradient(180deg, var(--atc-surface-1), var(--atc-surface-2));
  border: 1px solid var(--atc-line);
  border-radius: var(--atc-radius);
  box-shadow: var(--atc-shadow);
  transform: translate(-50%, calc(100% + var(--atc-offset-y)));
  opacity: 0;
  transition:
    transform 0.6s var(--atc-ease),
    opacity 220ms ease;
  transition-delay: 0s;
  isolation: isolate;
  container-type: inline-size;
}

.add-to-cart-bar::before {
  content: "";
  position: absolute;
  top: 0.95rem;
  left: var(--atc-padding-inline);
  width: var(--atc-top-rule-width);
  height: 1px;
  background: var(--atc-line-strong);
  pointer-events: none;
}

.add-to-cart-bar::after {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: calc(var(--atc-radius) - 1px);
  border: 1px solid rgba(255, 255, 255, 0.34);
  opacity: 0.55;
  pointer-events: none;
}

.add-to-cart-bar--visible {
  transform: translate(-50%, 0);
  opacity: 1;
  transition-delay: var(--atc-reveal-delay);
}

@supports (bottom: max(0px)) {
  .add-to-cart-bar {
    bottom: max(var(--atc-offset-y), env(safe-area-inset-bottom));
  }
}

.add-to-cart-bar__inner {
  display: grid;
  grid-template-columns:
    var(--atc-col-product)
    minmax(0, var(--atc-col-price))
    minmax(0, var(--atc-col-select))
    minmax(0, var(--atc-col-cta));
  gap: var(--atc-gap);
  align-items: center;
  max-width: 1320px;
  margin: 0 auto;
  padding: calc(var(--atc-padding-block) + 0.55rem) var(--atc-padding-inline) var(--atc-padding-block);
  min-width: 0;
}

.add-to-cart-bar__product {
  display: grid;
  grid-template-columns: var(--atc-media-size) minmax(0, 1fr);
  gap: var(--atc-gap-tight);
  align-items: center;
  min-width: 0;
}

.add-to-cart-bar__media {
  width: var(--atc-media-size);
  height: var(--atc-media-size);
  border-radius: 18px;
  object-fit: cover;
  background: var(--atc-highlight);
  box-shadow: var(--atc-shadow-soft);
}

.add-to-cart-bar__meta,
.add-to-cart-bar__price-block,
.add-to-cart-bar__field {
  min-width: 0;
}

.add-to-cart-bar__eyebrow,
.add-to-cart-bar__label,
.add-to-cart-bar__button-subline {
  margin: 0;
  font-size: clamp(8px, 0.48rem + 0.12vw, 11px);
  font-weight: 700;
  letter-spacing: var(--atc-utility-letter-spacing);
  line-height: 1.3;
  text-transform: uppercase;
  font-family: var(--font-primary);
}

.add-to-cart-bar__eyebrow,
.add-to-cart-bar__label {
  color: var(--atc-muted);
}

.add-to-cart-bar__meta {
  display: grid;
  gap: 0.28rem;
}

.add-to-cart-bar__title {
  margin: 0;
  font-family: var(--font-secondary);
  font-size: clamp(0.95rem, 0.82rem + 0.5vw, 1.2rem);
  font-weight: 400;
  line-height: 0.96;
  letter-spacing: -0.045em;
  color: var(--atc-ink-strong);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}

.add-to-cart-bar__caption {
  margin: 0;
  font-size: clamp(0.78rem, 0.74rem + 0.12vw, 0.88rem);
  line-height: 1.35;
  color: var(--atc-muted);
  font-family: var(--font-primary);
  display: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.add-to-cart-bar__price-block {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
  padding-inline: 0.35rem;
  border-left: 1px solid var(--atc-line);
  border-right: 1px solid var(--atc-line);
}

.add-to-cart-bar__price-value {
  margin: 0;
  font-family: var(--font-secondary);
  font-size: clamp(0.95rem, 0.84rem + 0.32vw, 1.12rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--atc-ink-strong);
  white-space: nowrap;
}

.add-to-cart-bar__field {
  display: grid;
  gap: 0.45rem;
  min-width: 0;
}

.add-to-cart-bar__inner > .add-to-cart-bar__field--select {
  grid-column: 3;
}

.add-to-cart-bar__inner > .add-to-cart-bar__cta {
  grid-column: 4;
}

.add-to-cart-bar__select-wrap,
.add-to-cart-bar__qty {
  position: relative;
  display: grid;
  width: 100%;
  align-items: center;
  min-height: var(--atc-height);
  background: var(--atc-control-bg);
  border: 1px solid var(--atc-control-border);
  border-radius: var(--atc-control-radius);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.add-to-cart-bar__qty {
  grid-template-columns: 2rem minmax(0, 1fr) 2rem;
  overflow: hidden;
}

.add-to-cart-bar__select-wrap {
  display: inline-flex;
}

.add-to-cart-bar__select {
  width: 100%;
  min-height: var(--atc-height);
  min-width: 0;
  padding: 0 2rem 0 0.65rem;
  border: 0;
  border-radius: var(--atc-control-radius);
  background: transparent;
  color: var(--atc-ink-strong);
  font: inherit;
  font-size: 0.82rem;
  font-weight: 600;
  appearance: none;
  outline: none;
  text-overflow: ellipsis;
}

.add-to-cart-bar__select-icon {
  position: absolute;
  right: 0.7rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--atc-muted);
  pointer-events: none;
}

.add-to-cart-bar__qty-input {
  min-height: var(--atc-height);
  border: 0;
  background: transparent;
  color: var(--atc-ink-strong);
  font: inherit;
}

.add-to-cart-bar__qty-input {
  width: 100%;
  min-width: 0;
  padding: 0;
  text-align: center;
  outline: none;
  appearance: textfield;
}

.add-to-cart-bar input[type="number"]::-webkit-inner-spin-button,
.add-to-cart-bar input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.add-to-cart-bar__cta {
  display: grid;
  grid-template-columns: minmax(0, var(--atc-qty-width)) minmax(0, 1fr);
  gap: var(--atc-gap-tight);
  align-items: end;
  min-width: 0;
}

.add-to-cart-bar__cta > .add-to-cart-bar__field--qty {
  min-width: 0;
}

.add-to-cart-bar__cta > .add-to-cart-bar__button {
  width: 100%;
}

.add-to-cart-bar__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: var(--atc-height);
  padding: 0.55rem 0.65rem;
  border: 2px solid var(--atc-button-border);
  border-radius: var(--atc-button-radius);
  background: var(--atc-button-bg);
  color: var(--atc-button-text);
  font: inherit;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  overflow: hidden;
  cursor: pointer;
  transition:
    transform 180ms ease,
    background-color 180ms ease,
    color 180ms ease,
    border-color 180ms ease;
}

.add-to-cart-bar__button:hover,
.add-to-cart-bar__button:focus-visible {
  transform: translateY(-2px);
}

.add-to-cart-bar__button-content {
  display: grid;
  gap: 0.12rem;
  justify-items: center;
  width: 100%;
  min-width: 0;
}

.add-to-cart-bar__button-text {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  letter-spacing: inherit;
}

.add-to-cart-bar__button-subline {
  color: rgba(238, 236, 230, 0.68);
}

.add-to-cart-bar__button:focus-visible,
.add-to-cart-bar__select:focus-visible,
.add-to-cart-bar__qty-input:focus-visible {
  outline: 2px solid var(--atc-ink-strong);
  outline-offset: 3px;
}

.add-to-cart-bar__eyebrow,
.add-to-cart-bar__caption,
.add-to-cart-bar__price-block > .add-to-cart-bar__label,
.add-to-cart-bar__field > .add-to-cart-bar__label,
.add-to-cart-bar__button-subline {
  display: none;
}

.add-to-cart-bar--dark {
  --atc-surface-1: rgba(17, 17, 17, 0.94);
  --atc-surface-2: rgba(26, 26, 26, 0.9);
  --atc-surface-3: rgba(255, 255, 255, 0.08);
  --atc-ink: var(--color-light-2);
  --atc-ink-strong: #ffffff;
  --atc-muted: var(--color-gray-2);
  --atc-line: rgba(255, 255, 255, 0.14);
  --atc-line-strong: rgba(255, 255, 255, 0.24);
  --atc-shadow: 0 34px 90px rgba(0, 0, 0, 0.42);
  --atc-shadow-soft: 0 16px 30px rgba(0, 0, 0, 0.28);
  --atc-control-bg: rgba(255, 255, 255, 0.04);
  --atc-control-border: rgba(255, 255, 255, 0.16);
  --atc-button-bg: var(--color-light-1);
  --atc-button-text: var(--color-dark-1);
  --atc-button-border: var(--color-light-1);
  -webkit-backdrop-filter: blur(18px) saturate(120%);
  backdrop-filter: blur(18px) saturate(120%);
}

@container (max-width: 560px) {
  .add-to-cart-bar {
    --atc-media-size: 32px;
    --atc-gap: 0.3rem;
    --atc-gap-tight: 0.2rem;
    --atc-padding-inline: 0.4rem;
    --atc-padding-block: 0.45rem;
    --atc-col-price: 3.2rem;
    --atc-col-select: 4.4rem;
    --atc-col-cta: 7.1rem;
    --atc-qty-width: 3.35rem;
  }

  .add-to-cart-bar__title {
    font-size: clamp(0.88rem, 0.78rem + 0.42vw, 1rem);
  }

  .add-to-cart-bar__price-block {
    padding-inline: 0.25rem;
  }

  .add-to-cart-bar__select {
    padding-inline: 0.55rem 1.7rem;
    font-size: 0.76rem;
  }

  .add-to-cart-bar__qty {
    grid-template-columns: 1.8rem minmax(0, 1fr) 1.8rem;
  }

  .add-to-cart-bar__button {
    padding-inline: 0.45rem;
    font-size: 0.64rem;
    letter-spacing: 0.08em;
  }
}

@container (max-width: 420px) {
  .add-to-cart-bar {
    --atc-offset-x: 8px;
    --atc-media-size: 28px;
    --atc-gap: 0.22rem;
    --atc-gap-tight: 0.18rem;
    --atc-padding-inline: 0.3rem;
    --atc-col-price: 2.75rem;
    --atc-col-select: 3.7rem;
    --atc-col-cta: 6rem;
    --atc-qty-width: 2.8rem;
  }

  .add-to-cart-bar__product {
    gap: 0.2rem;
  }

  .add-to-cart-bar__title {
    font-size: 0.82rem;
  }

  .add-to-cart-bar__price-value {
    font-size: 0.88rem;
  }

  .add-to-cart-bar__select {
    padding-inline: 0.45rem 1.55rem;
    font-size: 0.72rem;
  }

  .add-to-cart-bar__qty {
    grid-template-columns: 1.65rem minmax(0, 1fr) 1.65rem;
  }

  .add-to-cart-bar__button {
    padding-inline: 0.3rem;
    font-size: 0.58rem;
    letter-spacing: 0.06em;
  }
}

@media (min-width: 768px) {
  .add-to-cart-bar {
    --atc-radius: 26px;
    --atc-control-radius: 18px;
    --atc-height: 3rem;
    --atc-media-size: 56px;
    --atc-gap: clamp(0.5rem, 1vw, 0.85rem);
    --atc-gap-tight: clamp(0.35rem, 0.7vw, 0.55rem);
    --atc-padding-inline: clamp(0.7rem, 1.4vw, 1rem);
    --atc-padding-block: clamp(0.7rem, 1.2vw, 0.9rem);
    --atc-col-price: clamp(4.6rem, 7vw, 5.8rem);
    --atc-col-select: clamp(6.8rem, 11vw, 8.5rem);
    --atc-col-cta: clamp(9.8rem, 15vw, 12rem);
    --atc-qty-width: clamp(4.3rem, 6vw, 5.1rem);
  }

  .add-to-cart-bar__title {
    font-size: clamp(1.15rem, 1rem + 0.42vw, 1.45rem);
  }

  .add-to-cart-bar__price-value {
    font-size: clamp(1.05rem, 0.95rem + 0.34vw, 1.3rem);
  }

  .add-to-cart-bar__button {
    padding-inline: 0.85rem;
    font-size: 0.74rem;
    letter-spacing: 0.14em;
  }

  .add-to-cart-bar__eyebrow,
  .add-to-cart-bar__price-block > .add-to-cart-bar__label,
  .add-to-cart-bar__field > .add-to-cart-bar__label,
  .add-to-cart-bar__button-subline {
    display: block;
  }
}

@media (min-width: 1100px) {
  .add-to-cart-bar {
    --atc-radius: 28px;
    --atc-control-radius: 20px;
    --atc-height: 3.5rem;
    --atc-media-size: 84px;
    --atc-gap: clamp(1rem, 2vw, 2rem);
    --atc-gap-tight: clamp(0.65rem, 1.2vw, 1rem);
    --atc-padding-inline: clamp(1rem, 2vw, 2rem);
    --atc-padding-block: clamp(1rem, 1.8vw, 1.35rem);
    --atc-offset-x: clamp(12px, 3vw, 28px);
    --atc-offset-y: clamp(12px, 2.5vh, 24px);
    --atc-col-product: minmax(0, 1.7fr);
    --atc-col-price: clamp(5.25rem, 8vw, 7.75rem);
    --atc-col-select: clamp(8rem, 13vw, 11rem);
    --atc-col-cta: clamp(11rem, 18vw, 15rem);
    --atc-qty-width: clamp(5rem, 7vw, 6.5rem);
    --atc-top-rule-width: clamp(56px, 9vw, 120px);
  }

  .add-to-cart-bar__title {
    font-size: clamp(1.35rem, 1.2rem + 0.75vw, 2rem);
  }

  .add-to-cart-bar__caption {
    display: block;
  }

  .add-to-cart-bar__price-block {
    padding-inline: clamp(0.35rem, 0.9vw, 0.9rem);
  }

  .add-to-cart-bar__price-value {
    font-size: clamp(1.3rem, 1.08rem + 0.5vw, 1.75rem);
  }

  .add-to-cart-bar__select {
    padding-inline: 1rem 2.9rem;
    font-size: 1rem;
  }

  .add-to-cart-bar__select-icon {
    right: 1rem;
  }

  .add-to-cart-bar__qty {
    grid-template-columns: 2.8rem minmax(0, 1fr) 2.8rem;
  }

  .add-to-cart-bar__button {
    padding: 0.85rem 1.65rem;
    font-size: 1rem;
    letter-spacing: var(--atc-utility-letter-spacing);
  }

}

@media (prefers-reduced-motion: reduce) {
  .add-to-cart-bar,
  .add-to-cart-bar--visible,
  .add-to-cart-bar__button {
    transition: none;
  }
}





/**
 * @file
 * Sticky ATC stack layout, z-index, footer lift, and BBQ customizer sheet hide rules.
 * Canonical owner: frontend/add_to_cart_bar.
 */

:root {
  --sticky-atc-stack-height: clamp(6.5rem, 18vw, 9rem);
  --sticky-atc-stack-gap: 0.85rem;
}

body.page_has-sticky-atc :is(#bbq-styles-menu, .bbq-styles-card-grid) {
  padding-bottom: calc(
    var(--sticky-atc-stack-height, 6.5rem)
    + var(--sticky-atc-stack-gap, 0.85rem)
    + env(safe-area-inset-bottom, 0px)
  );
}

body.page_has-sticky-atc .footer-commerce__meta {
  margin-bottom: 9.5rem;
}

.sticky-atc-stack {
  position: fixed;
  left: 0;
  right: 0;
  padding-left: var(--gutter-horizontal);
  padding-right: var(--gutter-horizontal);
  pointer-events: none;
  z-index: 490;
  transition: transform 0.25s ease, visibility 0.25s ease;
}

/**
 * Signature-Q customizer modal: move sticky stacks off-canvas while open.
 * State class is toggled by the package customizer overlay.
 */
html.package-customizer-sheet-open .sticky-atc-stack {
  visibility: hidden;
}

html.package-customizer-sheet-open .sticky-atc-stack_top {
  transform: translateY(calc(-100% - var(--sticky-atc-top-offset, 0px) - 1rem));
}

html.package-customizer-sheet-open .sticky-atc-stack_bottom {
  transform: translateY(calc(100% + 1rem));
}

html.package-customizer-sheet-open .sticky-atc-stack .add-to-cart-bar {
  pointer-events: none;
}

.sticky-atc-stack_top {
  top: var(--sticky-atc-top-offset, 0px);
}

.sticky-atc-stack_bottom {
  bottom: 15px;
}

.sticky-atc-stack_safe-area {
  bottom: calc(var(--fix-bar-vh, 30px) + 15px);
}


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

@media screen and (max-width: 991px) {
  .sticky-atc-stack {
    padding-left: 20px;
    padding-right: 20px;
  }

  .sticky-atc-stack_bottom {
    bottom: 20px;
  }

  .sticky-atc-stack_safe-area.sticky-atc-stack_bottom {
    bottom: calc(var(--fix-bar-vh, 30px) + 20px);
  }

}
/**
 * @file
 * Commerce PDP purchase rail + StickyATC relocation bridge.
 * Canonical owner: frontend/add_to_cart_bar.
 *
 * Mobile-first zone contract:
 * - Base: identity + price, glance facts, full-width Commerce action.
 * - >=768px: identity | glance facts | price above Commerce action.
 * - --has-includes: paired sides directly beneath the parent product title.
 */

.add-to-cart-bar--commerce {
  container-type: normal;
}

.commerce-product .field--name-title .field__item,
.add-to-cart-bar--commerce .add-to-cart-bar__title {
  display: block;
  font-weight: 700;
  -webkit-box-orient: initial;
  -webkit-line-clamp: unset;
  line-clamp: unset;
  overflow: visible;
  text-overflow: clip;
}

.add-to-cart-bar--commerce.add-to-cart-bar--has-includes .add-to-cart-bar__title {
  margin-bottom: 0.05rem;
}

.add-to-cart-bar--commerce.add-to-cart-bar--has-includes .add-to-cart-bar__includes-label {
  display: inline;
}

.add-to-cart-bar--commerce .add-to-cart-bar__actions .form-actions input[type="submit"] {
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
}

.add-to-cart-bar.js-sticky-atc-bar {
  display: none;
  container-type: normal;
}

.add-to-cart-bar.js-sticky-atc-bar.sticky-atc_active {
  display: block;
}

.sticky-atc-stack .add-to-cart-bar.js-sticky-atc-bar {
  position: relative;
  left: auto;
  bottom: auto;
  width: 100%;
  max-width: min(calc(100vw - 2 * var(--atc-offset-x, 10px)), 1320px);
  margin-left: auto;
  margin-right: auto;
  transform: none;
  opacity: 1;
  transition: none;
  /* Mirror sticky-atc.css .sticky-atc: stack is pointer-events:none; bar must re-enable hits. */
  pointer-events: auto;
}

.sticky-atc-stack .add-to-cart-bar.js-sticky-atc-bar::before,
.sticky-atc-stack .add-to-cart-bar.js-sticky-atc-bar::after {
  display: none;
}

.sticky-atc-stack .add-to-cart-bar--commerce.js-sticky-atc-bar::before,
.sticky-atc-stack .add-to-cart-bar--commerce.js-sticky-atc-bar::after {
  display: none;
}

.add-to-cart-bar--commerce {
  --atc-radius: 0.4rem;
  min-width: 0;
  overflow: hidden;
  box-sizing: border-box;
}

.add-to-cart-bar--commerce .add-to-cart-bar__media {
  border-radius: var(--atc-radius);
}

.add-to-cart-bar--commerce::before,
.add-to-cart-bar--commerce::after {
  display: none;
}

.add-to-cart-bar--commerce .add-to-cart-bar__price-block {
  border: 0;
}

.add-to-cart-bar > .package-customizer-source {
  display: none;
}

/* --- Opaque commerce surfaces (light + dark; stack relocation) --- */

.add-to-cart-bar--commerce:not(.add-to-cart-bar--dark),
.sticky-atc-stack .add-to-cart-bar--commerce:not(.add-to-cart-bar--dark).js-sticky-atc-bar {
  /* WCAG 1.4.3: utility/meta on #f2f1ed >= 4.5:1 (default --color-gray-1 is 3.1:1). */
  --atc-muted: #6b6b6b;
}

.add-to-cart-bar--commerce,
.sticky-atc-stack .add-to-cart-bar--commerce.js-sticky-atc-bar {
  background-color: var(--color-dark-1);
  background-image: linear-gradient(180deg, var(--color-dark-1) 0%, var(--color-dark-2) 100%);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.add-to-cart-bar--commerce.add-to-cart-bar--dark,
.sticky-atc-stack .add-to-cart-bar--commerce.add-to-cart-bar--dark.js-sticky-atc-bar {
  --atc-radius: 0.65rem;
  --atc-muted: rgba(238, 236, 230, 0.72);
  --atc-ink: var(--color-light-1);
  --atc-ink-strong: var(--color-light-1);
  --atc-line: color-mix(in srgb, var(--color-accent) 22%, transparent);
  --atc-line-strong: color-mix(in srgb, var(--color-accent) 55%, transparent);
  --atc-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  border: 1px solid var(--bbq-styles-card-border, rgba(255, 255, 255, 0.34));
  border-top: 2px solid var(--color-accent);
  background-color: var(--color-dark-1);
  background-image: linear-gradient(180deg, var(--color-dark-1) 0%, var(--color-dark-2) 100%);
  box-shadow: var(--atc-shadow);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

@supports not (color: color-mix(in srgb, white 50%, black)) {
  .add-to-cart-bar--commerce.add-to-cart-bar--dark,
  .sticky-atc-stack .add-to-cart-bar--commerce.add-to-cart-bar--dark.js-sticky-atc-bar {
    --atc-line: rgba(212, 165, 95, 0.22);
    --atc-line-strong: rgba(212, 165, 95, 0.55);
  }
}

.add-to-cart-bar--commerce.add-to-cart-bar--dark .add-to-cart-bar__eyebrow,
.add-to-cart-bar--commerce.add-to-cart-bar--dark .add-to-cart-bar__price-block > .add-to-cart-bar__label,
.add-to-cart-bar--commerce.add-to-cart-bar--dark .add-to-cart-bar__price-value,
.add-to-cart-bar--commerce.add-to-cart-bar--dark .pdp-glance__label,
.add-to-cart-bar--commerce.add-to-cart-bar--dark .add-to-cart-bar__caption .add-to-cart-bar__includes-label {
  color: var(--color-accent);
}

.add-to-cart-bar--commerce.add-to-cart-bar--dark .add-to-cart-bar__title,
.add-to-cart-bar--commerce.add-to-cart-bar--dark .pdp-glance__value {
  color: var(--color-light-1);
}

.add-to-cart-bar--commerce.add-to-cart-bar--dark .add-to-cart-bar__caption,
.add-to-cart-bar--commerce.add-to-cart-bar--dark .add-to-cart-bar__includes-names {
  color: var(--atc-muted);
}

.add-to-cart-bar--commerce.add-to-cart-bar--dark .add-to-cart-bar__actions input[type="submit"].button_solid.button_graphite {
  border-color: color-mix(in srgb, var(--color-accent) 55%, transparent);
  color: var(--color-light-1);
}

.add-to-cart-bar--commerce.add-to-cart-bar--dark .add-to-cart-bar__actions input[type="submit"].button_solid.button_graphite:not(:disabled):not([disabled]):not([aria-disabled="true"]):hover,
.add-to-cart-bar--commerce.add-to-cart-bar--dark .add-to-cart-bar__actions input[type="submit"].button_solid.button_graphite:not(:disabled):not([disabled]):not([aria-disabled="true"]):focus-visible {
  border-color: var(--color-accent);
  color: var(--color-accent);
  background-color: var(--color-accent-soft);
}

.add-to-cart-bar--commerce.add-to-cart-bar--dark .add-to-cart-bar__actions input[type="submit"].button_solid.button_graphite.is-added,
.add-to-cart-bar--commerce.add-to-cart-bar--dark .add-to-cart-bar__actions input[type="submit"].button_solid.button_graphite.is-added:hover,
.add-to-cart-bar--commerce.add-to-cart-bar--dark .add-to-cart-bar__actions input[type="submit"].button_solid.button_graphite.is-added:focus-visible {
  border-color: var(--color-accent);
  color: var(--color-light-1);
}

/* --- Mobile-first purchase rail --- */

.add-to-cart-bar--commerce .add-to-cart-bar__inner {
  display: grid;
  grid-template-areas:
    "product price"
    "glance glance"
    "actions actions";
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
  gap: var(--atc-gap-tight);
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: visible;
  /* Commerce hides ::before top rule; drop the decorative top inset from atcb.css. */
  padding-top: var(--atc-padding-block);
}

.add-to-cart-bar--commerce .add-to-cart-bar__product {
  grid-area: product;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--atc-gap-tight);
  align-items: center;
  width: 100%;
  min-width: 0;
}

.add-to-cart-bar--commerce .add-to-cart-bar__meta {
  display: grid;
  gap: var(--atc-gap-tight);
  min-width: 0;
}

.add-to-cart-bar--commerce .add-to-cart-bar__eyebrow {
  display: block;
}

.add-to-cart-bar--commerce .add-to-cart-bar__price-block {
  grid-area: price;
  display: grid;
  gap: 0.12rem;
  justify-items: end;
  align-self: start;
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
  text-align: right;
}

.add-to-cart-bar--commerce .add-to-cart-bar__price-block > .add-to-cart-bar__label {
  display: block;
  margin: 0;
  font-size: clamp(8px, 0.48rem + 0.12vw, 10px);
  font-family: var(--font-primary);
}

.add-to-cart-bar--commerce .pdp-glance__list {
  grid-area: glance;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  min-width: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--atc-line);
  border-bottom: 1px solid var(--atc-line);
}

.add-to-cart-bar--commerce .pdp-glance__item {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  min-width: 0;
  padding: 0.45rem var(--atc-padding-inline);
}

.add-to-cart-bar--commerce .pdp-glance__icon,
.add-to-cart-bar--commerce .pdp-glance__item > .material-icons {
  display: none;
}

.add-to-cart-bar--commerce .pdp-glance__item + .pdp-glance__item {
  border-left: 1px solid var(--atc-line);
}

.add-to-cart-bar--commerce .pdp-glance__copy {
  display: grid;
  gap: 0.12rem;
  min-width: 0;
}

.add-to-cart-bar--commerce .pdp-glance__label {
  color: var(--atc-muted);
  font-family: var(--font-primary);
  font-size: clamp(8px, 0.48rem + 0.12vw, 10px);
  font-weight: 700;
  letter-spacing: var(--atc-utility-letter-spacing);
  line-height: 1.2;
  text-transform: uppercase;
}

.add-to-cart-bar--commerce .pdp-glance__value {
  overflow: hidden;
  color: var(--atc-ink-strong);
  font-family: var(--font-secondary);
  font-size: clamp(0.82rem, 0.76rem + 0.22vw, 1rem);
  font-weight: 400;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.add-to-cart-bar--commerce .pdp-glance__item:last-child .pdp-glance__copy {
  justify-items: end;
  text-align: right;
}

/* Commerce action retains the native Drupal Commerce form. */
.add-to-cart-bar--commerce .add-to-cart-bar__actions {
  grid-area: actions;
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--atc-gap-tight);
  align-items: stretch;
  min-width: 0;
  max-width: 100%;
}

.add-to-cart-bar--commerce .add-to-cart-bar__field--qty,
.add-to-cart-bar--commerce .add-to-cart-bar__field--select {
  display: none;
}

.add-to-cart-bar--commerce .add-to-cart-bar__actions .form-actions .button,
.add-to-cart-bar--commerce .add-to-cart-bar__actions .form-actions input[type="submit"] {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  height: var(--atc-height);
  min-height: var(--atc-height);
  padding-block: 0;
  line-height: 1.3;
  align-self: end;
}

@media (max-width: 767.98px) {
  /* Block wrappers on mobile so relocated submit inputs retain painted backgrounds. */
  .add-to-cart-bar--commerce .add-to-cart-bar__actions > div,
  .add-to-cart-bar--commerce .add-to-cart-bar__actions > div > div {
    display: block;
    grid-column: 1;
    min-width: 0;
  }

  .add-to-cart-bar--commerce .add-to-cart-bar__actions > form.commerce-order-item-add-to-cart-form,
  .add-to-cart-bar--commerce .add-to-cart-bar__actions form.commerce-order-item-add-to-cart-form {
    display: block;
    grid-column: 1;
    margin: 0;
    min-width: 0;
  }

  .add-to-cart-bar--commerce .add-to-cart-bar__actions .form-actions {
    display: block;
    margin: 0;
    min-width: 0;
  }

}

/* Paired sides: visible under title whenever --has-includes (all breakpoints). */
.add-to-cart-bar--commerce .add-to-cart-bar__caption {
  display: none;
}

.add-to-cart-bar--commerce.add-to-cart-bar--has-includes .add-to-cart-bar__product {
  align-items: start;
}

.add-to-cart-bar--commerce.add-to-cart-bar--has-includes .add-to-cart-bar__meta {
  gap: clamp(0.28rem, 0.55vw, 0.42rem);
  align-content: start;
}

.add-to-cart-bar--commerce.add-to-cart-bar--has-includes .add-to-cart-bar__caption {
  display: flex;
  align-items: baseline;
  gap: 0.3rem;
  margin: clamp(0.28rem, 0.55vw, 0.4rem) 0 0;
  padding-bottom: 0.05rem;
  overflow: hidden;
  white-space: nowrap;
  font-size: clamp(0.68rem, 0.64rem + 0.22vw, 0.82rem);
  line-height: 1.35;
  color: var(--atc-muted);
  font-family: var(--font-primary);
}

.add-to-cart-bar--commerce.add-to-cart-bar--has-includes .add-to-cart-bar__caption .add-to-cart-bar__includes-label {
  display: block;
  flex: 0 0 auto;
  margin: 0;
}

.add-to-cart-bar--commerce.add-to-cart-bar--has-includes .add-to-cart-bar__includes-names {
  min-width: 0;
  overflow: hidden;
  font-weight: 400;
  letter-spacing: normal;
  text-overflow: ellipsis;
  text-transform: none;
}

@media (max-width: 767.98px) {
  .add-to-cart-bar--commerce {
    --atc-height: 2.4rem;
  }
}

.add-to-cart-bar--commerce .add-to-cart-bar__price-block > .add-to-cart-bar__label + .add-to-cart-bar__price-value {
  margin-top: 0.06rem;
}

/* --- Qty + variant select (tablet+ progressive disclosure) --- */
/* Base chrome: atcb.css (.add-to-cart-bar__select-wrap, .add-to-cart-bar__qty, .add-to-cart-bar__select, .add-to-cart-bar__qty-input). */

.add-to-cart-bar--commerce .add-to-cart-bar__field--select .form-item,
.add-to-cart-bar--commerce .add-to-cart-bar__field--qty .form-item,
.add-to-cart-bar--commerce .add-to-cart-bar__field--qty .field--name-quantity,
.add-to-cart-bar--commerce .add-to-cart-bar__field--qty .js-form-wrapper {
  margin: 0;
}

.add-to-cart-bar--commerce .add-to-cart-bar__field--select .form-item label {
  clip: rect(0, 0, 0, 0);
  overflow: hidden;
  position: absolute;
  width: 1px;
  height: 1px;
}

/* --- Tablet+: variant select beside the full-width Commerce action --- */

@media (min-width: 768px) {
  .add-to-cart-bar--commerce {
    --atc-col-cta: clamp(8.4rem, 12vw, 9.6rem);
  }

  .add-to-cart-bar--commerce .add-to-cart-bar__actions > div,
  .add-to-cart-bar--commerce .add-to-cart-bar__actions > div > div,
  .add-to-cart-bar--commerce .add-to-cart-bar__actions > form.commerce-order-item-add-to-cart-form,
  .add-to-cart-bar--commerce .add-to-cart-bar__actions form.commerce-order-item-add-to-cart-form,
  .add-to-cart-bar--commerce .add-to-cart-bar__actions .form-actions {
    display: contents;
    margin: 0;
    min-width: 0;
  }

  .add-to-cart-bar--commerce:not(.add-to-cart-bar--package-customizer):not(.add-to-cart-bar--single-variation) .add-to-cart-bar__actions {
    grid-template-columns:
      minmax(0, var(--atc-col-select))
      minmax(0, 1fr);
    width: 100%;
    max-width: 100%;
  }

  .add-to-cart-bar--commerce:not(.add-to-cart-bar--package-customizer):not(.add-to-cart-bar--single-variation) .add-to-cart-bar__field--select {
    display: grid;
    grid-column: 1;
    min-width: 0;
  }

  .add-to-cart-bar--commerce .add-to-cart-bar__actions .form-actions input[type="submit"] {
    grid-column: 1;
  }

  .add-to-cart-bar--commerce:not(.add-to-cart-bar--package-customizer):not(.add-to-cart-bar--single-variation) .add-to-cart-bar__actions .form-actions input[type="submit"] {
    grid-column: 2;
  }

  .add-to-cart-bar--commerce .add-to-cart-bar__actions .form-actions input[type="submit"] {
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
  }
}

@media (min-width: 1100px) {
  .add-to-cart-bar--commerce {
    --atc-col-cta: clamp(8.8rem, 10vw, 10rem);
  }

}

@media (max-width: 560px) {
  .add-to-cart-bar--commerce {
    --atc-gap: 0.3rem;
    --atc-gap-tight: 0.2rem;
    --atc-padding-inline: 0.4rem;
    --atc-padding-block: 0.35rem;
    --atc-col-select: 4.4rem;
  }

  .add-to-cart-bar--commerce .add-to-cart-bar__title {
    font-size: clamp(0.88rem, 0.78rem + 0.42vw, 1rem);
  }
}

@media (max-width: 420px) {
  .add-to-cart-bar--commerce {
    --atc-offset-x: 8px;
    --atc-gap: 0.22rem;
    --atc-gap-tight: 0.18rem;
    --atc-padding-inline: 0.3rem;
    --atc-col-select: 3.7rem;
  }

  .add-to-cart-bar--commerce .add-to-cart-bar__product {
    gap: 0.2rem;
  }

  .add-to-cart-bar--commerce .add-to-cart-bar__title {
    font-size: 0.82rem;
  }

  .add-to-cart-bar--commerce .add-to-cart-bar__price-value {
    font-size: 0.88rem;
  }
}



/* --- AJAX add-to-cart messages (frontend/add_to_cart_bar) --- */

.page-wrapper__messages .messages {
  opacity: 0;
  transform: translateY(-0.35rem);
  animation-name: atc-popup-fade;
  animation-duration: 4.8s;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
  animation-fill-mode: forwards;
}

.page-wrapper__messages .messages--error {
  animation-duration: 6.8s;
}

@keyframes atc-popup-fade {
  0% {
    opacity: 0;
    transform: translateY(-0.45rem);
  }
  10% {
    opacity: 1;
    transform: translateY(0);
  }
  78% {
    opacity: 1;
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    transform: translateY(-0.25rem);
  }
}