/* Европа-Ростов — страница сравнения [esync_compare]. */

.esync-compare {
	--c-primary: #0077A8;
	--c-primary-hover: #005E85;
	--c-ink: #1A2733;
	--c-muted: #5A6B7A;
	--c-line: #DFE5EA;
	--c-panel: #F4F7F9;
	--c-label: 220px;
	--c-col: 270px;
	color: var(--c-ink);
}

/* Вкладки по категориям */
.esync-compare__tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 16px;
}

body .esync-compare__tab {
	height: 40px !important;
	min-height: 0 !important;
	padding: 0 16px !important;
	border: 1px solid var(--c-line) !important;
	border-radius: 10px !important;
	background: #fff !important;
	box-shadow: none !important;
	color: var(--c-ink) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	cursor: pointer;
}

.esync-compare__tab span {
	margin-left: 4px;
	color: var(--c-muted);
}

body .esync-compare__tab.is-active {
	border-color: var(--c-primary) !important;
	background: #E8F3F8 !important;
	color: var(--c-primary) !important;
}

/* «Только различия» */
.esync-compare__diff {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 16px;
	color: var(--c-ink);
	font-size: 14px;
	cursor: pointer;
	user-select: none;
}

.esync-compare__diff input {
	width: 16px;
	height: 16px;
	margin: 0;
	accent-color: var(--c-primary);
}

.esync-compare.is-diff .esync-compare__row.is-same {
	display: none;
}

.esync-compare__panel {
	display: none;
}

.esync-compare__panel.is-active {
	display: block;
}

/* Таблица: первая колонка с подписями закреплена при прокрутке вбок. */
.esync-compare__scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

body .esync-compare__table {
	/* Ширина колонки постоянная: один товар не растягивается на весь
	   экран, четыре и больше уходят в прокрутку. */
	width: calc(var(--c-label) + var(--cols) * var(--c-col)) !important;
	min-width: 0 !important;
	max-width: none !important;
	margin: 0 !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	border: 0 !important;
	table-layout: fixed;
	font-size: 14px !important;
}

body .esync-compare__table th,
body .esync-compare__table td {
	padding: 10px 14px !important;
	border: 0 !important;
	border-bottom: 1px solid var(--c-line) !important;
	background: #fff;
	color: var(--c-ink) !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	line-height: 1.45 !important;
	text-align: left !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	vertical-align: top !important;
}

body .esync-compare__table tbody th[scope="row"],
body .esync-compare__corner {
	position: sticky;
	left: 0;
	z-index: 2;
	width: var(--c-label);
	color: var(--c-muted) !important;
}

body .esync-compare__table td.is-empty {
	color: #9AA5AD !important;
}

/* Строки, где значения различаются, чуть заметнее. */
body .esync-compare__row:not(.is-same) td {
	font-weight: 500 !important;
}

body .esync-compare__row:hover th,
body .esync-compare__row:hover td {
	background: var(--c-panel);
}

/* Заголовок группы */
body .esync-compare__group th {
	padding: 22px 0 8px !important;
	background: #fff !important;
	border-bottom: 1px solid var(--c-line) !important;
}

.esync-compare__group th span {
	position: sticky;
	left: 14px;
	color: var(--c-ink);
	font-size: 16px;
	font-weight: 700;
}

/* Карточки товаров */
body .esync-compare__product {
	padding: 0 14px 18px !important;
	border-bottom: 1px solid var(--c-line) !important;
}

.esync-compare__card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 6px;
	height: 100%;
}

body .esync-compare__remove {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
	width: 28px !important;
	height: 28px !important;
	min-height: 0 !important;
	padding: 0 !important;
	border: 1px solid var(--c-line) !important;
	border-radius: 50% !important;
	background: #fff !important;
	color: var(--c-muted) !important;
	font-size: 16px !important;
	line-height: 26px !important;
	cursor: pointer;
}

body .esync-compare__remove:hover {
	border-color: #D32718 !important;
	color: #D32718 !important;
}

.esync-compare__thumb {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 150px;
	margin-bottom: 4px;
}

body .esync-compare__img {
	width: auto !important;
	max-width: 100% !important;
	height: auto !important;
	max-height: 150px !important;
	object-fit: contain;
}

/* Высоты элементов карточки фиксированы, чтобы цена и кнопка
   стояли на одной линии во всех колонках, как бы ни было длинно
   название и есть ли старая цена. */
body .esync-compare__title {
	display: -webkit-box;
	height: 4.2em;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	color: var(--c-ink) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	text-decoration: none !important;
}

body .esync-compare__title:hover {
	color: var(--c-primary) !important;
}

.esync-compare__meta {
	display: flex;
	align-items: baseline;
	gap: 10px;
	height: 20px;
	overflow: hidden;
	white-space: nowrap;
}

.esync-compare__stock {
	overflow: hidden;
	font-size: 13px;
	font-weight: 600;
	line-height: 20px;
	text-overflow: ellipsis;
}

body .esync-compare__rating {
	display: inline-flex;
	align-items: baseline;
	gap: 3px;
	flex: 0 0 auto;
	font-size: 13px;
	line-height: 20px;
	text-decoration: none !important;
}

/* Без <b>/<i>: тема красит их по-своему (курсив) — свои классы. */
body .esync-compare__rating span {
	font-style: normal !important;
	font-size: 13px !important;
}

body .esync-compare__star { color: #F2A93B !important; }
body .esync-compare__score { color: var(--c-ink) !important; font-weight: 600 !important; }
body .esync-compare__count { color: var(--c-muted) !important; font-weight: 400 !important; }
body .esync-compare__rating:hover .esync-compare__count { color: var(--c-primary) !important; }

.esync-compare__stock.in-stock { color: #3F7016; }
.esync-compare__stock.available-on-backorder { color: #9A5C00; }

body .esync-compare__price {
	display: flex;
	align-items: baseline;
	height: 28px;
	margin-top: 2px;
}

body .esync-compare__price,
body .esync-compare__price .amount {
	color: var(--c-ink) !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	white-space: nowrap;
}

body .esync-compare__price del,
body .esync-compare__price del .amount {
	margin-right: 6px;
	color: var(--c-muted) !important;
	font-size: 13px !important;
	font-weight: 400 !important;
}

body .esync-compare__price ins {
	text-decoration: none !important;
	background: none !important;
}

body .esync-compare__price .esync-price-badge {
	display: none;
}

body .esync-compare__buy {
	display: flex !important;
	align-items: center;
	justify-content: center;
	height: 40px;
	margin-top: 6px;
	padding: 0 14px;
	border-radius: 10px;
	background: var(--c-primary) !important;
	color: #fff !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	text-transform: none !important;
}

body .esync-compare__buy:hover {
	background: var(--c-primary-hover) !important;
}

body .esync-compare__buy.added::after {
	content: " ✓";
}

.esync-compare .added_to_cart {
	display: none !important;
}

/* Пусто */
.esync-compare--empty {
	max-width: 520px;
	margin: 40px auto;
	padding: 32px;
	border-radius: 16px;
	background: var(--c-panel);
	text-align: center;
}

.esync-compare__empty-title {
	margin-bottom: 8px;
	font-size: 20px;
	font-weight: 700;
}

.esync-compare--empty p {
	margin: 0 0 18px;
	color: var(--c-muted);
	font-size: 15px;
}

.esync-compare--empty .esync-compare__buy {
	display: inline-flex !important;
}

@media (max-width: 767px) {
	.esync-compare {
		--c-label: 130px;
		--c-col: 170px;
	}

	.esync-compare__thumb {
		height: 110px;
	}

	body .esync-compare__img {
		max-height: 110px !important;
	}

	body .esync-compare__table th,
	body .esync-compare__table td {
		padding: 8px 10px !important;
		font-size: 13px !important;
	}
}

/* Цена со скидкой — красная, как в каталоге и карточке. */
body .esync-compare__price ins,
body .esync-compare__price ins .amount,
body .esync-compare__price ins bdi {
	color: #D32718 !important;
}

/* Бренд — ссылкой на его товары. */
body .esync-compare__table td a {
	color: var(--c-primary) !important;
	text-decoration: none !important;
}

body .esync-compare__table td a:hover {
	text-decoration: underline !important;
}