/*
 * Мобильные карточки для .table-responsive: визуальная сетка + сохранение <table> для SR.
 * Подписи — .crm-cell-label в DOM (crm-table-mobile-a11y.js), не псевдоэлемент.
 */

/* Десктоп: заголовки только в thead (td.headers → th); подписи в ячейках — для мобильных */
.table-responsive td .crm-cell-label {
    display: none;
}

@media screen and (max-width: 768px) {
    .table-responsive > table {
        display: table;
        width: 100%;
        border-collapse: separate;
        border-spacing: 0 10px;
    }

    .table-responsive > table > thead {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .table-responsive > table > tbody {
        display: table-row-group;
    }

    .table-responsive > table > tbody > tr {
        display: block;
        border: 1px solid var(--bs-border-color);
        border-radius: 10px;
        margin-bottom: 0;
        padding: 8px 10px;
        background-color: var(--crm-surface-elevated);
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
    }

    .table-responsive > table > tbody > tr > td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 8px;
        padding: 6px 4px;
        border: none;
        border-bottom: 1px solid var(--crm-line-soft);
        font-size: 13px;
        text-align: right;
        min-height: 34px;
    }

    .table-responsive > table > tbody > tr > td:last-child {
        border-bottom: none;
    }

    .table-responsive td::before {
        content: none !important;
        display: none !important;
    }

    .table-responsive td .crm-cell-label {
        display: block;
        font-weight: 600;
        color: var(--bs-link-hover-color);
        text-align: left;
        padding-right: 8px;
        flex: 0 0 42%;
        max-width: 42%;
        font-size: 12px;
        line-height: 1.2;
    }

    .table-responsive td[data-label="Гос. номер"] .crm-cell-label {
        font-weight: 700;
    }
}