/* TINSE Reviews for Google: front-end styles */
.tgr {
	--tgr-bg: #fff;
	--tgr-fg: #1f2328;
	--tgr-muted: #6b7280;
	--tgr-border: #e5e7eb;
	--tgr-accent: #1a73e8;
	--tgr-gap: 1rem;
	--tgr-radius: 12px;
	--tgr-star: #fbbc04;
	color: inherit;
	font: inherit;
	box-sizing: border-box;
}
.tgr *, .tgr *::before, .tgr *::after { box-sizing: inherit; }

.tgr--theme-dark {
	--tgr-bg: #1c1f24;
	--tgr-fg: #f3f4f6;
	--tgr-muted: #9ca3af;
	--tgr-border: #2f343b;
	--tgr-accent: #8ab4f8;
}

/* Header */
.tgr__header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
	margin-bottom: var(--tgr-gap);
}
.tgr__score { font-size: 2.75rem; font-weight: 700; line-height: 1; }
.tgr__count { color: var(--tgr-muted); font-size: .875rem; margin-top: .15rem; }
.tgr__cta {
	margin-left: auto;
	padding: .55rem 1rem;
	border-radius: 999px;
	background: var(--tgr-accent);
	color: #fff !important;
	font-size: .875rem;
	font-weight: 600;
	text-decoration: none;
}
.tgr__cta:hover, .tgr__cta:focus { opacity: .9; }

/* Stars */
.tgr-stars {
	position: relative;
	display: inline-block;
	color: #d1d5db;
	letter-spacing: 2px;
	line-height: 1;
	white-space: nowrap;
}
.tgr-stars::before {
	content: "★★★★★";
	position: absolute;
	left: 0;
	top: 0;
	width: var(--tgr-pct, 100%);
	overflow: hidden;
	color: var(--tgr-star);
	letter-spacing: 2px;
	white-space: nowrap;
}

/* Layouts */
.tgr--grid .tgr__track {
	display: grid;
	grid-template-columns: repeat(var(--tgr-cols, 3), minmax(0, 1fr));
	gap: var(--tgr-gap);
}
.tgr--list .tgr__track {
	display: flex;
	flex-direction: column;
	gap: var(--tgr-gap);
}
@media (max-width: 900px) {
	.tgr--grid .tgr__track { grid-template-columns: repeat(min(var(--tgr-cols, 3), 2), minmax(0, 1fr)); }
}
@media (max-width: 600px) {
	.tgr--grid .tgr__track { grid-template-columns: minmax(0, 1fr); }
}

/* Card */
.tgr__card {
	background: var(--tgr-bg);
	color: var(--tgr-fg);
	border: 1px solid var(--tgr-border);
	border-radius: var(--tgr-radius);
	padding: 1.1rem 1.15rem;
	display: flex;
	flex-direction: column;
	gap: .65rem;
}
.tgr__author { display: flex; align-items: center; gap: .7rem; }
.tgr__avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	object-fit: cover;
	flex: 0 0 40px;
}
.tgr__avatar--initial {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--tgr-accent);
	color: #fff;
	font-weight: 600;
}
.tgr__meta { display: flex; flex-direction: column; min-width: 0; }
.tgr__name { font-weight: 600; overflow-wrap: anywhere; }
.tgr__date { color: var(--tgr-muted); font-size: .8125rem; }
.tgr__text { margin: 0; line-height: 1.55; overflow-wrap: anywhere; }

/* Read more (native <details>) */
.tgr__more summary {
	display: inline;
	cursor: pointer;
	list-style: none;
	color: var(--tgr-accent);
	font-size: .875rem;
	margin-left: .25rem;
}
.tgr__more summary::-webkit-details-marker { display: none; }
.tgr__more[open] summary { display: block; margin: .4rem 0 0; }
.tgr__more[open] .tgr__more-open,
.tgr__more:not([open]) .tgr__more-close { display: none; }

/* Owner reply */
.tgr__reply {
	margin-top: auto;
	padding: .65rem .8rem;
	border-left: 3px solid var(--tgr-border);
	font-size: .875rem;
	color: var(--tgr-muted);
}
.tgr__reply p { margin: .25rem 0 0; }

.tgr__footer { margin: var(--tgr-gap) 0 0; text-align: center; font-size: .875rem; }
.tgr__footer a { color: var(--tgr-accent); }
.tgr-notice { opacity: .8; }
