/* =====================================================================
   [شكل] كل جداول السيستم على الكمبيوتر = صفوف كروت بنفس لغة كروت الأعضاء
   - كل صف كارت أبيض بحواف دايرية وظل خفيف وخط لون على جنبه (أخضر/أحمر/برتقالي حسب الحالة اللي جواه)
   - العناوين فوق خفيفة (والترتيب بالدوسة عليها شغال زي ما هو)
   - زراير التعديل/المسح/الدفع بقت مربعات أيقونات زي كارت العضو
   - الإجمالي (tfoot) كارت غامق
   شكل بس: نفس الجداول ونفس الصفوف والأحداث والترقيم والتصدير — مفيش أي تغيير في البيانات
   الموبايل (أقل من 768) زي ما هو: كروت الموبايل اللي في gs-pages.css
   لو جدول محتاج يفضل عادي: class="gs-plain"
   ===================================================================== */
@media (min-width: 768px) {
    /* ---------- الجدول ---------- */
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details),
    .gs-admin table.gs-table:not(.gs-plain),
    .gs-admin table.sh-table:not(.gs-plain),
    .gs-admin table.pf-table:not(.gs-plain),
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) {
        border-collapse: separate !important; border-spacing: 0 8px !important;
        border: 0 !important; background: transparent !important; margin-top: -4px !important; margin-bottom: 0 !important;
    }
    /* الغلاف: من غير إطار عشان الكروت هي اللي تبان */
    .gs-admin .gs-table-wrap:has(> table.gs-table:not(.gs-plain)),
    .gs-admin .sh-table-wrap:has(> table.sh-table:not(.gs-plain)),
    .gs-admin .pf-table-wrap:has(> table.pf-table:not(.gs-plain)) {
        border: 0 !important; background: transparent !important; box-shadow: none !important; border-radius: 0; padding: 0 3px 4px; overflow: visible;
    }
    .gs-admin .pf-table-wrap:has(> table.pf-table:not(.gs-plain)) { overflow-x: auto; }

    /* ---------- العناوين: خفيفة فوق الكروت ---------- */
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > thead,
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > thead > tr,
    .gs-admin table.gs-table:not(.gs-plain) > thead, .gs-admin table.gs-table:not(.gs-plain) > thead > tr,
    .gs-admin table.sh-table:not(.gs-plain) > thead, .gs-admin table.sh-table:not(.gs-plain) > thead > tr,
    .gs-admin table.pf-table:not(.gs-plain) > thead, .gs-admin table.pf-table:not(.gs-plain) > thead > tr,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > thead,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > thead > tr { background: transparent !important; box-shadow: none !important; }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > thead > tr > th,
    .gs-admin table.gs-table:not(.gs-plain) > thead > tr > th,
    .gs-admin table.sh-table:not(.gs-plain) > thead > tr > th,
    .gs-admin table.pf-table:not(.gs-plain) > thead > tr > th,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > thead > tr > th {
        background: transparent !important; border: 0 !important; box-shadow: none !important;
        color: #8a9099 !important; font-size: 11.5px !important; font-weight: 700 !important; letter-spacing: .02em;
        padding: 6px 12px 0 !important; white-space: nowrap; text-align: start;
    }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > thead > tr > th.sorting_asc,
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > thead > tr > th.sorting_desc { color: #1d2127 !important; }
    /* سهم الترتيب جنب العمود المترتب بيه */
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > thead > tr > th.sorting_asc::after,
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > thead > tr > th.sorting_desc::after {
        content: '\f0d8'; font-family: FontAwesome; font-size: 11px; color: var(--gs-red, #d53c41); margin-inline-start: 6px; position: static; opacity: 1; display: inline-block;
    }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > thead > tr > th.sorting_desc::after { content: '\f0d7'; }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > thead > tr > th.sorting::after { display: none; }

    /* ---------- الصف = كارت ---------- */
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child),
    .gs-admin table.gs-table:not(.gs-plain) > tbody > tr,
    .gs-admin table.sh-table:not(.gs-plain) > tbody > tr,
    .gs-admin table.pf-table:not(.gs-plain) > tbody > tr,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr:not(.child) {
        background: transparent !important; box-shadow: none !important; filter: drop-shadow(0 0 .6px rgba(16, 24, 40, .34)) drop-shadow(0 3px 8px rgba(16, 24, 40, .06));
        transition: filter .15s ease, transform .15s ease;
    }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child) > td,
    .gs-admin table.gs-table:not(.gs-plain) > tbody > tr > td,
    .gs-admin table.sh-table:not(.gs-plain) > tbody > tr > td,
    .gs-admin table.pf-table:not(.gs-plain) > tbody > tr > td,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr:not(.child) > td {
        background: #fff !important; border: 0 !important;
        padding: 13px 12px !important; vertical-align: middle !important; font-size: 13.5px; font-weight: 600; color: #1d2127;
        box-shadow: none !important; transition: background-color .15s ease, border-color .15s ease;
    }
    /* أول خانة وآخر خانة: الحواف + خط اللون */
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child) > td:first-child,
    .gs-admin table.gs-table:not(.gs-plain) > tbody > tr > td:first-child,
    .gs-admin table.sh-table:not(.gs-plain) > tbody > tr > td:first-child,
    .gs-admin table.pf-table:not(.gs-plain) > tbody > tr > td:first-child,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr:not(.child) > td:first-child {
        border-start-start-radius: 14px; border-end-start-radius: 14px;
        padding-inline-start: 18px !important; font-weight: 800;
    }
    .gs-admin table.dataTable.dtr-inline.collapsed:not(.gs-plain) > tbody > tr:not(.child) > td.dtr-control,
    .gs-admin table.dataTable.dtr-inline.collapsed:not(.gs-plain) > tbody > tr:not(.child) > td:first-child { padding-inline-start: 40px !important; }
    html[dir="ltr"] .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child) > td:first-child,
    html[dir="ltr"] .gs-admin table.gs-table:not(.gs-plain) > tbody > tr > td:first-child,
    html[dir="ltr"] .gs-admin table.sh-table:not(.gs-plain) > tbody > tr > td:first-child,
    html[dir="ltr"] .gs-admin table.pf-table:not(.gs-plain) > tbody > tr > td:first-child,
    html[dir="ltr"] .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr:not(.child) > td:first-child { box-shadow: inset 4px 0 0 var(--gs-row-bar, #e3e6ea) !important; }
    html[dir="rtl"] .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child) > td:first-child,
    html[dir="rtl"] .gs-admin table.gs-table:not(.gs-plain) > tbody > tr > td:first-child,
    html[dir="rtl"] .gs-admin table.sh-table:not(.gs-plain) > tbody > tr > td:first-child,
    html[dir="rtl"] .gs-admin table.pf-table:not(.gs-plain) > tbody > tr > td:first-child,
    html[dir="rtl"] .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr:not(.child) > td:first-child { box-shadow: inset -4px 0 0 var(--gs-row-bar, #e3e6ea) !important; }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child) > td:last-child,
    .gs-admin table.gs-table:not(.gs-plain) > tbody > tr > td:last-child,
    .gs-admin table.sh-table:not(.gs-plain) > tbody > tr > td:last-child,
    .gs-admin table.pf-table:not(.gs-plain) > tbody > tr > td:last-child,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr:not(.child) > td:last-child,
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child) > td.gs-td-last {
        border-start-end-radius: 14px; border-end-end-radius: 14px;
    }
    /* لون الخط حسب الحالة اللي جوه الصف (زي كارت العضو) */
    .gs-admin table > tbody > tr:has(.gs-pill.is-green, p[style*="color:green"], p[style*="color: green"], h5[style*="color:green"], h5[style*="color: green"]) { --gs-row-bar: #16a34a; }
    .gs-admin table > tbody > tr:has(.gs-pill.is-orange, p[style*="darkorange"]) { --gs-row-bar: #f59e0b; }
    .gs-admin table > tbody > tr:has(.gs-pill.is-red, p[style*="color:red"], p[style*="color: red"], p[style*="color: Red"]) { --gs-row-bar: var(--gs-red, #d53c41); }
    .gs-admin table.pf-table > tbody > tr.is-off { --gs-row-bar: #c3c7ce; }

    /* الهوفر: الكارت بيطلع لفوق شوية والخط يحمر */
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child):hover,
    .gs-admin table.gs-table:not(.gs-plain) > tbody > tr:hover,
    .gs-admin table.sh-table:not(.gs-plain) > tbody > tr:hover,
    .gs-admin table.pf-table:not(.gs-plain) > tbody > tr:hover,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr:not(.child):hover {
        filter: drop-shadow(0 0 .8px rgba(var(--gs-red-rgb, 213, 60, 65), .55)) drop-shadow(0 10px 16px rgba(16, 24, 40, .10)); transform: translateY(-1px);
    }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child):hover > td,
    .gs-admin table.gs-table:not(.gs-plain) > tbody > tr:hover > td,
    .gs-admin table.sh-table:not(.gs-plain) > tbody > tr:hover > td,
    .gs-admin table.pf-table:not(.gs-plain) > tbody > tr:hover > td,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr:not(.child):hover > td { background: #fff !important; }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr.selected > td,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr.selected > td { background: #fff7f7 !important; }
    /* صف فاضي (مفيش نتايج) */
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td.dataTables_empty,
    .gs-admin table.pf-table:not(.gs-plain) > tbody > tr > td.pf-empty,
    .gs-admin table.pf-table:not(.gs-plain) > tbody > tr > td[colspan] {
        text-align: center !important; color: #9aa0a8 !important; font-weight: 600 !important; padding: 30px 16px !important;
        border: 1px dashed #dfe2e7 !important; border-radius: 14px !important; box-shadow: none !important;
    }
    .gs-admin table.dataTable:not(.gs-member-cards) > tbody > tr:has(> td.dataTables_empty),
    .gs-admin table.pf-table > tbody > tr:has(> td[colspan]) { box-shadow: none !important; transform: none !important; }

    /* ---------- الخانات ---------- */
    /* التواريخ والأرقام والموبايلات مايتكسروش على سطرين (الأسماء والكلام الطويل بيلفوا عادي عشان الجدول مايتطويش) */
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child) > td.gs-td-nw,
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tfoot > tr > * { white-space: nowrap; }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a.gs-member-link,
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a.gs-name-link { font-weight: 800; }
    /* زراير الأيقونات القديمة (تعديل / مسح / دفع / هيستوري) = مربعات زي كارت العضو */
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a.blue,
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a.red,
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a.green,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a.blue,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a.red,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a.green {
        display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; margin: 0 2px;
        border-radius: 11px; background: #f4f5f7; color: #1d2127 !important; text-decoration: none !important; vertical-align: middle;
        transition: background-color .15s ease, color .15s ease, transform .15s ease;
    }
    .gs-admin table > tbody > tr > td a.blue:hover { background: #141414; color: #fff !important; transform: translateY(-1px); }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a.red,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a.red { background: #fdecec; color: var(--gs-red, #d53c41) !important; }
    .gs-admin table > tbody > tr > td a.red:hover { background: var(--gs-red, #d53c41); color: #fff !important; transform: translateY(-1px); }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a.green,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a.green { background: #effaf3; color: #15803d !important; }
    .gs-admin table > tbody > tr > td a.green:hover { background: #16a34a; color: #fff !important; transform: translateY(-1px); }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a .bigger-150,
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td a .bigger-150 { font-size: 15px !important; margin: 0 !important; }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td > div:has(> a.blue, > a.red, > a.green) { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
    /* زراير عادية جوه الصف (زي "الهيستوري") */
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td .btn-light,
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td .btn-default {
        height: 36px; display: inline-flex; align-items: center; gap: 6px; padding: 0 12px; border-radius: 11px;
        background: #f4f5f7; border: 0; font-weight: 700; font-size: 12.5px; color: #1d2127;
    }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td .btn-light:hover,
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td .btn-default:hover { background: #141414; color: #fff; }
    /* خانات الأكشن اللي من غير عنوان: صغيرة ولازقة في الآخر */
    .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr > td.gs-td-actions { width: 1%; white-space: nowrap; }

    /* ---------- الإجمالي = كارت غامق ---------- */
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tfoot > tr > th,
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tfoot > tr > td {
        background: #141414 !important; color: #fff !important; border: 0 !important; padding: 13px 16px !important; font-weight: 800 !important; font-variant-numeric: tabular-nums;
    }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tfoot > tr > :first-child { border-start-start-radius: 14px; border-end-start-radius: 14px; padding-inline-start: 20px !important; }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tfoot > tr > :last-child,
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tfoot > tr > .gs-td-last { border-start-end-radius: 14px; border-end-end-radius: 14px; }

    /* ---------- الأعمدة المطوية (Responsive): زرار + صغير وتفاصيل الكارت تحته ---------- */
    .gs-admin table.dataTable.dtr-inline.collapsed:not(.gs-plain) > tbody > tr > td.dtr-control::before,
    .gs-admin table.dataTable.dtr-inline.collapsed:not(.gs-plain) > tbody > tr > td:first-child::before {
        top: 50% !important; transform: translateY(-50%); margin-top: 0 !important;
    }
    .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain) > tbody > tr.child > td {
        background: #fafbfc !important; border: 1px dashed #e1e4e8 !important; border-radius: 14px !important; padding: 10px 18px !important; box-shadow: none !important;
    }
    .gs-admin table.dataTable > tbody > tr.child ul.dtr-details > li { border-bottom-color: #eef0f2; padding: 8px 0; }
    .gs-admin table.dataTable > tbody > tr.child span.dtr-title { color: #8a9099; font-size: 11.5px; font-weight: 700; min-width: 110px; }
    .gs-admin table.dataTable > tbody > tr.child span.dtr-data { font-weight: 700; }

    /* الجدول جوه مودال: نفس الشكل بس أصغر شوية */
    .gs-admin .modal table.dataTable:not(.gs-plain) > tbody > tr > td,
    .gs-admin .modal table.gs-cards:not(.gs-plain) > tbody > tr > td { padding: 11px 14px !important; }

    /* ترقيم الجداول: من غير خط فوقه */
    .gs-admin table.dataTable.no-footer:not(.gs-member-cards):not(.gs-plain) { border-bottom: 0 !important; }
}
@media (min-width: 768px) and (prefers-reduced-motion: reduce) {
    .gs-admin table > tbody > tr:hover { transform: none !important; }
}

/* [موبايل] الإجمالي تحت الكروت: كارت غامق فيه كل رقم باسم عموده (بدل ما يطلع صف مكسور فوق) */
@media (max-width: 767.98px) {
    .gs-admin table.gs-cards:has(> tfoot) { display: flex !important; flex-direction: column; }
    .gs-admin table.gs-cards > tfoot { display: block; order: 2; }
    .gs-admin table.gs-cards > tfoot > tr { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: flex-end; background: #141414; color: #fff; border-radius: 14px; padding: 12px 14px; margin: 2px 0 8px; }
    .gs-admin table.gs-cards > tfoot > tr > * { display: flex !important; flex-direction: column; gap: 2px; padding: 0 !important; border: 0 !important; background: transparent !important; color: #fff !important; font-weight: 800; font-size: 14px; text-align: start !important; white-space: nowrap; }
    .gs-admin table.gs-cards > tfoot > tr > .gs-td-empty { display: none !important; }
    .gs-admin table.gs-cards > tfoot > tr > [data-label]::before { content: attr(data-label); font-size: 11px; font-weight: 600; color: #a7abb3; }
    .gs-admin table.gs-cards > tfoot > tr > :first-child { flex: 1 0 100%; font-size: 13px; color: #d9dbe0 !important; }
}

/* =====================================================================
   [شكل] كروت الموبايل أصغر وأشيك: 3 خانات في السطر، مسافات أقل، زراير أقصر
   (نفس الخانات ونفس الزراير — الحجم بس)
   ===================================================================== */
@media (max-width: 767.98px) {
    .gs-admin table.gs-cards > tbody > tr:not(.child) {
        grid-template-columns: repeat(6, minmax(0, 1fr)); column-gap: 10px;
        padding: 10px 12px 10px; margin: 0 0 8px; border-radius: 14px;
    }
    .gs-admin table.gs-cards > tbody > tr:not(.child)::before { top: 12px; height: 18px; }
    .gs-admin table.gs-cards > tbody > tr > td,
    .gs-admin table.gs-cards > tbody > tr > td[style*="display: none"] {
        border-top: 0 !important; padding: 4px 0 !important; gap: 1px; font-size: 13px; line-height: 1.35;
    }
    .gs-admin table.gs-cards > tbody > tr:not(.child) > td { grid-column: auto / span 3; }
    .gs-admin table.gs-cards > tbody > tr:not(.child) > td.gs-td-title,
    .gs-admin table.gs-cards > tbody > tr:not(.child) > td.gs-td-wide,
    .gs-admin table.gs-cards > tbody > tr:not(.child) > td.gs-td-actions,
    .gs-admin table.gs-cards > tbody > tr:not(.child) > td.dataTables_empty { grid-column: 1 / -1; }
    .gs-admin table.gs-cards > tbody > tr:not(.child) > td.gs-td-title.is-part1 { grid-column: 1 / 4; }
    .gs-admin table.gs-cards > tbody > tr:not(.child) > td.gs-td-title.is-part2 { grid-column: 4 / 7; }
    .gs-admin table.gs-cards > tbody > tr > td[data-label]::after { font-size: 10.5px; }
    .gs-admin table.gs-cards > tbody > tr > td.gs-td-title {
        padding: 0 0 6px !important; margin-bottom: 4px; border-bottom: 1px solid #f0f1f4 !important; font-size: 14.5px;
    }
    .gs-admin table.gs-cards > tbody > tr > td.gs-td-actions { padding: 8px 0 0 !important; gap: 6px; }
    .gs-admin table.gs-cards td.gs-td-actions a, .gs-admin table.gs-cards td.gs-td-actions button { height: 34px; border-radius: 10px; font-size: 12px; }
    /* لو الزراير في كذا خانة (تعديل / مسح / هيستوري): جنب بعض في سطر واحد بدل كل واحد سطر */
    .gs-admin table.gs-cards > tbody > tr:not(.child):has(> td.gs-td-actions + td.gs-td-actions) > td.gs-td-actions { grid-column: auto / span 3; }
    .gs-admin table.gs-cards > tbody > tr:not(.child):has(> td.gs-td-actions + td.gs-td-actions + td.gs-td-actions) > td.gs-td-actions { grid-column: auto / span 2; }
    .gs-admin table.gs-cards td.gs-td-actions .btn { height: 34px !important; min-height: 0; padding: 0 8px; width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 6px; border-radius: 10px; font-size: 12px; margin: 0 !important; }
    /* الزراير دايماً في سطر لوحدها في الآخر */
    .gs-admin table.gs-cards > tbody > tr:not(.child) > td:not(.gs-td-actions) + td.gs-td-actions { grid-column-start: 1 !important; }
    .gs-admin table.gs-cards td p[style*="color"], .gs-admin table.gs-cards td h5[style*="color"] { padding: 2px 8px !important; font-size: 11.5px; }

    /* كروت الأعضاء */
    #clienttable.gs-member-cards tbody { gap: 8px; }
    #clienttable.gs-member-cards tbody tr { padding: 11px 12px; gap: 6px 10px; border-radius: 14px; }
    #clienttable.gs-member-cards td.c-name { font-size: 14.5px; }
    #clienttable.gs-member-cards td.c-exp, #clienttable.gs-member-cards td.c-classes { padding: 6px 10px !important; border-radius: 10px; font-size: 13px; }
    #clienttable.gs-member-cards td[data-label]::before { font-size: 10.5px; margin-bottom: 1px; }
    #clienttable.gs-member-cards td.c-plan p { padding: 3px 10px; font-size: 12px; }
    #clienttable.gs-member-cards td.c-acts { padding-top: 8px !important; }
    .gs-mc-act { height: 34px; border-radius: 10px; }
    .gs-mc-medal a { height: 32px; border-radius: 10px; }

    /* المنصة */
    .gs-admin table.pf-table.gs-cards > tbody > tr:not(.child) { padding: 10px 12px; border-radius: 14px; margin-bottom: 8px; box-shadow: 0 1px 6px rgba(16, 24, 40, .05); }
    .gs-admin table.pf-table.gs-cards td.gs-td-actions .btn { height: 34px; }
}

/* =====================================================================
   [شكل] خانة اتجاهها غير اتجاه الصفحة (زي الـ IP أو رقم الموبايل dir="ltr" في العربي):
   الحواف الدايرية بتتحسب باتجاه الخانة نفسها فكانت بتطلع معكوسة — هنا بتتظبط على اتجاه الصفحة
   ===================================================================== */
@media (min-width: 768px) {
    html[dir="rtl"] .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child) > td:last-child[dir="ltr"],
    html[dir="rtl"] .gs-admin table.gs-table:not(.gs-plain) > tbody > tr > td:last-child[dir="ltr"],
    html[dir="rtl"] .gs-admin table.sh-table:not(.gs-plain) > tbody > tr > td:last-child[dir="ltr"],
    html[dir="rtl"] .gs-admin table.pf-table:not(.gs-plain) > tbody > tr > td:last-child[dir="ltr"],
    html[dir="rtl"] .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr:not(.child) > td:last-child[dir="ltr"] { border-radius: 14px 0 0 14px !important; }
    html[dir="rtl"] .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child) > td:first-child[dir="ltr"],
    html[dir="rtl"] .gs-admin table.gs-table:not(.gs-plain) > tbody > tr > td:first-child[dir="ltr"],
    html[dir="rtl"] .gs-admin table.sh-table:not(.gs-plain) > tbody > tr > td:first-child[dir="ltr"],
    html[dir="rtl"] .gs-admin table.pf-table:not(.gs-plain) > tbody > tr > td:first-child[dir="ltr"],
    html[dir="rtl"] .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr:not(.child) > td:first-child[dir="ltr"] { border-radius: 0 14px 14px 0 !important; padding-left: 12px !important; padding-right: 18px !important; }
    html[dir="ltr"] .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child) > td:last-child[dir="rtl"],
    html[dir="ltr"] .gs-admin table.gs-table:not(.gs-plain) > tbody > tr > td:last-child[dir="rtl"],
    html[dir="ltr"] .gs-admin table.sh-table:not(.gs-plain) > tbody > tr > td:last-child[dir="rtl"],
    html[dir="ltr"] .gs-admin table.pf-table:not(.gs-plain) > tbody > tr > td:last-child[dir="rtl"],
    html[dir="ltr"] .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr:not(.child) > td:last-child[dir="rtl"] { border-radius: 0 14px 14px 0 !important; }
    html[dir="ltr"] .gs-admin table.dataTable:not(.gs-member-cards):not(.gs-plain):not(.dtr-details) > tbody > tr:not(.child) > td:first-child[dir="rtl"],
    html[dir="ltr"] .gs-admin table.gs-table:not(.gs-plain) > tbody > tr > td:first-child[dir="rtl"],
    html[dir="ltr"] .gs-admin table.sh-table:not(.gs-plain) > tbody > tr > td:first-child[dir="rtl"],
    html[dir="ltr"] .gs-admin table.pf-table:not(.gs-plain) > tbody > tr > td:first-child[dir="rtl"],
    html[dir="ltr"] .gs-admin table.gs-cards:not(.gs-member-cards):not(.gs-plain) > tbody > tr:not(.child) > td:first-child[dir="rtl"] { border-radius: 14px 0 0 14px !important; padding-right: 12px !important; padding-left: 18px !important; }
}
/* [شكل] ونفس الخانة: الكلام الإنجليزي (IP / اسم المستخدم / الإيميل الصغير) بيتحاذى مع عنوان العمود ومع باقي الصف بدل ما يروح للناحية التانية */
html[dir="rtl"] .gs-admin table.pf-table > tbody > tr > td[dir="ltr"]:not([colspan]),
html[dir="rtl"] .gs-admin table.pf-table > tbody > tr > td .pf-sub[dir="ltr"] { text-align: right; }
html[dir="ltr"] .gs-admin table.pf-table > tbody > tr > td[dir="rtl"]:not([colspan]),
html[dir="ltr"] .gs-admin table.pf-table > tbody > tr > td .pf-sub[dir="rtl"] { text-align: left; }

/* [شكل] زرار + (الأعمدة المطوية) بعيد عن طرف الصف والخط الملون بدل ما يبقى لازق فيه */
@media (min-width: 768px) {
    html[dir="rtl"] .gs-admin table.dataTable.dtr-inline.collapsed:not(.gs-plain):not(.gs-member-cards) > tbody > tr > td.dtr-control::before,
    html[dir="rtl"] .gs-admin table.dataTable.dtr-inline.collapsed:not(.gs-plain):not(.gs-member-cards) > tbody > tr > td:first-child::before { right: 16px !important; left: auto !important; }
    html[dir="ltr"] .gs-admin table.dataTable.dtr-inline.collapsed:not(.gs-plain):not(.gs-member-cards) > tbody > tr > td.dtr-control::before,
    html[dir="ltr"] .gs-admin table.dataTable.dtr-inline.collapsed:not(.gs-plain):not(.gs-member-cards) > tbody > tr > td:first-child::before { left: 16px !important; right: auto !important; }
    .gs-admin table.dataTable.dtr-inline.collapsed:not(.gs-plain):not(.gs-member-cards) > tbody > tr:not(.child) > td.dtr-control,
    .gs-admin table.dataTable.dtr-inline.collapsed:not(.gs-plain):not(.gs-member-cards) > tbody > tr:not(.child) > td:first-child { padding-inline-start: 50px !important; }
}

/* [شكل] ليبل المدرب/الكلاس (والحالات) لما ييجي على سطرين: كارت صغير مدور بدل البيضاوي، السطرين متوازنين،
   والنقطة جنب أول سطر — في سطر واحد شكله زي ما هو بالظبط */
.gs-admin table.dataTable td p[style*="color"],
.gs-admin table.dataTable td h5[style*="color"],
.gs-admin table.dataTable td h5.blue {
    border-radius: 12px; align-items: flex-start; text-align: start; text-wrap-style: balance; max-width: 100%;
}
.gs-admin table.dataTable td p[style*="color"]::before,
.gs-admin table.dataTable td h5[style*="color"]::before,
.gs-admin table.dataTable td h5.blue::before { flex: 0 0 auto; margin-top: calc(.75em - 3px); }
@media (max-width: 767.98px) {
    .gs-admin table.dataTable td p[style*="color"],
    .gs-admin table.dataTable td h5[style*="color"] { padding: 5px 11px; line-height: 1.55; width: fit-content; }
}

/* =====================================================================
   [شكل وسهولة — الموبايل] زراير الكروت بأسمائها + المسح مربع صغير + "التفاصيل" للكارت الطويل
   ===================================================================== */
.gs-more-t { display: none; }
@media (max-width: 767.98px) {
    /* اسم الزرار جنب الأيقونة */
    .gs-admin table.gs-cards td.gs-td-actions [data-gs-lbl]::after { content: attr(data-gs-lbl); font-family: inherit; font-size: 12.5px; font-weight: 700; line-height: 1; }
    /* المسح: مربع صغير هادي في آخر السطر (مش أكبر زرار في الكارت) */
    .gs-admin table.gs-cards td.gs-td-actions a.gs-act-del, .gs-admin table.gs-cards td.gs-td-actions button.gs-act-del {
        flex: 0 0 40px !important; width: 40px; padding: 0 !important; order: 50; background: #fff !important; border: 1px solid rgba(var(--gs-red-rgb, 213, 60, 65), .25) !important; color: var(--gs-red) !important;
    }
    .gs-admin table.gs-cards td.gs-td-actions .gs-act-del::after { display: none; }
    .gs-admin table.gs-cards td.gs-td-actions .gs-act-del:active { background: var(--gs-red-soft) !important; }
    /* لو المسح لوحده في الكارت (زي المصروفات): على الطرف بحجمه الصغير */
    .gs-admin table.gs-cards > tbody > tr > td.gs-td-actions:not(:has(a:not(.gs-act-del), button:not(.gs-act-del))) { justify-content: flex-end; }
    /* كل الأرقام بعرض ثابت (تيجي تحت بعض) */
    .gs-admin table.gs-cards > tbody > tr > td { font-variant-numeric: tabular-nums; }

    /* الكارت الطويل: الباقي تحت "التفاصيل" */
    .gs-admin table.gs-cards > tbody > tr.gs-has-more:not(.is-open) > td.gs-td-more { display: none !important; }
    .gs-admin table.gs-cards > tbody > tr.gs-has-more > td.gs-td-actions { flex-wrap: wrap; }
    .gs-admin table.gs-cards td.gs-td-actions .gs-more-t {
        display: inline-flex !important; flex: 1 0 100% !important; order: -1; height: 34px !important; margin: 0 0 2px !important; padding: 0 10px !important;
        align-items: center; justify-content: center; gap: 6px; border-radius: 10px; border: 1px dashed #d9dce2 !important; background: #fafbfc !important;
        color: #4b5260 !important; font-weight: 700; font-size: 12.5px; font-family: inherit; cursor: pointer;
    }
    .gs-more-t small { font-size: 11px; font-weight: 700; color: #8a909a; }
    .gs-more-t .fa { transition: transform .2s ease; font-size: 14px; }
    .gs-more-t .gs-more-c, tr.is-open .gs-more-t .gs-more-o { display: none; }
    tr.is-open .gs-more-t .gs-more-c { display: inline; }
    tr.is-open .gs-more-t .fa { transform: rotate(180deg); }
    .gs-admin table.gs-cards > tbody > tr.is-open > td.gs-td-more { animation: gsMoreIn .22s ease both; }
    @keyframes gsMoreIn { from { opacity: 0; transform: translateY(-3px); } to { opacity: 1; transform: none; } }
}
@media (min-width: 768px) {
    /* الكمبيوتر: نفس الأيقونات، والاسم بيظهر كتلميح لما الماوس يقف عليها */
    .gs-admin table td.gs-td-actions .gs-more-t { display: none !important; }
}

/* ---------- الفلاتر الكتير على الموبايل: زرار "الفلاتر" */
.gs-flt-t { display: none; }
@media (max-width: 767.98px) {
    .gs-flt-t {
        display: flex; align-items: center; gap: 8px; width: calc(100% - 2em); margin: 1em 1em 0; height: 46px; padding: 0 14px; border-radius: 14px;
        border: 1px solid var(--gs-border, #e1e3e8); background: #fff; color: var(--gs-text, #1d2127); font-family: inherit; font-weight: 800; font-size: 14px; cursor: pointer;
        box-shadow: 0 1px 6px rgba(16, 24, 40, .05);
    }
    .gs-flt-t > .fa-sliders { width: 30px; height: 30px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; background: rgba(var(--gs-red-rgb, 213, 60, 65), .1); color: var(--gs-red, #d53c41); font-size: 14px; }
    .gs-flt-t > span { flex: 1 1 auto; text-align: start; }
    .gs-flt-n { min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: var(--gs-red, #d53c41); color: #fff; font-size: 12px; display: inline-flex; align-items: center; justify-content: center; }
    .gs-flt-n[hidden] { display: none; }
    .gs-flt-ar { color: #8a909a; transition: transform .2s ease; font-size: 16px; }
    .gs-flt-t.is-open .gs-flt-ar { transform: rotate(180deg); }
    .gs-flt-t.is-open { border-color: rgba(var(--gs-red-rgb, 213, 60, 65), .35); }
    .row.gs-flt:not(.is-open) { display: none !important; }
    .row.gs-flt.is-open { animation: gsMoreIn .22s ease both; }
}

/* [شكل] كروت المشتركين على الموبايل: زرار المسح كان بيخرج برّه الكارت (الاسم الطويل "الاشتراكات السابقة") — الزراير بقت تتقسم المساحة */
@media (max-width: 575px) {
    .gs-mc-acts { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 38px; gap: 6px; min-width: 0; }
    .gs-mc-act:not(.is-danger) { min-width: 0; width: auto; padding: 0 6px; gap: 5px; }
    .gs-mc-act:not(.is-danger) span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
    .gs-mc-act .fa { flex: 0 0 auto; }
    .gs-mc-act.is-danger { grid-column: 3; grid-row: 1; width: 38px; background: #fff; border: 1px solid rgba(var(--gs-red-rgb, 213, 60, 65), .25); }
    .gs-mc-act[onclick*="istory"] { grid-column: 1 / -1; order: 5; }
}

/* [شكل] الكمبيوتر: اسم الزرار (تعديل / السجل / دفع / حذف) بيطلع فوق الأيقونة لما الماوس يقف عليها — فقاعة غامقة صغيرة */
@media (min-width: 768px) and (hover: hover) {
    .gs-admin table td.gs-td-actions [data-gs-lbl] { position: relative; }
    .gs-admin table td.gs-td-actions [data-gs-lbl]::after {
        content: attr(data-gs-lbl); position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translate(-50%, 4px); z-index: 30;
        padding: 5px 9px; border-radius: 8px; background: #141414; color: #fff; font-size: 12px; font-weight: 700; line-height: 1.2; white-space: nowrap;
        font-family: inherit; pointer-events: none; opacity: 0; transition: opacity .15s ease, transform .15s ease; box-shadow: 0 8px 18px rgba(0, 0, 0, .18);
    }
    .gs-admin table td.gs-td-actions [data-gs-lbl]:hover::after, .gs-admin table td.gs-td-actions [data-gs-lbl]:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }
    .gs-admin table.dataTable > tbody > tr > td { font-variant-numeric: tabular-nums; }
}
/* [سهولة] اللي بيستخدم الكيبورد (Tab): حلقة واضحة حوالين الزرار/اللينك اللي واقف عليه — الماوس واللمس مش بيتأثروا */
.gs-admin a:focus-visible, .gs-admin button:focus-visible, .gs-admin .btn:focus-visible, .gs-admin [tabindex]:focus-visible {
    outline: 2px solid rgba(var(--gs-red-rgb, 213, 60, 65), .55) !important; outline-offset: 2px; box-shadow: none;
}
