.cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item {
  width: 100%;
}

.cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item__media {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background: var(--kombos-gray-100);
}

.cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item__video, .cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Tap the clip to play/pause; the play badge sits on top but lets the tap
   through to the video underneath. */
.cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item__video {
  cursor: pointer;
}

.cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item__play-badge {
  pointer-events: none;
}

.cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item__placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--kombos-gray-300);
  font-size: 3rem;
}

.cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item__play-badge {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  background: rgba(20, 20, 26, 0.5);
  color: var(--kombos-white);
  font-size: 1rem;
  pointer-events: none;
}

/* Product chip on every breakpoint — on mobile too, so shoppers can jump
   from a clip to the product. Slightly tighter on small screens. */
.cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item__product-chip {
  position: absolute;
  left: 0.5rem;
  bottom: 0.5rem;
  right: 0.5rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--kombos-white);
  padding: 0.375rem 0.5rem;
  text-decoration: none;
  max-width: 15rem;
}

@media (min-width: 1024px) {
  .cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item__product-chip {
    left: 0.75rem;
    bottom: 0.75rem;
    right: 0.75rem;
    gap: 0.625rem;
    padding: 0.5rem 0.75rem;
  }
}

.cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item__product-img {
  width: 2.25rem;
  height: 2.25rem;
  object-fit: cover;
  flex-shrink: 0;
}

.cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item__product-info {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  min-width: 0;
}

.cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item__product-name {
  color: var(--kombos-gray-700);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cc_Ipc5W68kmf_6EjDvHm0St .kombos-ugc-item__product-cta {
  color: var(--kombos-brand-bordo);
  text-decoration: underline;
  /* Without this, a narrow chip (mobile) wraps this text — with min-width:0
     on its flex parent, it wraps character-by-character instead of at word
     boundaries. Truncate with an ellipsis instead. */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
