/* Google reviews (0.4.0). Colours and font come from the site's own settings where they exist
   (--sse-ink / --sse-muted / --sse-line / --sse-surface are printed by essentials.css), with
   fallbacks, so the block also works on a site that runs only this module.
   No scroll-behavior:smooth on the track: with scroll-snap it counts as a scroll before first
   paint on narrow screens and Lighthouse reports NO_LCP (natura, 22.10.2026). */
.sse-rv {
	--rv-ink: var(--sse-ink, #1f2937);
	--rv-muted: var(--sse-muted, #6b7280);
	--rv-line: var(--sse-line, #e5e7eb);
	--rv-surface: var(--sse-surface, #f8fafc);
	--rv-star: #f5b301;
	--rv-gap: 16px;
	box-sizing: border-box;
	max-width: 1200px;
	margin-inline: auto;
	padding-block: 8px;
	color: var(--rv-ink);
	font-size: 16px;
	line-height: 1.55;
}
.sse-rv *, .sse-rv *::before, .sse-rv *::after { box-sizing: border-box; }
.sse-rv__heading { margin: 0 0 12px; text-align: center; font-size: clamp(1.35rem, 1.1rem + 1vw, 1.9rem); line-height: 1.25; }
.sse-rv__summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 12px; margin: 0 0 20px; }
.sse-rv__score { font-size: 1.75rem; font-weight: 700; line-height: 1; }
.sse-rv__stars { color: var(--rv-star); font-size: 1.15rem; letter-spacing: 1px; white-space: nowrap; line-height: 1; }
.sse-rv__stars-off { color: var(--rv-line); }
.sse-rv a.sse-rv__count { color: var(--rv-muted); font-size: .95rem; text-decoration: underline; text-underline-offset: 3px; }
.sse-rv a.sse-rv__count:hover, .sse-rv a.sse-rv__count:focus-visible { color: var(--rv-ink); }

.sse-rv__list { list-style: none; margin: 0; padding: 0; }
.sse-rv--carousel .sse-rv__list {
	display: flex;
	gap: var(--rv-gap);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x proximity;
	padding: 4px 4px 14px;
	scrollbar-width: thin;
}
.sse-rv--carousel .sse-rv__list:focus-visible { outline: 2px solid var(--rv-ink); outline-offset: 2px; }
.sse-rv--carousel .sse-rv__card { flex: 0 0 min(340px, 84%); scroll-snap-align: start; }
.sse-rv--grid .sse-rv__list { display: grid; gap: var(--rv-gap); grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); }

.sse-rv__card {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding: 18px;
	background: #fff;
	border: 1px solid var(--rv-line);
	border-radius: 12px;
	text-align: start;
}
.sse-rv__who { display: flex; align-items: center; gap: 10px; min-width: 0; }
.sse-rv__avatar { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; object-fit: cover; background: var(--rv-surface); }
.sse-rv__avatar--initial { display: inline-flex; align-items: center; justify-content: center; font-weight: 700; color: var(--rv-muted); }
.sse-rv__meta { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.sse-rv__name { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sse-rv__date { color: var(--rv-muted); font-size: .85rem; }
.sse-rv__text { margin: 0; white-space: normal; overflow-wrap: anywhere; }
/* Clamped from the first paint (a clamp that arrived with the script resized the card after it was drawn, and on a
   page that opens with the reviews that paragraph is the LCP element). Without JS the render prints a <noscript>
   style that removes the clamp, so the full text still shows. */
.sse-rv__text:not(.is-open) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 6; line-clamp: 6; overflow: hidden; }
/* A theme's own button rules (hello-elementor: a red pill border, padding, a filled hover) must not reach this
   text button, so every property they touch is set here, on a selector that outranks `button` and `[type=button]`. */
.sse-rv button.sse-rv__more,
.sse-rv button.sse-rv__more:hover,
.sse-rv button.sse-rv__more:focus,
.sse-rv button.sse-rv__more:active {
	align-self: flex-start;
	display: inline;
	width: auto;
	min-width: 0;
	min-height: 0;
	margin: -4px 0 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: var(--rv-ink);
	font: inherit;
	font-size: .9rem;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0;
	text-transform: none;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}
.sse-rv button.sse-rv__more:focus-visible { outline: 2px solid var(--rv-ink); outline-offset: 2px; }
.sse-rv__reply { margin: 0; padding: 10px 12px; background: var(--rv-surface); border-radius: 8px; font-size: .92rem; }
.sse-rv a.sse-rv__src { margin-top: auto; color: var(--rv-muted); font-size: .85rem; text-decoration: underline; text-underline-offset: 3px; }
.sse-rv a.sse-rv__src:hover, .sse-rv a.sse-rv__src:focus-visible { color: var(--rv-ink); }

.sse-rv__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 20px; margin: 18px 0 0; }
.sse-rv a.sse-rv__btn {
	display: inline-block;
	padding: 10px 22px;
	border: 1px solid var(--rv-ink);
	border-radius: 999px;
	background: var(--rv-ink);
	color: #fff;
	font-weight: 600;
	text-decoration: none;
}
.sse-rv a.sse-rv__btn:hover, .sse-rv a.sse-rv__btn:focus-visible { background: #fff; color: var(--rv-ink); text-decoration: none; }
.sse-rv a.sse-rv__all { color: var(--rv-ink); font-size: 1rem; text-decoration: underline; text-underline-offset: 3px; }

/* ---- row layout (0.4.1, Haim 14.11.2026): a summary panel beside the row, arrows on the row ---- */
/* 0.4.4: the arrows hang 14px outside the row. The section keeps that room inside its own box and clips, so a
   section that sits flush with the screen edge (galit /lp/ on a phone) cannot widen the page. */
.sse-rv--carousel { padding-inline: 16px; overflow-x: clip; }
.sse-rv__body { display: flex; align-items: stretch; gap: 22px; }
.sse-rv__panel {
	flex: 0 0 230px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 8px 4px;
	text-align: center;
}
.sse-rv .sse-rv__panel p { margin: 0; }
.sse-rv__logo { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; }
.sse-rv__place { font-weight: 700; font-size: 1.05rem; line-height: 1.3; }
.sse-rv__rating { display: flex; align-items: center; justify-content: center; gap: 8px; }
.sse-rv__panel .sse-rv__score { font-size: 1.35rem; color: #f28c00; }
.sse-rv__panel .sse-rv__stars { font-size: 1.3rem; color: #f28c00; }
.sse-rv__powered { font-size: .95rem; font-weight: 600; white-space: nowrap; }
.sse-rv__google i { font-style: normal; font-weight: 700; }
.sse-rv__google i:nth-child(1), .sse-rv__google i:nth-child(4) { color: #4285f4; }
.sse-rv__google i:nth-child(2), .sse-rv__google i:nth-child(6) { color: #ea4335; }
.sse-rv__google i:nth-child(3) { color: #fbbc05; }
.sse-rv__google i:nth-child(5) { color: #34a853; }
.sse-rv a.sse-rv__btn { display: inline-flex; align-items: center; gap: 8px; }
.sse-rv__g { flex: 0 0 22px; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: #fff; }
.sse-rv .sse-rv__panel a.sse-rv__btn { margin-top: 6px; padding: 8px 18px; background: #1a73e8; border-color: #1a73e8; color: #fff; }
.sse-rv .sse-rv__panel a.sse-rv__btn:hover, .sse-rv .sse-rv__panel a.sse-rv__btn:focus-visible { background: #1558b0; border-color: #1558b0; color: #fff; }

.sse-rv__track { position: relative; flex: 1 1 0; min-width: 0; }
/* 0.4.5 (Haim 14.11.2026, galit: "מעט מדי כרטיסים"): whole cards in view, three beside the panel on a desktop and two
   on a tablet, instead of a fixed 340px that showed two and a half. The phone keeps one card and a peek of the next. */
@media (min-width: 1101px) { .sse-rv--carousel .sse-rv__track .sse-rv__card { flex-basis: calc((100% - 2 * var(--rv-gap)) / 3); } }
@media (min-width: 783px) and (max-width: 1100px) { .sse-rv--carousel .sse-rv__track .sse-rv__card { flex-basis: calc((100% - var(--rv-gap)) / 2); } }
/* 0.4.5: an opened review no longer stretches every other card to its height. The script pins the cards to the
   height they had, then frees the row (reviews.js). */
.sse-rv--carousel .sse-rv__list.sse-rv__list--free { align-items: flex-start; }
/* 0.4.5: a card with one long unbroken name or word kept its own width (343px beside 292px ones). */
.sse-rv--carousel .sse-rv__card { min-width: 0; }
.sse-rv__meta { flex: 1 1 0; }
/* With the arrows there (the script shows them) the bar is not needed; without JS it stays as the way to scroll. */
.sse-rv--js .sse-rv__track .sse-rv__list { scrollbar-width: none; padding-bottom: 4px; }
.sse-rv--js .sse-rv__track .sse-rv__list::-webkit-scrollbar { display: none; }
.sse-rv button.sse-rv__nav,
.sse-rv button.sse-rv__nav:hover,
.sse-rv button.sse-rv__nav:focus,
.sse-rv button.sse-rv__nav:active {
	position: absolute;
	top: 50%;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	min-width: 0;
	min-height: 0;
	margin: -19px 0 0;
	padding: 0 0 3px;
	border: 1px solid var(--rv-line);
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .14);
	color: var(--rv-ink);
	font: 400 24px/1 Arial, sans-serif;
	letter-spacing: 0;
	text-transform: none;
	text-decoration: none;
	cursor: pointer;
}
.sse-rv button.sse-rv__nav[hidden] { display: none; }
.sse-rv button.sse-rv__nav:hover { background: var(--rv-surface); }
.sse-rv button.sse-rv__nav:focus-visible { outline: 2px solid var(--rv-ink); outline-offset: 2px; }
/* At an end of the row the arrow that leads nowhere disappears (it stays in the layout, so nothing jumps). */
.sse-rv button.sse-rv__nav[disabled] { opacity: 0; pointer-events: none; }
/* Physical sides on purpose: "previous" sits where the row started, which flips with the direction. */
.sse-rv[dir="rtl"] .sse-rv__nav--prev, .sse-rv[dir="ltr"] .sse-rv__nav--next { right: -14px; left: auto; }
.sse-rv[dir="rtl"] .sse-rv__nav--next, .sse-rv[dir="ltr"] .sse-rv__nav--prev { left: -14px; right: auto; }
/* The glyphs point left / right; in RTL "next" is to the left, so they are mirrored. */
.sse-rv[dir="rtl"] .sse-rv__nav span { display: inline-block; transform: scaleX(-1); }

@media (max-width: 782px) {
	.sse-rv__body { flex-direction: column; gap: 12px; }
	.sse-rv__panel { flex: 0 0 auto; }
	.sse-rv--carousel { padding-inline: 10px; }
	.sse-rv[dir="rtl"] .sse-rv__nav--prev, .sse-rv[dir="ltr"] .sse-rv__nav--next { right: -6px; }
	.sse-rv[dir="rtl"] .sse-rv__nav--next, .sse-rv[dir="ltr"] .sse-rv__nav--prev { left: -6px; }
}

@media (max-width: 600px) {
	.sse-rv { font-size: 15px; }
	.sse-rv__card { padding: 16px; }
}
