.cc_nbby5ts8_dF1O5yGaPV .ea-pl {
  width: 100%;
  font-family: var(--ea-font-sans);
  padding: var(--ea-pl-py, 64px) 0;
}
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__inner {
  max-width: var(--ea-container-max);
  margin: 0 auto;
  padding: 0 var(--ea-container-pad);
}
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__head-text { display: grid; gap: 6px; }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__title {
  font-family: var(--ea-font-sans);
  font-size: var(--ea-fs-2xl);
  font-weight: 600;
  margin: 0;
  color: var(--ea-pl-title, #1a1814);
  letter-spacing: -0.01em;
}
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__subtitle {
  font-size: var(--ea-fs-md);
  color: var(--ea-pl-sub, #6b6660);
  margin: 0;
}
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__head-actions { display: inline-flex; align-items: center; gap: 12px; }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__nav { display: inline-flex; gap: 4px; }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__nav-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--ea-color-border);
  background: #fff;
  color: var(--ea-color-text);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: border-color var(--ea-trans-base), background var(--ea-trans-base);
}
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__nav-btn:hover { border-color: var(--ea-color-text); background: var(--ea-color-surface); }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__view-all {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: var(--ea-fs-sm);
  font-weight: 600;
  color: var(--ea-color-text);
  text-decoration: none;
  padding: 8px 4px;
  border-bottom: 1px solid transparent;
  transition: border-color var(--ea-trans-base), color var(--ea-trans-base);
}
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__view-all:hover { border-color: var(--ea-color-text); color: var(--ea-color-accent); }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__view-all i { font-size: 11px; transition: transform var(--ea-trans-base); }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__view-all:hover i { transform: translateX(3px); }

.cc_nbby5ts8_dF1O5yGaPV .ea-pl__empty {
  padding: 64px 16px;
  text-align: center;
  color: var(--ea-color-text-muted);
  font-size: var(--ea-fs-base);
}

/* Wrap holds the carousel viewport + arrow buttons. The wrap itself stays
   overflow:visible so arrows can sit OUTSIDE the visible card strip without
   getting clipped. The inner viewport handles the actual mask. */
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__wrap { position: relative; }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__viewport { position: relative; container-type: inline-size; }
.ea-pl__viewport:has(.ea-pl__track--slider-d),
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__viewport:has(.ea-pl__track--slider-m) { overflow: hidden; }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__track {
  display: grid;
  grid-template-columns: repeat(var(--ea-pl-cols-d, 4), minmax(0, 1fr));
  gap: var(--ea-pl-gap, 16px);
  align-items: stretch;
}

/* Carousel arrows — base look/position (consumes the --ea-arr-* vars set
   inline). Without this the buttons render unstyled in normal flow (the same
   bug fixed on the ProductDetail related carousel). */
.cc_nbby5ts8_dF1O5yGaPV .ea-arr {
  position: absolute;
  top: calc(50% - var(--ea-arr-size, 40px) / 2);
  width: var(--ea-arr-size, 40px);
  height: var(--ea-arr-size, 40px);
  border-radius: var(--ea-arr-radius, 999px);
  border: 0;
  background: var(--ea-arr-bg, #ffffff);
  color: var(--ea-arr-color, #1a1814);
  box-shadow: var(--ea-arr-shadow, 0 4px 14px rgba(20, 18, 14, 0.18));
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 4;
  transition: background var(--ea-trans-base), color var(--ea-trans-base), opacity var(--ea-trans-base), transform var(--ea-trans-base);
}
.cc_nbby5ts8_dF1O5yGaPV .ea-arr i { font-size: calc(var(--ea-arr-size, 40px) * 0.35); line-height: 1; }
.cc_nbby5ts8_dF1O5yGaPV .ea-arr:hover:not(:disabled) {
  background: var(--ea-arr-hbg, #1a1814);
  color: var(--ea-arr-hcolor, #ffffff);
}
.cc_nbby5ts8_dF1O5yGaPV .ea-arr:disabled { opacity: 0; pointer-events: none; }
/* Inside the carousel by default. */
.cc_nbby5ts8_dF1O5yGaPV .ea-arr--prev { left: var(--ea-arr-offset, 14px); }
.cc_nbby5ts8_dF1O5yGaPV .ea-arr--next { right: var(--ea-arr-offset, 14px); }
/* Outside anchor — arrows escape the viewport edges (wrap is not clipped). */
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__wrap--arr-anchor-outside .ea-arr--prev {
  left: calc(-1 * var(--ea-arr-size, 40px) - var(--ea-arr-offset, 14px));
}
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__wrap--arr-anchor-outside .ea-arr--next {
  right: calc(-1 * var(--ea-arr-size, 40px) - var(--ea-arr-offset, 14px));
}
/* Narrow viewports: fall back to inside so arrows never overflow the page. */
@media (max-width: 1280px) {
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__wrap--arr-anchor-outside .ea-arr--prev { left: var(--ea-arr-offset, 14px); }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__wrap--arr-anchor-outside .ea-arr--next { right: var(--ea-arr-offset, 14px); }
}

/* Arrow visibility modes — shared with CategoryBoxes pattern */
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__wrap--arr-none .ea-arr { display: none; }
@media (max-width: 768px) {
  .ea-pl__wrap--arr-hover .ea-arr,
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__wrap--arr-desktop .ea-arr { display: none; }
}
@media (min-width: 769px) {
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__wrap--arr-mobile .ea-arr { display: none; }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__wrap--arr-hover .ea-arr { opacity: 0; }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__wrap--arr-hover:hover .ea-arr:not(:disabled) { opacity: 1; }
}
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__item {
  display: flex;
  min-width: 0;
  height: 100%;
}
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__item > * { width: 100%; height: 100%; }

/* Arrow-only carousel: transform-driven, no native scroll, no drag. */
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__track--slider-d {
  display: flex !important;
  grid-template-columns: none !important;
  flex-wrap: nowrap;
  align-items: stretch;
  overflow: visible;
  gap: var(--ea-pl-gap, 16px);
}
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__track--slider-d .ea-pl__item {
  flex: 0 0 calc((100cqi - (var(--ea-pl-cols-d, 4) - 1) * var(--ea-pl-gap, 16px)) / var(--ea-pl-cols-d, 4));
  width: calc((100cqi - (var(--ea-pl-cols-d, 4) - 1) * var(--ea-pl-gap, 16px)) / var(--ea-pl-cols-d, 4));
  min-width: 0;
}

@media (max-width: 1024px) {
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__track:not(.ea-pl__track--slider-d):not(.ea-pl__track--slider-m) {
    grid-template-columns: repeat(var(--ea-pl-cols-t, 3), minmax(0, 1fr));
  }
}
@media (max-width: 768px) {
.cc_nbby5ts8_dF1O5yGaPV .ea-pl { padding: 40px 0; }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__inner { padding: 0 var(--ea-container-pad-mobile); }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__title { font-size: var(--ea-fs-xl); }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__subtitle { font-size: var(--ea-fs-sm); }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__track:not(.ea-pl__track--slider-m) {
    display: grid;
    grid-template-columns: repeat(var(--ea-pl-cols-m, 2), minmax(0, 1fr));
    gap: 10px;
  }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__track--slider-m {
    display: flex !important;
    grid-template-columns: none !important;
    flex-wrap: nowrap;
    align-items: stretch;
    overflow: visible;
    gap: 10px;
  }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__track--slider-m .ea-pl__item {
    flex: 0 0 calc((100cqi - (var(--ea-pl-cols-m, 2) - 1) * 10px) / var(--ea-pl-cols-m, 2));
    width: calc((100cqi - (var(--ea-pl-cols-m, 2) - 1) * 10px) / var(--ea-pl-cols-m, 2));
    min-width: 0;
    height: auto;
  }
.cc_nbby5ts8_dF1O5yGaPV .ea-pl__nav { display: none; }
}
