/* Контейнер для таблицы */
.custom-table-container {
    margin: 10px auto; /* Центрирование */
    max-width: 100%; /* Полная ширина */
    font-family: Arial, sans-serif;
    overflow-x: hidden; /* Убираем горизонтальную прокрутку */
}

/* Таблица */
.custom-table {
    width: 100%; /* Таблица занимает всю ширину контейнера */
    border-collapse: collapse; /* Убираем двойные границы */
    font-size: 12px; /* Уменьшенный шрифт */
    table-layout: auto; /* Колонки подстраиваются под контент */
}

/* Ячейки */
.custom-table th, .custom-table td {
    padding: 6px 8px; /* Удобные отступы */
    border: 1px solid #ddd; /* Границы между ячейками */
    text-align: left; /* Выравнивание текста */
    word-break: break-word; /* Перенос слов */
    overflow-wrap: break-word; /* Поддержка переноса */
    white-space: normal; /* Разрешаем перенос текста */
    hyphens: auto; /* Перенос по дефисам */
}

/* Заголовки таблицы */
.custom-table th {
    background-color: #f4f4f4; /* Светло-серый фон */
    font-weight: bold; /* Жирный текст */
    font-size: 13px; /* Уменьшенный шрифт */
    text-align: center; /* Центрируем заголовки */
}

/* Полосатость строк */
.custom-table tr:nth-child(even) {
    background-color: #f9f9f9; /* Светлый фон для четных строк */
}

.custom-table tr:hover {
    background-color: #e9e9e9; /* Подсветка строки */
}

/* Ограничение ширины текста для длинных колонок */
.custom-table td:nth-child(7) {
    max-width: 300px; /* Умеренно узкие колонки */
    word-wrap: break-word; /* Перенос слов */
    white-space: normal; /* Разрешаем перенос текста */
    hyphens: auto; /* Перенос по дефисам */
}

/* Адаптация для мобильных устройств */
@media (max-width: 768px) {
    /* Контейнер */
    .custom-table-container {
        padding: 0 5px; /* Уменьшенные отступы */
    }

    /* Таблица */
    .custom-table {
        font-size: 10px; /* Уменьшенный шрифт */
    }

    /* Ячейки */
    .custom-table th, .custom-table td {
        padding: 4px; /* Компактные отступы */
        font-size: 10px; /* Уменьшенный размер текста */
    }

    /* Перенос текста */
    .custom-table td {
        word-break: break-word; /* Разрешаем перенос длинных слов */
        white-space: normal; /* Перенос строк */
        hyphens: auto; /* Перенос текста по дефисам */
    }

    /* Заголовки */
    .custom-table th {
        font-size: 11px; /* Небольшой размер шрифта для заголовков */
        text-align: left; /* Выравнивание заголовков влево */
    }

    /* Равномерные колонки */
    .custom-table tr {
        display: table-row; /* Оставляем строки привычного вида */
    }
}
