/* Отзывы с Яндекс Услуг — слайдер */

.yur {
	--yur-accent: #fc3f1d;
	/* --yur-cols-xl приходит инлайном из шорткода; ниже его ужимают медиазапросы */
	--yur-cols-xl: 3;
	--yur-cols: var(--yur-cols-xl);
	--yur-clamp: 7;
	--yur-gap: 20px;
	--yur-radius: 16px;
	--yur-bg: #fff;
	--yur-fg: #1a1a1a;
	--yur-muted: #8a8f98;
	--yur-line: #e8eaed;
	--yur-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 8px 24px rgba(16, 24, 40, .06);
	--yur-star-off: #dfe1e5;

	position: relative;
	box-sizing: border-box;
	color: var(--yur-fg);
	font-size: 15px;
	line-height: 1.55;
}

.yur *,
.yur *::before,
.yur *::after { box-sizing: border-box; }

/* Тёмная тема */
.yur--theme-dark,
.yur--theme-auto {
	color-scheme: light dark;
}

.yur--theme-dark {
	--yur-bg: #1c1d21;
	--yur-fg: #f2f3f5;
	--yur-muted: #9aa0a8;
	--yur-line: #2e3036;
	--yur-shadow: 0 1px 2px rgba(0, 0, 0, .4);
	--yur-star-off: #3a3d44;
}

@media (prefers-color-scheme: dark) {
	.yur--theme-auto {
		--yur-bg: #1c1d21;
		--yur-fg: #f2f3f5;
		--yur-muted: #9aa0a8;
		--yur-line: #2e3036;
		--yur-shadow: 0 1px 2px rgba(0, 0, 0, .4);
		--yur-star-off: #3a3d44;
	}
}

/* --- Лента --------------------------------------------------------- */

.yur__viewport {
	overflow: hidden;
	margin: 0 -4px;
	padding: 4px;
}

.yur__track {
	display: flex;
	gap: var(--yur-gap);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding-bottom: 2px;
}

.yur__track::-webkit-scrollbar { display: none; }

.yur.is-dragging .yur__track {
	scroll-behavior: auto;
	scroll-snap-type: none;
	cursor: grabbing;
}

.yur__card {
	flex: 0 0 calc((100% - (var(--yur-cols) - 1) * var(--yur-gap)) / var(--yur-cols));
	min-width: 0;
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 20px;
	background: var(--yur-bg);
	border: 1px solid var(--yur-line);
	border-radius: var(--yur-radius);
	box-shadow: var(--yur-shadow);
}

/* --- Шапка карточки ------------------------------------------------ */

.yur__head {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
}

.yur__avatar {
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	object-fit: cover;
	background: var(--yur-line);
}

.yur__avatar--letter {
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: 18px;
	color: #fff;
	background: var(--yur-accent);
}

.yur__meta { min-width: 0; }

.yur__author {
	font-weight: 600;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.yur__sub {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	margin-top: 2px;
}

.yur__stars {
	display: inline-flex;
	gap: 2px;
	line-height: 0;
}

.yur__star {
	width: 15px;
	height: 15px;
	fill: var(--yur-star-off);
}

.yur__star--on { fill: #ffb800; }

.yur__date {
	font-size: 13px;
	color: var(--yur-muted);
}

/* --- Текст --------------------------------------------------------- */

.yur__bodywrap { flex: 0 1 auto; }

/* Прижимает плюсы и фото к низу карточки, выравнивая ряд. */
.yur__spacer {
	display: block;
	flex: 1 1 auto;
	min-height: 0;
}

.yur__body {
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: var(--yur-clamp);
	line-clamp: var(--yur-clamp);
	-webkit-box-orient: vertical;
	overflow: hidden;
	word-break: break-word;
}

.yur__card.is-open .yur__body {
	display: block;
	-webkit-line-clamp: unset;
	line-clamp: unset;
	overflow: visible;
}

.yur__more {
	align-self: flex-start;
	padding: 0;
	border: 0;
	background: none;
	color: var(--yur-accent);
	font: inherit;
	font-size: 14px;
	cursor: pointer;
	text-decoration: none;
}

.yur__more:hover { text-decoration: underline; }

/* --- Фото и плюсы -------------------------------------------------- */

.yur__photos {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.yur__photo {
	display: block;
	width: 56px;
	height: 56px;
	border-radius: 10px;
	overflow: hidden;
	border: 1px solid var(--yur-line);
}

.yur__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.yur__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.yur__tag {
	font-size: 12.5px;
	line-height: 1.2;
	padding: 5px 9px;
	border-radius: 999px;
	color: var(--yur-muted);
	background: color-mix(in srgb, var(--yur-fg) 6%, transparent);
}

/* --- Кнопка «Читать в источнике» ----------------------------------- */

.yur__origin {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 2px;
	padding: 8px 14px;
	border: 1px solid var(--yur-line);
	border-radius: 999px;
	font-size: 13.5px;
	line-height: 1;
	font-weight: 500;
	color: var(--yur-fg);
	text-decoration: none;
	background: transparent;
	transition: border-color .15s ease, color .15s ease, background .15s ease;
}

.yur__origin:hover,
.yur__origin:focus-visible {
	border-color: var(--yur-accent);
	color: var(--yur-accent);
	text-decoration: none;
}

.yur__origin svg {
	width: 14px;
	height: 14px;
	flex: 0 0 auto;
}

@supports not (color: color-mix(in srgb, red, blue)) {
	.yur__tag { background: rgba(128, 128, 128, .12); }
}

/* --- Стрелки ------------------------------------------------------- */

.yur__ctrls {
	display: flex;
	gap: 8px;
	order: 3;
}

.yur__nav {
	width: 38px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 1px solid var(--yur-line);
	border-radius: 50%;
	background: var(--yur-bg);
	color: var(--yur-fg);
	box-shadow: var(--yur-shadow);
	cursor: pointer;
	transition: transform .15s ease, opacity .15s ease, border-color .15s ease;
}

.yur__nav svg { width: 20px; height: 20px; }

.yur__nav:hover:not([disabled]) {
	transform: scale(1.07);
	border-color: var(--yur-accent);
	color: var(--yur-accent);
}

.yur__nav[disabled] {
	opacity: .35;
	cursor: default;
}

/* --- Подвал -------------------------------------------------------- */

.yur__footer {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	margin-top: 20px;
}

.yur__dots {
	display: flex;
	align-items: center;
	gap: 7px;
	flex-wrap: wrap;
	order: 1;
	margin-right: auto;
}

.yur__dot {
	width: 8px;
	height: 8px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--yur-star-off);
	cursor: pointer;
	transition: width .2s ease, background .2s ease;
}

.yur__dot.is-active {
	width: 22px;
	border-radius: 999px;
	background: var(--yur-accent);
}

.yur__source {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	color: var(--yur-muted);
	text-decoration: none;
	order: 2;
}

.yur__source:hover { color: var(--yur-accent); }
.yur__source svg { width: 15px; height: 15px; }

/* --- Адаптив ------------------------------------------------------- */

@media (max-width: 1024px) {
	.yur { --yur-cols: min(2, var(--yur-cols-xl)); }
}

@media (max-width: 680px) {
	.yur {
		--yur-cols: 1;
		--yur-gap: 14px;
	}
	/* На узком экране карточка одна — тянуть её до высоты самой длинной незачем. */
	.yur__track { align-items: flex-start; }

	.yur__footer {
		justify-content: center;
		row-gap: 12px;
	}
	.yur__dots {
		order: 1;
		width: 100%;
		justify-content: center;
		margin-right: 0;
	}
	.yur__ctrls { order: 2; }
	.yur__source { order: 3; }
}

@media (prefers-reduced-motion: reduce) {
	.yur__track { scroll-behavior: auto; }
	.yur__nav, .yur__dot { transition: none; }
}

/* --- Служебное сообщение для админа -------------------------------- */

.yur-notice {
	padding: 12px 16px;
	border: 1px dashed #d0a000;
	border-radius: 10px;
	background: #fffaf0;
	color: #6b5200;
	font-size: 14px;
}