/* ============================================
   СТИЛИ ДЛЯ ОБЫЧНЫХ ТАБЛИЦ (не содержание)
   ============================================ */

/* Базовые стили для обычных таблиц */
.work-content table:not(.table-of-contents) {
	width: 100%;
	max-width: 100%;
	border-collapse: collapse;
	margin: 20px 0;
	font-size: 14px;
	background: white;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.work-content table:not(.table-of-contents) th,
.work-content table:not(.table-of-contents) td {
	padding: 12px;
	border: 1px solid #e5e7eb;
	text-align: left;
	vertical-align: top;
	word-wrap: break-word;
	word-break: break-word;
	line-height: 1.5;
}

.work-content table:not(.table-of-contents) th {
	background: #f8fafc;
	font-weight: 600;
	color: #374151;
}

.work-content table:not(.table-of-contents) td {
	background: white;
	color: #1f2937;
}

/* Зебра-стиль для строк */
.work-content table:not(.table-of-contents) tbody tr:nth-child(even) {
	background: #f9fafb;
}

.work-content table:not(.table-of-contents) tbody tr:hover {
	background: #f3f4f6;
}

/* ============================================
   МОБИЛЬНАЯ ВЕРСИЯ (до 768px)
   ============================================ */

@media (max-width: 768px) {
	/* Таблица без скролла - текст переносится */
	.work-content table:not(.table-of-contents) {
		display: table;
		width: 100% !important;
		font-size: 11px;
		border: 1px solid #e5e7eb;
		border-radius: 8px;
		table-layout: fixed !important; /* Фиксированная ширина колонок */
	}

	.work-content table:not(.table-of-contents) thead,
	.work-content table:not(.table-of-contents) tbody {
		display: table-row-group;
	}

	.work-content table:not(.table-of-contents) tr {
		display: table-row;
	}

	.work-content table:not(.table-of-contents) th,
	.work-content table:not(.table-of-contents) td {
		display: table-cell;
		padding: 8px 6px;
		font-size: 11px;
		line-height: 1.4;
		/* ВАЖНО: разрешаем перенос текста */
		white-space: normal !important;
		word-wrap: break-word !important;
		word-break: break-word !important;
		overflow-wrap: break-word !important;
		/* Высота строки подстраивается под контент */
		height: auto;
	}

	/* Заголовки чуть жирнее для читаемости */
	.work-content table:not(.table-of-contents) th {
		font-size: 11px;
		font-weight: 700;
		line-height: 1.3;
	}
}

/* ============================================
   ОЧЕНЬ МАЛЕНЬКИЕ ЭКРАНЫ (до 480px)
   ============================================ */

@media (max-width: 480px) {
	.work-content table:not(.table-of-contents) {
		font-size: 10px;
	}

	.work-content table:not(.table-of-contents) th,
	.work-content table:not(.table-of-contents) td {
		padding: 6px 4px;
		font-size: 10px;
		line-height: 1.3;
	}

	.work-content table:not(.table-of-contents) th {
		font-size: 10px;
		line-height: 1.2;
	}
}

/* ============================================
   СРЕДНИЕ ЭКРАНЫ (481px - 768px)
   ============================================ */

@media (min-width: 481px) and (max-width: 768px) {
	.work-content table:not(.table-of-contents) th,
	.work-content table:not(.table-of-contents) td {
		padding: 10px 8px;
		font-size: 12px;
	}
}

/* ============================================
   ДЕСКТОПНАЯ ВЕРСИЯ (больше 768px)
   ============================================ */

@media (min-width: 769px) {
	/* На больших экранах таблица занимает всю ширину */
	.work-content table:not(.table-of-contents) {
		table-layout: auto;
		width: 100%;
	}

	/* Нормальные отступы и размер шрифта */
	.work-content table:not(.table-of-contents) th,
	.work-content table:not(.table-of-contents) td {
		padding: 12px 15px;
		font-size: 14px;
		line-height: 1.5;
	}
}

/* ============================================
   ДОПОЛНИТЕЛЬНЫЕ УЛУЧШЕНИЯ
   ============================================ */

/* Выравнивание для коротких ячеек */
.work-content table:not(.table-of-contents) td:empty::after {
	content: "—";
	color: #9ca3af;
}

/* Для очень длинных слов (URL, email) */
.work-content table:not(.table-of-contents) td {
	overflow-wrap: anywhere;
	hyphens: auto;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
}

/* ============================================
   ВРЕМЕННАЯ ОТЛАДКА (удалить после проверки)
   ============================================ */

/* Раскомментируйте для визуальной проверки:

.work-content table:not(.table-of-contents) {
	border: 3px solid blue !important;
}

.work-content table:not(.table-of-contents)::before {
	content: "📊 ОБЫЧНАЯ ТАБЛИЦА (без скролла)" !important;
	display: block !important;
	background: blue !important;
	color: white !important;
	padding: 5px !important;
	text-align: center !important;
	font-weight: bold !important;
	font-size: 12px !important;
}

*/