/**
 * صفحة الحضور (الإدارة وبوابة المدرب): بطاقة الاختيار، الكشف اليومي، الكشف الشامل لكل الأيام
 * القوالب: admin/attendance/picker.php · partials/attendance-sheet.php · partials/attendance-matrix.php
 */

/* بطاقة اختيار البرنامج واليوم في سطر واحد */
.tnt .tnt-att-picker { margin-bottom: 20px; }
.tnt .tnt-att-picker__form { display: grid; grid-template-columns: minmax(0, 1fr) 220px 120px; gap: 14px; align-items: end; }
.tnt .tnt-att-picker__form > .tnt-field { margin: 0; grid-column: auto; }
.tnt .tnt-att-picker__form:not(:has(.tnt-att-picker__date)) { grid-template-columns: minmax(0, 1fr) 120px; }
@media (max-width: 782px) {
	.tnt .tnt-att-picker__form, .tnt .tnt-att-picker__form:not(:has(.tnt-att-picker__date)) { grid-template-columns: minmax(0, 1fr); }
}

.tnt .tnt-att-stats { margin-bottom: 20px; }

/* الكشف اليومي: الاسم في سطر واحد */
.tnt .tnt-att-sheet td:first-child { min-width: 170px; text-align: start; }
@media (min-width: 1280px) {
	.tnt .tnt-att-sheet .tnt-person { white-space: nowrap; }
}

/* علامات الحضور */
.tnt .tnt-att-mark {
	display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 7px; font-style: normal; vertical-align: middle;
}
.tnt .tnt-att-mark.is-present { background: var(--tnt-success-50); color: var(--tnt-success); }
.tnt .tnt-att-mark.is-absent { background: var(--tnt-danger-50); color: var(--tnt-danger); }
.tnt .tnt-att-mark.is-future { background: var(--tnt-surface-2); border: 1px dashed var(--tnt-border-strong); }
.tnt .tnt-att-legend { display: flex; flex-wrap: wrap; gap: 14px; margin-inline-start: auto; font-size: 13px; font-weight: 600; color: var(--tnt-text-2); }
.tnt .tnt-att-legend span { display: inline-flex; align-items: center; gap: 6px; }

/* الكشف الشامل: عمود الاسم ثابت عند التمرير الأفقي */
.tnt .tnt-att-matrix .tnt-table { border-collapse: separate; border-spacing: 0; }
.tnt .tnt-att-matrix th, .tnt .tnt-att-matrix td { padding: 8px 6px; }
.tnt .tnt-att-matrix .tnt-att-matrix__name {
	position: sticky; right: 0; z-index: 2; /* right وليس inset-inline-start: الأخيرة لا تُرسم في بعض إصدارات كروم داخل جدول RTL */ min-width: 220px; max-width: 260px; text-align: start; padding-inline: 14px;
	background: var(--tnt-surface); box-shadow: inset -1px 0 0 var(--tnt-border);
}
.tnt .tnt-att-matrix thead .tnt-att-matrix__name, .tnt .tnt-att-matrix tfoot .tnt-att-matrix__name { background: var(--tnt-surface-2); }
.tnt .tnt-att-matrix__name .tnt-cell-main { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.tnt .tnt-att-matrix__day { min-width: 46px; }
.tnt .tnt-att-matrix__day a, .tnt .tnt-att-matrix__day > small { color: inherit; text-decoration: none; }
.tnt .tnt-att-matrix__day a { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 2px 4px; border-radius: 8px; }
.tnt .tnt-att-matrix__day a:hover { background: var(--tnt-primary-50); color: var(--tnt-primary); }
.tnt .tnt-att-matrix__day small { font-size: 11px; font-weight: 600; color: var(--tnt-muted); }
.tnt .tnt-att-matrix__day span { font-size: 12.5px; font-weight: 700; font-family: ui-monospace, Consolas, monospace; }
.tnt .tnt-att-matrix__day.is-today a { background: var(--tnt-gold-50); box-shadow: inset 0 0 0 1px var(--tnt-gold); }
.tnt .tnt-att-matrix__cell { text-align: center; }
.tnt .tnt-att-matrix tbody tr:hover td { background: var(--tnt-surface-2); }
.tnt .tnt-att-matrix tfoot td, .tnt .tnt-att-matrix tfoot th { border-top: 2px solid var(--tnt-border-strong); background: var(--tnt-surface-2); }
.tnt .tnt-att-matrix tfoot td strong { display: block; font-size: 13px; }
.tnt .tnt-att-matrix tfoot td small { font-size: 11px; color: var(--tnt-muted); }

/* خانات الكشف الشامل القابلة للضغط (الإدارة) */
.tnt button.tnt-att-mark { border: 0; padding: 0; cursor: pointer; transition: transform .12s var(--tnt-ease), box-shadow .12s var(--tnt-ease); }
.tnt button.tnt-att-mark:hover { transform: scale(1.15); box-shadow: 0 0 0 2px currentColor; }
.tnt button.tnt-att-mark:focus-visible { outline: none; box-shadow: var(--tnt-ring); }
.tnt button.tnt-att-mark.is-busy { opacity: .5; cursor: progress; }