/* KidShine Reviews */
.ksr {
	--ksr-accent: #12a9e0;
	--ksr-ink: #1d3b53;
	--ksr-muted: #5f7385;
	--ksr-card: #ffffff;
	--ksr-line: #e3edf3;
	--ksr-star: #f5b400;
	--ksr-star-off: #d9e1e7;
	--ksr-google: #4285f4;
	--ksr-yelp: #d32323;
	--ksr-facebook: #1877f2;
	--ksr-radius: 14px;
	--ksr-gap: 20px;
	color: var(--ksr-ink);
	font-family: inherit;
	line-height: 1.5;
	box-sizing: border-box;
}
.ksr *, .ksr *::before, .ksr *::after { box-sizing: border-box; }

/* ---------- Stars ---------- */
.ksr-stars {
	--size: 16px;
	position: relative;
	display: inline-block;
	width: calc(var(--size) * 5);
	height: var(--size);
	background: var(--ksr-star-off);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l2.9 6.1 6.6.8-4.9 4.6 1.3 6.6L12 17.3l-5.9 3.3 1.3-6.6-4.9-4.6 6.6-.8z'/%3E%3C/svg%3E") 0 0 / var(--size) var(--size) repeat-x;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l2.9 6.1 6.6.8-4.9 4.6 1.3 6.6L12 17.3l-5.9 3.3 1.3-6.6-4.9-4.6 6.6-.8z'/%3E%3C/svg%3E") 0 0 / var(--size) var(--size) repeat-x;
	vertical-align: middle;
}
.ksr-stars__fill {
	position: absolute;
	inset: 0 auto 0 0;
	background: var(--ksr-star);
}
.ksr-stars--yelp .ksr-stars__fill { background: var(--ksr-yelp); }
.ksr-stars--lg { --size: 22px; }

/* ---------- Badge ---------- */
.ksr-badge {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 24px;
	padding: 16px 22px;
	background: var(--ksr-card);
	border: 1px solid var(--ksr-line);
	border-radius: var(--ksr-radius);
	box-shadow: 0 6px 24px rgba(16, 66, 102, .08);
}
.ksr-badge--compact {
	padding: 0;
	background: none;
	border: 0;
	box-shadow: none;
}
.ksr-badge__main { display: flex; align-items: center; gap: 12px; }
.ksr-badge__score {
	font-size: 44px;
	font-weight: 700;
	line-height: 1;
	color: var(--ksr-ink);
	font-variant-numeric: tabular-nums;
}
.ksr-badge__meta { display: flex; flex-direction: column; gap: 4px; }
.ksr-badge__count { font-size: 14px; color: var(--ksr-muted); }
.ksr-badge__count a { color: inherit; }
.ksr-badge__sources {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ksr-src {
	margin: 0;
	padding: 0;
	font-size: 14px;
}
.ksr-src > a, .ksr-src:not(:has(> a)) {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border: 1px solid var(--ksr-line);
	border-radius: 999px;
	background: #f7fbfd;
	color: var(--ksr-ink);
	text-decoration: none;
}
.ksr-src > a:hover { border-color: var(--ksr-accent); }
.ksr-src__count { color: var(--ksr-muted); }
.ksr-src__dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--ksr-google);
	display: inline-block;
	flex: none;
}
.ksr-src--yelp .ksr-src__dot, .ksr-src__dot--yelp { background: var(--ksr-yelp); }
.ksr-src--facebook .ksr-src__dot, .ksr-src__dot--facebook { background: var(--ksr-facebook); }

/* ---------- Slider ---------- */
.ksr-slider { position: relative; width: 100%; }
.ksr-slider__top {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 18px;
}
.ksr-slider__title { margin: 0 0 8px; color: var(--ksr-ink); }
.ksr-slider__nav { display: flex; gap: 8px; flex: none; }
.ksr-nav {
	width: 44px;
	height: 44px;
	display: inline-grid;
	place-items: center;
	padding: 0;
	border: 1px solid var(--ksr-line);
	border-radius: 50%;
	background: var(--ksr-card);
	color: var(--ksr-accent);
	cursor: pointer;
	transition: background .2s, color .2s, opacity .2s;
}
.ksr-nav svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.ksr-nav:hover:not(:disabled), .ksr-nav:focus-visible { background: var(--ksr-accent); color: #fff; }
.ksr-nav:disabled { opacity: .35; cursor: default; }

.ksr-track {
	display: flex;
	align-items: stretch;
	gap: var(--ksr-gap);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	padding: 4px 2px 18px;
	margin: 0 -2px;
}
.ksr-track::-webkit-scrollbar { display: none; }
.ksr-track:focus-visible { outline: 2px solid var(--ksr-accent); outline-offset: 4px; border-radius: var(--ksr-radius); }

.ksr-card {
	flex: 0 0 calc((100% - 2 * var(--ksr-gap)) / 3);
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	gap: 10px;
	min-height: 250px;
	padding: 22px;
	background: var(--ksr-card);
	border: 1px solid var(--ksr-line);
	border-top: 4px solid var(--ksr-accent);
	border-radius: var(--ksr-radius);
	box-shadow: 0 6px 20px rgba(16, 66, 102, .07);
	text-align: left;
}
.ksr-card__head { display: flex; align-items: center; gap: 12px; }
.ksr-card__avatar {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	object-fit: cover;
	flex: none;
	margin: 0 !important;
}
.ksr-card__avatar--initial {
	display: inline-grid;
	place-items: center;
	background: var(--ksr-accent);
	color: #fff;
	font-weight: 700;
	font-size: 18px;
}
.ksr-card__who { display: flex; flex-direction: column; min-width: 0; }
.ksr-card__name {
	font-weight: 700;
	color: var(--ksr-ink);
	text-decoration: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
a.ksr-card__name:hover { text-decoration: underline; }
.ksr-card__when { font-size: 13px; color: var(--ksr-muted); }
.ksr-card__text {
	font-size: 15px;
	color: var(--ksr-ink);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 6;
	line-clamp: 6;
	overflow: hidden;
}
.ksr-card.is-expanded .ksr-card__text { -webkit-line-clamp: unset; line-clamp: unset; overflow: visible; }
.ksr-card__more {
	align-self: flex-start;
	padding: 0;
	border: 0;
	background: none;
	color: var(--ksr-accent);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}
.ksr-card__more:hover { text-decoration: underline; background: none; color: var(--ksr-accent); }
.ksr-card__more[hidden] { display: none; }
.ksr-card__foot {
	margin-top: auto;
	padding-top: 10px;
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: var(--ksr-muted);
	border-top: 1px solid var(--ksr-line);
}
.ksr-card__foot a { color: var(--ksr-muted); text-decoration: none; }
.ksr-card__foot a:hover { color: var(--ksr-accent); text-decoration: underline; }

.ksr-attrib { margin: 4px 0 0; font-size: 12px; color: var(--ksr-muted); text-align: right; }
.ksr-admin-note { padding: 10px 14px; border: 1px dashed #c3c4c7; background: #fff8e5; font-size: 14px; }

/* Tablet: 2 cards */
@media (max-width: 991px) {
	.ksr-card { flex-basis: calc((100% - var(--ksr-gap)) / 2); }
}
/* Phone: 1 card with a peek of the next */
@media (max-width: 640px) {
	.ksr { --ksr-gap: 14px; }
	.ksr-card { flex-basis: 86%; padding: 18px; }
	.ksr-slider__top { flex-direction: column; align-items: flex-start; }
	.ksr-slider__nav { display: none; }
	.ksr-badge__score { font-size: 36px; }
	.ksr-attrib { text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
	.ksr-track { scroll-behavior: auto; }
}
