.tm-main:has(#cacao-passport.cp-live) { padding-top: clamp(14px, 2.4vw, 34px); }

@media (min-width: 1280px) {
  #tm-main > .uk-container:has(> #RadicalMart.product > #cacao-passport.cp-live) {
    max-width: 1504px;
  }

  /* Extend the section surface while keeping content on the product grid. */
  #RadicalMart.product > :is(.cp-live-origin, .cp-live-composition, .cp-cup-course) {
    position: relative;
    isolation: isolate;
  }

  #RadicalMart.product > :is(.cp-live-origin, .cp-live-composition, .cp-cup-course)::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background: inherit;
    box-shadow: 0 0 0 100vmax var(--cp-section-edge);
    clip-path: inset(0 -100vmax);
    pointer-events: none;
  }

  .cp-live-origin { --cp-section-edge: var(--origin-surface); }
  .cp-live-composition { --cp-section-edge: #f6ecd7; }
  .cp-cup-course { --cp-section-edge: #321509; }
}

.cp-live .cacao-restock-entry--detail {
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: start;
  gap: 14px;
  margin: 18px 0 0;
  padding: clamp(14px, 2vw, 24px);
  border-color: var(--cp-line, #dfcbb3);
  border-radius: 6px;
  background: var(--cp-cream, #faf4e8);
  box-shadow: none;
  color: var(--cp-ink, #592203);
}
.cp-live .cacao-restock-entry__icon {
  width: 38px;
  height: 38px;
  border-radius: 4px;
  background: #f0e3ca;
  color: var(--cp-copper, #993800);
}
.cp-live .cacao-restock-entry__icon svg { width: 21px; height: 21px; }
.cp-live .cacao-restock-entry__copy { gap: 6px; }
.cp-live .cacao-restock-entry__eyebrow {
  color: var(--cp-copper, #993800);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}
.cp-live .cacao-restock-entry__copy strong {
  color: inherit;
  font: 400 clamp(1.2rem, 2vw, 1.55rem)/1.22 "Lora", Georgia, serif;
}
.cp-live .cacao-restock-entry__copy > span:not(.cacao-restock-entry__eyebrow):not(.cacao-restock-date) {
  color: var(--cp-muted, #805d49);
  line-height: 1.55;
}
.cp-live .cacao-restock-entry--detail .cacao-restock-button {
  grid-column: 2;
  justify-self: start;
  min-height: 48px;
  padding-inline: 16px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: var(--cp-amber, #f1be53);
  box-shadow: none;
  color: var(--cp-ink, #592203);
  font-weight: 600;
  letter-spacing: 0;
  transform: none;
}
.cp-live .cacao-restock-entry--detail .cacao-restock-button:is(:hover, :focus-visible) {
  border-color: var(--cp-copper, #993800);
  background: #ffd47f;
}
.cp-live .cacao-restock-entry--detail .cacao-restock-button:focus-visible { outline: 2px solid var(--cp-copper, #993800); }
@media (max-width: 600px) {
  .cp-live .cacao-restock-entry--detail .cacao-restock-button { grid-column: 1 / -1; justify-self: stretch; }
}

#cacao-passport.cp-live .cp-product {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
  grid-template-rows: auto 1fr;
  align-items: start;
  gap: 16px clamp(24px, 4.5vw, 68px);
  padding-block: clamp(12px, 2vw, 24px) clamp(28px, 5vw, 68px);
}

#cacao-passport.cp-live .cp-live-eyebrow {
  margin-bottom: 10px;
  color: var(--cp-copper);
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .06em;
}

#cacao-passport.cp-live h1 {
  font-size: clamp(2rem, 3.65vw, 3.625rem);
  text-wrap: pretty;
  overflow-wrap: anywhere;
}

#cacao-passport.cp-live .cp-gallery > div { width: 100%; }
.cp-role-gallery { min-width: 0; container-type: inline-size; }
.cp-role-gallery-stage { position: relative; }
.cp-role-gallery figure { margin: 0; }
.cp-role-gallery-open {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  border-radius: 6px;
  background: var(--cp-cream);
}
.cp-role-gallery-open > img {
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: cover;
}
.cp-role-gallery-action {
  position: absolute;
  right: 12px;
  bottom: 12px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding-inline: 12px;
  border-radius: 4px;
  background: var(--cp-paper);
  color: var(--cp-ink);
  font-size: .78rem;
}
.cp-role-gallery-open:hover .cp-role-gallery-action { background: var(--cp-amber); }
.cp-role-gallery figcaption { margin-top: 10px; color: var(--cp-muted); font-size: .78rem; line-height: 1.5; }
.cp-role-gallery-tabs {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  gap: 10px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}
.cp-role-gallery-tabs-scroll {
  --cp-gallery-gap: 10px;
  grid-auto-columns: calc((100% - 2 * var(--cp-gallery-gap)) / 3);
  gap: var(--cp-gallery-gap);
  margin-top: 8px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.cp-role-gallery-tabs-scroll::-webkit-scrollbar { display: none; }
.cp-role-gallery-tabs-scroll > li { scroll-snap-align: start; min-width: 0; }
.cp-role-gallery-tabs button {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  height: 100%;
  min-height: 68px;
  padding: 8px;
  border: 1px solid var(--cp-line);
  border-radius: 6px;
  background: var(--cp-cream);
  color: var(--cp-ink);
  font: inherit;
  font-size: .81rem;
  text-align: left;
  cursor: pointer;
}
.cp-role-gallery-tabs img { flex: 0 0 auto; width: 64px; height: 48px; object-fit: cover; border-radius: 3px; }
.cp-role-gallery-tabs button:hover,
.cp-role-gallery-tabs .uk-active button { border-color: var(--cp-copper); }
.cp-role-gallery-tabs .uk-active button { background: var(--cp-sand, #efe3cb); box-shadow: inset 0 -2px var(--cp-copper); }
.cp-role-gallery-tabs small { margin-inline-start: 2px; color: var(--cp-muted); font-size: .7em; }
.cp-role-gallery-bar {
  margin-top: 12px;
  color: var(--cp-muted);
  font-size: .81rem;
}
.cp-role-gallery-count { margin-inline-start: 4px; color: var(--cp-copper); font-variant-numeric: tabular-nums; }
.cp-role-gallery-controls {
  position: absolute;
  inset: 0 0 auto;
  aspect-ratio: 4 / 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-inline: 12px;
  pointer-events: none;
}
.cp-role-gallery-controls button {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--cp-line);
  border-radius: 50%;
  background: var(--cp-paper);
  color: var(--cp-ink);
  box-shadow: 0 2px 10px rgb(47 22 10 / 24%);
  pointer-events: auto;
  cursor: pointer;
}
.cp-role-gallery-controls button:hover { background: var(--cp-sand, #efe3cb); border-color: var(--cp-copper); }
.cp-role-gallery :is(a, button):focus-visible { outline: 2px solid var(--cp-copper); outline-offset: 2px; }
.cp-role-gallery-tabs-scroll button:focus-visible { outline-offset: -3px; }
@container (max-width: 510px) {
  .cp-role-gallery-controls { padding-inline: 8px; }
  .cp-role-gallery-tabs { gap: 8px; margin-top: 14px; }
  .cp-role-gallery-tabs-scroll { --cp-gallery-gap: 8px; margin-top: 8px; }
  .cp-role-gallery-tabs button { flex-direction: column; gap: 6px; padding: 6px; font-size: .75rem; text-align: center; }
  .cp-role-gallery-tabs img { width: 100%; height: 46px; }
}
#cacao-passport.cp-live .cp-gallery hr:last-child { display: none; }
#cacao-passport.cp-live .uk-slideshow-items {
  min-height: 0 !important;
  max-height: none !important;
  height: auto !important;
  aspect-ratio: 1.24 !important;
  border-radius: 6px;
  background: var(--cp-cream);
}

#cacao-passport.cp-live .uk-thumbnav {
  flex-wrap: nowrap;
  gap: 8px;
  margin-left: 0;
  padding: 4px 4px 9px;
  overflow-x: auto;
}

#cacao-passport.cp-live .uk-thumbnav > li { flex: 0 0 58px; padding: 0; }
#cacao-passport.cp-live .uk-thumbnav img { width: 58px; height: 46px; object-fit: cover; border-radius: 3px; }
#cacao-passport.cp-live .uk-thumbnav .uk-active > a { outline: 2px solid var(--cp-copper); outline-offset: 2px; border-radius: 3px; }

#cacao-passport.cp-live .cp-product-details { margin-top: 0; }
#cacao-passport.cp-live .cp-live-intro { font-size: .94rem; }

#cacao-passport.cp-live .cp-purchase {
  border: 1px solid var(--cp-line);
  border-radius: 6px;
  padding: clamp(13px, 2vw, 22px);
  margin-top: 18px;
  background: var(--cp-cream);
}

#cacao-passport.cp-live .cp-live-packs-label { margin-bottom: 7px; font-size: .81rem; }
#cacao-passport.cp-live .cp-live-packs { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 70px), 1fr)); gap: 7px; }
#cacao-passport.cp-live .cp-live-pack {
  display: grid;
  place-content: center;
  min-height: 53px;
  border: 1px solid var(--cp-line);
  border-radius: 4px;
  padding: 4px;
  background: var(--cp-paper);
  text-align: center;
  font-size: .86rem;
  line-height: 1.35;
}

#cacao-passport.cp-live .cp-live-pack small { color: var(--cp-copper); font-size: .71rem; }
#cacao-passport.cp-live .cp-live-pack:hover { border-color: var(--cp-copper); }
#cacao-passport.cp-live .cp-live-pack[aria-current] { color: var(--cp-paper); background: var(--cp-ink); border-color: var(--cp-ink); }
#cacao-passport.cp-live .cp-live-pack[aria-current] small { color: var(--cp-amber); }

#cacao-passport.cp-live .cp-purchase > .uk-tile { padding: 0; margin: 0 !important; background: transparent; }
#cacao-passport.cp-live .cp-purchase > .uk-tile > .uk-margin:not([radicalmart-cart]) { margin-block: 12px !important; }
#cacao-passport.cp-live .cp-purchase > .uk-tile > .uk-margin:not([radicalmart-cart]) :is(h6, .uk-text-large) {
  margin-block: 0 !important;
  font-size: .82rem;
  text-transform: none;
  letter-spacing: normal;
}
#cacao-passport.cp-live .cp-purchase > .uk-tile > .uk-margin:not([radicalmart-cart]) img { max-width: 30px; }
#cacao-passport.cp-live [radicalmart-cart="product"] {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 11px;
  margin: 13px 0 0 !important;
}

#cacao-passport.cp-live [radicalmart-cart="product"] > div { min-width: 0; padding: 0; margin: 0; }
#cacao-passport.cp-live [radicalmart-cart="product"] > div:has([radicalmart-cart="add"]) { grid-column: 1 / -1; }
#cacao-passport.cp-live .price strong { font: 400 clamp(1.625rem, 2.5vw, 2.375rem)/1.15 'Lora', serif; }
#cacao-passport.cp-live [radicalmart-cart="quantity"] { width: 2.7rem; height: 42px; padding: 0; background: var(--cp-paper); }
#cacao-passport.cp-live :is([radicalmart-cart="quantity_minus"], [radicalmart-cart="quantity_plus"]) { display: inline-grid; place-items: center; min-width: 34px; min-height: 44px; margin: 0 !important; color: var(--cp-ink); }
#cacao-passport.cp-live [radicalmart-cart="add"] { width: 100%; min-height: 48px; border: 0; border-radius: 4px; background: var(--cp-amber); color: var(--cp-deep); font-size: .9rem; font-weight: 600; text-transform: none; }
#cacao-passport.cp-live [radicalmart-cart="add"]:hover { background: #e7aa37; }
#cacao-passport.cp-live .cp-purchase .cacao-ycp-product-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
#cacao-passport.cp-live .cp-purchase .cacao-ycp-button[data-cacao-ycp-kind="product"] {
  --yakit-button-bg-color: var(--cp-ink, #592203);
  --yakit-button-hover-bg: var(--cp-copper, #993800);
  --yakit-button-border-radius: 4px;
  width: 100%;
  min-height: 48px;
  padding-inline: 10px;
  color: var(--cp-paper, #fffaf1);
  box-shadow: none;
  font-size: .9rem;
}
#cacao-passport.cp-live .cp-purchase .cacao-ycp-button:focus-visible {
  outline: 2px solid var(--cp-copper, #993800);
  outline-offset: 3px;
}
@media (max-width: 639px) {
  #cacao-passport.cp-live .cp-purchase .cacao-ycp-product-actions { grid-template-columns: minmax(0, 1fr); }
}


@media (max-width: 767px) {
  #cacao-passport.cp-live .cp-product { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; }
  #cacao-passport.cp-live :is(.cp-title-group, .cp-gallery, .cp-product-details) { grid-column: 1; grid-row: auto; }
  #cacao-passport.cp-live .cp-gallery { margin-top: 0; }
  #cacao-passport.cp-live .uk-slideshow-items { aspect-ratio: 1.32 !important; }
  #cacao-passport.cp-live .cp-gallery .uk-thumbnav { margin-bottom: 0 !important; }
}