/**
 * BD Review Cards — .espt-block-bd-review-cards (.bdv16)
 * vars: --cols --gap --title-size --text-size --name-size --star-size
 *       --avatar-size --avatar-radius --star-color --star-empty
 *       --title-color --text-color --name-color --verified-color --quote-color
 * classes: is-layout-{list|cards|soft|quote|bubble|frame|minimal|slider}
 *          is-text-align-* is-avatar-pos-{name|top|none}
 *          is-stagger/no-stagger is-clamp-{0|3|4|5|6} is-arrows/no-arrows
 *          is-dots/no-dots (the verified tag and the quote mark are chosen in
 *          the render, so they carry element classes, not root ones)
 * Mobile-first: base ≤767px, then 768px / 1024px.
 */

.espt-block-bd-review-cards .bdv16 {
	color: var(--bd-ink);
	min-width: 0;
}

.espt-block-bd-review-cards .espt-block-note {
	background: var(--bd-soft);
	border: 1px dashed var(--bd-soft-line);
	border-radius: 10px;
	color: var(--bd-muted);
	font-size: 13px;
	margin: 0;
	padding: 12px 14px;
}

/* ------------------------------------------------------------- heading */
.espt-block-bd-review-cards .bdv16-head {
	margin: 0 0 14px;
	min-width: 0;
	text-align: left;
}

.espt-block-bd-review-cards .bdv16-title {
	color: var(--title-color, var(--bd-ink));
	font-size: var(--title-size, 18px);
	font-weight: 800;
	line-height: 1.28;
	margin: 0;
	overflow-wrap: anywhere;
}

.espt-block-bd-review-cards .bdv16-sub {
	color: var(--bd-muted);
	font-size: 13.5px;
	line-height: 1.5;
	margin: 5px 0 0;
	overflow-wrap: anywhere;
}

/* --------------------------------------------------------------- stars */
/* width:fit-content matters — the star row lives inside column flexboxes
   (.bdv16-b, .bdv16-sum-l) which would otherwise stretch it to the full card
   width, and the % overlay below is a share of THIS box: stretched, every
   rating from ~2 upwards would paint five full stars. */
.espt-block-bd-review-cards .bdv16-s {
	color: var(--star-color, var(--bd-accent));
	display: inline-block;
	flex: none;
	font-size: var(--star-size, 14px);
	letter-spacing: 2px;
	line-height: 1.1;
	max-width: 100%;
	position: relative;
	white-space: nowrap;
	width: fit-content;
}

.espt-block-bd-review-cards .bdv16-sb { color: var(--star-empty, var(--bd-line)); }

.espt-block-bd-review-cards .bdv16-sf {
	color: var(--star-color, var(--bd-accent));
	inset: 0 auto 0 0;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
}

/* --------------------------------------------------------- summary bar */
.espt-block-bd-review-cards .bdv16-sum {
	align-items: center;
	background: var(--bd-soft);
	border: 1px solid var(--bd-soft-line);
	border-radius: calc(var(--bd-radius) * 0.7);
	display: flex;
	flex-wrap: wrap;
	gap: 10px 16px;
	margin: 0 0 14px;
	min-width: 0;
	padding: 12px 14px;
}

.espt-block-bd-review-cards .bdv16-sum-l {
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.espt-block-bd-review-cards .bdv16-sum-score {
	color: var(--bd-ink);
	font-size: 30px;
	font-weight: 800;
	line-height: 1;
}

.espt-block-bd-review-cards .bdv16-sum-lb {
	color: var(--bd-muted);
	font-size: 12px;
	font-weight: 600;
}

.espt-block-bd-review-cards .bdv16-sum-r {
	display: grid;
	flex: 1 1 190px;
	gap: 5px;
	min-width: 0;
}

.espt-block-bd-review-cards .bdv16-sum-c {
	color: var(--bd-muted);
	font-size: 12.5px;
	font-weight: 700;
	overflow-wrap: anywhere;
}

.espt-block-bd-review-cards .bdv16-sum-c b {
	color: var(--bd-ink);
	font-weight: 800;
}

.espt-block-bd-review-cards .bdv16-bars {
	display: grid;
	gap: 4px;
	min-width: 0;
}

.espt-block-bd-review-cards .bdv16-bar {
	align-items: center;
	color: var(--bd-muted);
	display: grid;
	font-size: 11.5px;
	gap: 8px;
	grid-template-columns: auto minmax(0, 1fr) auto;
	line-height: 1;
	min-width: 0;
}

.espt-block-bd-review-cards .bdv16-bl {
	font-variant-numeric: tabular-nums;
	font-weight: 700;
	min-width: 22px;
}

.espt-block-bd-review-cards .bdv16-bn {
	font-variant-numeric: tabular-nums;
	min-width: 14px;
	text-align: right;
}

.espt-block-bd-review-cards .bdv16-bs {
	color: var(--star-color, var(--bd-accent));
	margin-left: 2px;
}

.espt-block-bd-review-cards .bdv16-track {
	background: color-mix(in srgb, var(--bd-line) 75%, transparent);
	border-radius: 999px;
	display: block;
	height: 6px;
	min-width: 0;
	overflow: hidden;
}

.espt-block-bd-review-cards .bdv16-track i {
	background: var(--star-color, var(--bd-accent));
	border-radius: 999px;
	display: block;
	height: 100%;
	transition: width 0.4s ease;
}

/* ---------------------------------------------------------------- list */
.espt-block-bd-review-cards .bdv16-list {
	display: grid;
	gap: var(--gap, 14px);
	grid-template-columns: repeat(var(--cols, 1), minmax(0, 1fr));
	min-width: 0;
}

.espt-block-bd-review-cards .bdv16-c {
	display: flex;
	flex-direction: column;
	gap: 10px;
	min-width: 0;
	position: relative;
	text-align: left;
}

.espt-block-bd-review-cards .bdv16-c.is-hidden { display: none; }

.espt-block-bd-review-cards .bdv16-b {
	display: flex;
	flex-direction: column;
	gap: 7px;
	min-width: 0;
	position: relative;
}

.espt-block-bd-review-cards .bdv16-h {
	color: var(--bd-ink);
	font-size: calc(var(--text-size, 15px) + 1px);
	font-weight: 800;
	line-height: 1.35;
	margin: 0;
	overflow-wrap: anywhere;
}

.espt-block-bd-review-cards .bdv16-t {
	color: var(--text-color, var(--bd-body));
	font-size: var(--text-size, 15px);
	line-height: 1.7;
	margin: 0;
	min-width: 0;
	overflow-wrap: anywhere;
}

.espt-block-bd-review-cards .bdv16-q {
	color: var(--quote-color, var(--bd-primary));
	font-size: 44px;
	font-weight: 800;
	line-height: 0.6;
	opacity: 0.2;
	pointer-events: none;
	user-select: none;
}

/* ------------------------------------------------------- the name line */
.espt-block-bd-review-cards .bdv16-w {
	align-items: center;
	display: flex;
	gap: 9px;
	margin-top: auto;
	min-width: 0;
}

.espt-block-bd-review-cards .bdv16-av {
	border-radius: var(--avatar-radius, 50px);
	display: block;
	flex: none;
	height: var(--avatar-size, 38px);
	object-fit: cover;
	width: var(--avatar-size, 38px);
}

.espt-block-bd-review-cards .bdv16-av-ph {
	align-items: center;
	background: color-mix(in srgb, var(--bd-primary) 14%, transparent);
	color: var(--bd-primary);
	display: flex;
	font-size: calc(var(--avatar-size, 38px) * 0.44);
	font-weight: 800;
	justify-content: center;
	line-height: 1;
}

.espt-block-bd-review-cards .bdv16-nw {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.espt-block-bd-review-cards .bdv16-n {
	color: var(--name-color, var(--bd-muted));
	font-size: var(--name-size, 13px);
	font-weight: 700;
	line-height: 1.35;
	overflow-wrap: anywhere;
}

.espt-block-bd-review-cards .bdv16-d {
	color: var(--bd-muted);
	font-size: calc(var(--name-size, 13px) - 1.5px);
	line-height: 1.3;
	opacity: 0.85;
	overflow-wrap: anywhere;
}

/* verified tag — text / tick / pill */
.espt-block-bd-review-cards .bdv16-v {
	color: var(--verified-color, var(--bd-primary));
	font-weight: 700;
}

.espt-block-bd-review-cards .bdv16-v-tick,
.espt-block-bd-review-cards .bdv16-v-pill {
	align-items: center;
	display: inline-flex;
	font-size: calc(var(--name-size, 13px) - 1.5px);
	gap: 4px;
	line-height: 1.2;
	overflow-wrap: anywhere;
	width: fit-content;
}

.espt-block-bd-review-cards .bdv16-v-pill {
	background: color-mix(in srgb, var(--verified-color, var(--bd-primary)) 12%, transparent);
	border-radius: 999px;
	margin-top: 2px;
	padding: 2px 9px;
}

.espt-block-bd-review-cards .bdv16-vi svg {
	display: block;
	height: 1em;
	width: 1em;
}

.espt-block-bd-review-cards .bdv16-vi {
	flex: none;
	font-size: calc(var(--name-size, 13px) + 1px);
	line-height: 0;
}

/* ------------------------------------------------------------- layouts */
/* divider list — the plugin's original look */
.espt-block-bd-review-cards.is-layout-list .bdv16-list {
	gap: 0;
	grid-template-columns: minmax(0, 1fr);
}

.espt-block-bd-review-cards.is-layout-list .bdv16-c {
	border-top: 1px solid var(--bd-line);
	padding: 15px 0;
}

.espt-block-bd-review-cards.is-layout-list .bdv16-c:first-child { border-top: 0; padding-top: 0; }
.espt-block-bd-review-cards.is-layout-list .bdv16-c:last-child { padding-bottom: 0; }

/* soft tinted cards */
.espt-block-bd-review-cards.is-layout-soft .bdv16-c {
	background: var(--bd-soft);
	border-color: var(--bd-soft-line);
}

/* big quote cards */
.espt-block-bd-review-cards.is-layout-quote .bdv16-q {
	font-size: 60px;
	left: -2px;
	line-height: 0.7;
	opacity: 0.16;
	position: relative;
	top: 6px;
}

.espt-block-bd-review-cards.is-layout-quote .bdv16-t {
	font-size: calc(var(--text-size, 15px) + 1px);
	line-height: 1.75;
}

/* chat bubbles */
.espt-block-bd-review-cards.is-layout-bubble .bdv16-b {
	background: var(--bd-box-bg);
	border: 1px solid var(--bd-box-line);
	border-radius: calc(var(--bd-radius) * 0.9);
	padding: 13px 15px;
}

.espt-block-bd-review-cards.is-layout-bubble .bdv16-b::after {
	background: var(--bd-box-bg);
	border-bottom: 1px solid var(--bd-box-line);
	border-right: 1px solid var(--bd-box-line);
	bottom: -6px;
	content: "";
	height: 12px;
	left: 22px;
	position: absolute;
	transform: rotate(45deg);
	width: 12px;
}

.espt-block-bd-review-cards.is-layout-bubble .bdv16-w { padding-left: 6px; }
.espt-block-bd-review-cards.is-layout-bubble.bd-shadow-soft .bdv16-b { box-shadow: 0 6px 24px -12px rgba(15, 23, 42, 0.22); }
.espt-block-bd-review-cards.is-layout-bubble.bd-shadow-strong .bdv16-b { box-shadow: 0 16px 34px -16px rgba(15, 23, 42, 0.35); }

/* the bubble is the card here, so the BD hover presets act on it */
.espt-block-bd-review-cards.is-layout-bubble .bdv16-b { transition: transform 0.25s ease, box-shadow 0.25s ease; }
.espt-block-bd-review-cards.is-layout-bubble.bd-hover-lift .bdv16-c:hover .bdv16-b { transform: translateY(-4px); box-shadow: 0 18px 36px -14px rgba(15, 23, 42, 0.3); }
.espt-block-bd-review-cards.is-layout-bubble.bd-hover-glow .bdv16-c:hover .bdv16-b { box-shadow: 0 0 0 3px color-mix(in srgb, var(--bd-primary) 30%, transparent), 0 14px 30px -12px rgba(15, 23, 42, 0.25); }
.espt-block-bd-review-cards.is-layout-bubble.bd-hover-scale .bdv16-c:hover .bdv16-b { transform: scale(1.015); }

/* right-aligned text puts the name on the right, so the tail follows it */
.espt-block-bd-review-cards.is-layout-bubble.is-text-align-right .bdv16-b::after { left: auto; right: 22px; }
.espt-block-bd-review-cards.is-layout-bubble.is-text-align-right .bdv16-w { padding: 0 6px 0 0; }
.espt-block-bd-review-cards.is-layout-bubble.is-text-align-center .bdv16-b::after { left: 50%; margin-left: -6px; }
.espt-block-bd-review-cards.is-layout-bubble.is-text-align-center .bdv16-w { padding-left: 0; }

/* accent bar cards */
.espt-block-bd-review-cards.is-layout-frame .bdv16-c {
	border-left: 4px solid var(--bd-primary);
	border-radius: 4px calc(var(--bd-radius) * 0.7) calc(var(--bd-radius) * 0.7) 4px;
}

/* minimal — no boxes */
.espt-block-bd-review-cards.is-layout-minimal .bdv16-c { gap: 8px; }

/* swipe slider — the vertical padding leaves room for the hover lift and the
   box shadow, which "overflow-x:auto" would otherwise clip (or turn into a
   stray vertical scrollbar); the negative margin keeps the visual rhythm. */
.espt-block-bd-review-cards.is-layout-slider .bdv16-list {
	-webkit-overflow-scrolling: touch;
	display: flex;
	margin: -8px 0 -6px;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	padding: 8px 0 10px;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.espt-block-bd-review-cards.is-layout-slider .bdv16-list::-webkit-scrollbar { display: none; }

.espt-block-bd-review-cards.is-layout-slider .bdv16-c {
	flex: 0 0 calc((100% - (var(--cols, 1) - 1) * var(--gap, 14px)) / var(--cols, 1));
	min-width: 0;
	scroll-snap-align: start;
}

/* ----------------------------------------------- photo on top variant */
.espt-block-bd-review-cards.is-avatar-pos-top .bdv16-w { margin: 0 0 2px; }

/* ------------------------------------------------------------ clamping */
.espt-block-bd-review-cards.is-clamp-3 .bdv16-t,
.espt-block-bd-review-cards.is-clamp-4 .bdv16-t,
.espt-block-bd-review-cards.is-clamp-5 .bdv16-t,
.espt-block-bd-review-cards.is-clamp-6 .bdv16-t {
	-webkit-box-orient: vertical;
	display: -webkit-box;
	overflow: hidden;
}

.espt-block-bd-review-cards.is-clamp-3 .bdv16-t { -webkit-line-clamp: 3; line-clamp: 3; }
.espt-block-bd-review-cards.is-clamp-4 .bdv16-t { -webkit-line-clamp: 4; line-clamp: 4; }
.espt-block-bd-review-cards.is-clamp-5 .bdv16-t { -webkit-line-clamp: 5; line-clamp: 5; }
.espt-block-bd-review-cards.is-clamp-6 .bdv16-t { -webkit-line-clamp: 6; line-clamp: 6; }

.espt-block-bd-review-cards .bdv16-t.is-open {
	-webkit-line-clamp: unset;
	display: block;
	line-clamp: unset;
	overflow: visible;
}

.espt-block-bd-review-cards .bdv16-rm {
	background: none;
	border: 0;
	color: var(--bd-primary);
	cursor: pointer;
	font: inherit;
	font-size: calc(var(--text-size, 15px) - 2px);
	font-weight: 700;
	margin-top: -2px;
	padding: 0;
	text-align: inherit;
	width: fit-content;
}

.espt-block-bd-review-cards .bdv16-rm:hover { text-decoration: underline; }

/* -------------------------------------------------- show more / slider nav */
.espt-block-bd-review-cards .bdv16-morewrap {
	display: flex;
	justify-content: center;
	margin-top: 14px;
}

/* the button only appears once JS can actually collapse the list */
.espt-block-bd-review-cards .bdv16-morewrap[hidden] { display: none; }

.espt-block-bd-review-cards .bdv16-more { cursor: pointer; }

.espt-block-bd-review-cards .bdv16-nav { display: none; }

.espt-block-bd-review-cards.is-layout-slider .bdv16-nav {
	align-items: center;
	display: flex;
	gap: 10px;
	justify-content: center;
	margin-top: 12px;
	min-width: 0;
}

.espt-block-bd-review-cards .bdv16-ar {
	align-items: center;
	background: var(--bd-box-bg);
	border: 1px solid var(--bd-box-line);
	border-radius: 50%;
	color: var(--bd-ink);
	cursor: pointer;
	display: flex;
	flex: none;
	height: 38px;
	justify-content: center;
	padding: 0;
	transition: background 0.2s ease, border-color 0.2s ease, opacity 0.2s ease;
	width: 38px;
}

.espt-block-bd-review-cards .bdv16-ar svg {
	height: 16px;
	width: 16px;
}

.espt-block-bd-review-cards .bdv16-ar:hover {
	background: var(--bd-soft);
	border-color: var(--bd-primary);
	color: var(--bd-primary);
}

.espt-block-bd-review-cards .bdv16-ar[disabled] {
	cursor: default;
	opacity: 0.35;
}

.espt-block-bd-review-cards .bdv16-dots {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	min-width: 0;
}

.espt-block-bd-review-cards .bdv16-dot {
	background: var(--bd-line);
	border: 0;
	border-radius: 999px;
	cursor: pointer;
	height: 7px;
	padding: 0;
	position: relative;
	transition: background 0.2s ease, width 0.2s ease;
	width: 7px;
}

/* a 7px dot is not a tap target — grow the hit area without growing the dot */
.espt-block-bd-review-cards .bdv16-dot::before {
	content: "";
	inset: -10px -3px; /* -3px = half the 6px gap, so neighbours never overlap */
	position: absolute;
}

.espt-block-bd-review-cards .bdv16-dot.is-on {
	background: var(--bd-primary);
	width: 18px;
}

.espt-block-bd-review-cards.no-arrows .bdv16-ar,
.espt-block-bd-review-cards.no-dots .bdv16-dots { display: none; }

/* nothing left to show: no empty nav row */
.espt-block-bd-review-cards.is-layout-slider.no-arrows.no-dots .bdv16-nav,
.espt-block-bd-review-cards.is-layout-slider .bdv16-nav.is-single { display: none; }

/* ---------------------------------------------------------- focus */
.espt-block-bd-review-cards .bdv16-list:focus-visible,
.espt-block-bd-review-cards .bdv16-ar:focus-visible,
.espt-block-bd-review-cards .bdv16-dot:focus-visible,
.espt-block-bd-review-cards .bdv16-rm:focus-visible,
.espt-block-bd-review-cards .bdv16-more:focus-visible {
	outline: 2px solid var(--bd-primary);
	outline-offset: 3px;
}

/* -------------------------------------------------------- alignment */
.espt-block-bd-review-cards.is-text-align-center .bdv16-head,
.espt-block-bd-review-cards.is-text-align-center .bdv16-c { text-align: center; }

.espt-block-bd-review-cards.is-text-align-center .bdv16-w,
.espt-block-bd-review-cards.is-text-align-center .bdv16-b { align-items: center; }

.espt-block-bd-review-cards.is-text-align-center .bdv16-nw { align-items: center; }

.espt-block-bd-review-cards.is-text-align-right .bdv16-head,
.espt-block-bd-review-cards.is-text-align-right .bdv16-c { text-align: right; }

.espt-block-bd-review-cards.is-text-align-right .bdv16-w,
.espt-block-bd-review-cards.is-text-align-right .bdv16-b { align-items: flex-end; }

.espt-block-bd-review-cards.is-text-align-right .bdv16-w { flex-direction: row-reverse; }

.espt-block-bd-review-cards.is-text-align-right .bdv16-nw { align-items: flex-end; }

/* ------------------------------------------------------------ polish */
.espt-block-bd-review-cards .bdv16-c { transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease; }

.espt-block-bd-review-cards.is-layout-cards .bdv16-c:hover,
.espt-block-bd-review-cards.is-layout-soft .bdv16-c:hover,
.espt-block-bd-review-cards.is-layout-quote .bdv16-c:hover,
.espt-block-bd-review-cards.is-layout-slider .bdv16-c:hover {
	border-color: color-mix(in srgb, var(--bd-primary) 40%, var(--bd-box-line));
}

/* the frame layout keeps its accent edge on hover */
.espt-block-bd-review-cards.is-layout-frame .bdv16-c:hover {
	border-color: color-mix(in srgb, var(--bd-primary) 40%, var(--bd-box-line));
	border-left-color: var(--bd-primary-dark);
}

.espt-block-bd-review-cards.is-stagger .bdv16-c {
	animation: espt-rc-in 0.5s ease both;
}

.espt-block-bd-review-cards.is-stagger .bdv16-c:nth-child(1) { animation-delay: 0.04s; }
.espt-block-bd-review-cards.is-stagger .bdv16-c:nth-child(2) { animation-delay: 0.12s; }
.espt-block-bd-review-cards.is-stagger .bdv16-c:nth-child(3) { animation-delay: 0.2s; }
.espt-block-bd-review-cards.is-stagger .bdv16-c:nth-child(4) { animation-delay: 0.28s; }
.espt-block-bd-review-cards.is-stagger .bdv16-c:nth-child(5) { animation-delay: 0.36s; }
.espt-block-bd-review-cards.is-stagger .bdv16-c:nth-child(n+6) { animation-delay: 0.44s; }

@keyframes espt-rc-in {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: none; }
}

/* --------------------------------------------------------- ≥768px */
@media (min-width: 768px) {
	.espt-block-bd-review-cards .bdv16-head { margin-bottom: 18px; }

	.espt-block-bd-review-cards .bdv16-sub { font-size: 14.5px; }

	.espt-block-bd-review-cards .bdv16-sum {
		flex-wrap: nowrap;
		gap: 18px;
		padding: 14px 18px;
	}

	.espt-block-bd-review-cards .bdv16-sum-l {
		align-items: center;
		border-right: 1px solid color-mix(in srgb, var(--bd-soft-line) 80%, transparent);
		padding-right: 18px;
	}

	.espt-block-bd-review-cards .bdv16-sum-score { font-size: 36px; }

	.espt-block-bd-review-cards.is-layout-list .bdv16-c { padding: 18px 0; }
}

/* -------------------------------------------------------- ≥1024px */
@media (min-width: 1024px) {
	.espt-block-bd-review-cards .bdv16-sum { padding: 16px 20px; }

	.espt-block-bd-review-cards .bdv16-ar { height: 40px; width: 40px; }
}

/* ------------------------------------------------- reduced motion */
@media (prefers-reduced-motion: reduce) {
	.espt-block-bd-review-cards.is-stagger .bdv16-c { animation: none; }
	.espt-block-bd-review-cards .bdv16-c { transition: none; }
	.espt-block-bd-review-cards .bdv16-track i { transition: none; }
}