/* =========================================================
   LeanCommerce — product-reviews.css
   Carrossel de avaliações (nome, texto e foto) na página de produto.
   Carregado só em is_product() — ver functions.php.
   ========================================================= */

.product-reviews{
	margin:3rem 0;
}
.product-reviews .section-head{
	margin-bottom:1.4rem;
}
.product-reviews .section-head h2{
	font-family:var(--font-display);
	font-size:clamp(1.6rem,4vw,2.2rem);
	text-transform:uppercase;
	letter-spacing:.02em;
	margin:0;
}

.reviews-carousel{
	position:relative;
}
.reviews-carousel-track{
	display:flex;
	gap:1.2rem;
	overflow-x:auto;
	scroll-snap-type:x mandatory;
	-webkit-overflow-scrolling:touch;
	padding-bottom:.4rem;
	scrollbar-width:none;
}
.reviews-carousel-track::-webkit-scrollbar{
	display:none;
}

.review-card{
	flex:0 0 min(360px,86vw);
	scroll-snap-align:start;
	background:var(--bg);
	border:2px solid var(--line-strong);
	box-shadow:var(--shadow-card);
	padding:1.2rem;
	display:flex;
	flex-direction:column;
	gap:.8rem;
}
.review-card-stars{
	color:var(--brand);
	font-size:1rem;
	letter-spacing:.15em;
	line-height:1;
}
.review-card-photo{
	width:100%;
	aspect-ratio:4/3;
	object-fit:cover;
	border:2px solid var(--line-strong);
	display:block;
}
.review-card-text{
	margin:0;
	font-size:.98rem;
	line-height:1.55;
	color:var(--ink-soft);
}
.review-card-author{
	font-family:var(--font-display);
	text-transform:uppercase;
	letter-spacing:.05em;
	font-size:.92rem;
	color:var(--stone);
}

.reviews-carousel-nav{
	display:flex;
	align-items:center;
	gap:.6rem;
	margin-top:1rem;
}
.reviews-carousel-arrow{
	width:40px;
	height:40px;
	border:2px solid var(--line-strong);
	background:#fff;
	display:grid;
	place-items:center;
	font-family:var(--font-display);
	font-size:1.2rem;
	line-height:1;
	transition:background .15s var(--ease);
}
.reviews-carousel-arrow:hover{
	background:var(--brand);
}
.reviews-carousel-dots{
	display:flex;
	align-items:center;
	gap:.5rem;
	margin-left:.4rem;
}
.reviews-carousel-dot{
	width:9px;
	height:9px;
	border-radius:50%;
	padding:0;
	background:var(--line);
	border:1.5px solid var(--line-strong);
}
.reviews-carousel-dot.is-active{
	background:var(--cta);
}

@media (max-width:480px){
	.review-card{
		flex-basis:88vw;
		padding:1rem;
	}
	.reviews-carousel-arrow{
		width:36px;
		height:36px;
	}
}