/**
 * PDP Reviews — override visual
 *
 * Alinea la sección de comentarios con las demás secciones del PDP y el
 * design system de Vini (DESIGN.md). Carga después de `product-reviews.css`.
 * El formulario queda siempre visible (no colapsado).
 */

/* El contenedor de reviews vive dentro de .related-wrapper */
.related-wrapper {
	background-color: transparent !important;
}

.product-reviews-container.product-details-wrapper {
	max-width: none;
	margin: 0;
	padding: 40px 2.77% 56px !important;
	font-family: "Plus Jakarta Sans", "Helvetica Neue", Arial, sans-serif;
}

.reviews-title {
	margin: 0 0 24px;
	padding-left: 0;
	font-family: "Plus Jakarta Sans", "Helvetica Neue", Arial, sans-serif;
	font-size: 2rem;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0;
	color: #1c1c1e;
}

.reviews-summary {
	grid-template-columns: 33% 1fr;
	gap: 40px;
}

/* Columna izquierda */
.reviews-average {
	position: static;
	padding: 0;
}

.average-star-header {
	align-items: center;
	gap: 12px;
	margin-bottom: 8px;
}

.average-number {
	font-family: "Plus Jakarta Sans", "Helvetica Neue", Arial, sans-serif;
	font-size: 1.75rem;
	font-weight: 500;
	line-height: 1.2;
	color: #1c1c1e;
}

.reviews-count {
	margin: 0;
	font-size: 0.95rem;
	color: #6b7280;
}

.reviews-distribution {
	gap: 10px;
	margin-top: 24px;
}

.distribution-row {
	grid-template-columns: 48px 1fr;
	gap: 12px;
}

.rating-number {
	font-size: 0.9rem;
	color: #1c1c1e;
}

.star-icon {
	color: #1c1c1e;
}

.rating-bar {
	height: 6px;
	background-color: #efece8;
	border-radius: 999px;
}

.rating-bar-fill {
	background-color: #e8562d;
	border-radius: 999px;
}

/* Columna derecha / lista */
.reviews-filter-active {
	margin-bottom: 16px;
	padding: 0;
	background-color: transparent;
}

.reviews-filter-active p {
	display: flex;
	align-items: center;
	gap: 8px;
	color: #6b7280;
}

.filter-badge {
	background-color: #fff;
	border: 1px solid #e8562d;
	color: #e8562d;
	border-radius: 999px;
	padding: 4px 12px;
	font-size: 0.85rem;
}

.reviews-list {
	padding: 0;
}

.review-item {
	padding: 24px 0;
	border-bottom: 1px solid #e7e2db;
}

.review-item:first-child {
	padding-top: 0;
}

.review-item:last-child {
	border-bottom: 0;
}

.author-avatar {
	width: 48px;
	height: 48px;
	background-color: #efece8;
	color: #6b7280;
	font-weight: 600;
}

.author-name-row {
	display: flex;
	align-items: center;
	gap: 8px;
}

.author-info strong {
	font-size: 1rem;
	font-weight: 600;
	color: #1c1c1e;
}

.verified-label {
	font-size: 0.85rem;
	font-weight: 400;
	color: #6b7280;
}

.review-date {
	font-size: 0.85rem;
	color: #6b7280;
}

.review-rating {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
}

.review-rating strong {
	display: inline;
	margin-top: 0;
	font-size: 1rem;
	font-weight: 600;
	color: #1c1c1e;
}

.review-content {
	color: #1c1c1e;
	font-size: 1rem;
	line-height: 1.6;
}

.no-reviews {
	color: #6b7280;
}

/* Formulario (siempre visible) */
.add-review-section {
	margin-top: 24px;
	margin-bottom: 40px;
	padding: 24px;
	background-color: #fff;
	border: 0;
	border-radius: 8px;
}

.review-form-wrapper,
.review-form-wrapper.expanded {
	max-height: none;
	overflow: visible;
	opacity: 1;
	margin-top: 0;
}

.review-form-title {
	margin: 0 0 8px;
	font-family: "Plus Jakarta Sans", "Helvetica Neue", Arial, sans-serif;
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 1.3;
	color: #1c1c1e;
}

.review-notice {
	margin: 0 0 24px;
	font-size: 0.875rem;
	color: #6b7280;
}

.form-group {
	margin-bottom: 24px;
}

.form-group label {
	font-size: 0.875rem;
	font-weight: 500;
	color: #1c1c1e;
}

.review-form input[type="text"],
.review-form input[type="email"],
.review-form textarea {
	padding: 12px 16px;
	border: 1px solid #e7e2db;
	border-radius: 8px;
	font-family: "Plus Jakarta Sans", "Helvetica Neue", Arial, sans-serif;
	font-size: 0.9375rem;
	color: #1c1c1e;
	background-color: #fff;
}

.review-form input[type="text"]:focus,
.review-form input[type="email"]:focus,
.review-form textarea:focus {
	border-color: #e8562d;
	box-shadow: 0 0 0 3px rgba(232, 86, 45, 0.12);
}

.review-form input::placeholder,
.review-form textarea::placeholder {
	color: #9aa1ac;
}

.submit-review-btn {
	padding: 12px 32px;
	background-color: #f2f4f7;
	color: #667085;
	border: 0;
	border-radius: 999px;
	font-family: "Plus Jakarta Sans", "Helvetica Neue", Arial, sans-serif;
	font-size: 0.9375rem;
	font-weight: 500;
}

.submit-review-btn:hover {
	background-color: #e9eaec;
}

@media (max-width: 992px) {
	.product-reviews-container.product-details-wrapper {
		padding: 32px 12px 40px;
	}

	.reviews-summary {
		grid-template-columns: 1fr;
		gap: 32px;
	}
}