/* ===== Trustpilot-style override for Customer Reviews for WooCommerce ===== */
:root{
	--tp-green:#00B67A;
	--tp-green-soft:#DCF2E9;
	--tp-dark:#191919;
	--tp-muted:#6E6E71;
	--tp-border:#DCDCE4;
	--tp-bg:#F5F5F0;
	--tp-card:#FFFFFF;
}

#reviews.woocommerce-Reviews{
	font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,Arial,sans-serif;
	color:var(--tp-dark);
}

/* Plugin attribution — Trustpilot has none, hide it */
#reviews .cr-credits-div{display:none !important;}

/* ---- Section title ---- */
#reviews .woocommerce-Reviews-title{
	font-size:24px;
	font-weight:700;
	color:var(--tp-dark);
	letter-spacing:-.01em;
	margin-bottom:20px;
}

/* ---- Summary panel (score + histogram) ---- */
#reviews .cr-summaryBox-wrap{
	display:grid;
	grid-template-columns:minmax(240px,1fr) 1.4fr;
	gap:48px;
	align-items:center;
	background:var(--tp-card);
	border:1px solid var(--tp-border);
	border-radius:8px;
	padding:28px 32px;
	margin:0 0 28px;
}
@media (max-width:640px){
	#reviews .cr-summaryBox-wrap{grid-template-columns:1fr;gap:24px;padding:22px;}
}

#reviews .cr-overall-rating-wrap{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:10px;
	border-right:1px solid var(--tp-border);
	padding-right:32px;
}
@media (max-width:640px){
	#reviews .cr-overall-rating-wrap{border-right:0;border-bottom:1px solid var(--tp-border);padding:0 0 20px;}
}

/* Big score number */
#reviews .cr-average-rating{
	font-size:52px;
	font-weight:800;
	line-height:1;
	color:var(--tp-dark);
	letter-spacing:-.02em;
}
#reviews .cr-average-rating span{display:inline;font:inherit;color:inherit;}
#reviews .cr-average-rating::after{
	content:" / 5";
	font-size:16px;
	font-weight:500;
	color:var(--tp-muted);
	margin-left:4px;
}

/* Stars in summary */
#reviews .cr-average-rating-stars{margin:2px 0 0;}

/* Trust label injected by JS — appears above stars */
#reviews .tp-trust-label{
	order:-1;
	font-size:18px;
	font-weight:700;
	color:var(--tp-dark);
}

/* "Based on X reviews" */
#reviews .cr-total-rating-count{
	font-size:14px;
	color:var(--tp-muted);
	margin-top:4px;
}

/* ---- Histogram table ---- */
#reviews .ivole-summaryBox,
#reviews .ivole-summaryBox.cr-noAjax{
	background:transparent;
	padding:0;
	border:0;
}
#reviews .cr-histogramTable{width:100%;border-collapse:collapse;margin:0;}
#reviews .cr-histogramTable tbody{display:block;}
#reviews .ivole-histogramRow{
	display:grid;
	grid-template-columns:54px 1fr 54px;
	gap:14px;
	align-items:center;
	padding:4px 0;
}
#reviews .ivole-histogramCell1,
#reviews .ivole-histogramCell2,
#reviews .ivole-histogramCell3{
	padding:0;border:0;background:transparent;color:var(--tp-dark);
}
#reviews .ivole-histogramCell1{font-size:14px;font-weight:600;}
#reviews .ivole-histogramCell1 .ivole-histogram-a{color:inherit;text-decoration:none;}
#reviews .ivole-histogramCell3{font-size:14px;color:var(--tp-muted);text-align:right;font-variant-numeric:tabular-nums;}
#reviews .ivole-histogramCell3 .ivole-histogram-a{color:inherit;text-decoration:none;}

#reviews .ivole-meter{
	position:relative;
	height:12px;
	background:#EDEDF2;
	border-radius:2px;
	overflow:hidden;
}
#reviews .ivole-meter-bar{
	background:var(--tp-green) !important;
	height:100%;
	color:transparent !important;        /* hide plugin's numeric label inside bar */
	font-size:0 !important;
	line-height:12px;
	border-radius:2px;
	transition:width .3s ease;
}
/* empty bars (no reviews in bucket) */
#reviews .ivole-histogramRow:has(.ivole-meter-bar[style*="width: 0%"]) .ivole-meter-bar{background:#EDEDF2 !important;}

/* ---- Review list ---- */
#reviews ol.commentlist{
	list-style:none;
	margin:0;
	padding:0;
	display:flex;
	flex-direction:column;
	gap:16px;
}
#reviews ol.commentlist li.comment,
#reviews ol.commentlist li.review{
	list-style:none;
	margin:0;
	padding:0;
	background:transparent;
}
#reviews .comment_container{
	position:relative;
	display:grid;
	grid-template-columns:48px 1fr;
	gap:16px;
	background:var(--tp-card);
	border:1px solid var(--tp-border);
	border-radius:8px;
	padding:22px 24px 20px;
	box-shadow:none;
}

/* Gravatar → circular initial-style avatar */
#reviews .comment_container > img.avatar,
#reviews .comment_container > .cr-std-avatar{
	grid-column:1;
	grid-row:1 / span 3;
	width:48px !important;
	height:48px !important;
	border-radius:50%;
	object-fit:cover;
	margin:2px 0 0;
	box-shadow:0 0 0 1px var(--tp-border);
	background:#F3F3F7;
}

#reviews .cr-comment-text{
	grid-column:2;
	padding:0;
	border:0;
	background:transparent;
	margin:0;
	max-width:100%;
}
#reviews .cr-comment-text::before,
#reviews .cr-comment-text::after{display:none;}

/* Meta line: author, verified, date */
#reviews .cr-comment-text .meta{
	margin:0 0 10px;
	padding:0;
	font-size:14px;
	color:var(--tp-muted);
	border:0;
}
#reviews .cr-meta-author-featured-date{
	display:flex;
	justify-content:space-between;
	align-items:flex-start;
	gap:12px;
	flex-wrap:wrap;
}
#reviews .cr-meta-author-title{
	display:flex;
	flex-direction:column;
	gap:2px;
}
#reviews .woocommerce-review__author{
	font-size:16px;
	font-weight:700;
	color:var(--tp-dark);
	line-height:1.3;
}
#reviews .woocommerce-review__verified{
	display:inline-flex;
	align-items:center;
	gap:4px;
	font-size:12px;
	font-weight:500;
	color:var(--tp-green);
	background:transparent;
	padding:0;
	border:0;
	letter-spacing:0;
	text-transform:none;
}
#reviews .woocommerce-review__verified::before{
	content:"";
	width:14px;height:14px;
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2300B67A'><path d='M8 .5A7.5 7.5 0 1 0 15.5 8 7.5 7.5 0 0 0 8 .5Zm3.7 5.9-4.4 4.4a.75.75 0 0 1-1 0L4.3 8.8a.75.75 0 0 1 1-1l1.4 1.4 4-4a.75.75 0 0 1 1 1Z'/></svg>");
	background-repeat:no-repeat;background-size:contain;background-position:center;
}

/* Hide the "Reviewer" label (only show "Verified owner") to mirror Trustpilot's "Verified" pattern */
#reviews .woocommerce-review__verified:not(.cr-verified-owner *):is([data-unverified]){display:none;}

#reviews .woocommerce-review__published-date{
	font-size:13px;
	color:var(--tp-muted);
	white-space:nowrap;
	margin-top:2px;
}

/* Country flag (if set) */
#reviews .ivole-review-country-icon{
	width:14px;height:14px;vertical-align:middle;margin-left:6px;border-radius:2px;
}

/* Star rating on individual review */
#reviews .cr-comment-text .crstar-rating-svg{
	margin:0 0 10px;
}

/* Comment text / review body */
#reviews .cr-comment-text .description,
#reviews .cr-comment-text p:not(.meta){
	font-size:15px;
	line-height:1.55;
	color:var(--tp-dark);
	margin:0 0 10px;
	word-break:break-word;
}

/* "Featured review" ribbon → Trustpilot-like subtle chip */
#reviews .cr-all-featured-badge{
	background:var(--tp-green-soft);
	color:var(--tp-green);
	border:0;
	border-radius:4px;
	padding:2px 8px;
	font-size:12px;
	font-weight:600;
	text-transform:none;
	letter-spacing:0;
	box-shadow:none;
}
#reviews .cr-all-featured-badge span{color:inherit;}

/* Pagination */
#reviews .woocommerce-pagination{margin-top:20px;}
#reviews .woocommerce-pagination ul{display:flex;gap:6px;justify-content:center;padding:0;list-style:none;}
#reviews .woocommerce-pagination a,
#reviews .woocommerce-pagination span{
	min-width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;
	border:1px solid var(--tp-border);border-radius:6px;color:var(--tp-dark);text-decoration:none;
	font-size:14px;
}
#reviews .woocommerce-pagination .current{background:var(--tp-dark);color:#fff;border-color:var(--tp-dark);}

/* ===== Trustpilot square-star tiles (injected by JS via spans) ===== */
.tp-stars{
	display:inline-flex;
	gap:2px;
	vertical-align:middle;
	line-height:0;
}
.tp-stars .tp-star{
	position:relative;
	width:22px;height:22px;
	background:#DCDCE4;         /* empty star tile color */
	display:inline-block;
	border-radius:2px;
	overflow:hidden;
}
.tp-stars .tp-star::before,
.tp-stars .tp-star .tp-star-fill::before{
	content:"";
	position:absolute;inset:0;
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'><path d='M12 2.5l2.9 6.3 6.9.6-5.2 4.6 1.6 6.8L12 17.4 5.8 20.8l1.6-6.8L2.2 9.4l6.9-.6L12 2.5Z'/></svg>");
	background-repeat:no-repeat;
	background-position:center;
	background-size:74% 74%;
	z-index:2;
}
.tp-stars .tp-star .tp-star-fill{
	position:absolute;inset:0;
	background:var(--tp-green);
	overflow:hidden;
	z-index:1;
}

/* Summary-size stars (larger) */
.cr-average-rating-stars .tp-stars .tp-star{width:32px;height:32px;border-radius:3px;}

/* Hide original SVG stars emitted by plugin — replaced by tp-stars */
#reviews .crstar-rating-svg > svg,
#reviews .crstar-rating-svg > .cr-rating-icon-base,
#reviews .crstar-rating-svg > .cr-rating-icon-frnt{display:none !important;}
#reviews .crstar-rating-svg{position:relative;display:inline-flex;align-items:center;min-height:24px;padding:0;}
/* In case plugin also uses inline <i> / icon spans */
#reviews .crstar-rating-svg .cr-rating-icon,
#reviews .crstar-rating-svg .cr-rating-icon-bg{display:none !important;}

/* Reviews count pill next to title (injected by JS) */
#reviews .tp-review-count-pill{
	display:inline-flex;align-items:center;
	font-size:14px;font-weight:500;color:var(--tp-muted);
	margin-left:8px;vertical-align:middle;
}

/* ===== Defense-in-depth: hide stray duplicates from older Trustpilot-style plugins =====
 * Historically several sister sites carried their own Trustpilot-style plugin
 * that injected .ku-tp-label / .ku-tp-scoreline / .kj-tp-* / .ktp-tp-* duplicates
 * on top of this one. The old plugins have been renamed to .disabled, but this
 * ruleset keeps the page clean if any stray DOM remains (server cache, fallback
 * theme copies, etc.). */
body.single-product #reviews [class*="ku-tp-label"],
body.single-product #reviews [class*="ku-tp-scoreline"],
body.single-product #reviews [class*="ku-tp-initials"],
body.single-product #reviews [class*="ku-tp-review-count"],
body.single-product #reviews [class*="kg-tp-label"],
body.single-product #reviews [class*="kg-tp-scoreline"],
body.single-product #reviews [class*="kj-tp-label"],
body.single-product #reviews [class*="kj-tp-scoreline"],
body.single-product #reviews [class*="kj-tp-initials"],
body.single-product #reviews [class*="kj-tp-review-count"],
body.single-product #reviews [class*="km-tp-label"],
body.single-product #reviews [class*="km-tp-scoreline"],
body.single-product #reviews [class*="km-tp-initials"],
body.single-product #reviews [class*="km-tp-review-count"],
body.single-product #reviews [class*="ktp-tp-label"],
body.single-product #reviews [class*="ktp-tp-scoreline"],
body.single-product #reviews [class*="ks-tp-reviews"],
body.single-product #reviews [class*="trp-label"],
body.single-product #reviews [class*="trp-scoreline"]{
	display:none !important;
}
/* Collapse any duplicate trust-score row the theme might inject (keep only the first). */
body.single-product #reviews .tp-trust-score ~ .tp-trust-score,
body.single-product #reviews .tp-trust-label ~ .tp-trust-label{
	display:none !important;
}

/* ===== Hide review author avatars to match katanasverdno =====
 * katanasverdno's katana-category-dark-layout.php hides the Gravatar/initial
 * avatar on single-product review cards and collapses the card to a single
 * column. Sister sites' katana-single-product-dark.php does the same, but
 * this plugin's card styles reintroduce the avatar column. Restore the hide. */
body.single-product #reviews .comment_container > img.avatar,
body.single-product #reviews .comment_container > .cr-std-avatar,
body.single-product #reviews .comment_container > img.photo,
body.single-product #reviews .comment_container img.avatar-60,
body.single-product #reviews .comment_container .avatar{
	display:none !important;
}
body.single-product #reviews .comment_container{
	display:block !important;
	grid-template-columns:1fr !important;
	gap:0 !important;
	padding:22px 26px 20px !important;
}
body.single-product #reviews .comment_container .cr-comment-text{
	grid-column:1 !important;
	grid-row:auto !important;
	width:100% !important;
	max-width:100% !important;
	padding:0 !important;
	margin:0 !important;
}