/**
 * Comparison Table — стили
 */

.e3d-comparison-wrapper {
	width    : 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.e3d-comparison-table {
	width          : 100%;
	border-collapse: separate;
	border-spacing : 0;
	font-size      : 14px;
	min-width      : 600px;
}

.e3d-comparison-table th,
.e3d-comparison-table td {
	padding      : 12px 16px;
	border-bottom: 1px solid #e5e5e5;
	text-align   : center;
	vertical-align: middle;
	border-right : 1px solid transparent;
	border-left  : 1px solid transparent;
}

.e3d-comparison-table th:first-child,
.e3d-comparison-table td:first-child {
	text-align: left;
	font-weight: 500;
	color     : #555;
	background: #f9fafb;
	width     : 200px;
}

/* ========== Шапка ========== */

.e3d-comparison-table thead th {
	padding-top   : 20px;
	padding-bottom: 16px;
	background    : #fff;
	position      : relative;
	border-top    : 3px solid transparent;
}

.e3d-comparison-table thead th.is-current {
	border-top   : 3px solid #00BFFF;
	border-left  : 1px solid #00BFFF;
	border-right : 1px solid #00BFFF;
}

.e3d-current-badge {
	display        : inline-block;
	padding        : 3px 10px;
	background     : #00BFFF;
	color          : #fff;
	font-size      : 11px;
	font-weight    : 600;
	letter-spacing : 0.5px;
	border-radius  : 12px;
	margin-bottom  : 8px;
	text-transform : uppercase;
}

.e3d-model-image-link {
	display       : block;
	margin        : 0 auto 10px;
	max-width     : 140px;
	transition    : transform 0.2s, opacity 0.2s;
	position      : relative;
}

.e3d-model-image-link:hover {
	transform: translateY(-2px);
	opacity  : 0.9;
}

.e3d-model-img {
	max-width : 100%;
	height    : auto;
	display   : block;
	margin    : 0 auto;
}

.e3d-model-title-link {
	display        : block;
	font-weight    : 600;
	font-size      : 15px;
	color          : #0073aa;
	text-decoration: none;
	margin-top     : 6px;
	transition     : color 0.2s;
	position       : relative;
}

.e3d-model-title-link:hover {
	color          : #00BFFF;
	text-decoration: underline;
}

/* Подсказка "кликабельно" — иконка стрелки рядом с названием */
.e3d-model-title-link::after {
	content     : ' →';
	opacity     : 0.5;
	transition  : opacity 0.2s, transform 0.2s;
	display     : inline-block;
}

.e3d-model-title-link:hover::after {
	opacity   : 1;
	transform : translateX(3px);
}

/* Подсказка "кликабельно" на картинке */
.e3d-model-image-link::after {
	content    : '';
	position   : absolute;
	top        : 4px;
	right      : 4px;
	width      : 24px;
	height     : 24px;
	background : rgba(0, 191, 255, 0.9);
	border-radius: 50%;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M9 5l7 7-7 7'/%3E%3C/svg%3E");
	background-size: 14px;
	background-repeat: no-repeat;
	background-position: center;
	opacity    : 0;
	transition : opacity 0.2s;
	pointer-events: none;
}

.e3d-model-image-link:hover::after {
	opacity: 1;
}

.e3d-no-image {
	display        : flex;
	align-items    : center;
	justify-content: center;
	width          : 100px;
	height         : 100px;
	background     : #f0f0f0;
	color          : #aaa;
	margin         : 0 auto;
	border-radius  : 4px;
}

/* ========== Тело таблицы ========== */

.e3d-comparison-table tbody tr:hover {
	background: #fafbfc;
}

.e3d-row-cell {
	color     : #333;
	font-weight: 500;
}

.e3d-row-cell.is-current {
	background  : rgba(0, 191, 255, 0.05);
	border-left : 1px solid #00BFFF;
	border-right: 1px solid #00BFFF;
	font-weight : 600;
}

.e3d-suffix {
	color    : #888;
	font-size: 0.9em;
	font-weight: normal;
}

.e3d-icon-check {
	display       : inline-flex;
	align-items   : center;
	justify-content: center;
	width         : 24px;
	height        : 24px;
	border-radius : 50%;
	background    : #25D366;
	color         : #fff;
	font-weight   : bold;
	font-size     : 14px;
}

.e3d-icon-cross {
	color     : #ccc;
	font-size : 18px;
}

.e3d-row-img {
	max-width : 60px;
	height    : auto;
	display   : block;
	margin    : 0 auto;
	border-radius: 4px;
}

/* ========== Подвал с кнопками ========== */

.e3d-comparison-table tfoot td {
	padding-top   : 18px;
	padding-bottom: 18px;
	background    : #fff;
}

.e3d-comparison-table tfoot td.is-current {
	border-bottom: 3px solid #00BFFF;
	border-left  : 1px solid #00BFFF;
	border-right : 1px solid #00BFFF;
}

.e3d-buy-button {
	display        : inline-flex;
	align-items    : center;
	gap            : 8px;
	padding        : 10px 22px;
	background     : #25D366;
	color          : #fff;
	font-weight    : 600;
	font-size      : 14px;
	text-decoration: none;
	border-radius  : 6px;
	transition     : background 0.2s, transform 0.2s, box-shadow 0.2s;
	border         : none;
	cursor         : pointer;
}

.e3d-buy-button:hover {
	background: #1ebe57;
	transform : translateY(-1px);
	box-shadow: 0 4px 12px rgba(37, 211, 102, 0.3);
	color     : #fff;
}

.e3d-wa-icon {
	width : 18px;
	height: 18px;
}

.e3d-current-here {
	display       : inline-block;
	padding       : 10px 22px;
	color         : #00BFFF;
	font-weight   : 600;
	font-size     : 14px;
	border        : 1.5px dashed #00BFFF;
	border-radius : 6px;
	background    : transparent;
}

/* ========== Notice в редакторе ========== */

.e3d-comparison-wrapper + .e3d-empty-notice,
.e3d-empty-notice {
	padding         : 30px 20px;
	background      : #fff8dc;
	border          : 1px dashed #d4a017;
	border-radius   : 4px;
	color           : #6b5400;
	text-align      : center;
	font-size       : 14px;
}

/* ========== Mobile ========== */

@media ( max-width: 768px ) {
	.e3d-comparison-table {
		font-size: 13px;
		min-width: 520px;
	}

	.e3d-comparison-table th,
	.e3d-comparison-table td {
		padding: 8px 10px;
	}

	.e3d-comparison-table th:first-child,
	.e3d-comparison-table td:first-child {
		width: 130px;
	}

	.e3d-model-image-link {
		max-width: 90px;
	}

	.e3d-model-title-link {
		font-size: 13px;
	}

	.e3d-buy-button {
		padding: 8px 14px;
		font-size: 13px;
	}

	.e3d-current-here {
		padding: 8px 14px;
		font-size: 13px;
	}
}