/*
 * thebamboostudio-v1 theme — infinite-loop testimonial carousel.
 * .bb-testimonials/.bb-testi-card come from extension/bamboo/catalog/view/
 * template/module/testimonials.twig (unmodified) via {{ content_bottom }}.
 */
.thebamboostudio-v1 .bb-testimonials-section { --bb-divider-pad: clamp(3.2rem, 6vw, 5.5rem); padding-block: var(--bb-divider-pad); }
.thebamboostudio-v1 .bb-testi-head { text-align: center; }

/* vertical padding keeps the card box-shadow inside the overflow clip; negative margins preserve outer spacing */
.thebamboostudio-v1 .bb-testi-viewport { overflow: hidden; width: 100vw; margin: calc(1.6rem - 2.5rem) calc(50% - 50vw) -2.5rem; padding-block: 2.5rem; }
.thebamboostudio-v1 .bb-testi-track {
  display: flex;
  gap: 1.4rem;
  transition: transform .55s cubic-bezier(.65, 0, .35, 1);
  will-change: transform;
}
.thebamboostudio-v1 .bb-testi-track.jump,
.thebamboostudio-v1 .bb-testi-track.jump .bb-testi-card {
  transition: none;
}

/* Flatten the two wrapper levels between {{ content_bottom }} and the track. */
.thebamboostudio-v1 .bb-content-bottom-slot,
.thebamboostudio-v1 .bb-content-bottom-slot .bb-testimonials {
  display: contents;
}

.thebamboostudio-v1 .bb-testi-card {
  flex: 0 0 min(760px, 82vw);
  background: var(--color-paper);
  border: 1px solid var(--color-border);
  border-radius: 22px;
  padding: clamp(1.7rem, 4vw, 2.4rem);
  box-shadow: var(--shadow-lg);
  text-align: center;
  opacity: .35;
  transform: scale(.9);
  transition: opacity .45s ease, transform .45s ease;
}
.thebamboostudio-v1 .bb-testi-card.active { opacity: 1; transform: scale(1); }
@media (max-width: 640px) { .thebamboostudio-v1 .bb-testi-card { flex: 0 0 88vw; } }

.thebamboostudio-v1 .bb-testi-mark { font-family: var(--font-display); font-size: 2.6rem; color: var(--brand-accent); line-height: 1; }
.thebamboostudio-v1 .bb-testi-quote { font-size: 1.06rem; color: var(--color-text); margin-block: .6rem 1.1rem; }
.thebamboostudio-v1 .bb-testi-name { font-weight: 700; color: var(--color-heading); }
.thebamboostudio-v1 .bb-stars-row { color: var(--brand-warm); margin-bottom: .4rem; letter-spacing: .1em; }
.thebamboostudio-v1 .bb-testi-card .bb-stars-row { font-size: 2em; }

.thebamboostudio-v1 .bb-testi-nav { display: flex; justify-content: center; gap: .8rem; margin-top: 1.4rem; }
.thebamboostudio-v1 .bb-testi-nav button {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid var(--color-border);
  background: var(--color-paper);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.05rem;
}
/* Needs to outrank ".bb-testi-nav button" above (2 classes + 1 type
   beats 2 classes alone) or the "next" button's real background/color
   silently loses to the plain white/border default. */
.thebamboostudio-v1 .bb-testi-nav button.bb-testi-nav-primary { background: var(--brand-primary); color: var(--color-bg); border-color: transparent; }
.thebamboostudio-v1 .bb-testi-dots { display: flex; justify-content: center; gap: .4rem; margin-top: 1rem; }
.thebamboostudio-v1 .bb-testi-dots span { width: 6px; height: 6px; border-radius: 50%; background: var(--color-border); display: block; cursor: pointer; }
.thebamboostudio-v1 .bb-testi-dots span.active { background: var(--brand-accent); }

@media (prefers-reduced-motion: reduce) {
  .thebamboostudio-v1 .bb-testi-track,
  .thebamboostudio-v1 .bb-testi-card { transition: none; }
}