/* =========================================================
   VSIM Product Reviews 2.0
   Розширення штатної comment_form / comments list
   ========================================================= */

.vsim-review-rating-box{
	margin:0 0 16px;
	padding:14px;
	border:1px solid #dfe4ea;
	border-radius:6px;
	background:#f8f9fb;
}

.vsim-review-rating-intro{
	display:flex;
	align-items:baseline;
	justify-content:space-between;
	gap:12px;
	flex-wrap:wrap;
	margin-bottom:12px;
}

.vsim-review-rating-intro strong{
	font-size:16px;
}

.vsim-review-rating-intro span{
	font-size:12px;
	color:#777;
}

.vsim-review-rating-row{
	display:grid;
	grid-template-columns:minmax(180px,1fr) auto;
	align-items:center;
	gap:12px;
	padding:8px 0;
	border-bottom:1px dashed #dde2e7;
}

.vsim-review-rating-row:last-of-type{
	border-bottom:0;
}

.vsim-review-rating-label{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:8px;
	font-weight:600;
	font-size:14px;
}

.vsim-review-rating-number{
	color:#777;
	white-space:nowrap;
}

.vsim-review-stars-input{
	display:flex;
	gap:1px;
}

.vsim-review-star-btn{
	appearance:none;
	border:0 !important;
	background:transparent !important;
	box-shadow:none !important;
	margin:0 !important;
	padding:0 2px !important;
	font-size:27px;
	line-height:1;
	color:#c9cdd2;
	cursor:pointer;
}

.vsim-review-star-btn:hover,
.vsim-review-star-btn.is-active{
	color:#f5a623;
}

.vsim-review-total-preview{
	display:flex;
	align-items:center;
	gap:8px;
	margin-top:12px;
	font-size:14px;
}

.vsim-review-total-number{
	font-size:18px;
}

.vsim-review-verified-note,
.vsim-review-verified{
	display:inline-flex;
	align-items:center;
	width:max-content;
	padding:2px 7px;
	border-radius:999px;
	background:#eaf6ed;
	color:#2d7d3e;
	font-size:11px;
	font-weight:600;
}

.vsim-review-verified-note{
	margin-top:9px;
}

.vsim-review-form-notice{
	margin:0 0 14px;
	padding:9px 11px;
	border:1px solid #e0e4e8;
	border-radius:5px;
	background:#f8f9fb;
	font-size:13px;
	line-height:1.5;
}

/* static stars */
.vsim-reviews-stars{
	position:relative;
	display:inline-block;
	font-size:22px;
	line-height:1;
	letter-spacing:1px;
	white-space:nowrap;
	vertical-align:middle;
}

.vsim-reviews-stars--small{
	font-size:16px;
}

.vsim-reviews-stars-bg{
	color:#d8d8d8;
}

.vsim-reviews-stars-fill{
	position:absolute;
	left:0;
	top:0;
	overflow:hidden;
	color:#f5a623;
	white-space:nowrap;
}

/* rating inside an existing top-level comment */
.vsim-review-meta{
	margin:0 0 12px;
	padding:10px 12px;
	border:1px solid #e2e6ea;
	border-radius:5px;
	background:#fafbfc;
}

.vsim-review-meta-main{
	display:flex;
	align-items:center;
	gap:7px;
	flex-wrap:wrap;
}

.vsim-review-meta-criteria{
	display:flex;
	gap:7px 16px;
	flex-wrap:wrap;
	margin-top:7px;
	font-size:12px;
	color:#666;
}

/* aggregate summary: still inside native comments section */
.vsim-reviews-summary{
	display:flex;
	align-items:center;
	gap:22px;
	margin:0 0 18px;
	padding:13px 14px;
	border:1px solid #dfe4ea;
	border-radius:6px;
	background:#f8f9fb;
}

.vsim-reviews-summary-rating{
	display:flex;
	align-items:center;
	gap:7px;
	flex-wrap:wrap;
}

.vsim-reviews-summary-rating > strong{
	font-size:24px;
}

.vsim-reviews-summary-rating > span:last-child{
	font-size:12px;
	color:#777;
}

.vsim-reviews-summary-criteria{
	display:flex;
	gap:6px 16px;
	flex-wrap:wrap;
	font-size:12px;
	color:#666;
}

.vsim-product-rating-shortcode{
	display:inline-flex;
	align-items:center;
	gap:5px;
}

/* dark mode */
html.dark-mode .vsim-review-rating-box,
html.dark-mode .vsim-review-form-notice,
html.dark-mode .vsim-review-meta,
html.dark-mode .vsim-reviews-summary{
	background:#292929;
	border-color:#444;
}

html.dark-mode .vsim-review-rating-row{
	border-color:#444;
}

html.dark-mode .vsim-review-rating-intro span,
html.dark-mode .vsim-review-rating-number,
html.dark-mode .vsim-review-meta-criteria,
html.dark-mode .vsim-reviews-summary-criteria,
html.dark-mode .vsim-reviews-summary-rating > span:last-child{
	color:#aaa;
}

@media (max-width:680px){
	.vsim-review-rating-row{
		grid-template-columns:1fr;
		gap:6px;
	}

	.vsim-reviews-summary{
		align-items:flex-start;
		flex-direction:column;
		gap:9px;
	}
}