/**
 * Таблица сравнения (.stomarus-compare-table)
 * Десктоп: 3 колонки. Узкий экран: шапка + блоки с серым заголовком-критерием.
 */

.stomarus-compare-table {
	--stomarus-compare-bg-head: #f0e8dc;
	--stomarus-compare-bg-row-mobile: #ebebeb;
	--stomarus-compare-border: #e0e0e0;
	--stomarus-compare-text: #2b2b2b;
	--stomarus-compare-pad: clamp(12px, 2.5vw, 18px);
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	font-family: 'Roboto', 'Arial', sans-serif;
	font-size: clamp(0.875rem, 1.6vw, 1rem);
	line-height: 1.45;
	color: var(--stomarus-compare-text);
}

/* ——— Десктоп ——— */
.stomarus-compare-table__desktop {
	display: none;
}

@media (min-width: 782px) {
	.stomarus-compare-table__desktop {
		display: block;
	}

	.stomarus-compare-table__mobile {
		display: none;
	}

	.stomarus-compare-table__row {
		display: grid;
		grid-template-columns: minmax(120px, 1.1fr) 1fr 1fr;
		gap: 0;
		border-bottom: 1px solid var(--stomarus-compare-border);
	}

	.stomarus-compare-table__row:last-child {
		border-bottom: none;
	}

	.stomarus-compare-table__row--head {
		background: var(--stomarus-compare-bg-head);
		border-bottom: 1px solid var(--stomarus-compare-border);
		font-weight: 600;
	}

	.stomarus-compare-table__cell {
		padding: var(--stomarus-compare-pad);
		box-sizing: border-box;
	}

	.stomarus-compare-table__cell--corner {
		background: var(--stomarus-compare-bg-head);
	}

	.stomarus-compare-table__cell--criterion {
		font-weight: 500;
		align-self: center;
	}

	.stomarus-compare-table__cell--minus .stomarus-compare-table__cell-inner,
	.stomarus-compare-table__cell--plus .stomarus-compare-table__cell-inner {
		display: flex;
		align-items: flex-start;
		gap: 0.5em;
		margin: 0;
	}

	.stomarus-compare-table__icon {
		width: 20px;
		height: 20px;
		flex: 0 0 auto;
		object-fit: contain;
		margin-top: 0.05em;
	}

	.stomarus-compare-table__text {
		flex: 1 1 auto;
		min-width: 0;
	}

	.stomarus-compare-table__text p {
		margin: 0 0 0.5em;
	}

	.stomarus-compare-table__text p:last-child {
		margin-bottom: 0;
	}
}

/* ——— Мобила ——— */
.stomarus-compare-table__mobile {
	display: block;
}

@media (min-width: 782px) {
	.stomarus-compare-table__mobile {
		display: none;
	}
}

.stomarus-compare-table__mobile-head {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	background: var(--stomarus-compare-bg-head);
	border-bottom: 1px solid var(--stomarus-compare-border);
	font-weight: 600;
}

.stomarus-compare-table__mobile-head-cell {
	padding: var(--stomarus-compare-pad);
	box-sizing: border-box;
	text-align: left;
}

.stomarus-compare-table__mobile-head-cell:first-child {
	border-right: 1px solid var(--stomarus-compare-border);
}

.stomarus-compare-table__mobile-block {
	border-bottom: 1px solid var(--stomarus-compare-border);
}

.stomarus-compare-table__mobile-block:last-child {
	border-bottom: none;
}

.stomarus-compare-table__mobile-criterion {
	margin: 0;
	padding: var(--stomarus-compare-pad);
	background: var(--stomarus-compare-bg-row-mobile);
	font-weight: 600;
	font-size: 0.95em;
	box-sizing: border-box;
}

.stomarus-compare-table__mobile-criterion p {
	margin: 0 0 0.35em;
}

.stomarus-compare-table__mobile-criterion p:last-child {
	margin-bottom: 0;
}

.stomarus-compare-table__mobile-pair {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
}

.stomarus-compare-table__mobile-pair .stomarus-compare-table__cell {
	padding: var(--stomarus-compare-pad);
	box-sizing: border-box;
	border-right: 1px solid var(--stomarus-compare-border);
}

.stomarus-compare-table__mobile-pair .stomarus-compare-table__cell:last-child {
	border-right: none;
}

.stomarus-compare-table__mobile .stomarus-compare-table__cell-inner {
	display: flex;
	align-items: flex-start;
	gap: 0.5em;
	margin: 0;
}

.stomarus-compare-table__mobile .stomarus-compare-table__icon {
	width: 20px;
	height: 20px;
	flex: 0 0 auto;
	object-fit: contain;
	margin-top: 0.05em;
}

/*
 * [stomarus_blocks] в колонке текста рядом с float-медиа (StomarusTextMediaBlock): узкая ширина ломает grid.
 * Класс .stomarus-blocks-root--compare-wide задаётся в PHP вместе с обёрткой.
 */
@media (min-width: 769px) {
	.stomarus-text-media .stomarus-text-media__body > .stomarus-blocks-root.stomarus-blocks-root--compare-wide {
		clear: both;
		width: 100%;
		min-width: 0;
		box-sizing: border-box;
	}
}