/**
 * الجداول الموحدة (.tnt-table)
 * العمود الأول (الاسم: المتدرب، الدورة، البرنامج...) يبدأ من اليمين، وباقي الأعمدة في الوسط.
 *   tnt-col-start  : لمحاذاة أي عمود آخر لليمين (نص طويل)
 *   tnt-col-center : لإبقاء العمود الأول في الوسط (عند الحاجة)
 */

.tnt .tnt-table-wrap { overflow-x: auto; }
.tnt .tnt-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px; }
.tnt .tnt-table th,
.tnt .tnt-table td { text-align: center; vertical-align: middle; }
.tnt .tnt-table th { font-weight: 700; font-size: 12.5px; color: var(--tnt-muted); background: var(--tnt-surface-2); padding: 12px 16px; border-bottom: 1px solid var(--tnt-border); white-space: nowrap; }
.tnt .tnt-table td { padding: 14px 16px; border-bottom: 1px solid var(--tnt-border); }
.tnt .tnt-table tbody tr { transition: background .12s; }
.tnt .tnt-table tbody tr:hover { background: #fafbff; }
.tnt .tnt-table tbody tr:last-child td { border-bottom: 0; }

/* عمود الاسم (الأول) من اليمين: الرأس والبيانات والصورة الرمزية */
.tnt .tnt-table th:first-child,
.tnt .tnt-table td:first-child,
.tnt .tnt-table .tnt-col-start { text-align: start; }
.tnt .tnt-table th:first-child { padding-inline-start: 20px; }
.tnt .tnt-table td:first-child { padding-inline-start: 20px; }
.tnt .tnt-table td:first-child > .tnt-person { justify-content: flex-start; }
.tnt .tnt-table th.tnt-col-center,
.tnt .tnt-table td.tnt-col-center { text-align: center; }

.tnt .tnt-table .tnt-col-actions { white-space: nowrap; }
.tnt .tnt-cell-main { font-weight: 600; color: var(--tnt-text); display: block; }
.tnt .tnt-cell-sub { font-size: 12.5px; color: var(--tnt-muted); display: block; }
/* العناصر المرنة داخل باقي الخلايا (صورة + اسم، أزرار) تتوسط */
.tnt .tnt-table td:not(:first-child) > .tnt-person,
.tnt .tnt-table td > .tnt-btn-row { justify-content: center; }
.tnt .tnt-table .tnt-nowrap { white-space: nowrap; }

/* خلايا البريد والتاريخ مع الوقت (مثل جدول المتدربين) */
.tnt .tnt-table .tnt-cell-email { display: inline-block; max-width: 230px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; font-size: 12.5px; color: var(--tnt-text-2); }
.tnt .tnt-table .tnt-cell-email:hover { color: var(--tnt-gold-600); }
.tnt .tnt-table .tnt-cell-datetime { white-space: nowrap; }