/* Temple Google Reviews widget. Override the custom properties from your theme / Elementor custom CSS. */
.tgr {
	--tgr-star: #fbbc04;
	--tgr-star-empty: #d9dde3;
	--tgr-card-bg: #ffffff;
	--tgr-card-border: rgba(0, 0, 0, 0.08);
	--tgr-card-radius: 14px;
	--tgr-card-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
	--tgr-text: inherit;
	--tgr-muted: #6b7280;
	--tgr-accent: #1a73e8;
	--tgr-gap: 20px;
	--tgr-nav-size: 40px;
	--tgr-avatar-size: 46px;
	--tgr-lines: 6;
	color: var(--tgr-text);
	position: relative;
	box-sizing: border-box;
	font-size: 16px;
	line-height: 1.5;
}
.tgr *, .tgr *::before, .tgr *::after { box-sizing: inherit; }
.tgr ul { list-style: none; margin: 0; padding: 0; }
.tgr li { list-style: none; margin: 0; }

/* ---- theme-proofing: themes/Elementor style bare <button> globally; neutralise that for ours ---- */
.tgr button.tgr-nav, .tgr button.tgr-dot, .tgr button.tgr-more {
	appearance: none !important; -webkit-appearance: none !important;
	background: none !important; background-image: none !important;
	border: 0 !important; box-shadow: none !important; outline: none;
	margin: 0 !important; padding: 0 !important;
	min-width: 0 !important; min-height: 0 !important; width: auto !important; height: auto !important;
	line-height: 1 !important; font-family: inherit !important; font-size: inherit !important; font-weight: inherit !important;
	color: inherit !important; text-transform: none !important; letter-spacing: normal !important; text-decoration: none !important;
	border-radius: 0 !important; transition: none !important; transform: none !important; display: inline-block;
}
.tgr button.tgr-nav:hover, .tgr button.tgr-dot:hover, .tgr button.tgr-more:hover { background-image: none !important; transform: none !important; }
.tgr button:focus-visible { outline: 2px solid var(--tgr-accent) !important; outline-offset: 2px !important; }

/* ---- size by the widget's own width, not the viewport. widget.js measures the root and sets
   data-tgr-size = s | m | l (no CSS container queries: `container-type` mis-sizes the wrapper
   inside Elementor's editor preview). The viewport media queries further down are the no-JS fallback. ---- */
.tgr[data-tgr-size="m"] .tgr-track { --tgr-cols: 2; }
.tgr[data-tgr-size="s"] .tgr-track { --tgr-cols: 1; }
.tgr[data-tgr-size="s"].tgr--slider .tgr-body { padding: 0; }
.tgr[data-tgr-size="s"] .tgr-nav { display: none !important; }
.tgr[data-tgr-size="l"] .tgr-nav { display: flex !important; }
.tgr[data-tgr-size="l"].tgr--cols-1 .tgr-track { --tgr-cols: 1; }
.tgr[data-tgr-size="l"].tgr--cols-2 .tgr-track { --tgr-cols: 2; }
.tgr[data-tgr-size="l"].tgr--cols-3 .tgr-track { --tgr-cols: 3; }
.tgr[data-tgr-size="l"].tgr--cols-4 .tgr-track { --tgr-cols: 4; }
.tgr--empty { padding: 16px; border: 1px dashed #bbb; border-radius: 8px; color: #666; font-size: 14px; }

/* ---- stars ---- */
.tgr-stars { position: relative; display: inline-flex; line-height: 0; vertical-align: middle; }
.tgr-stars__base, .tgr-stars__fill { display: inline-flex; white-space: nowrap; }
.tgr-stars__fill { position: absolute; left: 0; top: 0; overflow: hidden; }
.tgr-star { width: 18px; height: 18px; fill: var(--tgr-star-empty); flex: 0 0 auto; }
.tgr-stars__fill .tgr-star { fill: var(--tgr-star); }
.tgr-stars--lg .tgr-star { width: 24px; height: 24px; }

/* ---- header ---- */
.tgr-header {
	display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px;
	margin: 0 0 22px;
}
.tgr-header__brand { display: flex; flex-direction: column; min-width: 140px; }
.tgr-header__kicker { font-weight: 700; font-size: 1.05em; letter-spacing: .01em; }
.tgr-header__name { color: var(--tgr-muted); font-size: .85em; }
.tgr-header__score { display: flex; align-items: center; gap: 10px; }
.tgr-header__avg { font-size: 2.2em; font-weight: 800; line-height: 1; }
.tgr-header__meta { display: flex; flex-direction: column; font-size: .9em; }
.tgr-header__count { color: var(--tgr-muted); }
.tgr-header__link { color: var(--tgr-accent); text-decoration: none; font-weight: 600; }
.tgr-header__link:hover { text-decoration: underline; }
.tgr-header__logo { height: 22px; width: auto; margin-left: auto; align-self: center; }
.tgr--badge .tgr-header { margin: 0; }
/* compact badge: stacked and centred, for small boxes (hero cards, sidebars). Carries its own
   card surface so it reads on photos/dark sections; override --tgr-card-bg etc. to restyle. */
.tgr--compact {
	--tgr-text: #1b2430;
	font-size: 15px; color: var(--tgr-text);            /* size="s" — everything below scales in em */
	display: inline-block; min-width: 14em; max-width: 100%;
	background: var(--tgr-card-bg); padding: 1.05em 1.45em;
	border: 1px solid var(--tgr-card-border); border-radius: var(--tgr-card-radius); box-shadow: var(--tgr-card-shadow);
}
.tgr--compact.tgr--size-m { font-size: 18px; }
.tgr--compact.tgr--size-l { font-size: 21px; }
.tgr--compact .tgr-header { flex-direction: column; align-items: center; text-align: center; gap: .27em; }
.tgr--compact .tgr-header__score { gap: .5em; }
.tgr--compact .tgr-header__avg { font-size: 2em; }
.tgr--compact .tgr-stars--lg .tgr-star { width: 1.6em; height: 1.6em; }
.tgr--compact .tgr-header__meta { align-items: center; }
.tgr--compact .tgr-header__count { font-weight: 700; color: var(--tgr-text); }
.tgr--compact .tgr-header__asof { color: var(--tgr-muted); font-size: .8em; }
.tgr--compact .tgr-header__link { font-size: .85em; margin-top: .15em; }
.tgr--compact .tgr-header__logo { height: 1.5em; margin: .4em 0 0; }

/* ---- body / track ---- */
.tgr-body { position: relative; }
.tgr-track { display: grid; gap: var(--tgr-gap); align-items: stretch; }
.tgr--grid .tgr-track { grid-template-columns: repeat(var(--tgr-cols, 3), minmax(0, 1fr)); }
.tgr--list .tgr-track { grid-template-columns: 1fr; }
.tgr--cols-1 { --tgr-cols: 1; } .tgr--cols-2 { --tgr-cols: 2; } .tgr--cols-3 { --tgr-cols: 3; } .tgr--cols-4 { --tgr-cols: 4; }

/* slider */
.tgr--slider .tgr-body { padding: 0 calc(var(--tgr-nav-size) + 8px); }
.tgr-viewport { overflow: hidden; padding: 6px 0 14px; touch-action: pan-y; }
.tgr--slider .tgr-track {
	display: flex; gap: var(--tgr-gap);
	transition: transform .55s cubic-bezier(.4, 0, .2, 1);
	will-change: transform;
}
.tgr--slider .tgr-card {
	flex: 0 0 calc((100% - (var(--tgr-cols) - 1) * var(--tgr-gap)) / var(--tgr-cols));
}
.tgr.is-dragging .tgr-track { transition: none; }

/* ---- cards ---- */
.tgr-card {
	background: var(--tgr-card-bg);
	border: 1px solid var(--tgr-card-border);
	border-radius: var(--tgr-card-radius);
	box-shadow: var(--tgr-card-shadow);
	padding: 20px 22px;
	display: flex; flex-direction: column; gap: 10px;
	min-width: 0;
}
.tgr-card__head { display: flex; align-items: center; gap: 12px; }
.tgr-card__who { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.tgr-card__name { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tgr-card__date { color: var(--tgr-muted); font-size: .82em; }
.tgr-card__foot { margin-top: auto; padding-top: 6px; display: flex; justify-content: flex-end; }
.tgr-card__source { color: var(--tgr-muted); font-size: .72em; text-transform: uppercase; letter-spacing: .06em; }
.tgr-avatar {
	width: var(--tgr-avatar-size); height: var(--tgr-avatar-size); border-radius: 50%;
	overflow: hidden; flex: 0 0 auto;
	background: hsl(var(--tgr-hue, 210) 55% 45%);
	display: flex; align-items: center; justify-content: center;
	color: #fff; font-weight: 700; font-size: 1.15em;
}
.tgr-avatar__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tgr-card__text {
	display: -webkit-box;
	-webkit-line-clamp: var(--tgr-lines);
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: .95em;
}
.tgr-card.is-expanded .tgr-card__text { display: block; -webkit-line-clamp: unset; overflow: visible; }
.tgr button.tgr-more {
	align-self: flex-start; margin: -4px 0 0 !important;
	color: var(--tgr-accent) !important; font-size: .85em !important; font-weight: 600 !important; cursor: pointer; line-height: 1.4 !important;
}
.tgr button.tgr-more:hover { text-decoration: underline !important; }
.tgr-reply { font-size: .88em; border-top: 1px solid var(--tgr-card-border); padding-top: 8px; margin-top: 4px; }
.tgr-reply summary { cursor: pointer; color: var(--tgr-muted); font-weight: 600; }
.tgr-reply__text { margin-top: 6px; }

/* ---- nav ---- */
.tgr button.tgr-nav {
	position: absolute; top: 50%; transform: translateY(-50%) !important;
	width: var(--tgr-nav-size) !important; height: var(--tgr-nav-size) !important; border-radius: 50% !important;
	border: 1px solid var(--tgr-card-border) !important; background: var(--tgr-card-bg) !important; color: var(--tgr-text) !important;
	box-shadow: var(--tgr-card-shadow) !important; cursor: pointer; font-size: 26px !important; line-height: 1 !important;
	display: flex; align-items: center; justify-content: center; padding: 0 0 3px !important; z-index: 2;
}
.tgr button.tgr-nav:hover { background: var(--tgr-accent-soft, #eef3f4) !important; }
.tgr-nav--prev { left: 0; } .tgr-nav--next { right: 0; }
.tgr button.tgr-nav:disabled { opacity: .35; cursor: default; }
.tgr-dots { display: flex; justify-content: center; gap: 8px; margin-top: 4px; }
.tgr-dots:empty { display: none; }
.tgr button.tgr-dot {
	width: 9px !important; height: 9px !important; border-radius: 50% !important;
	background: var(--tgr-star-empty) !important; cursor: pointer;
}
.tgr button.tgr-dot[aria-selected="true"] { background: var(--tgr-accent) !important; transform: scale(1.2) !important; }

/* ---- responsive ---- */
@media (max-width: 900px) {
	.tgr--cols-3, .tgr--cols-4 { --tgr-cols: 2; }
}
@media (max-width: 600px) {
	.tgr:not([data-tgr-size]) { --tgr-cols: 1 !important; }
	.tgr:not([data-tgr-size]).tgr--slider .tgr-body { padding: 0; }
	.tgr:not([data-tgr-size]) .tgr-nav { display: none; }
	.tgr { --tgr-nav-size: 34px; --tgr-gap: 14px; }
	.tgr-header { gap: 6px 16px; }
	.tgr-header__avg { font-size: 1.9em; }
}
@media (prefers-reduced-motion: reduce) {
	.tgr--slider .tgr-track { transition: none; }
}