/* 
 * Стили для таблиц на страницах
 * Соответствует ТЗ: п.5.4.4 Таблицы
 */

/* ==========================================================================
   Основные стили таблиц
   ========================================================================== */

.page-table-wrapper {
    margin: 48px 0;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.page-table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Gilroy', sans-serif;
    min-width: 600px; /* Минимальная ширина для таблиц */
}

/* Заголовки таблицы */
.page-table__header {
    background-color: #F9F6F5; /* Согласно ТЗ */
    color: #1A1A1A;
    font-weight: 600;
    text-align: left;
    padding: 20px 24px;
    border-bottom: 2px solid #E0DAD9;
    white-space: nowrap;
    font-size: 16px;
}

/* Ячейки таблицы */
.page-table__cell {
    padding: 20px 24px;
    border-bottom: 1px solid #E0DAD9;
    color: #4A4A4A;
    vertical-align: top;
    line-height: 1.5;
    font-size: 16px;
}

/* Строки таблицы */

.page-table__row:nth-child(even) {
    background-color: #F9F6F5; /* Зебра для четных строк */
}

/* Удаление границы у последней строки */
.page-table__row:last-child .page-table__cell {
    border-bottom: none;
}

/* ==========================================================================
   Адаптивность таблиц
   ========================================================================== */

@media (max-width: 1024px) {
    .page-table__header,
    .page-table__cell {
        padding: 16px 20px;
        font-size: 15px;
    }
}

@media (max-width: 767px) {
    .page-table-wrapper {
        margin: 32px -16px;
        padding: 0 16px;
        width: calc(100% + 32px);
    }
    
    .page-table {
        min-width: 700px; /* Для горизонтального скролла на мобильных */
    }
    
    .page-table__header,
    .page-table__cell {
        padding: 14px 16px;
        font-size: 14px;
    }
}

/* ==========================================================================
   Специальные типы таблиц
   ========================================================================== */

/* Таблица с компактными ячейками */
.page-table--compact .page-table__header,
.page-table--compact .page-table__cell {
    padding: 12px 16px;
}

/* Таблица с выравниванием по центру */
.page-table--center .page-table__cell {
    text-align: center;
}

/* Таблица с числовыми данными (выравнивание по правому краю) */
.page-table--numeric .page-table__cell {
    text-align: right;
    font-feature-settings: "tnum";
    font-variant-numeric: tabular-nums;
}

/* ==========================================================================
   Стили для таблиц в WYSIWYG редакторе
   ========================================================================== */

.entry-content table,
.wp-block-table table {
    width: 100%;
    border-collapse: collapse;
    margin: 32px 0;
}

.entry-content thead,
.wp-block-table thead {
    background-color: #F9F6F5;
}

.entry-content th,
.wp-block-table th {
    padding: 16px 20px;
    border: 1px solid #E0DAD9;
    font-weight: 600;
    text-align: left;
    color: #1A1A1A;
    font-size: 16px;
}

.entry-content td,
.wp-block-table td {
    padding: 16px 20px;
    border: 1px solid #E0DAD9;
    color: #4A4A4A;
    line-height: 1.5;
}

.entry-content tr:nth-child(even),
.wp-block-table tr:nth-child(even) {
    background-color: #F9F6F5;
}

/* Обертка для скролла в WYSIWYG таблицах */
.entry-content .table-wrapper,
.wp-block-table .table-wrapper {
    overflow-x: auto;
    margin: 32px 0;
    -webkit-overflow-scrolling: touch;
}

/* ==========================================================================
   Адаптивность для WYSIWYG таблиц
   ========================================================================== */

@media (max-width: 767px) {
    .entry-content table,
    .wp-block-table table {
        font-size: 14px;
    }
    
    .entry-content th,
    .entry-content td,
    .wp-block-table th,
    .wp-block-table td {
        padding: 12px 16px;
    }
    
    /* Делаем таблицы в контенте скроллируемыми */
    .entry-content > table,
    .wp-block-table > table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* ==========================================================================
   Таблицы в политиках (специальные стили)
   ========================================================================== */

.page--policy .page-table {
    border: 1px solid #E0DAD9;
    border-radius: 4px;
    overflow: hidden;
}

.page--policy .page-table__header {
    background-color: #863A3A;
    color: #FFFFFF;
    border-bottom: 2px solid #6A2E2E;
}

.page--policy .page-table__cell {
    border-color: #E0DAD9;
}

/* Цветовые акценты для важных данных */
.page-table__cell--important {
    background-color: rgba(134, 58, 58, 0.05);
    font-weight: 600;
    color: #863A3A;
}

.page-table__cell--warning {
    background-color: rgba(237, 108, 2, 0.05);
    color: #ED6C02;
}

.page-table__cell--success {
    background-color: rgba(46, 125, 50, 0.05);
    color: #2E7D32;
}

/* ==========================================================================
   Утилитарные классы для таблиц
   ========================================================================== */

.table-caption {
    caption-side: bottom;
    padding: 16px 0;
    color: #767676;
    font-size: 14px;
    text-align: center;
    margin-top: 8px;
}

.table-footer {
    margin-top: 16px;
    padding: 12px 16px;
    background-color: #F9F6F5;
    border-radius: 0 0 4px 4px;
    font-size: 14px;
    color: #4A4A4A;
    border-top: 1px solid #E0DAD9;
}