/*
 * HSH Testimonials — [hsh_testimonials] shortcode.
 *
 * White review cards on a scroll-snap track with prev/next arrows top right.
 * Scoped under .hsh-testimonials; overridable custom properties:
 * --hsh-t-pv (cards per view, set inline by the per_view attribute),
 * --hsh-t-card-bg, --hsh-t-text, --hsh-t-name, --hsh-t-arrow-bg,
 * --hsh-t-arrow-color, --hsh-t-gap.
 */

.hsh-testimonials {
	--hsh-t-pv: 3;
	--hsh-t-gap: 24px;
	--hsh-t-card-bg: #ffffff;
	--hsh-t-text: #4a4a4a;
	--hsh-t-name: #333333;
	--hsh-t-arrow-bg: #ffffff;
	--hsh-t-arrow-color: #2f4b3f;
	position: relative;
}

/* ---- Arrows (top right, like the design) ---- */

.hsh-testimonials__nav {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	margin-bottom: 22px;
}

.hsh-testimonials button.hsh-testimonials__arrow {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	flex: 0 0 auto;
	width: 46px;
	height: 46px;
	min-width: 46px;
	min-height: 46px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--hsh-t-arrow-bg);
	color: var(--hsh-t-arrow-color);
	font-size: 0;
	line-height: 0;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
	cursor: pointer;
	transition: opacity 0.2s ease;
}

.hsh-testimonials button.hsh-testimonials__arrow svg {
	width: 18px;
	height: 18px;
}

.hsh-testimonials button.hsh-testimonials__arrow[disabled] {
	opacity: 0.35;
	cursor: default;
}

/* ---- Track & cards ---- */

.hsh-testimonials__track {
	display: flex;
	gap: var(--hsh-t-gap);
	margin: 0;
	padding: 0;
	list-style: none;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.hsh-testimonials__track::-webkit-scrollbar {
	display: none;
}

.hsh-testimonials__track:focus-visible {
	outline: 2px solid var(--hsh-t-arrow-color);
	outline-offset: 4px;
}

.hsh-testimonials__card {
	/* Containing block for abs-positioned descendants — prevents
	   screen-reader-text spans escaping the track and widening the page. */
	position: relative;
	flex: 0 0 calc((100% - (var(--hsh-t-pv) - 1) * var(--hsh-t-gap)) / var(--hsh-t-pv));
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	background: var(--hsh-t-card-bg);
	border-radius: 14px;
	padding: 34px 34px 30px;
	box-sizing: border-box;
}

.hsh-testimonials__logo {
	margin-bottom: 24px;
	min-height: 30px;
	display: flex;
	align-items: center;
}

.hsh-testimonials__logo-img {
	max-height: 30px;
	width: auto;
	display: block;
}

.hsh-testimonials__quote {
	margin: 0 0 26px;
	color: var(--hsh-t-text);
	font-size: 16px;
	line-height: 1.7;
	quotes: none;
}

.hsh-testimonials__name {
	margin-top: auto;
	color: var(--hsh-t-name);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

/* ---- Built-in platform logos (styled text + one inline SVG) ---- */

.hsh-tlogo {
	font-size: 21px;
	line-height: 1;
	display: inline-flex;
	align-items: center;
}

.hsh-tlogo b,
.hsh-tlogo i {
	font-style: normal;
	font-weight: 700;
}

.hsh-tlogo--booking b {
	color: #003580;
}

.hsh-tlogo--booking i {
	color: #499fdd;
}

.hsh-tlogo--google {
	font-weight: 700;
	letter-spacing: -0.5px;
}

.hsh-tlogo--google .g1 { color: #4285f4; }
.hsh-tlogo--google .g2 { color: #ea4335; }
.hsh-tlogo--google .g3 { color: #fbbc05; }
.hsh-tlogo--google .g4 { color: #34a853; }

.hsh-tlogo--tripadvisor {
	gap: 7px;
	color: #000;
}

.hsh-tlogo--tripadvisor svg {
	width: 26px;
	height: 26px;
}

.hsh-tlogo--text {
	font-weight: 700;
	color: #333;
}

/* ---- Responsive: 3 → 2 → 1 (capped by the per_view attribute) ---- */

@media (max-width: 1024px) {
	.hsh-testimonials {
		--hsh-t-pv: 2;
	}
}

@media (max-width: 767px) {
	.hsh-testimonials {
		--hsh-t-pv: 1;
	}

	.hsh-testimonials__nav {
		justify-content: center;
	}
}

/* ---- Reduced motion ---- */

@media (prefers-reduced-motion: reduce) {
	.hsh-testimonials__track {
		scroll-behavior: auto;
	}
}