/* Review Breakdown -- front-end review box. LTR (default) styles; see
   review-breakdown-rtl.css for the mirrored version WordPress swaps in
   automatically for RTL locales/text direction. */

.rvbd-review-box {
	margin: 24px 0;
	padding: 20px 24px;
	border: 1px solid #e2e2e2;
	border-radius: 6px;
	background: #fafafa;
}

.rvbd-review-overall {
	display: flex;
	align-items: baseline;
	gap: 12px;
	margin-bottom: 16px;
}

.rvbd-review-template-label {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #777;
}

/* Stars */
.rvbd-stars {
	position: relative;
	display: inline-block;
	font-size: 26px;
	line-height: 1;
	letter-spacing: 3px;
	color: #ddd;
}

.rvbd-stars::before {
	content: "\2605\2605\2605\2605\2605";
	position: absolute;
	top: 0;
	left: 0;
	width: var( --rvbd-star-pct, 0% );
	overflow: hidden;
	white-space: nowrap;
	color: #f5a623;
}

/* Points */
.rvbd-points {
	font-size: 30px;
	font-weight: 700;
	color: #222;
}

.rvbd-points-max {
	font-size: 16px;
	font-weight: 400;
	color: #888;
}

/* Percentage */
.rvbd-percentage {
	font-size: 30px;
	font-weight: 700;
	color: #222;
}

/* Per-criterion breakdown */
.rvbd-review-criteria {
	width: 100%;
	border-collapse: collapse;
}

.rvbd-review-criteria th,
.rvbd-review-criteria td {
	padding: 6px 0;
	font-size: 14px;
	text-align: left;
	vertical-align: middle;
}

.rvbd-review-criteria th {
	width: 35%;
	font-weight: 500;
	color: #444;
	padding-right: 12px;
}

.rvbd-bar {
	position: relative;
	height: 8px;
	border-radius: 4px;
	background: #e6e6e6;
	overflow: hidden;
}

.rvbd-bar-fill {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: #f5a623;
	border-radius: 4px;
}

.rvbd-bar-value {
	width: 54px;
	padding-left: 10px;
	text-align: right;
	color: #666;
	font-size: 13px;
	white-space: nowrap;
}

.rvbd-review-verdict {
	margin: 16px 0 0;
	font-style: italic;
	color: #444;
}