/* ============================================================================
   Forge Core — Reviews component
   Customer review carousel: product page + [forge_reviews] shortcode.
   Tokens only (design-system.css). Markup lives in reviews-frontend.php.
   ============================================================================ */

.forge-rev {
  font-family: var(--forge-font-body);
  margin: var(--forge-space-xl) 0;
}

/* Track — horizontal scroll-snap row */
.forge-rev__track {
  display: flex;
  gap: var(--forge-space-md);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 4px 2px var(--forge-space-md);
}
.forge-rev__track::-webkit-scrollbar { display: none; }

/* Card */
.forge-rev__card {
  flex: 0 0 320px;
  scroll-snap-align: start;
  box-sizing: border-box;
  background: var(--forge-card-bg);
  border: 1px solid var(--forge-border);
  border-radius: var(--forge-card-radius);
  padding: var(--forge-card-padding);
  box-shadow: var(--forge-card-shadow);
  transition: var(--forge-transition);
  display: flex;
  flex-direction: column;
  gap: var(--forge-space-sm);
}
.forge-rev__card:hover { box-shadow: var(--forge-card-shadow-hover); }

/* Head — avatar + name + stars + source badge */
.forge-rev__head {
  display: flex;
  align-items: flex-start;
  gap: var(--forge-space-sm);
}
.forge-rev__avatar {
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--forge-warm-white);
  border: 1px solid var(--forge-border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--forge-font-body);
  font-weight: 600;
  font-size: var(--forge-size-sm);
  color: var(--forge-gold);
  letter-spacing: 0.04em;
}
.forge-rev__id { flex: 1; min-width: 0; }
.forge-rev__name {
  display: block;
  font-family: var(--forge-font-body);
  font-weight: 600;
  font-size: var(--forge-size-sm);
  color: var(--forge-black);
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
a.forge-rev__name:hover { color: var(--forge-gold); }

/* Stars */
.forge-rev__stars {
  display: flex;
  gap: 2px;
  margin-top: 3px;
}
.forge-rev__star { fill: var(--forge-border); }
.forge-rev__star.is-on { fill: var(--forge-gold); }

/* Source badge — placement only; SVG colours handled per-source inside the SVG */
.forge-rev__badge {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}
.forge-rev__badge--google { color: var(--forge-black); }
.forge-rev__badge--amazon { color: #232F3E; } /* word "amazon" needs its brand colour */
.forge-rev__badge--onsite {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: var(--forge-size-xs);
  font-weight: 500;
  color: #34A853; /* verified-green */
}

/* Quote body */
.forge-rev__text {
  font-family: var(--forge-font-body);
  font-style: italic;
  font-size: var(--forge-size-sm);
  line-height: 1.65;
  color: var(--forge-text);
  margin: 0;
}

/* Photos */
.forge-rev__photos {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: var(--forge-space-xs);
}
.forge-rev__photo {
  width: 80px;
  height: 80px;
  object-fit: cover;
  border-radius: 8px;
  display: block;
  flex-shrink: 0;
}

/* Dot indicators */
.forge-rev__dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 7px;
  margin-top: 6px;
}
.forge-rev__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--forge-border);
  cursor: pointer;
  transition: var(--forge-transition);
  display: inline-block;
}
.forge-rev__dot.is-active {
  background: var(--forge-gold);
  width: 18px;
  border-radius: 4px;
}

/* Mobile — wider cards so one fits per snap stop */
@media (max-width: 600px) {
  .forge-rev__card { flex: 0 0 85vw; }
}