/**
 * MERP - تحويل الجداول إلى بطاقات على الجوال
 * يعمم على جميع لوحات التحكم والأقسام
 * Table rows → Cards on mobile (≤768px)
 */

@media (max-width: 768px) {
    /* جميع الجداول داخل المحتوى الرئيسي - يعمم على كل لوحات التحكم والأقسام */
    main .table-responsive table,
    .content-area .table-responsive table,
    .hr-content .table-responsive table,
    .inv-main .table-responsive table,
    .inv-content .table-responsive table,
    .inv-container .table-responsive table,
    .mt-content .table-responsive table,
    .mt-main .table-responsive table,
    .module-content .table-responsive table,
    .accounting-content .table-responsive table,
    .container-fluid .table-responsive table,
    .container .table-responsive table,
    main .card table,
    .content-area .card table,
    .hr-content .card table,
    .inv-main .card table,
    .inv-content .card table,
    .inv-container .card table,
    .mt-content .card table,
    .mt-main .card table,
    .module-content .card table,
    .accounting-content .card table,
    .container-fluid .card table,
    .container .card table,
    main table.table,
    .content-area table.table,
    .hr-content table.table,
    .inv-main table.table,
    .inv-content table.table,
    .inv-container table.table,
    .mt-content table.table,
    .mt-main table.table,
    .module-content table.table,
    .accounting-content table.table,
    .container-fluid table.table,
    .container table.table {
        display: block;
        border: none;
    }

    main .table-responsive,
    .content-area .table-responsive,
    .hr-content .table-responsive,
    .inv-main .table-responsive,
    .inv-content .table-responsive,
    .inv-container .table-responsive,
    .mt-content .table-responsive,
    .mt-main .table-responsive,
    .module-content .table-responsive,
    .accounting-content .table-responsive,
    .container-fluid .table-responsive,
    .container .table-responsive {
        overflow: visible;
        margin: 0 -0.5rem;
    }

    main table thead,
    .content-area table thead,
    .hr-content table thead,
    .inv-main table thead,
    .inv-content table thead,
    .inv-container table thead,
    .mt-content table thead,
    .mt-main table thead,
    .module-content table thead,
    .accounting-content table thead,
    .container-fluid table thead,
    .container table thead {
        display: none;
    }

    main table tbody,
    .content-area table tbody,
    .hr-content table tbody,
    .inv-main table tbody,
    .inv-content table tbody,
    .inv-container table tbody,
    .mt-content table tbody,
    .mt-main table tbody,
    .module-content table tbody,
    .accounting-content table tbody,
    .container-fluid table tbody,
    .container table tbody {
        display: block;
    }

    main table tbody tr,
    .content-area table tbody tr,
    .hr-content table tbody tr,
    .inv-main table tbody tr,
    .inv-content table tbody tr,
    .inv-container table tbody tr,
    .mt-content table tbody tr,
    .mt-main table tbody tr,
    .module-content table tbody tr,
    .accounting-content table tbody tr,
    .container-fluid table tbody tr,
    .container table tbody tr {
        display: block;
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        margin-bottom: 12px;
        padding: 16px;
        box-shadow: 0 2px 8px rgba(11, 114, 228, 0.06);
        transition: all 0.2s ease;
    }

    main table tbody tr:last-child,
    .content-area table tbody tr:last-child,
    .hr-content table tbody tr:last-child,
    .inv-main table tbody tr:last-child,
    .inv-content table tbody tr:last-child,
    .inv-container table tbody tr:last-child,
    .mt-content table tbody tr:last-child,
    .mt-main table tbody tr:last-child,
    .module-content table tbody tr:last-child,
    .accounting-content table tbody tr:last-child,
    .container-fluid table tbody tr:last-child,
    .container table tbody tr:last-child {
        margin-bottom: 0;
    }

    main table tbody tr:hover,
    .content-area table tbody tr:hover,
    .hr-content table tbody tr:hover,
    .inv-main table tbody tr:hover,
    .inv-content table tbody tr:hover,
    .inv-container table tbody tr:hover,
    .mt-content table tbody tr:hover,
    .mt-main table tbody tr:hover,
    .module-content table tbody tr:hover,
    .accounting-content table tbody tr:hover,
    .container-fluid table tbody tr:hover,
    .container table tbody tr:hover {
        box-shadow: 0 4px 16px rgba(11, 114, 228, 0.1);
    }

    main table tbody td,
    .content-area table tbody td,
    .hr-content table tbody td,
    .inv-main table tbody td,
    .inv-content table tbody td,
    .inv-container table tbody td,
    .mt-content table tbody td,
    .mt-main table tbody td,
    .module-content table tbody td,
    .accounting-content table tbody td,
    .container-fluid table tbody td,
    .container table tbody td {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 12px;
        padding: 10px 0;
        border: none;
        border-bottom: 1px solid #f1f5f9;
    }

    main table tbody td:last-child,
    .content-area table tbody td:last-child,
    .hr-content table tbody td:last-child,
    .inv-main table tbody td:last-child,
    .inv-content table tbody td:last-child,
    .inv-container table tbody td:last-child,
    .mt-content table tbody td:last-child,
    .mt-main table tbody td:last-child,
    .module-content table tbody td:last-child,
    .accounting-content table tbody td:last-child,
    .container-fluid table tbody td:last-child,
    .container table tbody td:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }

    main table tbody tr td:first-child,
    .content-area table tbody tr td:first-child,
    .hr-content table tbody tr td:first-child,
    .inv-main table tbody tr td:first-child,
    .inv-content table tbody tr td:first-child,
    .inv-container table tbody tr td:first-child,
    .mt-content table tbody tr td:first-child,
    .mt-main table tbody tr td:first-child,
    .module-content table tbody tr td:first-child,
    .accounting-content table tbody tr td:first-child,
    .container-fluid table tbody tr td:first-child,
    .container table tbody tr td:first-child {
        padding-top: 0;
    }

    main table tbody td::before,
    .content-area table tbody td::before,
    .hr-content table tbody td::before,
    .inv-main table tbody td::before,
    .inv-content table tbody td::before,
    .inv-container table tbody td::before,
    .mt-content table tbody td::before,
    .mt-main table tbody td::before,
    .module-content table tbody td::before,
    .accounting-content table tbody td::before,
    .container-fluid table tbody td::before,
    .container table tbody td::before {
        content: attr(data-label);
        font-weight: 700;
        color: #64748b;
        font-size: 0.8rem;
        flex-shrink: 0;
        min-width: 90px;
    }

    main table tbody td[data-label=""]::before,
    .content-area table tbody td[data-label=""]::before,
    .hr-content table tbody td[data-label=""]::before,
    .inv-main table tbody td[data-label=""]::before,
    .inv-content table tbody td[data-label=""]::before,
    .inv-container table tbody td[data-label=""]::before,
    .mt-content table tbody td[data-label=""]::before,
    .mt-main table tbody td[data-label=""]::before,
    .module-content table tbody td[data-label=""]::before,
    .accounting-content table tbody td[data-label=""]::before,
    .container-fluid table tbody td[data-label=""]::before,
    .container table tbody td[data-label=""]::before {
        display: none;
    }

    main table tbody td .btn,
    main table tbody td .badge,
    .content-area table tbody td .btn,
    .content-area table tbody td .badge,
    .hr-content table tbody td .btn,
    .hr-content table tbody td .badge,
    .inv-main table tbody td .btn,
    .inv-main table tbody td .badge,
    .inv-content table tbody td .btn,
    .inv-content table tbody td .badge,
    .inv-container table tbody td .btn,
    .inv-container table tbody td .badge,
    .mt-content table tbody td .btn,
    .mt-content table tbody td .badge,
    .mt-main table tbody td .btn,
    .mt-main table tbody td .badge,
    .module-content table tbody td .btn,
    .module-content table tbody td .badge,
    .accounting-content table tbody td .btn,
    .accounting-content table tbody td .badge,
    .container-fluid table tbody td .btn,
    .container-fluid table tbody td .badge,
    .container table tbody td .btn,
    .container table tbody td .badge {
        margin: 0;
    }

    main table tbody td .d-flex,
    .content-area table tbody td .d-flex,
    .hr-content table tbody td .d-flex,
    .inv-main table tbody td .d-flex,
    .inv-content table tbody td .d-flex,
    .inv-container table tbody td .d-flex,
    .mt-content table tbody td .d-flex,
    .mt-main table tbody td .d-flex,
    .module-content table tbody td .d-flex,
    .accounting-content table tbody td .d-flex,
    .container-fluid table tbody td .d-flex,
    .container table tbody td .d-flex {
        flex-wrap: wrap;
        gap: 6px;
    }
}