/* ============================================================================
   Таблицы
   ============================================================================ */

.applications-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: auto;
}

.applications-table td,
.applications-table th {
    padding: 0.35rem 0.5rem; /* Уменьшен padding для компактности */
    border-bottom: 1px solid rgba(16, 100, 209, 0.15);
}

.applications-table thead th {
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.9), rgba(224, 231, 255, 0.7), rgba(237, 233, 254, 0.6));
    color: #1064d1;
    font-weight: 700;
    border-bottom: 2px solid;
    border-image: linear-gradient(90deg, rgba(16, 100, 209, 0.4), rgba(139, 92, 246, 0.4)) 1;
}

.applications-table tbody tr {
    height: auto; /* Автоматическая высота строки */
    min-height: auto; /* Минимальная высота без ограничений */
}

.applications-table tbody tr:hover {
    background: rgba(239, 246, 255, 0.5);
}

.applications-table th {
    text-align: left;
    font-size: 0.75rem; /* Уменьшен размер шрифта для компактности */
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    padding: 0.4rem 0.5rem; /* Уменьшен padding для заголовков */
}

.applications-table.wide td form.inline-form {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.table-wide {
    width: 100%;
    border-collapse: collapse;
}

.table-wide td,
.table-wide th {
    padding: 0.35rem 0.5rem; /* Уменьшен padding для компактности */
    text-align: left;
    border-bottom: 1px solid rgba(16, 100, 209, 0.15);
}

.table-wide th {
    font-size: 0.75rem; /* Уменьшен размер шрифта для компактности */
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #1064d1;
    font-weight: 700;
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.9), rgba(224, 231, 255, 0.7), rgba(237, 233, 254, 0.6));
    border-bottom: 2px solid;
    border-image: linear-gradient(90deg, rgba(16, 100, 209, 0.4), rgba(139, 92, 246, 0.4)) 1;
    padding: 0.4rem 0.5rem; /* Уменьшен padding для заголовков */
}

.table-wide tbody tr:hover {
    background: rgba(239, 246, 255, 0.4);
}

/* ============================================================================
   АДАПТИВНОСТЬ ТАБЛИЦ
   ============================================================================ */

/* Обертка для горизонтальной прокрутки на мобильных */
.table-wrapper {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible !important; /* Убираем вертикальную прокрутку - важно для выпадающих списков */
    -webkit-overflow-scrolling: touch;
    margin: 1rem 0;
    position: relative;
    /* Фон наследуется от родителя (карточки) */
    background: transparent;
    /* Убираем горизонтальные отступы для синхронизации с фоном карточки */
    margin-left: -1.5rem;
    margin-right: -1.5rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    max-height: none; /* Убираем ограничение высоты */
}

/* На больших экранах таблица внутри обертки должна быть 100% */
.table-wrapper .applications-table,
.table-wrapper .table-wide {
    width: 100%;
    min-width: 100%;
}

.table-wrapper::-webkit-scrollbar {
    height: 8px;
}

.table-wrapper::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

.table-wrapper::-webkit-scrollbar-thumb {
    background: rgba(139, 92, 246, 0.5);
    border-radius: 4px;
}

.table-wrapper::-webkit-scrollbar-thumb:hover {
    background: rgba(168, 85, 247, 0.7);
}

/* Адаптивность для таблиц */
@media (max-width: 1024px) {
    .applications-table,
    .table-wide {
        font-size: 0.85rem;
    }
    
    .applications-table td,
    .applications-table th,
    .table-wide td,
    .table-wide th {
        padding: 0.3rem 0.4rem; /* Уменьшен padding для компактности */
    }
    
    .applications-table th,
    .table-wide th {
        font-size: 0.7rem; /* Уменьшен размер шрифта */
        padding: 0.35rem 0.4rem; /* Уменьшен padding для заголовков */
    }
    
    /* На планшетах таблица должна быть 100% ширины, но может прокручиваться */
    .table-wrapper .applications-table,
    .table-wrapper .table-wide {
        width: 100%;
        min-width: 100%;
    }
    
    /* Корректируем отступы для планшетов */
    .table-wrapper {
        margin-left: -1rem;
        margin-right: -1rem;
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

/* На очень маленьких экранах - уменьшаем размеры и делаем более компактными */
@media (max-width: 768px) {
    /* Таблицы внутри обертки получают min-width для прокрутки, но не width: 100% */
    .table-wrapper .applications-table,
    .table-wrapper .table-wide {
        font-size: 0.8rem;
        width: auto;
        min-width: 600px; /* Минимальная ширина для горизонтальной прокрутки */
    }
    
    /* Корректируем отступы для мобильных */
    .table-wrapper {
        margin-left: -0.75rem;
        margin-right: -0.75rem;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
    
    .applications-table td,
    .applications-table th,
    .table-wide td,
    .table-wide th {
        padding: 0.25rem 0.3rem; /* Уменьшен padding для компактности */
        white-space: nowrap;
    }
    
    .applications-table th,
    .table-wide th {
        font-size: 0.65rem; /* Уменьшен размер шрифта */
        letter-spacing: 0.02em;
        padding: 0.3rem 0.3rem; /* Уменьшен padding для заголовков */
    }
    
    /* Скрываем менее важные колонки на мобильных */
    .applications-table th:nth-child(n+6),
    .applications-table td:nth-child(n+6) {
        display: none;
    }
    
    /* Показываем важные колонки */
    .applications-table th:nth-child(1),
    .applications-table td:nth-child(1),
    .applications-table th:nth-child(2),
    .applications-table td:nth-child(2),
    .applications-table th:nth-child(3),
    .applications-table td:nth-child(3),
    .applications-table th:nth-child(4),
    .applications-table td:nth-child(4),
    .applications-table th:nth-child(5),
    .applications-table td:nth-child(5) {
        display: table-cell;
    }
}

/* На очень маленьких экранах (до 480px) - еще более компактный вид */
@media (max-width: 480px) {
    .table-wrapper .applications-table,
    .table-wrapper .table-wide {
        font-size: 0.75rem;
        width: auto;
        min-width: 500px;
    }
    
    .applications-table td,
    .applications-table th,
    .table-wide td,
    .table-wide th {
        padding: 0.2rem 0.25rem; /* Уменьшен padding для компактности */
    }
    
    .applications-table th,
    .table-wide th {
        padding: 0.25rem 0.25rem; /* Уменьшен padding для заголовков */
        font-size: 0.6rem; /* Уменьшен размер шрифта */
    }
    
    /* Корректируем отступы для маленьких мобильных */
    .table-wrapper {
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
}